analytics/webcontent/bi/js/storytelling/layout/views/PanAndZoomLayout1.js

'use strict';

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

define(['./PanAndZoomLayout', 'text!./templates/PanAndZoom.html', 'text!./templates/PanAndZoomItems.html'], function (BaseClass, PanAndZoomTemplate, PanAndZoomItemsTemplate) {

	var LayoutTemplate = BaseClass.extend({

		changePageSize: function changePageSize(event) {
			var info = {
				scenePadding: 10,
				height: event.value.height,
				width: event.value.width
			};
			info.offsetWidth = info.width + info.scenePadding;
			info.offsetHeight = info.height + info.scenePadding;
			info.halfOffsetWidth = info.offsetWidth / 2;
			info.halfOffsetHeight = info.offsetHeight / 2;

			this._boxLayoutInfo = info;

			this.sceneLocations = [{
				// 0
				x: 0,
				y: 0,
				scale: 1
			}, {
				// 1
				x: 0,
				y: info.offsetHeight,
				scale: 1
			}, {
				// 2
				x: info.halfOffsetWidth + info.offsetWidth,
				y: info.halfOffsetHeight,
				scale: this._computeTemplateScale(info.width, info.height, info.scenePadding, 2)
			}, {
				// 3
				x: info.halfOffsetWidth * 1.5 - info.halfOffsetWidth,
				y: info.offsetHeight * 1.5 + info.halfOffsetHeight * 1.5,
				scale: this._computeTemplateScale(info.width, info.height, info.scenePadding, 1.5)
			}, {
				// 4
				x: info.halfOffsetWidth * 1.5 - info.halfOffsetWidth + info.offsetWidth * 1.5,
				y: info.offsetHeight * 1.5 + info.halfOffsetHeight * 1.5,
				scale: this._computeTemplateScale(info.width, info.height, info.scenePadding, 1.5)
			}];
		},

		/**
   * Called to get the location of the center of the specified scene
   *
   * @param index -
   *            index of the scene.
   * @param viewport -
   *            viewport to scale the scene to
   * @param sceneModel -
   *            model to retrieve the size from
   * @return an object with an x, y, and a scale
   *
   */
		_getSceneLocation: function _getSceneLocation(index, viewport) {
			var info = this._boxLayoutInfo;

			var repeatCount = Math.floor(index / 5);
			var layoutBox = this.sceneLocations[index % 5];

			var yOffset = (this.sceneLocations[4].y + info.halfOffsetHeight * 1.5 + info.halfOffsetHeight) * repeatCount;

			var viewportScale = this._computeViewportScale(viewport, info.offsetHeight, info.offsetWidth);

			return {
				x: layoutBox.x * viewportScale,
				y: (layoutBox.y + yOffset) * viewportScale,
				scale: layoutBox.scale,
				height: info.height * viewportScale,
				width: info.width * viewportScale
			};
		},

		/**
   * Called to get the location of the center of the overview
   *
   * @param sceneCount -
   *            the number of scenes in the overview.
   * @param viewport -
   *            the viewport the overview has to be scaled to.
   * @return an object with an x, y, and a scale
   *
   */
		_getOverviewLocation: function _getOverviewLocation(viewport) {
			var info = this._boxLayoutInfo;

			// first scene is always upper left
			var x1 = info.halfOffsetWidth * -1;
			var y1 = info.halfOffsetHeight * -1;

			var x2 = 0;
			var y2 = 0;

			// The pattern can have 2 widths.
			// 1-2 scenes and 3+ scenes
			if (this.model.items.length < 3) {
				x2 = info.halfOffsetWidth;
			} else {
				x2 = this.sceneLocations[2].x + info.halfOffsetWidth * this.sceneLocations[2].scale;
			}

			// use last scene to figure out how far down we are.
			var lastScene = this._getSceneLocation(this.model.items.length - 1);

			y2 = lastScene.y + info.halfOffsetHeight * lastScene.scale;

			var x = (x2 + x1) / 2;
			var y = (y2 + y1) / 2;

			var xScale = (x2 - x1) / info.offsetWidth;
			var yScale = (y2 - y1) / info.offsetHeight;

			var viewportScale = this._computeViewportScale(viewport, info.offsetHeight, info.offsetWidth);
			return {
				scale: Math.max(xScale, yScale),
				x: x * viewportScale,
				y: y * viewportScale
			};
		}
	});
	/* used by HtmlTemplates.js */
	LayoutTemplate.getTemplate = function () {
		return [PanAndZoomTemplate, PanAndZoomItemsTemplate];
	};
	return LayoutTemplate;
});
//# sourceMappingURL=PanAndZoomLayout1.js.map