1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
|
/* Copyright 2014 Mozilla Foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
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] - 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] - 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.
*/
async register(
name,
element,
callerCloseMethod = null,
canForceClose = false
) {
let container;
if (!name || !element || !(container = element.parentNode)) {
throw new Error("Not enough parameters.");
} else if (this._overlays[name]) {
throw new Error("The overlay is already registered.");
}
this._overlays[name] = {
element,
container,
callerCloseMethod,
canForceClose,
};
}
/**
* @param {string} name - The name of the overlay that is unregistered.
* @returns {Promise} A promise that is resolved when the overlay has been
* unregistered.
*/
async unregister(name) {
if (!this._overlays[name]) {
throw new Error("The overlay does not exist.");
} else if (this._active === name) {
throw new Error("The overlay cannot be removed while it is active.");
}
delete this._overlays[name];
}
/**
* @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.
*/
async open(name) {
if (!this._overlays[name]) {
throw new Error("The overlay does not exist.");
} else if (this._active) {
if (this._overlays[name].canForceClose) {
this._closeThroughCaller();
} 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");
window.addEventListener("keydown", this._keyDownBound);
}
/**
* @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.
*/
async close(name) {
if (!this._overlays[name]) {
throw new Error("The overlay does not exist.");
} else if (!this._active) {
throw new Error("The overlay is currently not active.");
} 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;
window.removeEventListener("keydown", this._keyDownBound);
}
/**
* @private
*/
_keyDown(evt) {
if (this._active && evt.keyCode === /* Esc = */ 27) {
this._closeThroughCaller();
evt.preventDefault();
}
}
/**
* @private
*/
_closeThroughCaller() {
if (this._overlays[this._active].callerCloseMethod) {
this._overlays[this._active].callerCloseMethod();
}
if (this._active) {
this.close(this._active);
}
}
}
export { OverlayManager };
|
