123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292 |
- 'use strict';
- /**
- * Licensed Materials - Property of IBM
- * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2014, 2021
- * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
- */
- define(['../../lib/@waca/core-client/js/core-client/ui/core/View', 'underscore', 'jquery', 'text!./templates/NavigationView.html', '../nls/StringResources'], function (BaseView, _, $, Template, stringResources) {
- var View = BaseView.extend({
- templateString: Template,
- items: null,
- currentPosition: -1,
- callbacks: null,
- rendered: false,
- pendingRender: Promise.resolve(),
- pendingClear: Promise.resolve(),
- events: {
- 'click .navigationBar .clickable': 'onNavigationClick'
- },
- init: function init(options) {
- View.inherited('init', this, arguments);
- this.callbacks = options.callbacks;
- this.segue = options.segue;
- this.items = [];
- },
- _animationFactor: function _animationFactor() {
- return 1;
- },
- render: function render() {
- var html = this.dotTemplate({});
- this.$el.html(html);
- this.rendered = true;
- var promise = void 0;
- if (this.items.length) {
- var item = this.items[this.currentPosition];
- promise = this.displayItem(item);
- } else {
- promise = Promise.resolve();
- }
- return promise;
- },
- remove: function remove() {
- View.inherited('remove', this, arguments);
- this.rendered = false;
- },
- getCount: function getCount() {
- return this.items.length;
- },
- updateTitle: function updateTitle() {
- var canGoBack = false;
- var title = null;
- if (this.currentPosition >= 0) {
- var item = this.items[this.currentPosition];
- if (item.getTitle) {
- title = item.getTitle();
- }
- }
- if (this.currentPosition > 0 && title === '') {
- title = stringResources.get('navigationBack');
- }
- canGoBack = this.currentPosition > 0;
- var navigationBarLink = this.$el.find('.navigationBar').toggle(title ? true : false).find('> div');
- navigationBarLink.find('.title').html(title);
- navigationBarLink.toggleClass('clickable', canGoBack);
- },
- cleanItem: function cleanItem(item) {
- var _this = this;
- var promise = void 0;
- if (item) {
- promise = new Promise(function (resolve, reject) {
- try {
- item.$el.animate({
- 'opacity': 0
- }, 300 * _this._animationFactor(), function () {
- item.remove();
- resolve();
- });
- } catch (error) {
- reject(error);
- }
- });
- } else {
- promise = Promise.resolve();
- }
- return promise;
- },
- renderItem: function renderItem(item, currentItem) {
- var _this2 = this;
- var container = $('<div></div>');
- container.appendTo(this.$el.find('.navigationPanel'));
- var promises = [];
- item.$el = container;
- var rendered = item.render();
- if (rendered && rendered.then) {
- // We don't know what promise item.render() returns.
- // For safety, wrap it in a `Promise.resolve()`
- // TODO: get rid of the wrapper
- promises.push(Promise.resolve().then(rendered));
- }
- item.$el.css('opacity', 0);
- var promise = new Promise(function (resolve, reject) {
- try {
- item.$el.animate({
- opacity: 1
- }, 300 * _this2._animationFactor(), resolve);
- } catch (error) {
- reject(error);
- }
- });
- promises.push(promise);
- if (currentItem) {
- currentItem.$el.animate({
- opacity: 0
- }, 300 * this._animationFactor());
- }
- return Promise.all(promises);
- },
- displayItem: function displayItem(item, currentItem) {
- this.updateTitle();
- return this.renderItem(item, currentItem);
- },
- pushTop: function pushTop(item) {
- var currentItem = this.items[this.currentPosition];
- this.items = [item];
- this.currentPosition = 0;
- var promise = void 0;
- if (this.rendered) {
- // Prevent any pointer events during the animation and render phase.
- this.$el.css('pointer-events', 'none');
- // Another call to render the item is executing, wait for it to complete, and then push the item.
- promise = this.pendingRender = this.pendingRender.then(this.pushTopItem.bind(this, item, currentItem));
- } else {
- promise = this.pendingRender;
- }
- return promise;
- },
- pushTopItem: function pushTopItem(item, currentItem) {
- var _this3 = this;
- return this.displayItem(item, currentItem).then(function () {
- if (currentItem) {
- currentItem.remove();
- }
- // Renable pointer events. The animation and render phase is complete.
- _this3.$el.css('pointer-events', 'auto');
- });
- },
- push: function push(item) {
- this.items.push(item);
- this.currentPosition++;
- var promise = void 0;
- if (this.rendered) {
- // Prevent any pointer events during the animation and render phase.
- this.$el.css('pointer-events', 'none');
- var currentItem = this.items[this.currentPosition - 1];
- // Another call to render the item is executing, wait for it to complete, and then push the item.
- promise = this.pendingRender = this.pendingRender.then(this.pushItem.bind(this, item, currentItem));
- } else {
- promise = this.pendingRender;
- }
- return promise;
- },
- pushItem: function pushItem(item, currentItem) {
- var _this4 = this;
- return this.displayItem(item, currentItem).then(function () {
- if (currentItem) {
- currentItem.hide();
- }
- // Renable pointer events. The animation and render phase is complete.
- _this4.$el.css('pointer-events', 'auto');
- });
- },
- pop: function pop() {
- var currentItem = this.items.pop();
- if (currentItem) {
- this.currentPosition--;
- }
- var promise = void 0;
- if (this.rendered) {
- // Prevent any pointer events during the animation and render phase.
- this.$el.css('pointer-events', 'none');
- var item = _.last(this.items);
- // Another call to render the item is executing, wait for it to complete, and then push the item.
- promise = this.pendingRender = this.pendingRender.then(this.popItem.bind(this, item, currentItem));
- } else {
- promise = this.pendingRender;
- }
- return promise;
- },
- popItem: function popItem(item, currentItem) {
- var _this5 = this;
- if (item) {
- item.$el.show();
- item.$el.css('opacity', 0);
- item.$el.animate({
- opacity: 1
- }, 300 * this._animationFactor(), function () {});
- }
- return this.cleanItem(currentItem).then(function () {
- _this5.updateTitle();
- if (_this5.callbacks && _this5.callbacks.onPop) {
- _this5.callbacks.onPop();
- }
- // Renable pointer events. The animation and render phase is complete.
- _this5.$el.css('pointer-events', 'auto');
- });
- },
- _clear: function _clear() {
- if (this.items.length > 0) {
- var currentItem = _.last(this.items);
- // Clear the array.
- this.items = [];
- this.currentPosition = -1;
- if (this.rendered) {
- this.pendingClear = this.pendingClear.then(this.cleanItem.bind(this, currentItem));
- } else {
- this.pendingClear = Promise.resolve();
- }
- }
- return this.pendingClear;
- },
- onNavigationClick: function onNavigationClick() {
- return this.pop();
- }
- });
- return View;
- });
- //# sourceMappingURL=NavigationView.js.map
|