analytics/webcontent/bi/js/dashboard-analytics/visualizations/renderer/infographic/InfographicScaleView.js

'use strict';

/**
 * Licensed Materials - Property of IBM
 *
 * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2016, 2018
 *
 * US Government Users Restricted Rights - Use, duplication or disclosure
 * restricted by GSA ADP Schedule Contract with IBM Corp.
 */

define(['underscore', '../../../widgets/livewidget/nls/StringResources', '../../../lib/@waca/core-client/js/core-client/ui/core/View', '../../../lib/@waca/dashboard-common/dist/ui/Slider', '../../../lib/@waca/dashboard-common/dist/utils/ScaleUtil'], function (_, stringResources, View, Slider, ScaleUtil) {
	'use strict';

	// Create message map only once

	var _SCALE_MESSAGE_MAP = {};
	_SCALE_MESSAGE_MAP[ScaleUtil.SCALE_VALUE_FEW] = stringResources.get('propScaleFew');
	_SCALE_MESSAGE_MAP[ScaleUtil.SCALE_VALUE_DEFAULT] = stringResources.get('propScaleDefault');
	_SCALE_MESSAGE_MAP[ScaleUtil.SCALE_VALUE_MANY] = stringResources.get('propScaleMany');

	var InfographicScaleView = View.extend({

		init: function init(options) {
			InfographicScaleView.inherited('init', this, arguments);
			_.extend(this, options);
		},

		/**
   * Called to render the flyout with the slider/title to edit scale
   * @returns Flyout and slider are rendered
   */
		render: function render() {
			// Required to set dimensions of flyout. If not set, will appear tiny
			this.$el.css({
				height: 93,
				width: 200
			});
			var extremes = ScaleUtil.getMinMax(this.widgetValue, this.isPercent);
			var options = {
				el: this.$el[0],
				name: 'scaleSlider',
				label: stringResources.get('propScaleLabel'),
				type: 'slider',
				description: stringResources.get('propScaleDescription'),
				min: extremes.min,
				max: extremes.max,
				step: 1,
				showMinMax: false,
				value: this.currentScaleOption,
				style: 'simple',
				valueFormatter: this.valueFormatter.bind(this)
			};

			this.slider = new Slider(options);
			return this.slider.render();
		},

		/**
   * Called when the subview has finished rendering
   */
		notifyRenderComplete: function notifyRenderComplete() {
			if (this.slider) {
				// slider needs to re-layout after it's rendered to ensure size calculations are correct
				this.slider.layout();
				if (this.slider.slider) {
					// hook up slider event
					this.slider.slider.on('slideStop', this.onWidgetScaleUpdate.bind(this));
				}
			}
		},

		/**
   * Used to update the model when the scale is changed via the widget. Calls internal function to update model and reRender infographic.
   * @param {object} info - Object with a property (value) that contains the new slider value
   */
		onWidgetScaleUpdate: function onWidgetScaleUpdate(info) {
			this.content.setPropertyValue('value.graphic.currentScaleOption', info.value);
		},

		/**
   * Returns the slider text for the given value
   * @param {string} value
   * @returns {string}
   */
		valueFormatter: function valueFormatter(value) {
			return _SCALE_MESSAGE_MAP[value] || value;
		},

		setFocus: function setFocus() {
			if (this.slider) {
				this.slider.setFocus();
			}
		}
	});

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