analytics/webcontent/bi/js/dashboard-analytics/visualizations/renderer/info/InfoIndicator.js

'use strict';

/*
 *+------------------------------------------------------------------------+
 *| Licensed Materials - Property of IBM
 *| IBM Cognos Products: Dashboard
 *| (C) Copyright IBM Corp. 2017, 2019
 *|
 *| US Government Users Restricted Rights - Use, duplication or disclosure
 *| restricted by GSA ADP Schedule Contract with IBM Corp.
 *+------------------------------------------------------------------------+
 */
define(['underscore', '../../../lib/@waca/core-client/js/core-client/ui/core/View', '../../../lib/@waca/dashboard-common/dist/utils/Flyout', '../../../widgets/livewidget/nls/StringResources', 'text!./templates/InfoIndicator.html', './InfoFlyoutView'], function (_, View, Flyout, stringResources, template, InfoFlyoutView) {
	'use strict';

	var infoIndicator = View.extend({
		templateString: template,

		events: {
			'clicktap': '_onClick',
			'keydown': '_onClick'
		},

		init: function init(options) {
			infoIndicator.inherited('init', this, arguments);

			var warnIcon = options.ownerWidget.dashboardApi.getFeature('Icons').getIcon('warnIcon');
			this.messages = {};
			this.$el.empty().append(this.dotTemplate({
				title: stringResources.get('warning'),
				iconId: warnIcon.id
			}));
			this._hideIndicator();
		},

		remove: function remove() {
			if (this.flyout) {
				this.flyout.destroy();
			}
			infoIndicator.inherited('remove', this, arguments);
		},

		/**
   * @function addInfo
   * Adds an array of information to be rendered by the indicator.
   * This can be called multiple times before calling {@link InfoIndicator#reset} and
   * the information added with the same identifier will be merged as an unique information.
   * Each array item must be provided in the following format.
   * @param {Object[]} info - array of objects representing an information
   * @example
   * 	indicator.addInfo([{
   * 		id: 'information-identifier',
   *		label: 'information label'
   *		items: [{
   *			id: 'info-data-identifier',
   *			label: 'information data label'
   *		}],
   *		small: true    //Change the max-height of the dialog content to 100px instead of 300x
   * 	}]);
   */
		addInfo: function addInfo(info) {
			var _this = this;

			// filter out empty messages
			var filtered = _.filter(info, function (i) {
				return i.items.length > 0;
			});

			// merge the messages to the map
			// each service should has its own indicator section, and the message should be updated when that section get updated
			_.each(filtered, function (i) {
				_this.messages[i.id] = i;
			});

			if (_.isEmpty(this.messages)) {
				this._hideIndicator();
			} else {
				this.$el.show();
			}
		},

		/**
   * @function reset
   * Reset the information messages
   */
		reset: function reset() {
			this.messages = {};
			this._hideIndicator();
		},

		/**
  * Hide the info indicator
  */
		_hideIndicator: function _hideIndicator() {
			this.$el.hide();
		},
		clearMessagesByIdAndSubtype: function clearMessagesByIdAndSubtype(idType) {
			var _this2 = this;

			var id = idType.id;
			var type = idType.type;
			Object.values(this.messages).forEach(function (message) {
				for (var i = 0; i < message.items.length; i++) {
					if (message.items[i].id === id && message.items[i].type === type) {
						message.items.splice(i, 1);

						if (message.items.length === 0) {
							_this2.clearMessagesWithIds([message.id]);
						}
					}
				}
			});
		},


		/**
  * Clear all messages with the specified id. If there are no messages remaining
  * after the clear then hide the indicator.
  * @param {Array} ids - array of ids to clear in the messages object.
  */
		clearMessagesWithIds: function clearMessagesWithIds(ids) {
			var _this3 = this;

			ids.forEach(function (id) {
				if (_this3.messages[id]) {
					delete _this3.messages[id];
				}
			});

			// Check if there are messages available, if not, hide
			if (_.isEmpty(this.messages)) {
				this._hideIndicator();
			}
		},


		_onClick: function _onClick(event) {
			if (event.type === 'keydown') {
				event.stopPropagation();
				var key = event.key || event.keyCode || event.which || '';
				if (key !== 'Enter' && key !== 13) {
					return;
				}
			}

			if (event.gesture) {
				event.gesture.preventDefault();
			}

			if (event.cancelable) {
				event.preventDefault();
			}

			if (!this.flyout) {
				this.flyout = new Flyout({
					container: document.body,
					selector: this.$el,
					popoverClass: 'filterPopover visTopPopover',
					viewport: 'body',
					viewClass: InfoFlyoutView,
					viewOptions: {
						messages: _.values(this.messages)
					}
				});
			} else {
				this.flyout.view.setMessages(_.values(this.messages));
			}

			this.flyout.open(this.$el);
			event.stopPropagation();
		}
	});

	return infoIndicator;
});
//# sourceMappingURL=InfoIndicator.js.map