analytics/webcontent/bi/js/dashboard-analytics/features/content/common/textAction/TextAction.js

'use strict';

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

/**
 * Licensed Materials - Property of IBM
 * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2019, 2020
 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 */
define(['underscore', 'dashboard-analytics/visualizations/vipr/VIPRUtils', '../../../../widgets/livewidget/nls/StringResources', 'dashboard-analytics/util/FontFamilyOptions', '../../../../lib/@waca/dashboard-common/dist/core/APIFactory', '../../../content/slotActions/api/SlotActionsProviderAPI', '../../../../util/ContentUtil'], function (_, VIPRUtils, stringResources, FontFamilyOptions, APIFactory, SlotActionsProviderAPI, ContentUtil) {
	var TextAction = function () {
		function TextAction(options) {
			_classCallCheck(this, TextAction);

			this.initialState = {
				fontSize: null,
				font: null,
				bold: false,
				italic: false,
				underline: false,
				justifyLeft: false,
				justifyCenter: false,
				justifyRight: false,
				color: null,
				textAlign: '',
				textWrap: false
			};
			this.localVisSuffix = {
				color: 'Color',
				fontSize: 'FontSize',
				font: 'FontFace',
				bold: 'FontBold',
				italic: 'FontItalic',
				underline: 'FontUnderline',
				textAlign: 'FontAlign',
				textWrap: 'TextWrap'
			};
			this.vidaVisSuffix = {
				color: '.color',
				fontSize: 'size',
				font: 'family',
				bold: 'weight',
				italic: 'style'
			};
			this.booleanProperty = ['weight', 'style'];
			this.selectedAreaPrefix = 'selectedArea';

			this.dashboard = options.dashboardAPI;
			this.content = options.content;
			this.icons = options.features['Dashboard.Icons'];
			this.colorsService = this.dashboard.getFeature('Colors');

			this.content.getFeature('DataPointActions').registerProvider('TextAction', this);
			this.content.getFeature('SlotActions').registerProvider('TextAction', this.getAPI());
		}

		//vida based visulization does not support text decoration and text alignment yet, widget.legend has the same naming pattern


		TextAction.prototype.getDataPointActionList = function getDataPointActionList(selections, options) {
			if (this._supportDataPointAction()) {
				if (options.isAreaSelected) {
					this.selectedArea = ContentUtil.getContextFromSelection(this.content, this.dashboard);
					// if the selection is not valid, disable the textAction
					if (!this.selectedArea.length) {
						return [];
					}
					this.isAreaSelected = true;
				} else {
					this.isAreaSelected = false;
					this.selectedArea = null;
				}
				return this.getContribution(null, selections.area);
			}

			return [];
		};

		TextAction.prototype._supportDataPointAction = function _supportDataPointAction() {
			if (this.dashboard.getMode() !== this.dashboard.MODES.EDIT) {
				return false;
			}

			return true;
		};

		TextAction.prototype.getSlotActionList = function getSlotActionList(slotId, index, options) {
			if (this._supportSlotAction(index)) {
				if (options && options.isAreaSelected) {
					// textAction is not actually a slot action, should only have measure title selection here
					this.selectedArea = this._getContextFromSlot(slotId, index);
					// if the selection is not valid, disable the textAction
					if (!this.selectedArea.length) {
						return [];
					}
					this.isAreaSelected = true;
				} else {
					this.isAreaSelected = false;
					this.selectedArea = null;
				}
				return this.getContribution(slotId, options && options.area);
			}

			return [];
		};

		TextAction.prototype._getContextFromSlot = function _getContextFromSlot(slotId, index) {
			var slot = this.content.getFeature('Visualization').getSlots().getSlot(slotId);
			var dataItemList = slot && slot.getDataItemList();
			var dataItemLabel = dataItemList && dataItemList[index] && dataItemList[index].getLabel();
			if (dataItemLabel) {
				return [dataItemLabel];
			}
		};

		TextAction.prototype._supportSlotAction = function _supportSlotAction(index) {

			if (this.content.getFeature('Visualization').getDefinition().getId() === 'summary') {
				return false;
			}

			if (this.dashboard.getMode() !== this.dashboard.MODES.EDIT) {
				return false;
			}

			if (Array.isArray(index) && index.length == 1) {
				return true;
			}

			if (index !== undefined) {
				return false;
			}

			return true;
		};

		TextAction.prototype._supportsTextWrap = function _supportsTextWrap(slotId, area) {
			var supportsTextWrapAreaList = this.content.getFeature('Visualization').getDefinition().getProperty('supportsTextWrap');
			return supportsTextWrapAreaList ? supportsTextWrapAreaList[area] || supportsTextWrapAreaList[slotId] : false;
		};

		TextAction.prototype.getContribution = function getContribution(slotId, area) {
			var _this = this;

			this.propertyPrefix = this.isAreaSelected ? this.selectedAreaPrefix : this.constructPropertyPrefix(slotId, area);

			this.groupedProperty = this.content.getFeature('Visualization').getDefinition().getProperty('groupedProperty');
			if (this.propertyPrefix) {
				this.currentProps = this.content.getPropertyNameList().map(function (prop) {
					return { id: prop, value: _this.content.getPropertyValue(prop) };
				});
				var currentState = {};
				this.isLocalVis = this._isLocalVis(this.content.getFeature('Visualization').getDefinition().getId());
				this.propertySuffix = this.isLocalVis ? this.localVisSuffix : this.vidaVisSuffix;
				_.each(this.propertySuffix, function (value, prop) {
					currentState[prop] = _this.findCurrentProperties(_this.currentProps, value);
				});

				var elementListType = this.content.getFeature('Visualization').getDefinition().getProperty('supportsAdvancedProperties') ? 'default' : 'simpleTextEdit';
				var colorOptions = this._getTextColorOptions();
				var fontSizeOptions = this._getAppropriateFontSizes(area);
				var supportsTextWrap = this._supportsTextWrap(slotId, area);
				var viewOptions = {
					height: 140,
					width: 140,
					initialState: this.initialState,
					currentState: currentState,
					properties: {
						colors: colorOptions,
						fontSizes: fontSizeOptions,
						fonts: FontFamilyOptions
					},
					elementListType: elementListType,
					supportsTextWrap: supportsTextWrap
				};
				var commonTextEdit = this.icons.getIcon('common-text-edit');
				return [{
					name: 'text',
					text: stringResources.get('toolbarTextActionText'),
					label: stringResources.get('toolbarTextActionText'),
					icon: commonTextEdit.id,
					type: 'NextView',
					view: {
						module: 'dashboard-analytics/lib/@waca/dashboard-common/dist/ui/dialogs/TextToolbarCompactDialog',
						state: viewOptions
					},
					actions: {
						apply: this.onStateChange.bind(this)
					},
					showCaption: false
				}];
			}
		};

		/**
   * This method returns the appropriate font sizes that need to be shown. For the area type legend we are going to show 3 options and for the rest, 4 options.
   * @param {string} area
   * returns the Font Size object
   */


		TextAction.prototype._getAppropriateFontSizes = function _getAppropriateFontSizes(area) {
			var FONT_SIZE_OPTIONS = [{ value: '12px', label: '12px' }, { value: '14px', label: '14px' }, { value: '16px', label: '16px' }, { value: '24px', label: '24px' }];

			var LEGEND_FONT_SIZE_OPTIONS = [{ value: '11px', label: '11px' }, { value: '14px', label: '14px' }, { value: '16px', label: '16px' }];

			return area === 'legend' ? LEGEND_FONT_SIZE_OPTIONS : FONT_SIZE_OPTIONS;
		};

		TextAction.prototype.constructPropertyPrefix = function constructPropertyPrefix(currentSlotId, area) {
			var propertyPrefixesForWidget = this.content.getFeature('Visualization').getDefinition().getProperty('propertyPrefixes');
			var result = void 0;

			if (propertyPrefixesForWidget) {
				result = propertyPrefixesForWidget[area];
				if (result) {
					return result;
				} else {
					if (!currentSlotId && area === 'visualization') {
						return propertyPrefixesForWidget['dataPoint'];
					} else if (currentSlotId) {
						return propertyPrefixesForWidget[currentSlotId];
					}
				}
			}
		};

		TextAction.prototype._isLocalVis = function _isLocalVis(visId) {
			var localVis = ['summary', 'list', 'crosstab', 'JQGrid'];
			return _.contains(localVis, visId);
		};

		TextAction.prototype.findCurrentProperties = function findCurrentProperties(currentProps, propertyToFind) {
			var isFontProp = this.isLocalVis === false && propertyToFind !== '.color';
			var isColorProp = propertyToFind === '.color' || propertyToFind === 'Color';

			if (propertyToFind) {
				var findValue = this.propertyPrefix + (isFontProp ? '.font' : propertyToFind);
			} else {
				return undefined;
			}

			var propertyFound = this.findPropertyById(currentProps, findValue);
			if (currentProps === undefined || propertyFound === undefined) {
				var prefix = _.invert(this.propertySuffix)[propertyToFind];
				return this.initialState[prefix];
			} else if (propertyFound) {
				if (!isFontProp) {
					if (this.isAreaSelected) {
						// if multiple selections are made, show the first selection's value
						propertyFound.value = propertyFound.value && propertyFound.value[this.selectedArea[0]] && propertyFound.value[this.selectedArea[0]].value;
					}
					// if the property is a color property, we need to transform the color class value into hex value
					if (isColorProp && propertyFound.value !== null && typeof propertyFound.value === 'string' && !this._isHexColor(propertyFound.value)) {
						return this.colorsService.getHexColorFromDashboardColorSet(propertyFound.value);
					}
					return propertyFound.value;
				} else {
					return VIPRUtils.getVidaFontPropertiesPart(propertyToFind, propertyFound.value);
				}
			}
		};

		TextAction.prototype._isHexColor = function _isHexColor(val) {
			return val.indexOf('#') === 0 && val.length === 7;
		};

		TextAction.prototype.findPropertyById = function findPropertyById(properties, id) {
			var foundProperty = _.find(properties, function (property) {
				return property.id === id;
			});
			return foundProperty;
		};

		TextAction.prototype._getTextColorOptions = function _getTextColorOptions() {
			var colorPalette = this.colorsService.getDashboardColorSet().filter(function (item) {
				return item.id !== 'transparent';
			});
			var colorOptions = [];
			_.each(colorPalette, function (color) {
				colorOptions.push(color.hexValue);
			});
			return colorOptions;
		};

		TextAction.prototype.onStateChange = function onStateChange(stateChanges) {
			var propertyList = [];
			if (this.propertyPrefix) {
				if (this.isLocalVis) {
					propertyList = this._buildLocalVisPropertyList(stateChanges, propertyList);
				} else {
					propertyList = this._buildVidaVisPropertyList(stateChanges, propertyList);
				}
			}
			this.editProperties(propertyList);
		};

		TextAction.prototype._buildLocalVisPropertyList = function _buildLocalVisPropertyList(stateChanges, propertyList) {
			var _this2 = this;

			var changedStates = Object.keys(stateChanges);
			_.each(changedStates, function (changedState) {
				if (_this2.propertySuffix[changedState]) {
					var propertyName = _this2.propertyPrefix + _this2.propertySuffix[changedState];
					var isColorProp = changedState === 'color';
					// the text toolbar will set the hex color value, we need to transform the value into color class value before saved in the model
					var newPropertyVal = isColorProp && stateChanges[changedState] !== null ? _this2._findColorIdFromHex(stateChanges[changedState]) : stateChanges[changedState];
					if (_this2.isAreaSelected) {
						var currentPropertyValue = JSON.parse(JSON.stringify(_this2.content.getPropertyValue(propertyName) || {}));
						_.each(_this2.selectedArea, function (selectedArea) {
							// the text formatting for selection need to be applied in order, whichever comes last should win, use timestamp as the weight to sort the order here
							currentPropertyValue[selectedArea] = {
								value: newPropertyVal,
								weight: Date.now()
							};
						});
						newPropertyVal = currentPropertyValue;
					}
					propertyList.push({ 'id': propertyName, 'value': newPropertyVal });
					if (_this2.groupedProperty && _.has(_this2.groupedProperty, propertyName)) {
						_.each(_this2.groupedProperty[propertyName], function (prop) {
							propertyList.push({ 'id': prop, 'value': newPropertyVal });
						});
					}
				}
			});
			return propertyList;
		};

		TextAction.prototype._buildVidaVisPropertyList = function _buildVidaVisPropertyList(stateChanges, propertyList) {
			var _this3 = this;

			var vidaPropertyList = [];
			var fontParts = _.pick(stateChanges, 'font', 'fontSize');
			var colorPart = _.pick(stateChanges, 'color');

			if (!_.isEmpty(fontParts)) {
				var fontPropName = this.propertyPrefix + '.font';
				var currentPropertyValue = this.content.getPropertyValue(fontPropName);
				var fontProperty = VIPRUtils.buildVidaFontPropertiesFromParts(fontParts, currentPropertyValue);
				vidaPropertyList.push({ id: fontPropName, value: fontProperty });
			}

			if (!_.isEmpty(colorPart)) {
				//build color property
				var colorPropName = this.propertyPrefix + '.color';
				// the text toolbar will set the hex color value, we need to transform the value into color class value before saved in the model
				var colorPropValue = colorPart['color'] !== null ? this._findColorIdFromHex(colorPart['color']) : colorPart['color'];
				vidaPropertyList.push({ id: colorPropName, value: colorPropValue });
			}

			vidaPropertyList.forEach(function (vidaProperty) {
				if (_this3.groupedProperty && _.has(_this3.groupedProperty, vidaProperty.id)) {
					_.each(_this3.groupedProperty[vidaProperty.id], function (id) {
						return vidaPropertyList.push({ 'id': id, 'value': vidaProperty.value });
					});
				}
			});

			return propertyList.concat(vidaPropertyList);
		};

		TextAction.prototype._findColorIdFromHex = function _findColorIdFromHex(colorValue) {
			var colorPalette = this.colorsService.getDashboardColorSet().filter(function (item) {
				return item.id !== 'transparent';
			});
			var found = _.find(colorPalette, function (color) {
				return color.hexValue.toUpperCase() === colorValue.toUpperCase();
			});

			if (!found) {
				return this.colorsService.getColorClassName(colorValue);
			} else {
				return found.id;
			}
		};

		/**
   * This method sets the vis properties to the value given
   * @param propertyList - the propertyList that trigerred the state change
   */


		TextAction.prototype.editProperties = function editProperties(propertyList) {
			var _this4 = this;

			var transactionToken = this.dashboard.getFeature('Transaction').startTransaction();
			propertyList.forEach(function (prop) {
				_this4.content.setPropertyValue(prop.id, prop.value, transactionToken);
			});
			this.dashboard.getFeature('Transaction').endTransaction(transactionToken);
		};

		TextAction.prototype.getAPI = function getAPI() {
			if (!this._api) {
				this._api = APIFactory.createAPI(this, [SlotActionsProviderAPI]);
			}
			return this._api;
		};

		return TextAction;
	}();

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