analytics/webcontent/bi/js/gemini/dashboard/widgets/staticwidget/MultipurposeWidget.js

'use strict';

/**
 * Licensed Materials - Property of IBM
 * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2018, 2020
 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 */
define(['underscore', './StaticWidget', 'text!./Multipurpose.html', './IconPlaceholderView', './ShortcutPlaceholderView', './TextWidget'], function (_, StaticWidget, MultiPurposeTemplate, IconPlaceholderView, ShortcutPlaceholderView, TextWidget) {

	var MultipurposeWidget = StaticWidget.extend({
		init: function init(options) {
			MultipurposeWidget.inherited('init', this, arguments);
			if (options && options.initialConfigJSON && options.initialConfigJSON.placeholder) {
				this.placeholder = options.initialConfigJSON.placeholder;
			}
		},

		onContainerReady: function onContainerReady() {
			MultipurposeWidget.inherited('onContainerReady', this, arguments);
			if (this.model) {
				if (this.model.fillColor) {
					this.$el.find('div.staticContent').addClass('fill-' + this.model.fillColor);
				}
				if (this.model.borderColor) {
					this.$el.find('div.staticContent').addClass('border-' + this.model.borderColor);
				}
			}
		},

		render: function render() {
			var _this = this;

			this.$el.append(MultiPurposeTemplate);

			var viewOptions = { el: this.$el.find('.dropZone'), dashboardApi: this.dashboardApi };

			if (this.placeholder) {
				_.extend(viewOptions, this.placeholder);
				this.multiView = new IconPlaceholderView(viewOptions);
			} else {
				// shortcut callbacks
				_.extend(viewOptions, {
					onVisualizationSelected: function onVisualizationSelected() {
						_this.replaceWithVis();
					},
					onTextSelected: function onTextSelected() {
						_this.replaceWithText();
					},
					onImageSelected: function onImageSelected() {
						_this.replaceWithImage();
					}
				});
				this.multiView = new ShortcutPlaceholderView(viewOptions);
			}

			this.multiView.render();

			var DndManager = this.dashboardApi.getFeature('DashboardDnd.internal');
			DndManager.addDropTarget(this.$el, {
				accepts: function accepts(dragObject) {
					if (_this.placeholder) {
						return _this._isDraggingData(dragObject);
					} else {
						return _this._isDraggingData(dragObject) || _this._isDraggingWidget(dragObject) || _this._isMovingWidget(dragObject) || _this._isDraggingPin(dragObject) || _this._isDraggingGroup(dragObject);
					}
				},
				onDrop: function onDrop(dragObject) {
					_this.$el.find('.dropZone').removeClass('active');
					return _this._onDrop(dragObject);
				},
				onDragEnter: function onDragEnter() {
					_this.$el.find('.dropZone').addClass('active');
				},
				onDragLeave: function onDragLeave() {
					_this.$el.find('.dropZone').removeClass('active');
				}
			});
			return this.$el;
		},

		_isDraggingData: function _isDraggingData() {
			var dragObject = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

			var canvasDnD = this.dashboardApi.getFeature('CanvasDnD');
			return canvasDnD.accepts(dragObject, {
				fromMultipurposeWidget: true
			});
		},

		_isDraggingWidget: function _isDraggingWidget(dragObject) {
			return dragObject.type === 'widget' && dragObject.data && dragObject.data.operation === 'new';
		},

		_isMovingWidget: function _isMovingWidget(dragObject) {
			// Only can move one widget to the placeholder at once
			return dragObject.type === 'widget' && dragObject.data && dragObject.data.nodeInfoList && dragObject.data.nodeInfoList.length === 1;
		},

		_isDraggingPin: function _isDraggingPin(dragObject) {
			return dragObject.type === 'pin';
		},

		_isDraggingGroup: function _isDraggingGroup(dragObject) {
			return dragObject.type === 'groupContent';
		},

		destroy: function destroy() {
			if (this.multiView && this.multiView.destroy) {
				this.multiView.destroy();
			}

			if (this.model && this.model.id) {
				this.onChromeDeselected();
			}

			MultipurposeWidget.inherited('destroy', this, arguments);
		},

		registerEventGroup: function registerEventGroup() {
			// Multipurpose widgets are not added to event groups
		},

		_onDrop: function _onDrop(dragObject) {
			if (dragObject.data.operation === 'move') {
				return this._moveDrop(dragObject);
			} else if (this._isDraggingPin(dragObject) && dragObject.data.operation === 'new') {
				return this._onPinDrop(dragObject);
			} else if (dragObject.data.operation === 'new' || this._isDraggingData(dragObject)) {
				return this._newDrop(dragObject);
			}
		},

		_moveDrop: function _moveDrop(dragObject) {
			var transaction = this.dashboardApi.getFeature('Transaction');
			var canvas = this.dashboardApi.getCanvas();

			var transactionToken = transaction.startTransaction();
			var placeholderContent = canvas.getContent(this.id);
			var layout = this._getLayoutProperties(placeholderContent);

			canvas.removeContent(this.id, transactionToken);

			var nodeInfo = dragObject.data.nodeInfoList[0];
			var nodeModel = nodeInfo.node._layout.model;
			var content = canvas.getContent(nodeModel.id);

			this._setLayoutProperties(content, layout, transactionToken);
			// Need to move back to canvas as the widget drops to body by dnd manager
			canvas.moveContent(content.getContainer().getId(), [content.getId()], transactionToken);
			transaction.endTransaction(transactionToken);
		},

		_onPinDrop: function _onPinDrop(dragObject) {
			var pinSpec = dragObject.data.pinSpec;
			return this._replaceSelf(pinSpec.content);
		},

		_newDrop: function _newDrop(dragObject) {
			var _this2 = this;

			var canvasDnD = this.dashboardApi.getFeature('CanvasDnD');
			return canvasDnD.onDrop(dragObject).then(function (newModel) {
				return _this2._replaceSelf(newModel);
			});
		},

		_replaceSelf: function _replaceSelf(model) {
			var _this3 = this;

			var transaction = this.dashboardApi.getFeature('Transaction');
			var canvas = this.dashboardApi.getCanvas();

			var transactionToken = transaction.startTransaction();
			if (this.model) {
				if (this.model.fillColor) {
					model.fillColor = this.model.fillColor;
				}
				if (this.model.borderColor) {
					model.borderColor = this.model.borderColor;
				}
			}
			var placeholderContent = canvas.getContent(this.id);
			var content = {
				spec: model,
				containerId: this.content.getContainer().getId(),
				properties: this._getLayoutProperties(placeholderContent)
			};

			return canvas.addContent(content, transactionToken).then(function (newContent) {
				var state = newContent.getFeature('state');
				return state.whenStatusChanges(state.STATUS.RENDERED).then(function () {
					var selectedContentList = canvas.getSelectedContentList();
					var selectedContentIds = selectedContentList.map(function (item) {
						return item.getId();
					});

					canvas.deselectContent(selectedContentIds);
					canvas.removeContent(_this3.id, transactionToken);
					canvas.selectContent([newContent.getId()]);

					transaction.endTransaction(transactionToken);
				});
			});
		},

		_getLayoutProperties: function _getLayoutProperties(content) {
			return {
				height: content.getPropertyValue('height'),
				width: content.getPropertyValue('width'),
				left: content.getPropertyValue('left'),
				top: content.getPropertyValue('top')
			};
		},

		_setLayoutProperties: function _setLayoutProperties(content, layout, transactionToken) {
			content.setPropertyValue('height', layout.height, transactionToken);
			content.setPropertyValue('width', layout.width, transactionToken);
			content.setPropertyValue('left', layout.left, transactionToken);
			content.setPropertyValue('top', layout.top, transactionToken);
		},

		replaceWithVis: function replaceWithVis() {
			return this._replaceSelf({
				type: 'live',
				visId: 'com.ibm.vis.rave2bundlecolumn',
				expandOnRender: true,
				usePreferredSize: false
			});
		},

		replaceWithText: function replaceWithText() {
			var _this4 = this;

			var options = {
				style: 'body',
				placeholder: {
					showIcon: false
				}
			};
			return TextWidget.getDefaultSpec('', options).then(function (defaultSpec) {
				return _this4._replaceSelf(defaultSpec.model);
			});
		},

		replaceWithImage: function replaceWithImage() {
			return this._replaceSelf({ type: 'image' });
		},

		resize: function resize() {
			if (this.multiView.resize) {
				this.multiView.resize();
			}
		}
	});

	MultipurposeWidget.getDefaultSpec = function () {
		return Promise.resolve({
			model: {
				type: 'multipurpose',
				avatarHtml: MultiPurposeTemplate
			},
			layoutProperties: {
				style: {
					width: '240px',
					height: '180px'
				}
			}
		});
	};

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