analytics/webcontent/bi/js/gemini/features/dashboard/fullScreen/FullScreen.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 Business Analytics (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(['./FullScreenAPI', 'jquery', '../../../api/DashboardAPI', '../../../app/nls/StringResources', '../../../lib/@waca/dashboard-common/dist/core/APIFactory', '../../../lib/@waca/dashboard-common/dist/api/ContentActionsProviderAPI'], function (FullScreenAPI, $, DashboardAPI, stringResources, APIFactory, ContentActionsProviderAPI) {
	var FULL_SCREEN_CHANGE_EVENTS = 'webkitfullscreenchange mozfullscreenchange MSFullscreenChange fullscreenchange';

	/**
  * @implements {FullScreenAPI}
  */

	var FullScreen = function () {
		function FullScreen(_ref) {
			var features = _ref.features;

			_classCallCheck(this, FullScreen);

			this._dashboard = features.API;
			this._dashboardState = features.DashboardState;
			this._contentActions = features.ContentActions;
			this._icons = features.Icons;

			this._logger = this._dashboard.getService(DashboardAPI.GLOBAL_SERVICES.LOGGER);
		}

		FullScreen.prototype.initialize = function initialize() {
			this._api = APIFactory.createAPI(this, [FullScreenAPI, ContentActionsProviderAPI]);
			this._contentActions.registerProvider('fullScreenAction', this._api);
			this._dashboardState.onChangeActive(this._onChangeDashboardState.bind(this));
			this._dashboardState.onUiStateChange(this._onUiStateChange.bind(this));

			this._isEventTriggeredInternally = false;
			this._isFullScreen = false;
			this._inProgress = false;
		};

		FullScreen.prototype.getAPI = function getAPI() {
			return this._api;
		};

		FullScreen.prototype.destroy = function destroy() {
			this._api = null;
			$(document).off(FULL_SCREEN_CHANGE_EVENTS);
		};

		/**
   * @implements {FullScreenAPI#enter}
   * @description Enter full screen mode.<br/>
   * Please note that this method is REQUIRED to be invoked through a user
   * interaction due to security reasons in browsers.<br/>
   * See the following link for details:<br/>
   * https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullScreen
   */


		FullScreen.prototype.enter = function enter() {
			if (this.isFullScreen()) {
				this._logger.info(FullScreen.LOGGER_MESSAGE.ENTER);
				return;
			}

			this._onEnterFullScreen();

			if (this._isFullScreenEnabled()) {
				this._isEventTriggeredInternally = true;
				if (document.body.requestFullscreen) {
					document.body.requestFullscreen();
				} else if (document.body.webkitRequestFullscreen) {
					document.body.webkitRequestFullscreen();
				} else if (document.body.mozRequestFullScreen) {
					document.body.mozRequestFullScreen();
				} else if (document.body.msRequestFullscreen && !(window.frameElement && window.frameElement.nodeName === 'IFRAME')) {
					// Don't use full screen mode when we are inside an iframe as
					// IE has a bug where sizes are mis-reported by a factor of
					// 100 in this case. If we are not in an iframe, then full screen is okay.
					//https://connect.microsoft.com/IE/feedback/details/838286
					document.body.msRequestFullscreen();
				}
			}
		};

		FullScreen.prototype.exit = function exit() {
			if (!this.isFullScreen()) {
				this._logger.info(FullScreen.LOGGER_MESSAGE.EXIT);
				return;
			}

			this._onExitFullScreen();

			if (this._isFullScreenEnabled()) {
				this._isEventTriggeredInternally = true;
				if (document.exitFullscreen) {
					document.exitFullscreen();
				} else if (document.webkitExitFullscreen) {
					document.webkitExitFullscreen();
				} else if (document.mozCancelFullScreen) {
					document.mozCancelFullScreen();
				} else if (document.msExitFullscreen) {
					document.msExitFullscreen();
				}
			}
		};

		FullScreen.prototype.isFullScreen = function isFullScreen() {
			return this._isFullScreen;
		};

		FullScreen.prototype._onChangeDashboardState = function _onChangeDashboardState(data) {
			if (!data.info.value) {
				this.exit();
				$(document).off(FULL_SCREEN_CHANGE_EVENTS);
			} else {
				$(document).on(FULL_SCREEN_CHANGE_EVENTS, this._onFullScreenChangeEvents.bind(this));
			}
		};

		FullScreen.prototype._onFullScreenChangeEvents = function _onFullScreenChangeEvents() {
			if (this._isEventTriggeredInternally) {
				this._isEventTriggeredInternally = false;
			} else {
				if (this.isFullScreen()) {
					this._onExitFullScreen();
					this._dashboardState.setFullScreen(false);
				} else {
					this._onEnterFullScreen();
				}
			}
		};
		/** Helpers */


		FullScreen.prototype._onEnterFullScreen = function _onEnterFullScreen() {
			// no api to hide the glass yet
			//needs to overwrite glass app/nav bar because layout.css has display:flex !important
			this._activePaneColumn = $('.appview.paneColumn').not('.hidden');
			this._activePaneColumn.find('.appbar').addClass('fullScreenNoGlass');
			this._activePaneColumn.find('.navbar').addClass('fullScreenNoGlass');
			this._activePaneColumn.find('.templateBox').addClass('fullScreen');
			$('body').addClass('fullScreen');
			document.body.style.cssText = 'height: 100% !important';
			$('body').append($('<div class="dashboardAriaAlert fullScreenAlert" role="alert"></div>').text(stringResources.get('ariaFullScreenMessage')));

			if (this._dashboardState.getUiState().authoring === true) {
				this._wasAuthoring = true;
				this._dashboardState.setAuthoring(false);
			}

			this._isFullScreen = true;
			this._dashboard.triggerDashboardEvent('enter:fullscreen');
		};

		FullScreen.prototype._onExitFullScreen = function _onExitFullScreen() {
			//needs to show the glass app & nav bar again.
			this._activePaneColumn.find('.appbar').removeClass('fullScreenNoGlass');
			this._activePaneColumn.find('.navbar').removeClass('fullScreenNoGlass');
			this._activePaneColumn.find('.templateBox').removeClass('fullScreen');
			$('body').removeClass('fullScreen');
			document.body.style.cssText = '';
			$('body').find('.fullScreenAlert').remove();

			if (this._wasAuthoring) {
				this._wasAuthoring = false;
				this._dashboardState.setAuthoring(true);
			}

			this._isFullScreen = false;
			this._dashboard.triggerDashboardEvent('exit:fullscreen');
		};

		FullScreen.prototype._isFullScreenEnabled = function _isFullScreenEnabled() {
			return document.fullscreenEnabled || document.webkitFullscreenEnabled || document.mozFullScreenEnabled || document.msFullscreenEnabled ? true : false;
		};

		/**
   * Callback for DashboardStateAPI#onUiStateChange
   * @see DashboardStateAPI#onUiStateChange for callback parameters
   */


		FullScreen.prototype._onUiStateChange = function _onUiStateChange(_ref2) {
			var fullScreen = _ref2.fullScreen;

			if (this._inProgress) {
				this._logger.info(FullScreen.LOGGER_MESSAGE.IN_PROGRESS);
				return;
			}

			this._inProgress = true;
			if (fullScreen === true) {
				this.enter();
			} else {
				this.exit();
			}
			this._inProgress = false;
		};

		/**
   * @implements ContentActionProviderAPI#getContentActionList
   */


		FullScreen.prototype.getContentActionList = function getContentActionList(idList) {
			var _this = this;

			var uiState = this._dashboardState.getUiState();

			if (idList.length > 0) {
				return [];
			}

			var label = void 0,
			    icon = void 0;
			if (uiState.fullScreen) {
				label = stringResources.get('fullScreenClose');
				icon = this._icons.getIcon('minimize').id;
			} else {
				label = stringResources.get('fullScreenEnter');
				icon = this._icons.getIcon('maximize').id;
			}

			return [{
				name: 'FullScreen',
				type: 'Button',
				label: label,
				icon: icon,
				order: 2,
				disabled: uiState.eventGroups,
				action: function action() {
					if (uiState.fullScreen) {
						_this._dashboardState.setFullScreen(false);
					} else {
						_this._dashboardState.setFullScreen(true);
					}
				}
			}];
		};

		return FullScreen;
	}();

	FullScreen.LOGGER_MESSAGE = {
		ENTER: 'enter fullScreen - already in full screen',
		EXIT: 'exit fullScreen - not in full screen',
		IN_PROGRESS: 'change fullScreen state - already in progress'
	};

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