Convert the overlay manager to ES6 syntax

This commit is contained in:
Tim van der Meij 2017-05-26 14:52:23 +02:00
parent 8d55e6a01d
commit e7a04fc82d
No known key found for this signature in database
GPG key ID: 8C3FD2925A5F2762
6 changed files with 111 additions and 92 deletions

View file

@ -13,132 +13,137 @@
* limitations under the License.
*/
var OverlayManager = {
overlays: {},
active: null,
class OverlayManager {
constructor() {
this._overlays = {};
this._active = null;
this._keyDownBound = this._keyDown.bind(this);
}
get active() {
return this._active;
}
/**
* @param {string} name The name of the overlay that is registered.
* @param {HTMLDivElement} element The overlay's DOM element.
* @param {function} callerCloseMethod (optional) The method that, if present,
* will call OverlayManager.close from the Object
* @param {string} name - The name of the overlay that is registered.
* @param {HTMLDivElement} element - The overlay's DOM element.
* @param {function} callerCloseMethod - (optional) The method that, if
* present, calls `OverlayManager.close` from the object
* registering the overlay. Access to this method is
* necessary in order to run cleanup code when e.g.
* the overlay is force closed. The default is null.
* @param {boolean} canForceClose (optional) Indicates if opening the overlay
* will close an active overlay. The default is false.
* the overlay is force closed. The default is `null`.
* @param {boolean} canForceClose - (optional) Indicates if opening the
* overlay closes an active overlay. The default is `false`.
* @returns {Promise} A promise that is resolved when the overlay has been
* registered.
*/
register(name, element, callerCloseMethod, canForceClose) {
register(name, element, callerCloseMethod = null, canForceClose = false) {
return new Promise((resolve) => {
var container;
let container;
if (!name || !element || !(container = element.parentNode)) {
throw new Error('Not enough parameters.');
} else if (this.overlays[name]) {
} else if (this._overlays[name]) {
throw new Error('The overlay is already registered.');
}
this.overlays[name] = {
this._overlays[name] = {
element,
container,
callerCloseMethod: (callerCloseMethod || null),
canForceClose: (canForceClose || false),
callerCloseMethod,
canForceClose,
};
resolve();
});
},
}
/**
* @param {string} name The name of the overlay that is unregistered.
* @param {string} name - The name of the overlay that is unregistered.
* @returns {Promise} A promise that is resolved when the overlay has been
* unregistered.
*/
unregister(name) {
return new Promise((resolve) => {
if (!this.overlays[name]) {
if (!this._overlays[name]) {
throw new Error('The overlay does not exist.');
} else if (this.active === name) {
} else if (this._active === name) {
throw new Error('The overlay cannot be removed while it is active.');
}
delete this.overlays[name];
delete this._overlays[name];
resolve();
});
},
}
/**
* @param {string} name The name of the overlay that should be opened.
* @param {string} name - The name of the overlay that should be opened.
* @returns {Promise} A promise that is resolved when the overlay has been
* opened.
*/
open(name) {
return new Promise((resolve) => {
if (!this.overlays[name]) {
if (!this._overlays[name]) {
throw new Error('The overlay does not exist.');
} else if (this.active) {
if (this.overlays[name].canForceClose) {
} else if (this._active) {
if (this._overlays[name].canForceClose) {
this._closeThroughCaller();
} else if (this.active === name) {
} else if (this._active === name) {
throw new Error('The overlay is already active.');
} else {
throw new Error('Another overlay is currently active.');
}
}
this.active = name;
this.overlays[this.active].element.classList.remove('hidden');
this.overlays[this.active].container.classList.remove('hidden');
this._active = name;
this._overlays[this._active].element.classList.remove('hidden');
this._overlays[this._active].container.classList.remove('hidden');
window.addEventListener('keydown', this._keyDown);
window.addEventListener('keydown', this._keyDownBound);
resolve();
});
},
}
/**
* @param {string} name The name of the overlay that should be closed.
* @param {string} name - The name of the overlay that should be closed.
* @returns {Promise} A promise that is resolved when the overlay has been
* closed.
*/
close(name) {
return new Promise((resolve) => {
if (!this.overlays[name]) {
if (!this._overlays[name]) {
throw new Error('The overlay does not exist.');
} else if (!this.active) {
} else if (!this._active) {
throw new Error('The overlay is currently not active.');
} else if (this.active !== name) {
} else if (this._active !== name) {
throw new Error('Another overlay is currently active.');
}
this.overlays[this.active].container.classList.add('hidden');
this.overlays[this.active].element.classList.add('hidden');
this.active = null;
this._overlays[this._active].container.classList.add('hidden');
this._overlays[this._active].element.classList.add('hidden');
this._active = null;
window.removeEventListener('keydown', this._keyDown);
window.removeEventListener('keydown', this._keyDownBound);
resolve();
});
},
}
/**
* @private
*/
_keyDown(evt) {
var self = OverlayManager;
if (self.active && evt.keyCode === 27) { // Esc key.
self._closeThroughCaller();
if (this._active && evt.keyCode === 27) { // Esc key.
this._closeThroughCaller();
evt.preventDefault();
}
},
}
/**
* @private
*/
_closeThroughCaller() {
if (this.overlays[this.active].callerCloseMethod) {
this.overlays[this.active].callerCloseMethod();
if (this._overlays[this._active].callerCloseMethod) {
this._overlays[this._active].callerCloseMethod();
}
if (this.active) {
this.close(this.active);
if (this._active) {
this.close(this._active);
}
}
};
}
export {
OverlayManager,