analytics/webcontent/bi/js/dashboard-analytics/visualizations/renderer/grid/GridView.js

'use strict';

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

	var GridView = VisView.extend({
		templateString: '<div class="dataview grid-view"  data-attach-point="contentNode"></div>',

		className: 'dataview grid-view',

		alwaysRenderOnResize: true,

		// Maps related to changing text properties
		// Map properties to css style strings
		PROPERTY_TO_STYLE: {
			'font-weight': 'bold',
			'font-style': 'italic',
			'text-decoration': 'underline'
		},
		CELL_VALUE_PROPERTY_MAP: {
			cellValueColor: 'color',
			cellValueFontSize: 'font-size',
			cellValueFontFace: 'font-family',
			cellValueFontBold: 'font-weight',
			cellValueFontItalic: 'font-style',
			cellValueFontUnderline: 'text-decoration',
			cellValueFontAlign: 'text-align'
		},
		COL_HEADING_PROPERTY_MAP: {
			columnHeadingColor: 'color',
			columnHeadingFontSize: 'font-size',
			columnHeadingFontFace: 'font-family',
			columnHeadingFontBold: 'font-weight',
			columnHeadingFontItalic: 'font-style',
			columnHeadingFontUnderline: 'text-decoration',
			columnHeadingFontAlign: 'text-align'
		},

		/**
   * Cache focused group cell IDs
   */
		_focusedCellIDs: {
			'key': null,
			'cellIDs': []
		},

		init: function init() {
			GridView.inherited('init', this, arguments);
			this.isMobilePannable = true;

			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);
				}
			}
		},

		_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();
		},

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

			var result = void 0;
			if (this.visControl) {
				result = Promise.resolve(this.visControl);
			} else {
				//Load the control class defined in the item definition (eg JQGrid).
				result = new Promise(function (resolve, reject) {
					try {
						require([_this.visModel.getDefinition().control], function (VisControl) {
							_this.visControl = new VisControl({
								domNode: _this.$el.find('.grid-view')[0],
								gridView: _this,
								tabNavigation: _this.ownerWidget.interactivitySettings.tabNavigation,
								dashboardApi: _this.dashboardApi,
								summaryFeature: _this.content.getFeature('SummaryFeature'),
								conditionalFormatting: _this._conditionalFormatting,
								cellRenderer: _this.content.getFeature('CellRenderer.react')
							});
							_this.visControl.reset(_this.visModel);
							resolve(_this.visControl);
						}, reject);
					} catch (error) {
						reject(error);
					}
				}).then(function () {
					_this.eventHandler = new VisEventHandler({
						target: new GridEventTarget({
							$el: _this.$el,
							visControl: _this.visControl,
							visAPI: _this.visModel
						}),
						transaction: _this.transactionApi,
						ownerWidget: _this.ownerWidget,
						visAPI: _this.visModel,
						edgeSelection: true
					});
					return _this.visControl;
				});
			}

			return result;
		},

		getCurrentViewSelector: function getCurrentViewSelector() {
			return this.eventHandler;
		},

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

		whenSetDataReady: function whenSetDataReady(renderInfo) {
			if (renderInfo.data && renderInfo.data.getResult) {
				this.visControl.reset(this.visModel);
				this.visControl.setData(renderInfo.data.getResult());
			}
			return Promise.resolve(true);
		},

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

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

				if (!_this2.visControl) {
					//This should never happen because the render sequence ensures the control is loaded prior to calling render.
					return Promise.reject(new Error());
				}

				if (!_this2.visControl.hasData()) {
					return Promise.resolve(_this2);
				}

				_this2.removeIconView();

				_this2.resizeToWidget(renderInfo);

				var bResize = _this2.resizing;
				var renderingNewData = _this2.getRenderingNewData();

				var styleObj = {};
				styleObj.headerStyles = _this2._constructTextStyles(_this2.COL_HEADING_PROPERTY_MAP, _this2.visModel);
				styleObj.cellStyles = _this2._constructTextStyles(_this2.CELL_VALUE_PROPERTY_MAP, _this2.visModel);
				_this2.visControl.setStyles(styleObj);
				_this2.setSelections();
				return _this2.visControl.render(bResize, renderingNewData).then(function (isRenderValid) {
					if (!isRenderValid) {
						return { reRenderNeeded: true };
					} else {
						//Note: renderComplete is called in the base render method.
						return GridView.inherited('render', _this2, _arguments);
					}
				});
			});
		},

		_constructTextStyles: function _constructTextStyles(properties, visModel) {
			var stylesMap = {};
			var propertyToStyle = this.PROPERTY_TO_STYLE;
			_.each(properties, function (styleName, propertyName) {
				var propertyValue = visModel.getPropertyValue(propertyName);
				if (propertyValue) {
					if (propertyToStyle[styleName]) {
						propertyValue = propertyToStyle[styleName];
					}
					stylesMap[styleName] = propertyValue;
				} else {
					stylesMap[styleName] = '';
				}
			});
			return stylesMap;
		},

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

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

		// @override
		remove: function remove() {
			if (this.eventHandler) {
				this.eventHandler.remove();
				this.eventHandler = null;
			}
			if (this.visControl) {
				this.visControl.remove();
				this.visControl = null;
			}
			GridView.inherited('remove', this, arguments);
		},

		_extendTuples: function _extendTuples(aSourceArray, aTargetArray, name, value) {
			_.each(aSourceArray, function (prevTuple) {
				var obj = {};
				obj[name] = value;
				aTargetArray.push(_.extend(obj, prevTuple));
			});
		},

		/**
   * @returns an array that represents current filter as tuple
   */
		_getSelectionValues: function _getSelectionValues() {
			var aTuple = [];

			var selections = this.getController();
			var colIndex = this.visControl.getRankDataItemCount();

			_.each(this.visualization.getSlots().getMappedSlotList(), function (slot) {
				if (slot.getId() !== 'heat') {
					_.each(slot.getDataItemList(), function (dataItem) {
						var values = selections.getSelectedTuples([dataItem.getColumnId()]);
						if (values && values.length) {
							var aTemp = [];
							_.each(values, function (value) {
								if (aTuple.length === 0) {
									var tuple = {};
									tuple[colIndex] = value;
									aTemp.push(tuple);
								} else {
									this._extendTuples(aTuple, aTemp, colIndex, value);
								}
							}.bind(this));
							aTuple = aTemp.slice();
						}
						colIndex++;
					}.bind(this));
				}
			}.bind(this));

			return aTuple;
		},

		/**
   * Update the selection tuple of the grid
   */
		setSelections: function setSelections() {
			this.visControl.setSelections(this._getSelectionValues());
		},


		/**
   * Update the selection tuple of the grid 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();
			if (this.visControl) {
				// force a re-render so selections are handled properly
				this.visControl.onResize();
			}
		},


		getFocusedCellIDs: function getFocusedCellIDs() {
			return this._focusedCellIDs;
		},

		setFocusedCellIDs: function setFocusedCellIDs(cellID, cells) {
			this._focusedCellIDs.key = cellID;
			this._focusedCellIDs.cellIDs = cells;
		},

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

		filterNodeKeydownHandler: function filterNodeKeydownHandler(event) {
			event.stopPropagation();
		}

	});

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