@spscommerce/positioning 5.18.3-ie2 → 5.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.cjs.js +1 -1857
- package/lib/index.es.js +973 -1762
- package/package.json +7 -7
- package/vite.config.js +1 -1
- package/dist/out-tsc/index.d.ts +0 -4
- package/dist/out-tsc/index.js +0 -5
- package/dist/out-tsc/index.js.map +0 -1
- package/dist/out-tsc/position-anchor.enum.d.ts +0 -7
- package/dist/out-tsc/position-anchor.enum.js +0 -9
- package/dist/out-tsc/position-anchor.enum.js.map +0 -1
- package/dist/out-tsc/position.enum.d.ts +0 -18
- package/dist/out-tsc/position.enum.js +0 -20
- package/dist/out-tsc/position.enum.js.map +0 -1
- package/dist/out-tsc/positioning-options.interface.d.ts +0 -37
- package/dist/out-tsc/positioning-options.interface.js +0 -8
- package/dist/out-tsc/positioning-options.interface.js.map +0 -1
- package/dist/out-tsc/positioning.service.d.ts +0 -55
- package/dist/out-tsc/positioning.service.js +0 -466
- package/dist/out-tsc/positioning.service.js.map +0 -1
package/lib/index.es.js
CHANGED
|
@@ -1,1852 +1,1063 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
import { onNextTick, lockedToAnimationFrames } from "@spscommerce/utils";
|
|
7
21
|
var Position;
|
|
8
|
-
(function
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
22
|
+
(function(Position2) {
|
|
23
|
+
Position2["TOP_LEFT"] = "top left";
|
|
24
|
+
Position2["TOP_MIDDLE"] = "top middle";
|
|
25
|
+
Position2["TOP_RIGHT"] = "top right";
|
|
26
|
+
Position2["RIGHT_TOP"] = "right top";
|
|
27
|
+
Position2["RIGHT_MIDDLE"] = "right middle";
|
|
28
|
+
Position2["RIGHT_BOTTOM"] = "right bottom";
|
|
29
|
+
Position2["BOTTOM_RIGHT"] = "bottom right";
|
|
30
|
+
Position2["BOTTOM_MIDDLE"] = "bottom middle";
|
|
31
|
+
Position2["BOTTOM_LEFT"] = "bottom left";
|
|
32
|
+
Position2["LEFT_BOTTOM"] = "left bottom";
|
|
33
|
+
Position2["LEFT_MIDDLE"] = "left middle";
|
|
34
|
+
Position2["LEFT_TOP"] = "left top";
|
|
21
35
|
})(Position || (Position = {}));
|
|
22
|
-
|
|
23
|
-
/** Indicates which point on a positioned element it should be positioned by. */
|
|
24
36
|
var PositionAnchor;
|
|
25
|
-
(function
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
37
|
+
(function(PositionAnchor2) {
|
|
38
|
+
PositionAnchor2["TOP_LEFT"] = "top left";
|
|
39
|
+
PositionAnchor2["TOP_RIGHT"] = "top right";
|
|
40
|
+
PositionAnchor2["BOTTOM_LEFT"] = "bottom left";
|
|
41
|
+
PositionAnchor2["BOTTOM_RIGHT"] = "bottom right";
|
|
30
42
|
})(PositionAnchor || (PositionAnchor = {}));
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
position: Position.TOP_LEFT,
|
|
43
|
+
const DEFAULT_POSITIONING_OPTIONS = {
|
|
44
|
+
anchor: PositionAnchor.TOP_LEFT,
|
|
45
|
+
offsets: [],
|
|
46
|
+
position: Position.TOP_LEFT
|
|
36
47
|
};
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Copyright 2016 Google Inc. All Rights Reserved.
|
|
40
|
-
*
|
|
41
|
-
* Licensed under the W3C SOFTWARE AND DOCUMENT NOTICE AND LICENSE.
|
|
42
|
-
*
|
|
43
|
-
* https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
|
|
44
|
-
*
|
|
45
|
-
*/
|
|
46
48
|
(function() {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
if (typeof window !== 'object') {
|
|
50
|
-
return;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
// Exit early if all IntersectionObserver and IntersectionObserverEntry
|
|
54
|
-
// features are natively supported.
|
|
55
|
-
if ('IntersectionObserver' in window &&
|
|
56
|
-
'IntersectionObserverEntry' in window &&
|
|
57
|
-
'intersectionRatio' in window.IntersectionObserverEntry.prototype) {
|
|
58
|
-
|
|
59
|
-
// Minimal polyfill for Edge 15's lack of `isIntersecting`
|
|
60
|
-
// See: https://github.com/w3c/IntersectionObserver/issues/211
|
|
61
|
-
if (!('isIntersecting' in window.IntersectionObserverEntry.prototype)) {
|
|
62
|
-
Object.defineProperty(window.IntersectionObserverEntry.prototype,
|
|
63
|
-
'isIntersecting', {
|
|
64
|
-
get: function () {
|
|
65
|
-
return this.intersectionRatio > 0;
|
|
66
|
-
}
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
return;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
/**
|
|
73
|
-
* Returns the embedding frame element, if any.
|
|
74
|
-
* @param {!Document} doc
|
|
75
|
-
* @return {!Element}
|
|
76
|
-
*/
|
|
77
|
-
function getFrameElement(doc) {
|
|
78
|
-
try {
|
|
79
|
-
return doc.defaultView && doc.defaultView.frameElement || null;
|
|
80
|
-
} catch (e) {
|
|
81
|
-
// Ignore the error.
|
|
82
|
-
return null;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
/**
|
|
87
|
-
* A local reference to the root document.
|
|
88
|
-
*/
|
|
89
|
-
var document = (function(startDoc) {
|
|
90
|
-
var doc = startDoc;
|
|
91
|
-
var frame = getFrameElement(doc);
|
|
92
|
-
while (frame) {
|
|
93
|
-
doc = frame.ownerDocument;
|
|
94
|
-
frame = getFrameElement(doc);
|
|
95
|
-
}
|
|
96
|
-
return doc;
|
|
97
|
-
})(window.document);
|
|
98
|
-
|
|
99
|
-
/**
|
|
100
|
-
* An IntersectionObserver registry. This registry exists to hold a strong
|
|
101
|
-
* reference to IntersectionObserver instances currently observing a target
|
|
102
|
-
* element. Without this registry, instances without another reference may be
|
|
103
|
-
* garbage collected.
|
|
104
|
-
*/
|
|
105
|
-
var registry = [];
|
|
106
|
-
|
|
107
|
-
/**
|
|
108
|
-
* The signal updater for cross-origin intersection. When not null, it means
|
|
109
|
-
* that the polyfill is configured to work in a cross-origin mode.
|
|
110
|
-
* @type {function(DOMRect|ClientRect, DOMRect|ClientRect)}
|
|
111
|
-
*/
|
|
112
|
-
var crossOriginUpdater = null;
|
|
113
|
-
|
|
114
|
-
/**
|
|
115
|
-
* The current cross-origin intersection. Only used in the cross-origin mode.
|
|
116
|
-
* @type {DOMRect|ClientRect}
|
|
117
|
-
*/
|
|
118
|
-
var crossOriginRect = null;
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
/**
|
|
122
|
-
* Creates the global IntersectionObserverEntry constructor.
|
|
123
|
-
* https://w3c.github.io/IntersectionObserver/#intersection-observer-entry
|
|
124
|
-
* @param {Object} entry A dictionary of instance properties.
|
|
125
|
-
* @constructor
|
|
126
|
-
*/
|
|
127
|
-
function IntersectionObserverEntry(entry) {
|
|
128
|
-
this.time = entry.time;
|
|
129
|
-
this.target = entry.target;
|
|
130
|
-
this.rootBounds = ensureDOMRect(entry.rootBounds);
|
|
131
|
-
this.boundingClientRect = ensureDOMRect(entry.boundingClientRect);
|
|
132
|
-
this.intersectionRect = ensureDOMRect(entry.intersectionRect || getEmptyRect());
|
|
133
|
-
this.isIntersecting = !!entry.intersectionRect;
|
|
134
|
-
|
|
135
|
-
// Calculates the intersection ratio.
|
|
136
|
-
var targetRect = this.boundingClientRect;
|
|
137
|
-
var targetArea = targetRect.width * targetRect.height;
|
|
138
|
-
var intersectionRect = this.intersectionRect;
|
|
139
|
-
var intersectionArea = intersectionRect.width * intersectionRect.height;
|
|
140
|
-
|
|
141
|
-
// Sets intersection ratio.
|
|
142
|
-
if (targetArea) {
|
|
143
|
-
// Round the intersection ratio to avoid floating point math issues:
|
|
144
|
-
// https://github.com/w3c/IntersectionObserver/issues/324
|
|
145
|
-
this.intersectionRatio = Number((intersectionArea / targetArea).toFixed(4));
|
|
146
|
-
} else {
|
|
147
|
-
// If area is zero and is intersecting, sets to 1, otherwise to 0
|
|
148
|
-
this.intersectionRatio = this.isIntersecting ? 1 : 0;
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
/**
|
|
154
|
-
* Creates the global IntersectionObserver constructor.
|
|
155
|
-
* https://w3c.github.io/IntersectionObserver/#intersection-observer-interface
|
|
156
|
-
* @param {Function} callback The function to be invoked after intersection
|
|
157
|
-
* changes have queued. The function is not invoked if the queue has
|
|
158
|
-
* been emptied by calling the `takeRecords` method.
|
|
159
|
-
* @param {Object=} opt_options Optional configuration options.
|
|
160
|
-
* @constructor
|
|
161
|
-
*/
|
|
162
|
-
function IntersectionObserver(callback, opt_options) {
|
|
163
|
-
|
|
164
|
-
var options = opt_options || {};
|
|
165
|
-
|
|
166
|
-
if (typeof callback != 'function') {
|
|
167
|
-
throw new Error('callback must be a function');
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
if (
|
|
171
|
-
options.root &&
|
|
172
|
-
options.root.nodeType != 1 &&
|
|
173
|
-
options.root.nodeType != 9
|
|
174
|
-
) {
|
|
175
|
-
throw new Error('root must be a Document or Element');
|
|
49
|
+
if (typeof window !== "object") {
|
|
50
|
+
return;
|
|
176
51
|
}
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
this._callback = callback;
|
|
184
|
-
this._observationTargets = [];
|
|
185
|
-
this._queuedEntries = [];
|
|
186
|
-
this._rootMarginValues = this._parseRootMargin(options.rootMargin);
|
|
187
|
-
|
|
188
|
-
// Public properties.
|
|
189
|
-
this.thresholds = this._initThresholds(options.threshold);
|
|
190
|
-
this.root = options.root || null;
|
|
191
|
-
this.rootMargin = this._rootMarginValues.map(function(margin) {
|
|
192
|
-
return margin.value + margin.unit;
|
|
193
|
-
}).join(' ');
|
|
194
|
-
|
|
195
|
-
/** @private @const {!Array<!Document>} */
|
|
196
|
-
this._monitoringDocuments = [];
|
|
197
|
-
/** @private @const {!Array<function()>} */
|
|
198
|
-
this._monitoringUnsubscribes = [];
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
/**
|
|
203
|
-
* The minimum interval within which the document will be checked for
|
|
204
|
-
* intersection changes.
|
|
205
|
-
*/
|
|
206
|
-
IntersectionObserver.prototype.THROTTLE_TIMEOUT = 100;
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
/**
|
|
210
|
-
* The frequency in which the polyfill polls for intersection changes.
|
|
211
|
-
* this can be updated on a per instance basis and must be set prior to
|
|
212
|
-
* calling `observe` on the first target.
|
|
213
|
-
*/
|
|
214
|
-
IntersectionObserver.prototype.POLL_INTERVAL = null;
|
|
215
|
-
|
|
216
|
-
/**
|
|
217
|
-
* Use a mutation observer on the root element
|
|
218
|
-
* to detect intersection changes.
|
|
219
|
-
*/
|
|
220
|
-
IntersectionObserver.prototype.USE_MUTATION_OBSERVER = true;
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
/**
|
|
224
|
-
* Sets up the polyfill in the cross-origin mode. The result is the
|
|
225
|
-
* updater function that accepts two arguments: `boundingClientRect` and
|
|
226
|
-
* `intersectionRect` - just as these fields would be available to the
|
|
227
|
-
* parent via `IntersectionObserverEntry`. This function should be called
|
|
228
|
-
* each time the iframe receives intersection information from the parent
|
|
229
|
-
* window, e.g. via messaging.
|
|
230
|
-
* @return {function(DOMRect|ClientRect, DOMRect|ClientRect)}
|
|
231
|
-
*/
|
|
232
|
-
IntersectionObserver._setupCrossOriginUpdater = function() {
|
|
233
|
-
if (!crossOriginUpdater) {
|
|
234
|
-
/**
|
|
235
|
-
* @param {DOMRect|ClientRect} boundingClientRect
|
|
236
|
-
* @param {DOMRect|ClientRect} intersectionRect
|
|
237
|
-
*/
|
|
238
|
-
crossOriginUpdater = function(boundingClientRect, intersectionRect) {
|
|
239
|
-
if (!boundingClientRect || !intersectionRect) {
|
|
240
|
-
crossOriginRect = getEmptyRect();
|
|
241
|
-
} else {
|
|
242
|
-
crossOriginRect = convertFromParentRect(boundingClientRect, intersectionRect);
|
|
243
|
-
}
|
|
244
|
-
registry.forEach(function(observer) {
|
|
245
|
-
observer._checkForIntersections();
|
|
52
|
+
if ("IntersectionObserver" in window && "IntersectionObserverEntry" in window && "intersectionRatio" in window.IntersectionObserverEntry.prototype) {
|
|
53
|
+
if (!("isIntersecting" in window.IntersectionObserverEntry.prototype)) {
|
|
54
|
+
Object.defineProperty(window.IntersectionObserverEntry.prototype, "isIntersecting", {
|
|
55
|
+
get: function() {
|
|
56
|
+
return this.intersectionRatio > 0;
|
|
57
|
+
}
|
|
246
58
|
});
|
|
247
|
-
}
|
|
248
|
-
}
|
|
249
|
-
return crossOriginUpdater;
|
|
250
|
-
};
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
/**
|
|
254
|
-
* Resets the cross-origin mode.
|
|
255
|
-
*/
|
|
256
|
-
IntersectionObserver._resetCrossOriginUpdater = function() {
|
|
257
|
-
crossOriginUpdater = null;
|
|
258
|
-
crossOriginRect = null;
|
|
259
|
-
};
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
/**
|
|
263
|
-
* Starts observing a target element for intersection changes based on
|
|
264
|
-
* the thresholds values.
|
|
265
|
-
* @param {Element} target The DOM element to observe.
|
|
266
|
-
*/
|
|
267
|
-
IntersectionObserver.prototype.observe = function(target) {
|
|
268
|
-
var isTargetAlreadyObserved = this._observationTargets.some(function(item) {
|
|
269
|
-
return item.element == target;
|
|
270
|
-
});
|
|
271
|
-
|
|
272
|
-
if (isTargetAlreadyObserved) {
|
|
59
|
+
}
|
|
273
60
|
return;
|
|
274
61
|
}
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
this._observationTargets.push({element: target, entry: null});
|
|
282
|
-
this._monitorIntersections(target.ownerDocument);
|
|
283
|
-
this._checkForIntersections();
|
|
284
|
-
};
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
/**
|
|
288
|
-
* Stops observing a target element for intersection changes.
|
|
289
|
-
* @param {Element} target The DOM element to observe.
|
|
290
|
-
*/
|
|
291
|
-
IntersectionObserver.prototype.unobserve = function(target) {
|
|
292
|
-
this._observationTargets =
|
|
293
|
-
this._observationTargets.filter(function(item) {
|
|
294
|
-
return item.element != target;
|
|
295
|
-
});
|
|
296
|
-
this._unmonitorIntersections(target.ownerDocument);
|
|
297
|
-
if (this._observationTargets.length == 0) {
|
|
298
|
-
this._unregisterInstance();
|
|
62
|
+
function getFrameElement(doc) {
|
|
63
|
+
try {
|
|
64
|
+
return doc.defaultView && doc.defaultView.frameElement || null;
|
|
65
|
+
} catch (e) {
|
|
66
|
+
return null;
|
|
67
|
+
}
|
|
299
68
|
}
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
IntersectionObserver.prototype.disconnect = function() {
|
|
307
|
-
this._observationTargets = [];
|
|
308
|
-
this._unmonitorAllIntersections();
|
|
309
|
-
this._unregisterInstance();
|
|
310
|
-
};
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
/**
|
|
314
|
-
* Returns any queue entries that have not yet been reported to the
|
|
315
|
-
* callback and clears the queue. This can be used in conjunction with the
|
|
316
|
-
* callback to obtain the absolute most up-to-date intersection information.
|
|
317
|
-
* @return {Array} The currently queued entries.
|
|
318
|
-
*/
|
|
319
|
-
IntersectionObserver.prototype.takeRecords = function() {
|
|
320
|
-
var records = this._queuedEntries.slice();
|
|
321
|
-
this._queuedEntries = [];
|
|
322
|
-
return records;
|
|
323
|
-
};
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
/**
|
|
327
|
-
* Accepts the threshold value from the user configuration object and
|
|
328
|
-
* returns a sorted array of unique threshold values. If a value is not
|
|
329
|
-
* between 0 and 1 and error is thrown.
|
|
330
|
-
* @private
|
|
331
|
-
* @param {Array|number=} opt_threshold An optional threshold value or
|
|
332
|
-
* a list of threshold values, defaulting to [0].
|
|
333
|
-
* @return {Array} A sorted list of unique and valid threshold values.
|
|
334
|
-
*/
|
|
335
|
-
IntersectionObserver.prototype._initThresholds = function(opt_threshold) {
|
|
336
|
-
var threshold = opt_threshold || [0];
|
|
337
|
-
if (!Array.isArray(threshold)) threshold = [threshold];
|
|
338
|
-
|
|
339
|
-
return threshold.sort().filter(function(t, i, a) {
|
|
340
|
-
if (typeof t != 'number' || isNaN(t) || t < 0 || t > 1) {
|
|
341
|
-
throw new Error('threshold must be a number between 0 and 1 inclusively');
|
|
69
|
+
var document2 = function(startDoc) {
|
|
70
|
+
var doc = startDoc;
|
|
71
|
+
var frame = getFrameElement(doc);
|
|
72
|
+
while (frame) {
|
|
73
|
+
doc = frame.ownerDocument;
|
|
74
|
+
frame = getFrameElement(doc);
|
|
342
75
|
}
|
|
343
|
-
return
|
|
344
|
-
});
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
if (!parts) {
|
|
364
|
-
throw new Error('rootMargin must be specified in pixels or percent');
|
|
76
|
+
return doc;
|
|
77
|
+
}(window.document);
|
|
78
|
+
var registry = [];
|
|
79
|
+
var crossOriginUpdater = null;
|
|
80
|
+
var crossOriginRect = null;
|
|
81
|
+
function IntersectionObserverEntry2(entry) {
|
|
82
|
+
this.time = entry.time;
|
|
83
|
+
this.target = entry.target;
|
|
84
|
+
this.rootBounds = ensureDOMRect(entry.rootBounds);
|
|
85
|
+
this.boundingClientRect = ensureDOMRect(entry.boundingClientRect);
|
|
86
|
+
this.intersectionRect = ensureDOMRect(entry.intersectionRect || getEmptyRect());
|
|
87
|
+
this.isIntersecting = !!entry.intersectionRect;
|
|
88
|
+
var targetRect = this.boundingClientRect;
|
|
89
|
+
var targetArea = targetRect.width * targetRect.height;
|
|
90
|
+
var intersectionRect = this.intersectionRect;
|
|
91
|
+
var intersectionArea = intersectionRect.width * intersectionRect.height;
|
|
92
|
+
if (targetArea) {
|
|
93
|
+
this.intersectionRatio = Number((intersectionArea / targetArea).toFixed(4));
|
|
94
|
+
} else {
|
|
95
|
+
this.intersectionRatio = this.isIntersecting ? 1 : 0;
|
|
365
96
|
}
|
|
366
|
-
return {value: parseFloat(parts[1]), unit: parts[2]};
|
|
367
|
-
});
|
|
368
|
-
|
|
369
|
-
// Handles shorthand.
|
|
370
|
-
margins[1] = margins[1] || margins[0];
|
|
371
|
-
margins[2] = margins[2] || margins[0];
|
|
372
|
-
margins[3] = margins[3] || margins[1];
|
|
373
|
-
|
|
374
|
-
return margins;
|
|
375
|
-
};
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
/**
|
|
379
|
-
* Starts polling for intersection changes if the polling is not already
|
|
380
|
-
* happening, and if the page's visibility state is visible.
|
|
381
|
-
* @param {!Document} doc
|
|
382
|
-
* @private
|
|
383
|
-
*/
|
|
384
|
-
IntersectionObserver.prototype._monitorIntersections = function(doc) {
|
|
385
|
-
var win = doc.defaultView;
|
|
386
|
-
if (!win) {
|
|
387
|
-
// Already destroyed.
|
|
388
|
-
return;
|
|
389
97
|
}
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
// Private state for monitoring.
|
|
396
|
-
var callback = this._checkForIntersections;
|
|
397
|
-
var monitoringInterval = null;
|
|
398
|
-
var domObserver = null;
|
|
399
|
-
|
|
400
|
-
// If a poll interval is set, use polling instead of listening to
|
|
401
|
-
// resize and scroll events or DOM mutations.
|
|
402
|
-
if (this.POLL_INTERVAL) {
|
|
403
|
-
monitoringInterval = win.setInterval(callback, this.POLL_INTERVAL);
|
|
404
|
-
} else {
|
|
405
|
-
addEvent(win, 'resize', callback, true);
|
|
406
|
-
addEvent(doc, 'scroll', callback, true);
|
|
407
|
-
if (this.USE_MUTATION_OBSERVER && 'MutationObserver' in win) {
|
|
408
|
-
domObserver = new win.MutationObserver(callback);
|
|
409
|
-
domObserver.observe(doc, {
|
|
410
|
-
attributes: true,
|
|
411
|
-
childList: true,
|
|
412
|
-
characterData: true,
|
|
413
|
-
subtree: true
|
|
414
|
-
});
|
|
98
|
+
function IntersectionObserver2(callback, opt_options) {
|
|
99
|
+
var options = opt_options || {};
|
|
100
|
+
if (typeof callback != "function") {
|
|
101
|
+
throw new Error("callback must be a function");
|
|
415
102
|
}
|
|
103
|
+
if (options.root && options.root.nodeType != 1 && options.root.nodeType != 9) {
|
|
104
|
+
throw new Error("root must be a Document or Element");
|
|
105
|
+
}
|
|
106
|
+
this._checkForIntersections = throttle(this._checkForIntersections.bind(this), this.THROTTLE_TIMEOUT);
|
|
107
|
+
this._callback = callback;
|
|
108
|
+
this._observationTargets = [];
|
|
109
|
+
this._queuedEntries = [];
|
|
110
|
+
this._rootMarginValues = this._parseRootMargin(options.rootMargin);
|
|
111
|
+
this.thresholds = this._initThresholds(options.threshold);
|
|
112
|
+
this.root = options.root || null;
|
|
113
|
+
this.rootMargin = this._rootMarginValues.map(function(margin) {
|
|
114
|
+
return margin.value + margin.unit;
|
|
115
|
+
}).join(" ");
|
|
116
|
+
this._monitoringDocuments = [];
|
|
117
|
+
this._monitoringUnsubscribes = [];
|
|
416
118
|
}
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
119
|
+
IntersectionObserver2.prototype.THROTTLE_TIMEOUT = 100;
|
|
120
|
+
IntersectionObserver2.prototype.POLL_INTERVAL = null;
|
|
121
|
+
IntersectionObserver2.prototype.USE_MUTATION_OBSERVER = true;
|
|
122
|
+
IntersectionObserver2._setupCrossOriginUpdater = function() {
|
|
123
|
+
if (!crossOriginUpdater) {
|
|
124
|
+
crossOriginUpdater = function(boundingClientRect, intersectionRect) {
|
|
125
|
+
if (!boundingClientRect || !intersectionRect) {
|
|
126
|
+
crossOriginRect = getEmptyRect();
|
|
127
|
+
} else {
|
|
128
|
+
crossOriginRect = convertFromParentRect(boundingClientRect, intersectionRect);
|
|
129
|
+
}
|
|
130
|
+
registry.forEach(function(observer) {
|
|
131
|
+
observer._checkForIntersections();
|
|
132
|
+
});
|
|
133
|
+
};
|
|
134
|
+
}
|
|
135
|
+
return crossOriginUpdater;
|
|
136
|
+
};
|
|
137
|
+
IntersectionObserver2._resetCrossOriginUpdater = function() {
|
|
138
|
+
crossOriginUpdater = null;
|
|
139
|
+
crossOriginRect = null;
|
|
140
|
+
};
|
|
141
|
+
IntersectionObserver2.prototype.observe = function(target) {
|
|
142
|
+
var isTargetAlreadyObserved = this._observationTargets.some(function(item) {
|
|
143
|
+
return item.element == target;
|
|
144
|
+
});
|
|
145
|
+
if (isTargetAlreadyObserved) {
|
|
146
|
+
return;
|
|
147
|
+
}
|
|
148
|
+
if (!(target && target.nodeType == 1)) {
|
|
149
|
+
throw new Error("target must be an Element");
|
|
150
|
+
}
|
|
151
|
+
this._registerInstance();
|
|
152
|
+
this._observationTargets.push({ element: target, entry: null });
|
|
153
|
+
this._monitorIntersections(target.ownerDocument);
|
|
154
|
+
this._checkForIntersections();
|
|
155
|
+
};
|
|
156
|
+
IntersectionObserver2.prototype.unobserve = function(target) {
|
|
157
|
+
this._observationTargets = this._observationTargets.filter(function(item) {
|
|
158
|
+
return item.element != target;
|
|
159
|
+
});
|
|
160
|
+
this._unmonitorIntersections(target.ownerDocument);
|
|
161
|
+
if (this._observationTargets.length == 0) {
|
|
162
|
+
this._unregisterInstance();
|
|
163
|
+
}
|
|
164
|
+
};
|
|
165
|
+
IntersectionObserver2.prototype.disconnect = function() {
|
|
166
|
+
this._observationTargets = [];
|
|
167
|
+
this._unmonitorAllIntersections();
|
|
168
|
+
this._unregisterInstance();
|
|
169
|
+
};
|
|
170
|
+
IntersectionObserver2.prototype.takeRecords = function() {
|
|
171
|
+
var records = this._queuedEntries.slice();
|
|
172
|
+
this._queuedEntries = [];
|
|
173
|
+
return records;
|
|
174
|
+
};
|
|
175
|
+
IntersectionObserver2.prototype._initThresholds = function(opt_threshold) {
|
|
176
|
+
var threshold = opt_threshold || [0];
|
|
177
|
+
if (!Array.isArray(threshold))
|
|
178
|
+
threshold = [threshold];
|
|
179
|
+
return threshold.sort().filter(function(t, i, a) {
|
|
180
|
+
if (typeof t != "number" || isNaN(t) || t < 0 || t > 1) {
|
|
181
|
+
throw new Error("threshold must be a number between 0 and 1 inclusively");
|
|
182
|
+
}
|
|
183
|
+
return t !== a[i - 1];
|
|
184
|
+
});
|
|
185
|
+
};
|
|
186
|
+
IntersectionObserver2.prototype._parseRootMargin = function(opt_rootMargin) {
|
|
187
|
+
var marginString = opt_rootMargin || "0px";
|
|
188
|
+
var margins = marginString.split(/\s+/).map(function(margin) {
|
|
189
|
+
var parts = /^(-?\d*\.?\d+)(px|%)$/.exec(margin);
|
|
190
|
+
if (!parts) {
|
|
191
|
+
throw new Error("rootMargin must be specified in pixels or percent");
|
|
192
|
+
}
|
|
193
|
+
return { value: parseFloat(parts[1]), unit: parts[2] };
|
|
194
|
+
});
|
|
195
|
+
margins[1] = margins[1] || margins[0];
|
|
196
|
+
margins[2] = margins[2] || margins[0];
|
|
197
|
+
margins[3] = margins[3] || margins[1];
|
|
198
|
+
return margins;
|
|
199
|
+
};
|
|
200
|
+
IntersectionObserver2.prototype._monitorIntersections = function(doc) {
|
|
422
201
|
var win = doc.defaultView;
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
202
|
+
if (!win) {
|
|
203
|
+
return;
|
|
204
|
+
}
|
|
205
|
+
if (this._monitoringDocuments.indexOf(doc) != -1) {
|
|
206
|
+
return;
|
|
207
|
+
}
|
|
208
|
+
var callback = this._checkForIntersections;
|
|
209
|
+
var monitoringInterval = null;
|
|
210
|
+
var domObserver = null;
|
|
211
|
+
if (this.POLL_INTERVAL) {
|
|
212
|
+
monitoringInterval = win.setInterval(callback, this.POLL_INTERVAL);
|
|
213
|
+
} else {
|
|
214
|
+
addEvent(win, "resize", callback, true);
|
|
215
|
+
addEvent(doc, "scroll", callback, true);
|
|
216
|
+
if (this.USE_MUTATION_OBSERVER && "MutationObserver" in win) {
|
|
217
|
+
domObserver = new win.MutationObserver(callback);
|
|
218
|
+
domObserver.observe(doc, {
|
|
219
|
+
attributes: true,
|
|
220
|
+
childList: true,
|
|
221
|
+
characterData: true,
|
|
222
|
+
subtree: true
|
|
223
|
+
});
|
|
427
224
|
}
|
|
428
|
-
removeEvent(win, 'resize', callback, true);
|
|
429
225
|
}
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
226
|
+
this._monitoringDocuments.push(doc);
|
|
227
|
+
this._monitoringUnsubscribes.push(function() {
|
|
228
|
+
var win2 = doc.defaultView;
|
|
229
|
+
if (win2) {
|
|
230
|
+
if (monitoringInterval) {
|
|
231
|
+
win2.clearInterval(monitoringInterval);
|
|
232
|
+
}
|
|
233
|
+
removeEvent(win2, "resize", callback, true);
|
|
234
|
+
}
|
|
235
|
+
removeEvent(doc, "scroll", callback, true);
|
|
236
|
+
if (domObserver) {
|
|
237
|
+
domObserver.disconnect();
|
|
238
|
+
}
|
|
239
|
+
});
|
|
240
|
+
var rootDoc = this.root && (this.root.ownerDocument || this.root) || document2;
|
|
241
|
+
if (doc != rootDoc) {
|
|
242
|
+
var frame = getFrameElement(doc);
|
|
243
|
+
if (frame) {
|
|
244
|
+
this._monitorIntersections(frame.ownerDocument);
|
|
245
|
+
}
|
|
434
246
|
}
|
|
435
|
-
}
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
if (doc != rootDoc) {
|
|
441
|
-
var frame = getFrameElement(doc);
|
|
442
|
-
if (frame) {
|
|
443
|
-
this._monitorIntersections(frame.ownerDocument);
|
|
247
|
+
};
|
|
248
|
+
IntersectionObserver2.prototype._unmonitorIntersections = function(doc) {
|
|
249
|
+
var index = this._monitoringDocuments.indexOf(doc);
|
|
250
|
+
if (index == -1) {
|
|
251
|
+
return;
|
|
444
252
|
}
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
IntersectionObserver.prototype._unmonitorIntersections = function(doc) {
|
|
455
|
-
var index = this._monitoringDocuments.indexOf(doc);
|
|
456
|
-
if (index == -1) {
|
|
457
|
-
return;
|
|
458
|
-
}
|
|
459
|
-
|
|
460
|
-
var rootDoc =
|
|
461
|
-
(this.root && (this.root.ownerDocument || this.root)) || document;
|
|
462
|
-
|
|
463
|
-
// Check if any dependent targets are still remaining.
|
|
464
|
-
var hasDependentTargets =
|
|
465
|
-
this._observationTargets.some(function(item) {
|
|
466
|
-
var itemDoc = item.element.ownerDocument;
|
|
467
|
-
// Target is in this context.
|
|
253
|
+
var rootDoc = this.root && (this.root.ownerDocument || this.root) || document2;
|
|
254
|
+
var hasDependentTargets = this._observationTargets.some(function(item) {
|
|
255
|
+
var itemDoc = item.element.ownerDocument;
|
|
256
|
+
if (itemDoc == doc) {
|
|
257
|
+
return true;
|
|
258
|
+
}
|
|
259
|
+
while (itemDoc && itemDoc != rootDoc) {
|
|
260
|
+
var frame2 = getFrameElement(itemDoc);
|
|
261
|
+
itemDoc = frame2 && frame2.ownerDocument;
|
|
468
262
|
if (itemDoc == doc) {
|
|
469
263
|
return true;
|
|
470
264
|
}
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
return true;
|
|
477
|
-
}
|
|
478
|
-
}
|
|
479
|
-
return false;
|
|
480
|
-
});
|
|
481
|
-
if (hasDependentTargets) {
|
|
482
|
-
return;
|
|
483
|
-
}
|
|
484
|
-
|
|
485
|
-
// Unsubscribe.
|
|
486
|
-
var unsubscribe = this._monitoringUnsubscribes[index];
|
|
487
|
-
this._monitoringDocuments.splice(index, 1);
|
|
488
|
-
this._monitoringUnsubscribes.splice(index, 1);
|
|
489
|
-
unsubscribe();
|
|
490
|
-
|
|
491
|
-
// Also unmonitor the parent.
|
|
492
|
-
if (doc != rootDoc) {
|
|
493
|
-
var frame = getFrameElement(doc);
|
|
494
|
-
if (frame) {
|
|
495
|
-
this._unmonitorIntersections(frame.ownerDocument);
|
|
265
|
+
}
|
|
266
|
+
return false;
|
|
267
|
+
});
|
|
268
|
+
if (hasDependentTargets) {
|
|
269
|
+
return;
|
|
496
270
|
}
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
IntersectionObserver.prototype._unmonitorAllIntersections = function() {
|
|
507
|
-
var unsubscribes = this._monitoringUnsubscribes.slice(0);
|
|
508
|
-
this._monitoringDocuments.length = 0;
|
|
509
|
-
this._monitoringUnsubscribes.length = 0;
|
|
510
|
-
for (var i = 0; i < unsubscribes.length; i++) {
|
|
511
|
-
unsubscribes[i]();
|
|
512
|
-
}
|
|
513
|
-
};
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
/**
|
|
517
|
-
* Scans each observation target for intersection changes and adds them
|
|
518
|
-
* to the internal entries queue. If new entries are found, it
|
|
519
|
-
* schedules the callback to be invoked.
|
|
520
|
-
* @private
|
|
521
|
-
*/
|
|
522
|
-
IntersectionObserver.prototype._checkForIntersections = function() {
|
|
523
|
-
if (!this.root && crossOriginUpdater && !crossOriginRect) {
|
|
524
|
-
// Cross origin monitoring, but no initial data available yet.
|
|
525
|
-
return;
|
|
526
|
-
}
|
|
527
|
-
|
|
528
|
-
var rootIsInDom = this._rootIsInDom();
|
|
529
|
-
var rootRect = rootIsInDom ? this._getRootRect() : getEmptyRect();
|
|
530
|
-
|
|
531
|
-
this._observationTargets.forEach(function(item) {
|
|
532
|
-
var target = item.element;
|
|
533
|
-
var targetRect = getBoundingClientRect(target);
|
|
534
|
-
var rootContainsTarget = this._rootContainsTarget(target);
|
|
535
|
-
var oldEntry = item.entry;
|
|
536
|
-
var intersectionRect = rootIsInDom && rootContainsTarget &&
|
|
537
|
-
this._computeTargetAndRootIntersection(target, targetRect, rootRect);
|
|
538
|
-
|
|
539
|
-
var rootBounds = null;
|
|
540
|
-
if (!this._rootContainsTarget(target)) {
|
|
541
|
-
rootBounds = getEmptyRect();
|
|
542
|
-
} else if (!crossOriginUpdater || this.root) {
|
|
543
|
-
rootBounds = rootRect;
|
|
271
|
+
var unsubscribe = this._monitoringUnsubscribes[index];
|
|
272
|
+
this._monitoringDocuments.splice(index, 1);
|
|
273
|
+
this._monitoringUnsubscribes.splice(index, 1);
|
|
274
|
+
unsubscribe();
|
|
275
|
+
if (doc != rootDoc) {
|
|
276
|
+
var frame = getFrameElement(doc);
|
|
277
|
+
if (frame) {
|
|
278
|
+
this._unmonitorIntersections(frame.ownerDocument);
|
|
279
|
+
}
|
|
544
280
|
}
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
}
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
281
|
+
};
|
|
282
|
+
IntersectionObserver2.prototype._unmonitorAllIntersections = function() {
|
|
283
|
+
var unsubscribes = this._monitoringUnsubscribes.slice(0);
|
|
284
|
+
this._monitoringDocuments.length = 0;
|
|
285
|
+
this._monitoringUnsubscribes.length = 0;
|
|
286
|
+
for (var i = 0; i < unsubscribes.length; i++) {
|
|
287
|
+
unsubscribes[i]();
|
|
288
|
+
}
|
|
289
|
+
};
|
|
290
|
+
IntersectionObserver2.prototype._checkForIntersections = function() {
|
|
291
|
+
if (!this.root && crossOriginUpdater && !crossOriginRect) {
|
|
292
|
+
return;
|
|
293
|
+
}
|
|
294
|
+
var rootIsInDom = this._rootIsInDom();
|
|
295
|
+
var rootRect = rootIsInDom ? this._getRootRect() : getEmptyRect();
|
|
296
|
+
this._observationTargets.forEach(function(item) {
|
|
297
|
+
var target = item.element;
|
|
298
|
+
var targetRect = getBoundingClientRect(target);
|
|
299
|
+
var rootContainsTarget = this._rootContainsTarget(target);
|
|
300
|
+
var oldEntry = item.entry;
|
|
301
|
+
var intersectionRect = rootIsInDom && rootContainsTarget && this._computeTargetAndRootIntersection(target, targetRect, rootRect);
|
|
302
|
+
var rootBounds = null;
|
|
303
|
+
if (!this._rootContainsTarget(target)) {
|
|
304
|
+
rootBounds = getEmptyRect();
|
|
305
|
+
} else if (!crossOriginUpdater || this.root) {
|
|
306
|
+
rootBounds = rootRect;
|
|
561
307
|
}
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
308
|
+
var newEntry = item.entry = new IntersectionObserverEntry2({
|
|
309
|
+
time: now(),
|
|
310
|
+
target,
|
|
311
|
+
boundingClientRect: targetRect,
|
|
312
|
+
rootBounds,
|
|
313
|
+
intersectionRect
|
|
314
|
+
});
|
|
315
|
+
if (!oldEntry) {
|
|
567
316
|
this._queuedEntries.push(newEntry);
|
|
317
|
+
} else if (rootIsInDom && rootContainsTarget) {
|
|
318
|
+
if (this._hasCrossedThreshold(oldEntry, newEntry)) {
|
|
319
|
+
this._queuedEntries.push(newEntry);
|
|
320
|
+
}
|
|
321
|
+
} else {
|
|
322
|
+
if (oldEntry && oldEntry.isIntersecting) {
|
|
323
|
+
this._queuedEntries.push(newEntry);
|
|
324
|
+
}
|
|
568
325
|
}
|
|
326
|
+
}, this);
|
|
327
|
+
if (this._queuedEntries.length) {
|
|
328
|
+
this._callback(this.takeRecords(), this);
|
|
569
329
|
}
|
|
570
|
-
}
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
// If the element isn't displayed, an intersection can't happen.
|
|
594
|
-
if (window.getComputedStyle(target).display == 'none') return;
|
|
595
|
-
|
|
596
|
-
var intersectionRect = targetRect;
|
|
597
|
-
var parent = getParentNode(target);
|
|
598
|
-
var atRoot = false;
|
|
599
|
-
|
|
600
|
-
while (!atRoot && parent) {
|
|
601
|
-
var parentRect = null;
|
|
602
|
-
var parentComputedStyle = parent.nodeType == 1 ?
|
|
603
|
-
window.getComputedStyle(parent) : {};
|
|
604
|
-
|
|
605
|
-
// If the parent isn't displayed, an intersection can't happen.
|
|
606
|
-
if (parentComputedStyle.display == 'none') return null;
|
|
607
|
-
|
|
608
|
-
if (parent == this.root || parent.nodeType == /* DOCUMENT */ 9) {
|
|
609
|
-
atRoot = true;
|
|
610
|
-
if (parent == this.root || parent == document) {
|
|
611
|
-
if (crossOriginUpdater && !this.root) {
|
|
612
|
-
if (!crossOriginRect ||
|
|
613
|
-
crossOriginRect.width == 0 && crossOriginRect.height == 0) {
|
|
614
|
-
// A 0-size cross-origin intersection means no-intersection.
|
|
615
|
-
parent = null;
|
|
616
|
-
parentRect = null;
|
|
617
|
-
intersectionRect = null;
|
|
330
|
+
};
|
|
331
|
+
IntersectionObserver2.prototype._computeTargetAndRootIntersection = function(target, targetRect, rootRect) {
|
|
332
|
+
if (window.getComputedStyle(target).display == "none")
|
|
333
|
+
return;
|
|
334
|
+
var intersectionRect = targetRect;
|
|
335
|
+
var parent = getParentNode(target);
|
|
336
|
+
var atRoot = false;
|
|
337
|
+
while (!atRoot && parent) {
|
|
338
|
+
var parentRect = null;
|
|
339
|
+
var parentComputedStyle = parent.nodeType == 1 ? window.getComputedStyle(parent) : {};
|
|
340
|
+
if (parentComputedStyle.display == "none")
|
|
341
|
+
return null;
|
|
342
|
+
if (parent == this.root || parent.nodeType == 9) {
|
|
343
|
+
atRoot = true;
|
|
344
|
+
if (parent == this.root || parent == document2) {
|
|
345
|
+
if (crossOriginUpdater && !this.root) {
|
|
346
|
+
if (!crossOriginRect || crossOriginRect.width == 0 && crossOriginRect.height == 0) {
|
|
347
|
+
parent = null;
|
|
348
|
+
parentRect = null;
|
|
349
|
+
intersectionRect = null;
|
|
350
|
+
} else {
|
|
351
|
+
parentRect = crossOriginRect;
|
|
352
|
+
}
|
|
618
353
|
} else {
|
|
619
|
-
parentRect =
|
|
354
|
+
parentRect = rootRect;
|
|
620
355
|
}
|
|
621
356
|
} else {
|
|
622
|
-
|
|
357
|
+
var frame = getParentNode(parent);
|
|
358
|
+
var frameRect = frame && getBoundingClientRect(frame);
|
|
359
|
+
var frameIntersect = frame && this._computeTargetAndRootIntersection(frame, frameRect, rootRect);
|
|
360
|
+
if (frameRect && frameIntersect) {
|
|
361
|
+
parent = frame;
|
|
362
|
+
parentRect = convertFromParentRect(frameRect, frameIntersect);
|
|
363
|
+
} else {
|
|
364
|
+
parent = null;
|
|
365
|
+
intersectionRect = null;
|
|
366
|
+
}
|
|
623
367
|
}
|
|
624
368
|
} else {
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
var frameIntersect =
|
|
629
|
-
frame &&
|
|
630
|
-
this._computeTargetAndRootIntersection(frame, frameRect, rootRect);
|
|
631
|
-
if (frameRect && frameIntersect) {
|
|
632
|
-
parent = frame;
|
|
633
|
-
parentRect = convertFromParentRect(frameRect, frameIntersect);
|
|
634
|
-
} else {
|
|
635
|
-
parent = null;
|
|
636
|
-
intersectionRect = null;
|
|
369
|
+
var doc = parent.ownerDocument;
|
|
370
|
+
if (parent != doc.body && parent != doc.documentElement && parentComputedStyle.overflow != "visible") {
|
|
371
|
+
parentRect = getBoundingClientRect(parent);
|
|
637
372
|
}
|
|
638
373
|
}
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
// or <html> element, update the intersection rect.
|
|
642
|
-
// Note: <body> and <html> cannot be clipped to a rect that's not also
|
|
643
|
-
// the document rect, so no need to compute a new intersection.
|
|
644
|
-
var doc = parent.ownerDocument;
|
|
645
|
-
if (parent != doc.body &&
|
|
646
|
-
parent != doc.documentElement &&
|
|
647
|
-
parentComputedStyle.overflow != 'visible') {
|
|
648
|
-
parentRect = getBoundingClientRect(parent);
|
|
374
|
+
if (parentRect) {
|
|
375
|
+
intersectionRect = computeRectIntersection(parentRect, intersectionRect);
|
|
649
376
|
}
|
|
377
|
+
if (!intersectionRect)
|
|
378
|
+
break;
|
|
379
|
+
parent = parent && getParentNode(parent);
|
|
650
380
|
}
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
381
|
+
return intersectionRect;
|
|
382
|
+
};
|
|
383
|
+
IntersectionObserver2.prototype._getRootRect = function() {
|
|
384
|
+
var rootRect;
|
|
385
|
+
if (this.root && !isDoc(this.root)) {
|
|
386
|
+
rootRect = getBoundingClientRect(this.root);
|
|
387
|
+
} else {
|
|
388
|
+
var doc = isDoc(this.root) ? this.root : document2;
|
|
389
|
+
var html = doc.documentElement;
|
|
390
|
+
var body = doc.body;
|
|
391
|
+
rootRect = {
|
|
392
|
+
top: 0,
|
|
393
|
+
left: 0,
|
|
394
|
+
right: html.clientWidth || body.clientWidth,
|
|
395
|
+
width: html.clientWidth || body.clientWidth,
|
|
396
|
+
bottom: html.clientHeight || body.clientHeight,
|
|
397
|
+
height: html.clientHeight || body.clientHeight
|
|
398
|
+
};
|
|
656
399
|
}
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
*/
|
|
669
|
-
IntersectionObserver.prototype._getRootRect = function() {
|
|
670
|
-
var rootRect;
|
|
671
|
-
if (this.root && !isDoc(this.root)) {
|
|
672
|
-
rootRect = getBoundingClientRect(this.root);
|
|
673
|
-
} else {
|
|
674
|
-
// Use <html>/<body> instead of window since scroll bars affect size.
|
|
675
|
-
var doc = isDoc(this.root) ? this.root : document;
|
|
676
|
-
var html = doc.documentElement;
|
|
677
|
-
var body = doc.body;
|
|
678
|
-
rootRect = {
|
|
679
|
-
top: 0,
|
|
680
|
-
left: 0,
|
|
681
|
-
right: html.clientWidth || body.clientWidth,
|
|
682
|
-
width: html.clientWidth || body.clientWidth,
|
|
683
|
-
bottom: html.clientHeight || body.clientHeight,
|
|
684
|
-
height: html.clientHeight || body.clientHeight
|
|
400
|
+
return this._expandRectByRootMargin(rootRect);
|
|
401
|
+
};
|
|
402
|
+
IntersectionObserver2.prototype._expandRectByRootMargin = function(rect) {
|
|
403
|
+
var margins = this._rootMarginValues.map(function(margin, i) {
|
|
404
|
+
return margin.unit == "px" ? margin.value : margin.value * (i % 2 ? rect.width : rect.height) / 100;
|
|
405
|
+
});
|
|
406
|
+
var newRect = {
|
|
407
|
+
top: rect.top - margins[0],
|
|
408
|
+
right: rect.right + margins[1],
|
|
409
|
+
bottom: rect.bottom + margins[2],
|
|
410
|
+
left: rect.left - margins[3]
|
|
685
411
|
};
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
/**
|
|
692
|
-
* Accepts a rect and expands it by the rootMargin value.
|
|
693
|
-
* @param {DOMRect|ClientRect} rect The rect object to expand.
|
|
694
|
-
* @return {ClientRect} The expanded rect.
|
|
695
|
-
* @private
|
|
696
|
-
*/
|
|
697
|
-
IntersectionObserver.prototype._expandRectByRootMargin = function(rect) {
|
|
698
|
-
var margins = this._rootMarginValues.map(function(margin, i) {
|
|
699
|
-
return margin.unit == 'px' ? margin.value :
|
|
700
|
-
margin.value * (i % 2 ? rect.width : rect.height) / 100;
|
|
701
|
-
});
|
|
702
|
-
var newRect = {
|
|
703
|
-
top: rect.top - margins[0],
|
|
704
|
-
right: rect.right + margins[1],
|
|
705
|
-
bottom: rect.bottom + margins[2],
|
|
706
|
-
left: rect.left - margins[3]
|
|
412
|
+
newRect.width = newRect.right - newRect.left;
|
|
413
|
+
newRect.height = newRect.bottom - newRect.top;
|
|
414
|
+
return newRect;
|
|
707
415
|
};
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
var oldRatio = oldEntry && oldEntry.isIntersecting ?
|
|
731
|
-
oldEntry.intersectionRatio || 0 : -1;
|
|
732
|
-
var newRatio = newEntry.isIntersecting ?
|
|
733
|
-
newEntry.intersectionRatio || 0 : -1;
|
|
734
|
-
|
|
735
|
-
// Ignore unchanged ratios
|
|
736
|
-
if (oldRatio === newRatio) return;
|
|
737
|
-
|
|
738
|
-
for (var i = 0; i < this.thresholds.length; i++) {
|
|
739
|
-
var threshold = this.thresholds[i];
|
|
740
|
-
|
|
741
|
-
// Return true if an entry matches a threshold or if the new ratio
|
|
742
|
-
// and the old ratio are on the opposite sides of a threshold.
|
|
743
|
-
if (threshold == oldRatio || threshold == newRatio ||
|
|
744
|
-
threshold < oldRatio !== threshold < newRatio) {
|
|
745
|
-
return true;
|
|
416
|
+
IntersectionObserver2.prototype._hasCrossedThreshold = function(oldEntry, newEntry) {
|
|
417
|
+
var oldRatio = oldEntry && oldEntry.isIntersecting ? oldEntry.intersectionRatio || 0 : -1;
|
|
418
|
+
var newRatio = newEntry.isIntersecting ? newEntry.intersectionRatio || 0 : -1;
|
|
419
|
+
if (oldRatio === newRatio)
|
|
420
|
+
return;
|
|
421
|
+
for (var i = 0; i < this.thresholds.length; i++) {
|
|
422
|
+
var threshold = this.thresholds[i];
|
|
423
|
+
if (threshold == oldRatio || threshold == newRatio || threshold < oldRatio !== threshold < newRatio) {
|
|
424
|
+
return true;
|
|
425
|
+
}
|
|
426
|
+
}
|
|
427
|
+
};
|
|
428
|
+
IntersectionObserver2.prototype._rootIsInDom = function() {
|
|
429
|
+
return !this.root || containsDeep(document2, this.root);
|
|
430
|
+
};
|
|
431
|
+
IntersectionObserver2.prototype._rootContainsTarget = function(target) {
|
|
432
|
+
var rootDoc = this.root && (this.root.ownerDocument || this.root) || document2;
|
|
433
|
+
return containsDeep(rootDoc, target) && (!this.root || rootDoc == target.ownerDocument);
|
|
434
|
+
};
|
|
435
|
+
IntersectionObserver2.prototype._registerInstance = function() {
|
|
436
|
+
if (registry.indexOf(this) < 0) {
|
|
437
|
+
registry.push(this);
|
|
746
438
|
}
|
|
439
|
+
};
|
|
440
|
+
IntersectionObserver2.prototype._unregisterInstance = function() {
|
|
441
|
+
var index = registry.indexOf(this);
|
|
442
|
+
if (index != -1)
|
|
443
|
+
registry.splice(index, 1);
|
|
444
|
+
};
|
|
445
|
+
function now() {
|
|
446
|
+
return window.performance && performance.now && performance.now();
|
|
747
447
|
}
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
};
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
/**
|
|
762
|
-
* Returns whether or not the target element is a child of root.
|
|
763
|
-
* @param {Element} target The target element to check.
|
|
764
|
-
* @return {boolean} True if the target element is a child of root.
|
|
765
|
-
* @private
|
|
766
|
-
*/
|
|
767
|
-
IntersectionObserver.prototype._rootContainsTarget = function(target) {
|
|
768
|
-
var rootDoc =
|
|
769
|
-
(this.root && (this.root.ownerDocument || this.root)) || document;
|
|
770
|
-
return (
|
|
771
|
-
containsDeep(rootDoc, target) &&
|
|
772
|
-
(!this.root || rootDoc == target.ownerDocument)
|
|
773
|
-
);
|
|
774
|
-
};
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
/**
|
|
778
|
-
* Adds the instance to the global IntersectionObserver registry if it isn't
|
|
779
|
-
* already present.
|
|
780
|
-
* @private
|
|
781
|
-
*/
|
|
782
|
-
IntersectionObserver.prototype._registerInstance = function() {
|
|
783
|
-
if (registry.indexOf(this) < 0) {
|
|
784
|
-
registry.push(this);
|
|
448
|
+
function throttle(fn, timeout) {
|
|
449
|
+
var timer = null;
|
|
450
|
+
return function() {
|
|
451
|
+
if (!timer) {
|
|
452
|
+
timer = setTimeout(function() {
|
|
453
|
+
fn();
|
|
454
|
+
timer = null;
|
|
455
|
+
}, timeout);
|
|
456
|
+
}
|
|
457
|
+
};
|
|
785
458
|
}
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
* @private
|
|
792
|
-
*/
|
|
793
|
-
IntersectionObserver.prototype._unregisterInstance = function() {
|
|
794
|
-
var index = registry.indexOf(this);
|
|
795
|
-
if (index != -1) registry.splice(index, 1);
|
|
796
|
-
};
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
/**
|
|
800
|
-
* Returns the result of the performance.now() method or null in browsers
|
|
801
|
-
* that don't support the API.
|
|
802
|
-
* @return {number} The elapsed time since the page was requested.
|
|
803
|
-
*/
|
|
804
|
-
function now() {
|
|
805
|
-
return window.performance && performance.now && performance.now();
|
|
806
|
-
}
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
/**
|
|
810
|
-
* Throttles a function and delays its execution, so it's only called at most
|
|
811
|
-
* once within a given time period.
|
|
812
|
-
* @param {Function} fn The function to throttle.
|
|
813
|
-
* @param {number} timeout The amount of time that must pass before the
|
|
814
|
-
* function can be called again.
|
|
815
|
-
* @return {Function} The throttled function.
|
|
816
|
-
*/
|
|
817
|
-
function throttle(fn, timeout) {
|
|
818
|
-
var timer = null;
|
|
819
|
-
return function () {
|
|
820
|
-
if (!timer) {
|
|
821
|
-
timer = setTimeout(function() {
|
|
822
|
-
fn();
|
|
823
|
-
timer = null;
|
|
824
|
-
}, timeout);
|
|
459
|
+
function addEvent(node, event, fn, opt_useCapture) {
|
|
460
|
+
if (typeof node.addEventListener == "function") {
|
|
461
|
+
node.addEventListener(event, fn, opt_useCapture || false);
|
|
462
|
+
} else if (typeof node.attachEvent == "function") {
|
|
463
|
+
node.attachEvent("on" + event, fn);
|
|
825
464
|
}
|
|
826
|
-
};
|
|
827
|
-
}
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
/**
|
|
831
|
-
* Adds an event handler to a DOM node ensuring cross-browser compatibility.
|
|
832
|
-
* @param {Node} node The DOM node to add the event handler to.
|
|
833
|
-
* @param {string} event The event name.
|
|
834
|
-
* @param {Function} fn The event handler to add.
|
|
835
|
-
* @param {boolean} opt_useCapture Optionally adds the even to the capture
|
|
836
|
-
* phase. Note: this only works in modern browsers.
|
|
837
|
-
*/
|
|
838
|
-
function addEvent(node, event, fn, opt_useCapture) {
|
|
839
|
-
if (typeof node.addEventListener == 'function') {
|
|
840
|
-
node.addEventListener(event, fn, opt_useCapture || false);
|
|
841
465
|
}
|
|
842
|
-
|
|
843
|
-
node.
|
|
466
|
+
function removeEvent(node, event, fn, opt_useCapture) {
|
|
467
|
+
if (typeof node.removeEventListener == "function") {
|
|
468
|
+
node.removeEventListener(event, fn, opt_useCapture || false);
|
|
469
|
+
} else if (typeof node.detatchEvent == "function") {
|
|
470
|
+
node.detatchEvent("on" + event, fn);
|
|
471
|
+
}
|
|
844
472
|
}
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
473
|
+
function computeRectIntersection(rect1, rect2) {
|
|
474
|
+
var top = Math.max(rect1.top, rect2.top);
|
|
475
|
+
var bottom = Math.min(rect1.bottom, rect2.bottom);
|
|
476
|
+
var left = Math.max(rect1.left, rect2.left);
|
|
477
|
+
var right = Math.min(rect1.right, rect2.right);
|
|
478
|
+
var width = right - left;
|
|
479
|
+
var height = bottom - top;
|
|
480
|
+
return width >= 0 && height >= 0 && {
|
|
481
|
+
top,
|
|
482
|
+
bottom,
|
|
483
|
+
left,
|
|
484
|
+
right,
|
|
485
|
+
width,
|
|
486
|
+
height
|
|
487
|
+
} || null;
|
|
859
488
|
}
|
|
860
|
-
|
|
861
|
-
|
|
489
|
+
function getBoundingClientRect(el) {
|
|
490
|
+
var rect;
|
|
491
|
+
try {
|
|
492
|
+
rect = el.getBoundingClientRect();
|
|
493
|
+
} catch (err) {
|
|
494
|
+
}
|
|
495
|
+
if (!rect)
|
|
496
|
+
return getEmptyRect();
|
|
497
|
+
if (!(rect.width && rect.height)) {
|
|
498
|
+
rect = {
|
|
499
|
+
top: rect.top,
|
|
500
|
+
right: rect.right,
|
|
501
|
+
bottom: rect.bottom,
|
|
502
|
+
left: rect.left,
|
|
503
|
+
width: rect.right - rect.left,
|
|
504
|
+
height: rect.bottom - rect.top
|
|
505
|
+
};
|
|
506
|
+
}
|
|
507
|
+
return rect;
|
|
862
508
|
}
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
*/
|
|
873
|
-
function computeRectIntersection(rect1, rect2) {
|
|
874
|
-
var top = Math.max(rect1.top, rect2.top);
|
|
875
|
-
var bottom = Math.min(rect1.bottom, rect2.bottom);
|
|
876
|
-
var left = Math.max(rect1.left, rect2.left);
|
|
877
|
-
var right = Math.min(rect1.right, rect2.right);
|
|
878
|
-
var width = right - left;
|
|
879
|
-
var height = bottom - top;
|
|
880
|
-
|
|
881
|
-
return (width >= 0 && height >= 0) && {
|
|
882
|
-
top: top,
|
|
883
|
-
bottom: bottom,
|
|
884
|
-
left: left,
|
|
885
|
-
right: right,
|
|
886
|
-
width: width,
|
|
887
|
-
height: height
|
|
888
|
-
} || null;
|
|
889
|
-
}
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
/**
|
|
893
|
-
* Shims the native getBoundingClientRect for compatibility with older IE.
|
|
894
|
-
* @param {Element} el The element whose bounding rect to get.
|
|
895
|
-
* @return {DOMRect|ClientRect} The (possibly shimmed) rect of the element.
|
|
896
|
-
*/
|
|
897
|
-
function getBoundingClientRect(el) {
|
|
898
|
-
var rect;
|
|
899
|
-
|
|
900
|
-
try {
|
|
901
|
-
rect = el.getBoundingClientRect();
|
|
902
|
-
} catch (err) {
|
|
903
|
-
// Ignore Windows 7 IE11 "Unspecified error"
|
|
904
|
-
// https://github.com/w3c/IntersectionObserver/pull/205
|
|
509
|
+
function getEmptyRect() {
|
|
510
|
+
return {
|
|
511
|
+
top: 0,
|
|
512
|
+
bottom: 0,
|
|
513
|
+
left: 0,
|
|
514
|
+
right: 0,
|
|
515
|
+
width: 0,
|
|
516
|
+
height: 0
|
|
517
|
+
};
|
|
905
518
|
}
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
rect = {
|
|
519
|
+
function ensureDOMRect(rect) {
|
|
520
|
+
if (!rect || "x" in rect) {
|
|
521
|
+
return rect;
|
|
522
|
+
}
|
|
523
|
+
return {
|
|
912
524
|
top: rect.top,
|
|
913
|
-
|
|
525
|
+
y: rect.top,
|
|
914
526
|
bottom: rect.bottom,
|
|
915
527
|
left: rect.left,
|
|
916
|
-
|
|
917
|
-
|
|
528
|
+
x: rect.left,
|
|
529
|
+
right: rect.right,
|
|
530
|
+
width: rect.width,
|
|
531
|
+
height: rect.height
|
|
918
532
|
};
|
|
919
533
|
}
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
top: 0,
|
|
932
|
-
bottom: 0,
|
|
933
|
-
left: 0,
|
|
934
|
-
right: 0,
|
|
935
|
-
width: 0,
|
|
936
|
-
height: 0
|
|
937
|
-
};
|
|
938
|
-
}
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
/**
|
|
942
|
-
* Ensure that the result has all of the necessary fields of the DOMRect.
|
|
943
|
-
* Specifically this ensures that `x` and `y` fields are set.
|
|
944
|
-
*
|
|
945
|
-
* @param {?DOMRect|?ClientRect} rect
|
|
946
|
-
* @return {?DOMRect}
|
|
947
|
-
*/
|
|
948
|
-
function ensureDOMRect(rect) {
|
|
949
|
-
// A `DOMRect` object has `x` and `y` fields.
|
|
950
|
-
if (!rect || 'x' in rect) {
|
|
951
|
-
return rect;
|
|
534
|
+
function convertFromParentRect(parentBoundingRect, parentIntersectionRect) {
|
|
535
|
+
var top = parentIntersectionRect.top - parentBoundingRect.top;
|
|
536
|
+
var left = parentIntersectionRect.left - parentBoundingRect.left;
|
|
537
|
+
return {
|
|
538
|
+
top,
|
|
539
|
+
left,
|
|
540
|
+
height: parentIntersectionRect.height,
|
|
541
|
+
width: parentIntersectionRect.width,
|
|
542
|
+
bottom: top + parentIntersectionRect.height,
|
|
543
|
+
right: left + parentIntersectionRect.width
|
|
544
|
+
};
|
|
952
545
|
}
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
left: rect.left,
|
|
962
|
-
x: rect.left,
|
|
963
|
-
right: rect.right,
|
|
964
|
-
width: rect.width,
|
|
965
|
-
height: rect.height
|
|
966
|
-
};
|
|
967
|
-
}
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
/**
|
|
971
|
-
* Inverts the intersection and bounding rect from the parent (frame) BCR to
|
|
972
|
-
* the local BCR space.
|
|
973
|
-
* @param {DOMRect|ClientRect} parentBoundingRect The parent's bound client rect.
|
|
974
|
-
* @param {DOMRect|ClientRect} parentIntersectionRect The parent's own intersection rect.
|
|
975
|
-
* @return {ClientRect} The local root bounding rect for the parent's children.
|
|
976
|
-
*/
|
|
977
|
-
function convertFromParentRect(parentBoundingRect, parentIntersectionRect) {
|
|
978
|
-
var top = parentIntersectionRect.top - parentBoundingRect.top;
|
|
979
|
-
var left = parentIntersectionRect.left - parentBoundingRect.left;
|
|
980
|
-
return {
|
|
981
|
-
top: top,
|
|
982
|
-
left: left,
|
|
983
|
-
height: parentIntersectionRect.height,
|
|
984
|
-
width: parentIntersectionRect.width,
|
|
985
|
-
bottom: top + parentIntersectionRect.height,
|
|
986
|
-
right: left + parentIntersectionRect.width
|
|
987
|
-
};
|
|
988
|
-
}
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
/**
|
|
992
|
-
* Checks to see if a parent element contains a child element (including inside
|
|
993
|
-
* shadow DOM).
|
|
994
|
-
* @param {Node} parent The parent element.
|
|
995
|
-
* @param {Node} child The child element.
|
|
996
|
-
* @return {boolean} True if the parent node contains the child node.
|
|
997
|
-
*/
|
|
998
|
-
function containsDeep(parent, child) {
|
|
999
|
-
var node = child;
|
|
1000
|
-
while (node) {
|
|
1001
|
-
if (node == parent) return true;
|
|
1002
|
-
|
|
1003
|
-
node = getParentNode(node);
|
|
546
|
+
function containsDeep(parent, child) {
|
|
547
|
+
var node = child;
|
|
548
|
+
while (node) {
|
|
549
|
+
if (node == parent)
|
|
550
|
+
return true;
|
|
551
|
+
node = getParentNode(node);
|
|
552
|
+
}
|
|
553
|
+
return false;
|
|
1004
554
|
}
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
if (node.nodeType == /* DOCUMENT */ 9 && node != document) {
|
|
1019
|
-
// If this node is a document node, look for the embedding frame.
|
|
1020
|
-
return getFrameElement(node);
|
|
555
|
+
function getParentNode(node) {
|
|
556
|
+
var parent = node.parentNode;
|
|
557
|
+
if (node.nodeType == 9 && node != document2) {
|
|
558
|
+
return getFrameElement(node);
|
|
559
|
+
}
|
|
560
|
+
if (parent && parent.assignedSlot) {
|
|
561
|
+
parent = parent.assignedSlot.parentNode;
|
|
562
|
+
}
|
|
563
|
+
if (parent && parent.nodeType == 11 && parent.host) {
|
|
564
|
+
return parent.host;
|
|
565
|
+
}
|
|
566
|
+
return parent;
|
|
1021
567
|
}
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
if (parent && parent.assignedSlot) {
|
|
1025
|
-
parent = parent.assignedSlot.parentNode;
|
|
568
|
+
function isDoc(node) {
|
|
569
|
+
return node && node.nodeType === 9;
|
|
1026
570
|
}
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
571
|
+
window.IntersectionObserver = IntersectionObserver2;
|
|
572
|
+
window.IntersectionObserverEntry = IntersectionObserverEntry2;
|
|
573
|
+
})();
|
|
574
|
+
var eventemitter3 = { exports: {} };
|
|
575
|
+
(function(module) {
|
|
576
|
+
var has = Object.prototype.hasOwnProperty, prefix = "~";
|
|
577
|
+
function Events() {
|
|
1031
578
|
}
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
/**
|
|
1037
|
-
* Returns true if `node` is a Document.
|
|
1038
|
-
* @param {!Node} node
|
|
1039
|
-
* @returns {boolean}
|
|
1040
|
-
*/
|
|
1041
|
-
function isDoc(node) {
|
|
1042
|
-
return node && node.nodeType === 9;
|
|
1043
|
-
}
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
// Exposes the constructors globally.
|
|
1047
|
-
window.IntersectionObserver = IntersectionObserver;
|
|
1048
|
-
window.IntersectionObserverEntry = IntersectionObserverEntry;
|
|
1049
|
-
|
|
1050
|
-
}());
|
|
1051
|
-
|
|
1052
|
-
var eventemitter3 = {exports: {}};
|
|
1053
|
-
|
|
1054
|
-
(function (module) {
|
|
1055
|
-
|
|
1056
|
-
var has = Object.prototype.hasOwnProperty
|
|
1057
|
-
, prefix = '~';
|
|
1058
|
-
|
|
1059
|
-
/**
|
|
1060
|
-
* Constructor to create a storage for our `EE` objects.
|
|
1061
|
-
* An `Events` instance is a plain object whose properties are event names.
|
|
1062
|
-
*
|
|
1063
|
-
* @constructor
|
|
1064
|
-
* @private
|
|
1065
|
-
*/
|
|
1066
|
-
function Events() {}
|
|
1067
|
-
|
|
1068
|
-
//
|
|
1069
|
-
// We try to not inherit from `Object.prototype`. In some engines creating an
|
|
1070
|
-
// instance in this way is faster than calling `Object.create(null)` directly.
|
|
1071
|
-
// If `Object.create(null)` is not supported we prefix the event names with a
|
|
1072
|
-
// character to make sure that the built-in object properties are not
|
|
1073
|
-
// overridden or used as an attack vector.
|
|
1074
|
-
//
|
|
1075
|
-
if (Object.create) {
|
|
1076
|
-
Events.prototype = Object.create(null);
|
|
1077
|
-
|
|
1078
|
-
//
|
|
1079
|
-
// This hack is needed because the `__proto__` property is still inherited in
|
|
1080
|
-
// some old browsers like Android 4, iPhone 5.1, Opera 11 and Safari 5.
|
|
1081
|
-
//
|
|
1082
|
-
if (!new Events().__proto__) prefix = false;
|
|
1083
|
-
}
|
|
1084
|
-
|
|
1085
|
-
/**
|
|
1086
|
-
* Representation of a single event listener.
|
|
1087
|
-
*
|
|
1088
|
-
* @param {Function} fn The listener function.
|
|
1089
|
-
* @param {*} context The context to invoke the listener with.
|
|
1090
|
-
* @param {Boolean} [once=false] Specify if the listener is a one-time listener.
|
|
1091
|
-
* @constructor
|
|
1092
|
-
* @private
|
|
1093
|
-
*/
|
|
1094
|
-
function EE(fn, context, once) {
|
|
1095
|
-
this.fn = fn;
|
|
1096
|
-
this.context = context;
|
|
1097
|
-
this.once = once || false;
|
|
1098
|
-
}
|
|
1099
|
-
|
|
1100
|
-
/**
|
|
1101
|
-
* Add a listener for a given event.
|
|
1102
|
-
*
|
|
1103
|
-
* @param {EventEmitter} emitter Reference to the `EventEmitter` instance.
|
|
1104
|
-
* @param {(String|Symbol)} event The event name.
|
|
1105
|
-
* @param {Function} fn The listener function.
|
|
1106
|
-
* @param {*} context The context to invoke the listener with.
|
|
1107
|
-
* @param {Boolean} once Specify if the listener is a one-time listener.
|
|
1108
|
-
* @returns {EventEmitter}
|
|
1109
|
-
* @private
|
|
1110
|
-
*/
|
|
1111
|
-
function addListener(emitter, event, fn, context, once) {
|
|
1112
|
-
if (typeof fn !== 'function') {
|
|
1113
|
-
throw new TypeError('The listener must be a function');
|
|
579
|
+
if (Object.create) {
|
|
580
|
+
Events.prototype = Object.create(null);
|
|
581
|
+
if (!new Events().__proto__)
|
|
582
|
+
prefix = false;
|
|
1114
583
|
}
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
if (!emitter._events[evt]) emitter._events[evt] = listener, emitter._eventsCount++;
|
|
1120
|
-
else if (!emitter._events[evt].fn) emitter._events[evt].push(listener);
|
|
1121
|
-
else emitter._events[evt] = [emitter._events[evt], listener];
|
|
1122
|
-
|
|
1123
|
-
return emitter;
|
|
1124
|
-
}
|
|
1125
|
-
|
|
1126
|
-
/**
|
|
1127
|
-
* Clear event by name.
|
|
1128
|
-
*
|
|
1129
|
-
* @param {EventEmitter} emitter Reference to the `EventEmitter` instance.
|
|
1130
|
-
* @param {(String|Symbol)} evt The Event name.
|
|
1131
|
-
* @private
|
|
1132
|
-
*/
|
|
1133
|
-
function clearEvent(emitter, evt) {
|
|
1134
|
-
if (--emitter._eventsCount === 0) emitter._events = new Events();
|
|
1135
|
-
else delete emitter._events[evt];
|
|
1136
|
-
}
|
|
1137
|
-
|
|
1138
|
-
/**
|
|
1139
|
-
* Minimal `EventEmitter` interface that is molded against the Node.js
|
|
1140
|
-
* `EventEmitter` interface.
|
|
1141
|
-
*
|
|
1142
|
-
* @constructor
|
|
1143
|
-
* @public
|
|
1144
|
-
*/
|
|
1145
|
-
function EventEmitter() {
|
|
1146
|
-
this._events = new Events();
|
|
1147
|
-
this._eventsCount = 0;
|
|
1148
|
-
}
|
|
1149
|
-
|
|
1150
|
-
/**
|
|
1151
|
-
* Return an array listing the events for which the emitter has registered
|
|
1152
|
-
* listeners.
|
|
1153
|
-
*
|
|
1154
|
-
* @returns {Array}
|
|
1155
|
-
* @public
|
|
1156
|
-
*/
|
|
1157
|
-
EventEmitter.prototype.eventNames = function eventNames() {
|
|
1158
|
-
var names = []
|
|
1159
|
-
, events
|
|
1160
|
-
, name;
|
|
1161
|
-
|
|
1162
|
-
if (this._eventsCount === 0) return names;
|
|
1163
|
-
|
|
1164
|
-
for (name in (events = this._events)) {
|
|
1165
|
-
if (has.call(events, name)) names.push(prefix ? name.slice(1) : name);
|
|
584
|
+
function EE(fn, context, once) {
|
|
585
|
+
this.fn = fn;
|
|
586
|
+
this.context = context;
|
|
587
|
+
this.once = once || false;
|
|
1166
588
|
}
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
589
|
+
function addListener(emitter, event, fn, context, once) {
|
|
590
|
+
if (typeof fn !== "function") {
|
|
591
|
+
throw new TypeError("The listener must be a function");
|
|
592
|
+
}
|
|
593
|
+
var listener = new EE(fn, context || emitter, once), evt = prefix ? prefix + event : event;
|
|
594
|
+
if (!emitter._events[evt])
|
|
595
|
+
emitter._events[evt] = listener, emitter._eventsCount++;
|
|
596
|
+
else if (!emitter._events[evt].fn)
|
|
597
|
+
emitter._events[evt].push(listener);
|
|
598
|
+
else
|
|
599
|
+
emitter._events[evt] = [emitter._events[evt], listener];
|
|
600
|
+
return emitter;
|
|
1170
601
|
}
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
* Return the listeners registered for a given event.
|
|
1177
|
-
*
|
|
1178
|
-
* @param {(String|Symbol)} event The event name.
|
|
1179
|
-
* @returns {Array} The registered listeners.
|
|
1180
|
-
* @public
|
|
1181
|
-
*/
|
|
1182
|
-
EventEmitter.prototype.listeners = function listeners(event) {
|
|
1183
|
-
var evt = prefix ? prefix + event : event
|
|
1184
|
-
, handlers = this._events[evt];
|
|
1185
|
-
|
|
1186
|
-
if (!handlers) return [];
|
|
1187
|
-
if (handlers.fn) return [handlers.fn];
|
|
1188
|
-
|
|
1189
|
-
for (var i = 0, l = handlers.length, ee = new Array(l); i < l; i++) {
|
|
1190
|
-
ee[i] = handlers[i].fn;
|
|
602
|
+
function clearEvent(emitter, evt) {
|
|
603
|
+
if (--emitter._eventsCount === 0)
|
|
604
|
+
emitter._events = new Events();
|
|
605
|
+
else
|
|
606
|
+
delete emitter._events[evt];
|
|
1191
607
|
}
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
if (!listeners) return 0;
|
|
1208
|
-
if (listeners.fn) return 1;
|
|
1209
|
-
return listeners.length;
|
|
1210
|
-
};
|
|
1211
|
-
|
|
1212
|
-
/**
|
|
1213
|
-
* Calls each of the listeners registered for a given event.
|
|
1214
|
-
*
|
|
1215
|
-
* @param {(String|Symbol)} event The event name.
|
|
1216
|
-
* @returns {Boolean} `true` if the event had listeners, else `false`.
|
|
1217
|
-
* @public
|
|
1218
|
-
*/
|
|
1219
|
-
EventEmitter.prototype.emit = function emit(event, a1, a2, a3, a4, a5) {
|
|
1220
|
-
var evt = prefix ? prefix + event : event;
|
|
1221
|
-
|
|
1222
|
-
if (!this._events[evt]) return false;
|
|
1223
|
-
|
|
1224
|
-
var listeners = this._events[evt]
|
|
1225
|
-
, len = arguments.length
|
|
1226
|
-
, args
|
|
1227
|
-
, i;
|
|
1228
|
-
|
|
1229
|
-
if (listeners.fn) {
|
|
1230
|
-
if (listeners.once) this.removeListener(event, listeners.fn, undefined, true);
|
|
1231
|
-
|
|
1232
|
-
switch (len) {
|
|
1233
|
-
case 1: return listeners.fn.call(listeners.context), true;
|
|
1234
|
-
case 2: return listeners.fn.call(listeners.context, a1), true;
|
|
1235
|
-
case 3: return listeners.fn.call(listeners.context, a1, a2), true;
|
|
1236
|
-
case 4: return listeners.fn.call(listeners.context, a1, a2, a3), true;
|
|
1237
|
-
case 5: return listeners.fn.call(listeners.context, a1, a2, a3, a4), true;
|
|
1238
|
-
case 6: return listeners.fn.call(listeners.context, a1, a2, a3, a4, a5), true;
|
|
608
|
+
function EventEmitter() {
|
|
609
|
+
this._events = new Events();
|
|
610
|
+
this._eventsCount = 0;
|
|
611
|
+
}
|
|
612
|
+
EventEmitter.prototype.eventNames = function eventNames() {
|
|
613
|
+
var names = [], events, name;
|
|
614
|
+
if (this._eventsCount === 0)
|
|
615
|
+
return names;
|
|
616
|
+
for (name in events = this._events) {
|
|
617
|
+
if (has.call(events, name))
|
|
618
|
+
names.push(prefix ? name.slice(1) : name);
|
|
619
|
+
}
|
|
620
|
+
if (Object.getOwnPropertySymbols) {
|
|
621
|
+
return names.concat(Object.getOwnPropertySymbols(events));
|
|
1239
622
|
}
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
623
|
+
return names;
|
|
624
|
+
};
|
|
625
|
+
EventEmitter.prototype.listeners = function listeners(event) {
|
|
626
|
+
var evt = prefix ? prefix + event : event, handlers = this._events[evt];
|
|
627
|
+
if (!handlers)
|
|
628
|
+
return [];
|
|
629
|
+
if (handlers.fn)
|
|
630
|
+
return [handlers.fn];
|
|
631
|
+
for (var i = 0, l = handlers.length, ee = new Array(l); i < l; i++) {
|
|
632
|
+
ee[i] = handlers[i].fn;
|
|
1243
633
|
}
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
|
|
1247
|
-
var
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
|
|
1251
|
-
|
|
1252
|
-
|
|
634
|
+
return ee;
|
|
635
|
+
};
|
|
636
|
+
EventEmitter.prototype.listenerCount = function listenerCount(event) {
|
|
637
|
+
var evt = prefix ? prefix + event : event, listeners = this._events[evt];
|
|
638
|
+
if (!listeners)
|
|
639
|
+
return 0;
|
|
640
|
+
if (listeners.fn)
|
|
641
|
+
return 1;
|
|
642
|
+
return listeners.length;
|
|
643
|
+
};
|
|
644
|
+
EventEmitter.prototype.emit = function emit(event, a1, a2, a3, a4, a5) {
|
|
645
|
+
var evt = prefix ? prefix + event : event;
|
|
646
|
+
if (!this._events[evt])
|
|
647
|
+
return false;
|
|
648
|
+
var listeners = this._events[evt], len = arguments.length, args, i;
|
|
649
|
+
if (listeners.fn) {
|
|
650
|
+
if (listeners.once)
|
|
651
|
+
this.removeListener(event, listeners.fn, void 0, true);
|
|
1253
652
|
switch (len) {
|
|
1254
|
-
case 1:
|
|
1255
|
-
|
|
1256
|
-
case
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
listeners
|
|
653
|
+
case 1:
|
|
654
|
+
return listeners.fn.call(listeners.context), true;
|
|
655
|
+
case 2:
|
|
656
|
+
return listeners.fn.call(listeners.context, a1), true;
|
|
657
|
+
case 3:
|
|
658
|
+
return listeners.fn.call(listeners.context, a1, a2), true;
|
|
659
|
+
case 4:
|
|
660
|
+
return listeners.fn.call(listeners.context, a1, a2, a3), true;
|
|
661
|
+
case 5:
|
|
662
|
+
return listeners.fn.call(listeners.context, a1, a2, a3, a4), true;
|
|
663
|
+
case 6:
|
|
664
|
+
return listeners.fn.call(listeners.context, a1, a2, a3, a4, a5), true;
|
|
665
|
+
}
|
|
666
|
+
for (i = 1, args = new Array(len - 1); i < len; i++) {
|
|
667
|
+
args[i - 1] = arguments[i];
|
|
668
|
+
}
|
|
669
|
+
listeners.fn.apply(listeners.context, args);
|
|
670
|
+
} else {
|
|
671
|
+
var length = listeners.length, j;
|
|
672
|
+
for (i = 0; i < length; i++) {
|
|
673
|
+
if (listeners[i].once)
|
|
674
|
+
this.removeListener(event, listeners[i].fn, void 0, true);
|
|
675
|
+
switch (len) {
|
|
676
|
+
case 1:
|
|
677
|
+
listeners[i].fn.call(listeners[i].context);
|
|
678
|
+
break;
|
|
679
|
+
case 2:
|
|
680
|
+
listeners[i].fn.call(listeners[i].context, a1);
|
|
681
|
+
break;
|
|
682
|
+
case 3:
|
|
683
|
+
listeners[i].fn.call(listeners[i].context, a1, a2);
|
|
684
|
+
break;
|
|
685
|
+
case 4:
|
|
686
|
+
listeners[i].fn.call(listeners[i].context, a1, a2, a3);
|
|
687
|
+
break;
|
|
688
|
+
default:
|
|
689
|
+
if (!args)
|
|
690
|
+
for (j = 1, args = new Array(len - 1); j < len; j++) {
|
|
691
|
+
args[j - 1] = arguments[j];
|
|
692
|
+
}
|
|
693
|
+
listeners[i].fn.apply(listeners[i].context, args);
|
|
694
|
+
}
|
|
1264
695
|
}
|
|
1265
696
|
}
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
*/
|
|
1280
|
-
EventEmitter.prototype.on = function on(event, fn, context) {
|
|
1281
|
-
return addListener(this, event, fn, context, false);
|
|
1282
|
-
};
|
|
1283
|
-
|
|
1284
|
-
/**
|
|
1285
|
-
* Add a one-time listener for a given event.
|
|
1286
|
-
*
|
|
1287
|
-
* @param {(String|Symbol)} event The event name.
|
|
1288
|
-
* @param {Function} fn The listener function.
|
|
1289
|
-
* @param {*} [context=this] The context to invoke the listener with.
|
|
1290
|
-
* @returns {EventEmitter} `this`.
|
|
1291
|
-
* @public
|
|
1292
|
-
*/
|
|
1293
|
-
EventEmitter.prototype.once = function once(event, fn, context) {
|
|
1294
|
-
return addListener(this, event, fn, context, true);
|
|
1295
|
-
};
|
|
1296
|
-
|
|
1297
|
-
/**
|
|
1298
|
-
* Remove the listeners of a given event.
|
|
1299
|
-
*
|
|
1300
|
-
* @param {(String|Symbol)} event The event name.
|
|
1301
|
-
* @param {Function} fn Only remove the listeners that match this function.
|
|
1302
|
-
* @param {*} context Only remove the listeners that have this context.
|
|
1303
|
-
* @param {Boolean} once Only remove one-time listeners.
|
|
1304
|
-
* @returns {EventEmitter} `this`.
|
|
1305
|
-
* @public
|
|
1306
|
-
*/
|
|
1307
|
-
EventEmitter.prototype.removeListener = function removeListener(event, fn, context, once) {
|
|
1308
|
-
var evt = prefix ? prefix + event : event;
|
|
1309
|
-
|
|
1310
|
-
if (!this._events[evt]) return this;
|
|
1311
|
-
if (!fn) {
|
|
1312
|
-
clearEvent(this, evt);
|
|
1313
|
-
return this;
|
|
1314
|
-
}
|
|
1315
|
-
|
|
1316
|
-
var listeners = this._events[evt];
|
|
1317
|
-
|
|
1318
|
-
if (listeners.fn) {
|
|
1319
|
-
if (
|
|
1320
|
-
listeners.fn === fn &&
|
|
1321
|
-
(!once || listeners.once) &&
|
|
1322
|
-
(!context || listeners.context === context)
|
|
1323
|
-
) {
|
|
697
|
+
return true;
|
|
698
|
+
};
|
|
699
|
+
EventEmitter.prototype.on = function on(event, fn, context) {
|
|
700
|
+
return addListener(this, event, fn, context, false);
|
|
701
|
+
};
|
|
702
|
+
EventEmitter.prototype.once = function once(event, fn, context) {
|
|
703
|
+
return addListener(this, event, fn, context, true);
|
|
704
|
+
};
|
|
705
|
+
EventEmitter.prototype.removeListener = function removeListener(event, fn, context, once) {
|
|
706
|
+
var evt = prefix ? prefix + event : event;
|
|
707
|
+
if (!this._events[evt])
|
|
708
|
+
return this;
|
|
709
|
+
if (!fn) {
|
|
1324
710
|
clearEvent(this, evt);
|
|
711
|
+
return this;
|
|
1325
712
|
}
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
if (
|
|
1329
|
-
|
|
1330
|
-
(once && !listeners[i].once) ||
|
|
1331
|
-
(context && listeners[i].context !== context)
|
|
1332
|
-
) {
|
|
1333
|
-
events.push(listeners[i]);
|
|
713
|
+
var listeners = this._events[evt];
|
|
714
|
+
if (listeners.fn) {
|
|
715
|
+
if (listeners.fn === fn && (!once || listeners.once) && (!context || listeners.context === context)) {
|
|
716
|
+
clearEvent(this, evt);
|
|
1334
717
|
}
|
|
718
|
+
} else {
|
|
719
|
+
for (var i = 0, events = [], length = listeners.length; i < length; i++) {
|
|
720
|
+
if (listeners[i].fn !== fn || once && !listeners[i].once || context && listeners[i].context !== context) {
|
|
721
|
+
events.push(listeners[i]);
|
|
722
|
+
}
|
|
723
|
+
}
|
|
724
|
+
if (events.length)
|
|
725
|
+
this._events[evt] = events.length === 1 ? events[0] : events;
|
|
726
|
+
else
|
|
727
|
+
clearEvent(this, evt);
|
|
728
|
+
}
|
|
729
|
+
return this;
|
|
730
|
+
};
|
|
731
|
+
EventEmitter.prototype.removeAllListeners = function removeAllListeners(event) {
|
|
732
|
+
var evt;
|
|
733
|
+
if (event) {
|
|
734
|
+
evt = prefix ? prefix + event : event;
|
|
735
|
+
if (this._events[evt])
|
|
736
|
+
clearEvent(this, evt);
|
|
737
|
+
} else {
|
|
738
|
+
this._events = new Events();
|
|
739
|
+
this._eventsCount = 0;
|
|
1335
740
|
}
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
741
|
+
return this;
|
|
742
|
+
};
|
|
743
|
+
EventEmitter.prototype.off = EventEmitter.prototype.removeListener;
|
|
744
|
+
EventEmitter.prototype.addListener = EventEmitter.prototype.on;
|
|
745
|
+
EventEmitter.prefixed = prefix;
|
|
746
|
+
EventEmitter.EventEmitter = EventEmitter;
|
|
747
|
+
{
|
|
748
|
+
module.exports = EventEmitter;
|
|
1342
749
|
}
|
|
1343
|
-
|
|
1344
|
-
|
|
750
|
+
})(eventemitter3);
|
|
751
|
+
var __defProp2 = Object.defineProperty;
|
|
752
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
753
|
+
var __decorateClass = (decorators, target, key, kind) => {
|
|
754
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
|
|
755
|
+
for (var i = decorators.length - 1, decorator; i >= 0; i--)
|
|
756
|
+
if (decorator = decorators[i])
|
|
757
|
+
result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
758
|
+
if (kind && result)
|
|
759
|
+
__defProp2(target, key, result);
|
|
760
|
+
return result;
|
|
1345
761
|
};
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
* @param {(String|Symbol)} [event] The event name.
|
|
1351
|
-
* @returns {EventEmitter} `this`.
|
|
1352
|
-
* @public
|
|
1353
|
-
*/
|
|
1354
|
-
EventEmitter.prototype.removeAllListeners = function removeAllListeners(event) {
|
|
1355
|
-
var evt;
|
|
1356
|
-
|
|
1357
|
-
if (event) {
|
|
1358
|
-
evt = prefix ? prefix + event : event;
|
|
1359
|
-
if (this._events[evt]) clearEvent(this, evt);
|
|
1360
|
-
} else {
|
|
1361
|
-
this._events = new Events();
|
|
1362
|
-
this._eventsCount = 0;
|
|
762
|
+
const NAVBAR_HEIGHT = 60;
|
|
763
|
+
const _PositioningService = class {
|
|
764
|
+
static on(eventName, handler) {
|
|
765
|
+
_PositioningService.events.on(eventName, handler);
|
|
1363
766
|
}
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
}
|
|
1367
|
-
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
|
|
1374
|
-
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
|
|
1378
|
-
|
|
1379
|
-
//
|
|
1380
|
-
// Allow `EventEmitter` to be imported as module namespace.
|
|
1381
|
-
//
|
|
1382
|
-
EventEmitter.EventEmitter = EventEmitter;
|
|
1383
|
-
|
|
1384
|
-
//
|
|
1385
|
-
// Expose the module.
|
|
1386
|
-
//
|
|
1387
|
-
{
|
|
1388
|
-
module.exports = EventEmitter;
|
|
1389
|
-
}
|
|
1390
|
-
}(eventemitter3));
|
|
1391
|
-
|
|
1392
|
-
var __assign = (undefined && undefined.__assign) || function () {
|
|
1393
|
-
__assign = Object.assign || function(t) {
|
|
1394
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
1395
|
-
s = arguments[i];
|
|
1396
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
1397
|
-
t[p] = s[p];
|
|
1398
|
-
}
|
|
1399
|
-
return t;
|
|
1400
|
-
};
|
|
1401
|
-
return __assign.apply(this, arguments);
|
|
1402
|
-
};
|
|
1403
|
-
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
1404
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
1405
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
1406
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
1407
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
1408
|
-
};
|
|
1409
|
-
var __metadata = (undefined && undefined.__metadata) || function (k, v) {
|
|
1410
|
-
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
1411
|
-
};
|
|
1412
|
-
var __values = (undefined && undefined.__values) || function(o) {
|
|
1413
|
-
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
|
|
1414
|
-
if (m) return m.call(o);
|
|
1415
|
-
if (o && typeof o.length === "number") return {
|
|
1416
|
-
next: function () {
|
|
1417
|
-
if (o && i >= o.length) o = void 0;
|
|
1418
|
-
return { value: o && o[i++], done: !o };
|
|
767
|
+
static off(eventName, handler) {
|
|
768
|
+
_PositioningService.events.off(eventName, handler);
|
|
769
|
+
}
|
|
770
|
+
static once(eventName, handler) {
|
|
771
|
+
_PositioningService.events.once(eventName, handler);
|
|
772
|
+
}
|
|
773
|
+
static checkCollisions(element, otherElements) {
|
|
774
|
+
const otherElementsList = otherElements || Array.from(_PositioningService.elements.keys());
|
|
775
|
+
const bounds = element.getBoundingClientRect();
|
|
776
|
+
const collisions = [];
|
|
777
|
+
for (const otherElement of otherElementsList) {
|
|
778
|
+
if (otherElement !== element) {
|
|
779
|
+
const otherBounds = otherElement.getBoundingClientRect();
|
|
780
|
+
if (otherBounds.left <= bounds.right && otherBounds.right >= bounds.left && otherBounds.top <= bounds.bottom && otherBounds.bottom >= bounds.top) {
|
|
781
|
+
collisions.push(otherElement);
|
|
1419
782
|
}
|
|
1420
|
-
|
|
1421
|
-
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
|
|
1422
|
-
};
|
|
1423
|
-
var __read = (undefined && undefined.__read) || function (o, n) {
|
|
1424
|
-
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
1425
|
-
if (!m) return o;
|
|
1426
|
-
var i = m.call(o), r, ar = [], e;
|
|
1427
|
-
try {
|
|
1428
|
-
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
783
|
+
}
|
|
1429
784
|
}
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
try {
|
|
1433
|
-
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
1434
|
-
}
|
|
1435
|
-
finally { if (e) throw e.error; }
|
|
785
|
+
if (collisions.length) {
|
|
786
|
+
_PositioningService.onElementIntersection(element, collisions);
|
|
1436
787
|
}
|
|
1437
|
-
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
* shared between all instances and static usages of PositioningService.
|
|
1445
|
-
*/
|
|
1446
|
-
var PositioningService = /** @class */ (function () {
|
|
1447
|
-
function PositioningService() {
|
|
788
|
+
}
|
|
789
|
+
static isPositioned(element) {
|
|
790
|
+
return _PositioningService.elements.has(element);
|
|
791
|
+
}
|
|
792
|
+
static getPositioningOptions(element) {
|
|
793
|
+
if (_PositioningService.elements.has(element)) {
|
|
794
|
+
return _PositioningService.elements.get(element);
|
|
1448
795
|
}
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
|
|
1460
|
-
|
|
1461
|
-
var bounds = element.getBoundingClientRect();
|
|
1462
|
-
var collisions = [];
|
|
1463
|
-
try {
|
|
1464
|
-
for (var otherElementsList_1 = __values(otherElementsList), otherElementsList_1_1 = otherElementsList_1.next(); !otherElementsList_1_1.done; otherElementsList_1_1 = otherElementsList_1.next()) {
|
|
1465
|
-
var otherElement = otherElementsList_1_1.value;
|
|
1466
|
-
if (otherElement !== element) {
|
|
1467
|
-
var otherBounds = otherElement.getBoundingClientRect();
|
|
1468
|
-
if (otherBounds.left <= bounds.right
|
|
1469
|
-
&& otherBounds.right >= bounds.left
|
|
1470
|
-
&& otherBounds.top <= bounds.bottom
|
|
1471
|
-
&& otherBounds.bottom >= bounds.top) {
|
|
1472
|
-
collisions.push(otherElement);
|
|
1473
|
-
}
|
|
1474
|
-
}
|
|
1475
|
-
}
|
|
1476
|
-
}
|
|
1477
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
1478
|
-
finally {
|
|
1479
|
-
try {
|
|
1480
|
-
if (otherElementsList_1_1 && !otherElementsList_1_1.done && (_a = otherElementsList_1.return)) _a.call(otherElementsList_1);
|
|
1481
|
-
}
|
|
1482
|
-
finally { if (e_1) throw e_1.error; }
|
|
1483
|
-
}
|
|
1484
|
-
if (collisions.length) {
|
|
1485
|
-
PositioningService.onElementIntersection(element, collisions);
|
|
1486
|
-
}
|
|
1487
|
-
};
|
|
1488
|
-
/**
|
|
1489
|
-
* Returns `true` if the element is currently being positioned by the service
|
|
1490
|
-
* and `false` otherwise.
|
|
1491
|
-
*/
|
|
1492
|
-
PositioningService.isPositioned = function (element) {
|
|
1493
|
-
return PositioningService.elements.has(element);
|
|
1494
|
-
};
|
|
1495
|
-
/**
|
|
1496
|
-
* Returns the options currently beinng used for positioning the element,
|
|
1497
|
-
* if it is indeed being positioned by the service.
|
|
1498
|
-
*/
|
|
1499
|
-
PositioningService.getPositioningOptions = function (element) {
|
|
1500
|
-
if (PositioningService.elements.has(element)) {
|
|
1501
|
-
return PositioningService.elements.get(element);
|
|
796
|
+
return null;
|
|
797
|
+
}
|
|
798
|
+
static position(element, options = {}) {
|
|
799
|
+
const opts = __spreadValues(__spreadValues({}, DEFAULT_POSITIONING_OPTIONS), options);
|
|
800
|
+
let e = element;
|
|
801
|
+
while (e !== document.body) {
|
|
802
|
+
e = e.parentElement;
|
|
803
|
+
if (e.classList.contains("sps-focused-task")) {
|
|
804
|
+
opts.scrollParent = e;
|
|
805
|
+
if (!_PositioningService.registeredScrollParents.has(e)) {
|
|
806
|
+
_PositioningService.registeredScrollParents.add(e);
|
|
807
|
+
e.addEventListener("scroll", _PositioningService.update);
|
|
1502
808
|
}
|
|
1503
|
-
|
|
809
|
+
break;
|
|
810
|
+
}
|
|
811
|
+
}
|
|
812
|
+
element.style.visibility = "hidden";
|
|
813
|
+
if (_PositioningService.elements.size === 0) {
|
|
814
|
+
window.addEventListener("resize", _PositioningService.update);
|
|
815
|
+
window.addEventListener("scroll", _PositioningService.update);
|
|
816
|
+
}
|
|
817
|
+
if (!opts.relativeTo) {
|
|
818
|
+
throw new Error("You must provide an element for the relativeTo option to position an element.");
|
|
819
|
+
}
|
|
820
|
+
_PositioningService.elements.set(element, opts);
|
|
821
|
+
onNextTick(() => {
|
|
822
|
+
_PositioningService.fixElementPosition(element);
|
|
823
|
+
_PositioningService.viewportObserver.observe(element);
|
|
824
|
+
element.style.visibility = "";
|
|
825
|
+
_PositioningService.checkCollisions(element);
|
|
826
|
+
});
|
|
827
|
+
}
|
|
828
|
+
static release(element) {
|
|
829
|
+
if (_PositioningService.elements.has(element)) {
|
|
830
|
+
_PositioningService.clearStyles(element);
|
|
831
|
+
const options = _PositioningService.elements.get(element);
|
|
832
|
+
if (options.scrollParent) {
|
|
833
|
+
options.scrollParent.removeEventListener("scroll", _PositioningService.update);
|
|
834
|
+
_PositioningService.registeredScrollParents.delete(options.scrollParent);
|
|
835
|
+
}
|
|
836
|
+
_PositioningService.elements.delete(element);
|
|
837
|
+
if (_PositioningService.elements.size === 0) {
|
|
838
|
+
window.removeEventListener("resize", _PositioningService.update);
|
|
839
|
+
window.removeEventListener("scroll", _PositioningService.update);
|
|
840
|
+
}
|
|
841
|
+
_PositioningService.viewportObserver.unobserve(element);
|
|
842
|
+
}
|
|
843
|
+
}
|
|
844
|
+
static releaseAll() {
|
|
845
|
+
for (const element of _PositioningService.elements.keys()) {
|
|
846
|
+
_PositioningService.release(element);
|
|
847
|
+
}
|
|
848
|
+
}
|
|
849
|
+
static refresh(element) {
|
|
850
|
+
if (_PositioningService.elements.has(element)) {
|
|
851
|
+
_PositioningService.clearStyles(element);
|
|
852
|
+
_PositioningService.fixElementPosition(element);
|
|
853
|
+
_PositioningService.checkCollisions(element);
|
|
854
|
+
}
|
|
855
|
+
}
|
|
856
|
+
static refreshAll() {
|
|
857
|
+
for (const element of _PositioningService.elements.keys()) {
|
|
858
|
+
_PositioningService.refresh(element);
|
|
859
|
+
}
|
|
860
|
+
}
|
|
861
|
+
static reposition(element, newOptions) {
|
|
862
|
+
if (_PositioningService.elements.has(element)) {
|
|
863
|
+
const options = _PositioningService.elements.get(element);
|
|
864
|
+
_PositioningService.elements.set(element, Object.assign(options, newOptions));
|
|
865
|
+
_PositioningService.refresh(element);
|
|
866
|
+
}
|
|
867
|
+
}
|
|
868
|
+
static onViewportIntersection(entries) {
|
|
869
|
+
for (const entry of entries) {
|
|
870
|
+
const entryCopy = Object.keys(IntersectionObserverEntry.prototype).reduce((copy, key) => __spreadProps(__spreadValues({}, copy), {
|
|
871
|
+
[key]: entry[key]
|
|
872
|
+
}), {});
|
|
873
|
+
entryCopy.rootBounds = entryCopy.rootBounds || _PositioningService.getRootBounds();
|
|
874
|
+
_PositioningService.events.emit("viewportIntersection", Object.freeze(entryCopy));
|
|
875
|
+
}
|
|
876
|
+
}
|
|
877
|
+
static onElementIntersection(target, intersectingWith) {
|
|
878
|
+
_PositioningService.events.emit("elementIntersection", { target, intersectingWith });
|
|
879
|
+
}
|
|
880
|
+
static getRootBounds() {
|
|
881
|
+
const rootWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
|
|
882
|
+
const rootHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
|
|
883
|
+
return {
|
|
884
|
+
x: 0,
|
|
885
|
+
y: NAVBAR_HEIGHT,
|
|
886
|
+
left: 0,
|
|
887
|
+
top: NAVBAR_HEIGHT,
|
|
888
|
+
right: rootWidth,
|
|
889
|
+
bottom: rootHeight,
|
|
890
|
+
height: rootHeight - NAVBAR_HEIGHT,
|
|
891
|
+
width: rootWidth
|
|
1504
892
|
};
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
893
|
+
}
|
|
894
|
+
static clearStyles(element) {
|
|
895
|
+
Object.assign(element.style, {
|
|
896
|
+
position: "",
|
|
897
|
+
width: "",
|
|
898
|
+
top: "",
|
|
899
|
+
left: "",
|
|
900
|
+
right: "",
|
|
901
|
+
bottom: "",
|
|
902
|
+
visibility: "",
|
|
903
|
+
zIndex: ""
|
|
904
|
+
});
|
|
905
|
+
}
|
|
906
|
+
static fixElementPosition(element, options) {
|
|
907
|
+
if (!this.elements.has(element)) {
|
|
908
|
+
return;
|
|
909
|
+
}
|
|
910
|
+
const opts = options || this.elements.get(element);
|
|
911
|
+
const rootBounds = this.getRootBounds();
|
|
912
|
+
const positionedElementBounds = element.getBoundingClientRect();
|
|
913
|
+
const relativeTargetBounds = opts.relativeTo.getBoundingClientRect();
|
|
914
|
+
const { width } = opts.useRelativeTargetWidth ? relativeTargetBounds : positionedElementBounds;
|
|
915
|
+
Object.assign(element.style, {
|
|
916
|
+
minWidth: `${width}px`,
|
|
917
|
+
position: "fixed",
|
|
918
|
+
zIndex: opts.zIndex || ""
|
|
919
|
+
});
|
|
920
|
+
let top;
|
|
921
|
+
let left;
|
|
922
|
+
const positionRelativeToTarget = opts.position.split(" ");
|
|
923
|
+
const offsetA = opts.offsets[0] || 0;
|
|
924
|
+
const offsetB = opts.offsets[1] || 0;
|
|
925
|
+
top = 0;
|
|
926
|
+
left = 0;
|
|
927
|
+
switch (positionRelativeToTarget[0]) {
|
|
928
|
+
case "top":
|
|
929
|
+
top = relativeTargetBounds.top - positionedElementBounds.height - offsetA;
|
|
930
|
+
break;
|
|
931
|
+
case "left":
|
|
932
|
+
left = relativeTargetBounds.left - width - offsetA;
|
|
933
|
+
break;
|
|
934
|
+
case "right":
|
|
935
|
+
left = relativeTargetBounds.right + offsetA;
|
|
936
|
+
break;
|
|
937
|
+
case "bottom":
|
|
938
|
+
top = relativeTargetBounds.bottom + offsetA;
|
|
939
|
+
break;
|
|
940
|
+
default:
|
|
941
|
+
throw new Error(`${opts.position} is not a valid position`);
|
|
942
|
+
}
|
|
943
|
+
switch (positionRelativeToTarget[1]) {
|
|
944
|
+
case "left":
|
|
945
|
+
left = relativeTargetBounds.left - offsetB;
|
|
946
|
+
break;
|
|
947
|
+
case "top":
|
|
948
|
+
top = relativeTargetBounds.top - offsetB;
|
|
949
|
+
break;
|
|
950
|
+
case "middle":
|
|
951
|
+
if (positionRelativeToTarget[0] === "top" || positionRelativeToTarget[0] === "bottom") {
|
|
952
|
+
left = relativeTargetBounds.left + relativeTargetBounds.width / 2 - width / 2 + offsetB;
|
|
953
|
+
} else if (positionRelativeToTarget[0] === "left" || positionRelativeToTarget[0] === "right") {
|
|
954
|
+
top = relativeTargetBounds.top + relativeTargetBounds.height / 2 - positionedElementBounds.height / 2 + offsetB;
|
|
1529
955
|
}
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
956
|
+
break;
|
|
957
|
+
case "bottom":
|
|
958
|
+
top = relativeTargetBounds.bottom - positionedElementBounds.height + offsetB;
|
|
959
|
+
break;
|
|
960
|
+
case "right":
|
|
961
|
+
left = relativeTargetBounds.right - width + offsetB;
|
|
962
|
+
break;
|
|
963
|
+
default:
|
|
964
|
+
throw new Error(`${opts.position} is not a valid position`);
|
|
965
|
+
}
|
|
966
|
+
const bottom = top + positionedElementBounds.height;
|
|
967
|
+
const right = left + positionedElementBounds.width;
|
|
968
|
+
const topPx = `${Math.round(top)}px`;
|
|
969
|
+
const bottomPx = `${Math.round(rootBounds.bottom - bottom)}px`;
|
|
970
|
+
const leftPx = `${Math.round(left)}px`;
|
|
971
|
+
const rightPx = `${Math.round(rootBounds.right - right)}px`;
|
|
972
|
+
switch (opts.anchor) {
|
|
973
|
+
case PositionAnchor.TOP_LEFT:
|
|
974
|
+
Object.assign(element.style, {
|
|
975
|
+
top: topPx,
|
|
976
|
+
bottom: "auto",
|
|
977
|
+
left: leftPx,
|
|
978
|
+
right: "auto"
|
|
1537
979
|
});
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
PositioningService.release = function (element) {
|
|
1541
|
-
if (PositioningService.elements.has(element)) {
|
|
1542
|
-
PositioningService.clearStyles(element);
|
|
1543
|
-
var options = PositioningService.elements.get(element);
|
|
1544
|
-
if (options.scrollParent) {
|
|
1545
|
-
options.scrollParent.removeEventListener("scroll", PositioningService.update);
|
|
1546
|
-
PositioningService.registeredScrollParents.delete(options.scrollParent);
|
|
1547
|
-
}
|
|
1548
|
-
PositioningService.elements.delete(element);
|
|
1549
|
-
if (PositioningService.elements.size === 0) {
|
|
1550
|
-
window.removeEventListener("resize", PositioningService.update);
|
|
1551
|
-
window.removeEventListener("scroll", PositioningService.update);
|
|
1552
|
-
}
|
|
1553
|
-
PositioningService.viewportObserver.unobserve(element);
|
|
1554
|
-
}
|
|
1555
|
-
};
|
|
1556
|
-
PositioningService.releaseAll = function () {
|
|
1557
|
-
var e_2, _a;
|
|
1558
|
-
try {
|
|
1559
|
-
for (var _b = __values(PositioningService.elements.keys()), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
1560
|
-
var element = _c.value;
|
|
1561
|
-
PositioningService.release(element);
|
|
1562
|
-
}
|
|
1563
|
-
}
|
|
1564
|
-
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
1565
|
-
finally {
|
|
1566
|
-
try {
|
|
1567
|
-
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
1568
|
-
}
|
|
1569
|
-
finally { if (e_2) throw e_2.error; }
|
|
1570
|
-
}
|
|
1571
|
-
};
|
|
1572
|
-
/** PositioningService will refresh the positioning of the given element */
|
|
1573
|
-
PositioningService.refresh = function (element) {
|
|
1574
|
-
if (PositioningService.elements.has(element)) {
|
|
1575
|
-
PositioningService.clearStyles(element);
|
|
1576
|
-
PositioningService.fixElementPosition(element);
|
|
1577
|
-
PositioningService.checkCollisions(element);
|
|
1578
|
-
}
|
|
1579
|
-
};
|
|
1580
|
-
PositioningService.refreshAll = function () {
|
|
1581
|
-
var e_3, _a;
|
|
1582
|
-
try {
|
|
1583
|
-
for (var _b = __values(PositioningService.elements.keys()), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
1584
|
-
var element = _c.value;
|
|
1585
|
-
PositioningService.refresh(element);
|
|
1586
|
-
}
|
|
1587
|
-
}
|
|
1588
|
-
catch (e_3_1) { e_3 = { error: e_3_1 }; }
|
|
1589
|
-
finally {
|
|
1590
|
-
try {
|
|
1591
|
-
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
1592
|
-
}
|
|
1593
|
-
finally { if (e_3) throw e_3.error; }
|
|
1594
|
-
}
|
|
1595
|
-
};
|
|
1596
|
-
/** Update the positioning options of a currently positioned element */
|
|
1597
|
-
PositioningService.reposition = function (element, newOptions) {
|
|
1598
|
-
if (PositioningService.elements.has(element)) {
|
|
1599
|
-
var options = PositioningService.elements.get(element);
|
|
1600
|
-
PositioningService.elements.set(element, Object.assign(options, newOptions));
|
|
1601
|
-
PositioningService.refresh(element);
|
|
1602
|
-
}
|
|
1603
|
-
};
|
|
1604
|
-
PositioningService.onViewportIntersection = function (entries) {
|
|
1605
|
-
var e_4, _a;
|
|
1606
|
-
var _loop_1 = function (entry) {
|
|
1607
|
-
/*
|
|
1608
|
-
* This is how you make a copy of an IntersectionObserverEntry that
|
|
1609
|
-
* you can modify; it's read-only and incompatible with simply using
|
|
1610
|
-
* destructuring or Object.assign. Before sending it out we make the
|
|
1611
|
-
* copy read-only by passing it to Object.freeze
|
|
1612
|
-
*/
|
|
1613
|
-
var entryCopy = Object.keys(IntersectionObserverEntry.prototype).reduce(function (copy, key) {
|
|
1614
|
-
var _a;
|
|
1615
|
-
return (__assign(__assign({}, copy), (_a = {}, _a[key] = entry[key], _a)));
|
|
1616
|
-
}, {});
|
|
1617
|
-
entryCopy.rootBounds = entryCopy.rootBounds || PositioningService.getRootBounds();
|
|
1618
|
-
PositioningService.events.emit("viewportIntersection", Object.freeze(entryCopy));
|
|
1619
|
-
};
|
|
1620
|
-
try {
|
|
1621
|
-
for (var entries_1 = __values(entries), entries_1_1 = entries_1.next(); !entries_1_1.done; entries_1_1 = entries_1.next()) {
|
|
1622
|
-
var entry = entries_1_1.value;
|
|
1623
|
-
_loop_1(entry);
|
|
1624
|
-
}
|
|
1625
|
-
}
|
|
1626
|
-
catch (e_4_1) { e_4 = { error: e_4_1 }; }
|
|
1627
|
-
finally {
|
|
1628
|
-
try {
|
|
1629
|
-
if (entries_1_1 && !entries_1_1.done && (_a = entries_1.return)) _a.call(entries_1);
|
|
1630
|
-
}
|
|
1631
|
-
finally { if (e_4) throw e_4.error; }
|
|
1632
|
-
}
|
|
1633
|
-
};
|
|
1634
|
-
PositioningService.onElementIntersection = function (target, intersectingWith) {
|
|
1635
|
-
PositioningService.events.emit("elementIntersection", { target: target, intersectingWith: intersectingWith });
|
|
1636
|
-
};
|
|
1637
|
-
PositioningService.getRootBounds = function () {
|
|
1638
|
-
var rootWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
|
|
1639
|
-
var rootHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
|
|
1640
|
-
return {
|
|
1641
|
-
x: 0,
|
|
1642
|
-
y: NAVBAR_HEIGHT,
|
|
1643
|
-
left: 0,
|
|
1644
|
-
top: NAVBAR_HEIGHT,
|
|
1645
|
-
right: rootWidth,
|
|
1646
|
-
bottom: rootHeight,
|
|
1647
|
-
height: rootHeight - NAVBAR_HEIGHT,
|
|
1648
|
-
width: rootWidth,
|
|
1649
|
-
};
|
|
1650
|
-
};
|
|
1651
|
-
PositioningService.clearStyles = function (element) {
|
|
980
|
+
break;
|
|
981
|
+
case PositionAnchor.TOP_RIGHT:
|
|
1652
982
|
Object.assign(element.style, {
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
right: "",
|
|
1658
|
-
bottom: "",
|
|
1659
|
-
visibility: "",
|
|
1660
|
-
zIndex: "",
|
|
983
|
+
top: topPx,
|
|
984
|
+
bottom: "auto",
|
|
985
|
+
left: "auto",
|
|
986
|
+
right: rightPx
|
|
1661
987
|
});
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
if (!this.elements.has(element)) {
|
|
1665
|
-
return;
|
|
1666
|
-
}
|
|
1667
|
-
var opts = options || this.elements.get(element);
|
|
1668
|
-
var rootBounds = this.getRootBounds();
|
|
1669
|
-
var positionedElementBounds = element.getBoundingClientRect();
|
|
1670
|
-
var relativeTargetBounds = opts.relativeTo.getBoundingClientRect();
|
|
1671
|
-
var width = (opts.useRelativeTargetWidth
|
|
1672
|
-
? relativeTargetBounds
|
|
1673
|
-
: positionedElementBounds).width;
|
|
988
|
+
break;
|
|
989
|
+
case PositionAnchor.BOTTOM_LEFT:
|
|
1674
990
|
Object.assign(element.style, {
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
991
|
+
top: "auto",
|
|
992
|
+
bottom: bottomPx,
|
|
993
|
+
left: leftPx,
|
|
994
|
+
right: "auto"
|
|
1678
995
|
});
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
right: "auto",
|
|
1747
|
-
});
|
|
1748
|
-
break;
|
|
1749
|
-
case PositionAnchor.TOP_RIGHT:
|
|
1750
|
-
Object.assign(element.style, {
|
|
1751
|
-
top: topPx,
|
|
1752
|
-
bottom: "auto",
|
|
1753
|
-
left: "auto",
|
|
1754
|
-
right: rightPx,
|
|
1755
|
-
});
|
|
1756
|
-
break;
|
|
1757
|
-
case PositionAnchor.BOTTOM_LEFT:
|
|
1758
|
-
Object.assign(element.style, {
|
|
1759
|
-
top: "auto",
|
|
1760
|
-
bottom: bottomPx,
|
|
1761
|
-
left: leftPx,
|
|
1762
|
-
right: "auto",
|
|
1763
|
-
});
|
|
1764
|
-
break;
|
|
1765
|
-
case PositionAnchor.BOTTOM_RIGHT:
|
|
1766
|
-
Object.assign(element.style, {
|
|
1767
|
-
top: "auto",
|
|
1768
|
-
bottom: bottomPx,
|
|
1769
|
-
left: "auto",
|
|
1770
|
-
right: rightPx,
|
|
1771
|
-
});
|
|
1772
|
-
break;
|
|
1773
|
-
// no default
|
|
1774
|
-
}
|
|
1775
|
-
};
|
|
1776
|
-
PositioningService.update = function (event) {
|
|
1777
|
-
var e_5, _a;
|
|
1778
|
-
var elements = PositioningService.elements.entries();
|
|
1779
|
-
var updatedElements = [];
|
|
1780
|
-
try {
|
|
1781
|
-
for (var elements_1 = __values(elements), elements_1_1 = elements_1.next(); !elements_1_1.done; elements_1_1 = elements_1.next()) {
|
|
1782
|
-
var _b = __read(elements_1_1.value, 2), element = _b[0], options = _b[1];
|
|
1783
|
-
if (!event
|
|
1784
|
-
|| event.target === document
|
|
1785
|
-
|| event.target === options.scrollParent
|
|
1786
|
-
|| event.target === window) {
|
|
1787
|
-
PositioningService.fixElementPosition(element, options);
|
|
1788
|
-
PositioningService.checkCollisions(element, updatedElements);
|
|
1789
|
-
updatedElements.push(element);
|
|
1790
|
-
}
|
|
1791
|
-
}
|
|
1792
|
-
}
|
|
1793
|
-
catch (e_5_1) { e_5 = { error: e_5_1 }; }
|
|
1794
|
-
finally {
|
|
1795
|
-
try {
|
|
1796
|
-
if (elements_1_1 && !elements_1_1.done && (_a = elements_1.return)) _a.call(elements_1);
|
|
1797
|
-
}
|
|
1798
|
-
finally { if (e_5) throw e_5.error; }
|
|
1799
|
-
}
|
|
1800
|
-
};
|
|
1801
|
-
/* eslint class-methods-use-this: "off" */
|
|
1802
|
-
PositioningService.prototype.on = function (eventName, handler) {
|
|
1803
|
-
PositioningService.on(eventName, handler);
|
|
1804
|
-
};
|
|
1805
|
-
PositioningService.prototype.off = function (eventName, handler) {
|
|
1806
|
-
PositioningService.off(eventName, handler);
|
|
1807
|
-
};
|
|
1808
|
-
PositioningService.prototype.once = function (eventName, handler) {
|
|
1809
|
-
PositioningService.once(eventName, handler);
|
|
1810
|
-
};
|
|
1811
|
-
PositioningService.prototype.isPositioned = function (element) {
|
|
1812
|
-
return PositioningService.isPositioned(element);
|
|
1813
|
-
};
|
|
1814
|
-
PositioningService.prototype.getPositioningOptions = function (element) {
|
|
1815
|
-
return PositioningService.getPositioningOptions(element);
|
|
1816
|
-
};
|
|
1817
|
-
PositioningService.prototype.position = function (element, options) {
|
|
1818
|
-
if (options === void 0) { options = {}; }
|
|
1819
|
-
PositioningService.position(element, options);
|
|
1820
|
-
};
|
|
1821
|
-
PositioningService.prototype.release = function (element) {
|
|
1822
|
-
PositioningService.release(element);
|
|
1823
|
-
};
|
|
1824
|
-
PositioningService.prototype.releaseAll = function () {
|
|
1825
|
-
PositioningService.releaseAll();
|
|
1826
|
-
};
|
|
1827
|
-
PositioningService.prototype.refresh = function (element) {
|
|
1828
|
-
PositioningService.refresh(element);
|
|
1829
|
-
};
|
|
1830
|
-
PositioningService.prototype.refreshAll = function () {
|
|
1831
|
-
PositioningService.refreshAll();
|
|
1832
|
-
};
|
|
1833
|
-
PositioningService.prototype.reposition = function (element, newOptions) {
|
|
1834
|
-
PositioningService.reposition(element, newOptions);
|
|
1835
|
-
};
|
|
1836
|
-
PositioningService.elements = new Map();
|
|
1837
|
-
PositioningService.registeredScrollParents = new Set();
|
|
1838
|
-
PositioningService.events = new eventemitter3.exports.EventEmitter();
|
|
1839
|
-
PositioningService.viewportObserver = new IntersectionObserver(PositioningService.onViewportIntersection, {
|
|
1840
|
-
rootMargin: "-" + NAVBAR_HEIGHT + "px 0px 0px",
|
|
1841
|
-
threshold: 1,
|
|
1842
|
-
});
|
|
1843
|
-
__decorate([
|
|
1844
|
-
lockedToAnimationFrames,
|
|
1845
|
-
__metadata("design:type", Function),
|
|
1846
|
-
__metadata("design:paramtypes", [Event]),
|
|
1847
|
-
__metadata("design:returntype", void 0)
|
|
1848
|
-
], PositioningService, "update", null);
|
|
1849
|
-
return PositioningService;
|
|
1850
|
-
}());
|
|
1851
|
-
|
|
996
|
+
break;
|
|
997
|
+
case PositionAnchor.BOTTOM_RIGHT:
|
|
998
|
+
Object.assign(element.style, {
|
|
999
|
+
top: "auto",
|
|
1000
|
+
bottom: bottomPx,
|
|
1001
|
+
left: "auto",
|
|
1002
|
+
right: rightPx
|
|
1003
|
+
});
|
|
1004
|
+
break;
|
|
1005
|
+
}
|
|
1006
|
+
}
|
|
1007
|
+
static update(event) {
|
|
1008
|
+
const elements = _PositioningService.elements.entries();
|
|
1009
|
+
const updatedElements = [];
|
|
1010
|
+
for (const [element, options] of elements) {
|
|
1011
|
+
if (!event || event.target === document || event.target === options.scrollParent || event.target === window) {
|
|
1012
|
+
_PositioningService.fixElementPosition(element, options);
|
|
1013
|
+
_PositioningService.checkCollisions(element, updatedElements);
|
|
1014
|
+
updatedElements.push(element);
|
|
1015
|
+
}
|
|
1016
|
+
}
|
|
1017
|
+
}
|
|
1018
|
+
on(eventName, handler) {
|
|
1019
|
+
_PositioningService.on(eventName, handler);
|
|
1020
|
+
}
|
|
1021
|
+
off(eventName, handler) {
|
|
1022
|
+
_PositioningService.off(eventName, handler);
|
|
1023
|
+
}
|
|
1024
|
+
once(eventName, handler) {
|
|
1025
|
+
_PositioningService.once(eventName, handler);
|
|
1026
|
+
}
|
|
1027
|
+
isPositioned(element) {
|
|
1028
|
+
return _PositioningService.isPositioned(element);
|
|
1029
|
+
}
|
|
1030
|
+
getPositioningOptions(element) {
|
|
1031
|
+
return _PositioningService.getPositioningOptions(element);
|
|
1032
|
+
}
|
|
1033
|
+
position(element, options = {}) {
|
|
1034
|
+
_PositioningService.position(element, options);
|
|
1035
|
+
}
|
|
1036
|
+
release(element) {
|
|
1037
|
+
_PositioningService.release(element);
|
|
1038
|
+
}
|
|
1039
|
+
releaseAll() {
|
|
1040
|
+
_PositioningService.releaseAll();
|
|
1041
|
+
}
|
|
1042
|
+
refresh(element) {
|
|
1043
|
+
_PositioningService.refresh(element);
|
|
1044
|
+
}
|
|
1045
|
+
refreshAll() {
|
|
1046
|
+
_PositioningService.refreshAll();
|
|
1047
|
+
}
|
|
1048
|
+
reposition(element, newOptions) {
|
|
1049
|
+
_PositioningService.reposition(element, newOptions);
|
|
1050
|
+
}
|
|
1051
|
+
};
|
|
1052
|
+
let PositioningService = _PositioningService;
|
|
1053
|
+
PositioningService.elements = new Map();
|
|
1054
|
+
PositioningService.registeredScrollParents = new Set();
|
|
1055
|
+
PositioningService.events = new eventemitter3.exports.EventEmitter();
|
|
1056
|
+
PositioningService.viewportObserver = new IntersectionObserver(_PositioningService.onViewportIntersection, {
|
|
1057
|
+
rootMargin: `-${NAVBAR_HEIGHT}px 0px 0px`,
|
|
1058
|
+
threshold: 1
|
|
1059
|
+
});
|
|
1060
|
+
__decorateClass([
|
|
1061
|
+
lockedToAnimationFrames
|
|
1062
|
+
], PositioningService, "update", 1);
|
|
1852
1063
|
export { DEFAULT_POSITIONING_OPTIONS, Position, PositionAnchor, PositioningService };
|