analytics/webcontent/bi/js/dashboard-analytics/visualizations/renderer/crosstab/CrosstabView.js

'use strict';

var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };

/**
 * Licensed Materials - Property of IBM
 * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2016, 2020
 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 */
define(['../VisView', './CrosstabGrid', '../../../widgets/livewidget/nls/StringResources', 'text!./Crosstab.html', '../../../DynamicFileLoader', 'jquery', 'underscore', '../VisEventHandler', './CrosstabEventTarget', '../../../util/ContentUtil'], function (VisView, CrosstabGrid, StringResources, CrosstabTemplate, DynamicFileLoader, $, _, VisEventHandler, CrosstabEventTarget, ContentUtil) {
	'use strict';

	var ROW_SLOT_ID = 'row_level1';
	var COLUMN_SLOT_ID = 'column_level1';

	var CrosstabView = VisView.extend({
		className: 'dataview crosstab-widget',
		templateString: CrosstabTemplate,
		alwaysRenderOnResize: true,
		/**
   * Initialize the view and its handlers, then render.
   */
		init: function init() {
			CrosstabView.inherited('init', this, arguments);
			this.visModel.on('change:theme', this.onChangeTheme, this);

			this.isMobilePannable = true;
			this.visProperties = this.visModel.getProperties();
			this.styleProxy = this.visModel.getVisPropertiesCSSProxy();
			this.rowHeadingProperties = this._getPropertiesForPrefix('rowHeading');
			this.columnHeadingProperties = this._getPropertiesForPrefix('columnHeading');
			this.dataValueProperties = this._getPropertiesForPrefix('values');
			this.valueHeadingProperties = this._getPropertiesForPrefix('valueHeading');
			this.summaryProperties = this._getPropertiesForPrefix('summary');
			this.selectedAreaProperties = this._getPropertiesForPrefix('selectedArea');
			this.content = this.content || this.dashboardApi.getCanvas().getContent(this.ownerWidget.getId());
			if (this._isNewConditionalFormatFeature()) {
				this._conditionalFormatting = this.content.getFeature('ConditionalFormatting');
			} else {
				// deregister here since the new component do not have access to the dashboardAPI to check whether the feature flag is turned on or off
				// Instead when the new feature gets loaded it always register itself with the 'Properties' and 'CustomColor' feature
				// Remove this code when the new feature get turn on by default
				var newCondFeature = this.content.getFeature('ConditionalFormatting');
				if (newCondFeature) {
					var properties = this.content.getFeature('Properties');
					var customColor = this.dashboardApi.getFeature('CustomColor');
					properties.deregisterProvider(newCondFeature);
					customColor.deregisterProvider(newCondFeature);
				}
			}
			this._crosstabGrid = new CrosstabGrid({
				$el: this.$el.find('.crosstab-widget'),
				visModel: this.visModel,
				dashboardApi: this.dashboardApi,
				colorsService: this.dashboardApi.getFeature('Colors'),
				crosstabView: this,
				conditionalFormatting: this._conditionalFormatting
			});
		},

		onChangeTheme: function onChangeTheme() {
			this.visModel.getRenderSequence().reRender();
		},

		getGrid: function getGrid() {
			return this._crosstabGrid;
		},

		getDescription: function getDescription() {
			// Append the F12 key instruction to the description
			var description = CrosstabView.inherited('getDescription', this, arguments);
			return StringResources.get('WidgetLabelWithDescripion', {
				label: description,
				description: StringResources.get('f12KeyDescription')
			});
		},

		/**
   * Handle the on container entered event
   * Sets up keyboard navigation inside the list
   * @return undefined
   */
		onEnterContainer: function onEnterContainer() {
			this._crosstabGrid.onEnterContainer();
		},

		/**
   * @Override VisView.getCurrentViewSelector()
   */
		//TODO: This might need to be abstracted at higher level
		getCurrentViewSelector: function getCurrentViewSelector() {
			return this.eventHandler;
		},

		/**
   * render the results.
   * @param {Object} renderInfo - renderInfo passed to all render methods from the render sequence.
   * @returns a promise which is resolved when rendering has completed.
   */
		render: function render(renderInfo) {
			var _this = this,
			    _arguments = arguments;

			return this._initializeConditionalFormatting().then(function () {
				if (!_this.isMappingComplete() || _this.hasMissingFilters() || _this.hasUnavailableMetadataColumns()) {
					_this.removeGridView();
					_this.resizeToWidget(renderInfo);
					_this.renderIconView();
					_this.updateSubViews();
					return Promise.resolve(_this);
				}

				_this.removeIconView();
				var dataQueryResult = renderInfo.data.getResult();
				_this.setStyles();
				_this.setSelections();
				_this.setFormat();
				_this.setHiddenRowsAndColumns();

				return _this._crosstabGrid.render(dataQueryResult, _this.resizing, _this.getRenderingNewData(), _this.eventHandler).then(function (isRenderValid) {
					if (!isRenderValid) {
						return { reRenderNeeded: true };
					} else {
						_this.resizeToWidget(renderInfo);
						_this.visControl.resetData(_this.visModel);
						_this.visControl.setGridData(_this._crosstabGrid);
						//Note: renderComplete is called from VisView.
						return CrosstabView.inherited('render', _this, _arguments);
					}
				});
			});
		},

		removeGridView: function removeGridView() {
			this._crosstabGrid && this._crosstabGrid.removeGridView();
		},

		remove: function remove() {
			if (this._crosstabGrid) {
				this._crosstabGrid.remove();
			}
			if (this.eventHandler) {
				this.eventHandler.remove();
			}

			this.visControl = null;
			// The super.destroy will clear all members of this class.
			CrosstabView.inherited('remove', this, arguments);
		},

		_isNewConditionalFormatFeature: function _isNewConditionalFormatFeature() {
			return !this.dashboardApi.getGlassCoreSvc('.FeatureChecker').checkValue('dashboard', 'xtabcondFormat', 'disabled');
		},


		_initializeConditionalFormatting: function _initializeConditionalFormatting() {
			// This is temporary until features have a proper way of initializing themselves
			return this._conditionalFormatting ? this._conditionalFormatting.initializeFeature() : Promise.resolve();
		},

		_getPropertiesForPrefix: function _getPropertiesForPrefix(prefix) {
			var propertiesForPrefix = this.visProperties.filter(function (property) {
				return property.prefix === prefix;
			});
			return propertiesForPrefix;
		},

		/**
   * Construct a CSS style map for the properties changed
   * @returns  {object} in the form of {<styleName>: <propertyValue>}
   */
		_constructTextStyles: function _constructTextStyles(properties) {
			var stylesMap = {};
			var visModel = this.visModel;
			var styleProxy = this.styleProxy;
			var styleToValue = styleProxy.styleToValue;
			_.each(properties, function (property) {
				// one property may control multiple styles
				var styleNames = styleProxy.getPropertyStyle(property.id);
				styleNames = Array.isArray(styleNames) ? styleNames : [styleNames];
				var propertyValue = visModel.getPropertyValue(property.id);
				_.each(styleNames, function (styleName) {
					if (propertyValue) {
						if (styleToValue && styleToValue[styleName]) {
							if ((typeof propertyValue === 'undefined' ? 'undefined' : _typeof(propertyValue)) === 'object') {
								var result = {};
								_.each(propertyValue, function (val, key) {
									result[key] = {
										value: val.value ? styleToValue[styleName] : '',
										weight: val.weight
									};
								});
								propertyValue = result;
							} else {
								propertyValue = styleToValue[styleName];
							}
						}
						stylesMap[styleName] = propertyValue;
					} else {
						stylesMap[styleName] = '';
					}
				});
			});
			return stylesMap;
		},

		setStyles: function setStyles() {
			var styleObj = {
				rowHeadingStyles: this._constructTextStyles(this.rowHeadingProperties),
				columnHeadingStyles: this._constructTextStyles(this.columnHeadingProperties),
				dataValueStyles: this._constructTextStyles(this.dataValueProperties),
				valueHeadingStyles: this._constructTextStyles(this.valueHeadingProperties),
				summaryStyles: this._constructTextStyles(this.summaryProperties),
				selectedAreaStyles: this._constructTextStyles(this.selectedAreaProperties)
			};
			this._crosstabGrid.setStyles(styleObj);
		},

		/**
   * Loads and creates the control. Returns a promise which is resolved when the control
   * is created and ready to render
   */
		whenVisControlReady: function whenVisControlReady() {
			var _this2 = this;

			//Load the control class defined in the item definition (eg JQGrid).
			this.$el.addClass('dataview crosstab-widget');

			return DynamicFileLoader.load(['dashboard-analytics/visualizations/renderer/crosstab/CrosstabControl']).then(function (modules) {
				var CrosstabControl = modules[0];
				var visControl = new CrosstabControl({
					domNode: _this2.$el.find('.crosstab-widget')[0],
					visualization: _this2.visualization
				});
				_this2.visControl = visControl;
				_this2.visControl.resetData(_this2.visModel);
				_this2.eventHandler = new VisEventHandler({
					target: new CrosstabEventTarget({
						$el: _this2.$el,
						view: _this2,
						visAPI: _this2.visModel.ownerWidget.visAPI,
						content: _this2.content,
						visualization: _this2.visualization
					}),
					transaction: _this2.transactionApi,
					ownerWidget: _this2.ownerWidget,
					visAPI: _this2.ownerWidget.visAPI
				});
				return _this2.visControl;
			});
		},

		/**
   * Update the selection tuple of the crosstabGrid
   */
		setSelections: function setSelections() {
			var aRowItems = ContentUtil.getColumnIdList([this.visualization.getSlots().getSlot(ROW_SLOT_ID)], 'attribute');
			var aColItems = ContentUtil.getColumnIdList([this.visualization.getSlots().getSlot(COLUMN_SLOT_ID)], 'attribute');
			var aRowSelection = this.getSelector().getSelection(aRowItems, {
				includeParents: true
			});
			var aColSelection = this.getSelector().getSelection(aColItems, {
				includeParents: true
			});
			var aDatapointSelection = this.getSelector().getSelection(aColItems.concat(aRowItems));

			//only clear the selection caches if we've just made a selection and we currently have items in the caches;
			var options = {
				clearSelectionCaches: (aRowSelection || aColSelection || aDatapointSelection) && (this._crosstabGrid.isSummaryHighlighted() || this._crosstabGrid.getSelectedMeasureNodes())
			};

			this._crosstabGrid.setSelections({
				rowSelection: aRowSelection,
				colSelection: aColSelection,
				datapointSelection: aDatapointSelection
			}, options);
		},


		/**
   * set property value with contentAPI
   */
		setPropertyValue: function setPropertyValue(property, value, options) {
			this.content.setPropertyValue(property, value, options);
		},

		/**
   * Update the selection tuple of the crosstabGrid and update the view
   * this will be called from visView once grid view is ready
   * should never be called before view is ready
   */
		renderSelected: function renderSelected() {
			this.setSelections();
			// force a re-render so selections are handled properly
			if (this._crosstabGrid) {
				this._crosstabGrid.onResize();
			}
		},


		/**
   * get property value with contentAPI
   */
		getPropertyValue: function getPropertyValue(property) {
			return this.content && this.content.getPropertyValue(property);
		},

		/**
   * Update the format info of the crosstab
   */
		setFormat: function setFormat() {
			var format = {
				fixedRowHeight: this.getPropertyValue('fixedRowHeight'),
				fixedColumnWidth: this.getPropertyValue('fixedColumnWidth'),
				columnWidths: this.getPropertyValue('columnWidths'),
				rowHeights: this.getPropertyValue('rowHeights')
			};
			this._crosstabGrid.setFormat(format);
		},

		/**
   * Update the hidden rows and columns info of the crosstab
   */
		setHiddenRowsAndColumns: function setHiddenRowsAndColumns() {
			var hiddenRowsAndColumns = this.getPropertyValue('hiddenRowsAndColumns') || [];
			this._crosstabGrid.setHiddenRowsAndColumns(hiddenRowsAndColumns);
		},

		/**
   * build validation response
   * @param {boolean} isValid
   * @param {string} message
   * @returns {object}
   */
		_buildValidateResponse: function _buildValidateResponse(isValid, message) {
			return { isValid: isValid, message: message };
		},

		/**
   * validate the input for property input
   * @param {number} propertyValue
   * @param {number} range
   */
		_checkValidInput: function _checkValidInput(propertyValue, range) {
			if (!$.isNumeric(propertyValue)) {
				return this._buildValidateResponse(false, StringResources.get('prop_sizeInputNonNumericValue'));
			}
			if (parseInt(propertyValue) < range) {
				return this._buildValidateResponse(false, StringResources.get('prop_sizeValueShouldBeHigher', {
					value: range
				}));
			}
			return this._buildValidateResponse(true);
		},

		/**
   * Property Provider for crosstabView
   */
		getPropertyList: function getPropertyList() {
			// TODO livewidget_cleanup - remove this line after making sure it is not used
			throw new Error('should not be called');
		},

		/**
   * Property Provider for crosstabView
   */
		getPropertyLayoutList: function getPropertyLayoutList() {
			// TODO livewidget_cleanup - remove this line after making sure it is not used
			throw new Error('should not be called');
		},

		/**
   * Override the animate to avoid the fade in/out when we resize or apply filters
   */
		animate: function animate() {
			if (this.resizing) {
				this.visModel.renderCompleteBeforeAnimation(); // Rendering is complete, no animation
			} else {
				CrosstabView.inherited('animate', this, arguments);
			}
		}

	});
	return CrosstabView;
});
//# sourceMappingURL=CrosstabView.js.map