pagewave 1.0.4 → 1.0.6
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/README.md +350 -331
- package/dist/KeyFramePreset.css +55 -0
- package/{OverlayPreset.css → dist/OverlayPreset.css} +49 -14
- package/dist/index.d.mts +127 -0
- package/dist/index.d.ts +127 -0
- package/dist/index.js +579 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +543 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +28 -8
- package/KeyFramePreset.css +0 -20
- package/sw.js +0 -40
- package/transition.js +0 -518
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,543 @@
|
|
|
1
|
+
// src/classes/KeyFrameBase.ts
|
|
2
|
+
var KeyFrameBase = class {
|
|
3
|
+
duration;
|
|
4
|
+
timing;
|
|
5
|
+
constructor(duration, timing = "linear") {
|
|
6
|
+
this.duration = duration;
|
|
7
|
+
this.timing = timing;
|
|
8
|
+
}
|
|
9
|
+
handle(direction, mainElement) {
|
|
10
|
+
}
|
|
11
|
+
hidePage(options) {
|
|
12
|
+
for (const ele of document.getElementsByClassName("pagewave-overlay-div")) {
|
|
13
|
+
ele.remove();
|
|
14
|
+
}
|
|
15
|
+
const mainContent = document.getElementById(options.mainContentIdName);
|
|
16
|
+
if (mainContent) {
|
|
17
|
+
mainContent.hidden = true;
|
|
18
|
+
} else {
|
|
19
|
+
this.waitForElementLoad(
|
|
20
|
+
`#${options.mainContentIdName}`,
|
|
21
|
+
(element) => {
|
|
22
|
+
element.hidden = true;
|
|
23
|
+
}
|
|
24
|
+
);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
revealPage(options) {
|
|
28
|
+
const mainContent = document.getElementById(options.mainContentIdName);
|
|
29
|
+
if (mainContent) {
|
|
30
|
+
mainContent.hidden = false;
|
|
31
|
+
} else {
|
|
32
|
+
this.waitForElementLoad(
|
|
33
|
+
`#${options.mainContentIdName}`,
|
|
34
|
+
(element) => {
|
|
35
|
+
element.hidden = false;
|
|
36
|
+
}
|
|
37
|
+
);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
waitForElementLoad(selector, functionToExecute) {
|
|
41
|
+
const existingElement = document.querySelector(selector);
|
|
42
|
+
if (existingElement != null) {
|
|
43
|
+
functionToExecute(existingElement);
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
const observer = new MutationObserver((mutations) => {
|
|
47
|
+
mutations.forEach((mutation) => {
|
|
48
|
+
mutation.addedNodes.forEach((node) => {
|
|
49
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
50
|
+
const element = node;
|
|
51
|
+
if (element.matches(selector)) {
|
|
52
|
+
observer.disconnect();
|
|
53
|
+
functionToExecute(element);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
});
|
|
58
|
+
});
|
|
59
|
+
observer.observe(document.body, { childList: true, subtree: true });
|
|
60
|
+
}
|
|
61
|
+
ApplyAnimation(element, animationName, duration, timing, direction) {
|
|
62
|
+
element.style.animation = `${animationName} ${duration}ms ${timing} both ${direction}`;
|
|
63
|
+
setTimeout(() => {
|
|
64
|
+
element.style.animation = "";
|
|
65
|
+
if (direction == "normal") {
|
|
66
|
+
element.hidden = true;
|
|
67
|
+
}
|
|
68
|
+
}, duration);
|
|
69
|
+
if (direction == "reverse") {
|
|
70
|
+
let handleAnimation2 = function(event) {
|
|
71
|
+
if (event.animationName == animationName && currentAnimation != null) {
|
|
72
|
+
const animationKeyframes = currentAnimation.effect;
|
|
73
|
+
const kfValues = Object.values(animationKeyframes.getKeyframes()[0]);
|
|
74
|
+
const kfKeys = Object.keys(animationKeyframes.getKeyframes()[0]);
|
|
75
|
+
const animationProperties = kfValues.slice(3, kfValues.length - 1);
|
|
76
|
+
const animationKeys = kfKeys.slice(3, kfValues.length - 1);
|
|
77
|
+
for (let i = 0; i < animationKeys.length; i++) {
|
|
78
|
+
const animationKey = animationKeys[i].toString();
|
|
79
|
+
const animationProperty = animationProperties[i].toString();
|
|
80
|
+
element.style.setProperty(animationKey, animationProperty);
|
|
81
|
+
}
|
|
82
|
+
element.style.animation = "";
|
|
83
|
+
element.removeEventListener("animationend", handleAnimation2);
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
var handleAnimation = handleAnimation2;
|
|
87
|
+
let currentAnimation = null;
|
|
88
|
+
element.getAnimations().forEach((animation) => {
|
|
89
|
+
if (currentAnimation == null && animation.id == animationName) {
|
|
90
|
+
currentAnimation = animation;
|
|
91
|
+
}
|
|
92
|
+
});
|
|
93
|
+
element.addEventListener("animationend", handleAnimation2);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
// src/classes/KeyFrameCustom.ts
|
|
99
|
+
var KeyFrameCustom = class extends KeyFrameBase {
|
|
100
|
+
animationName;
|
|
101
|
+
constructor(animationName, duration, timing = "linear") {
|
|
102
|
+
super(duration, timing);
|
|
103
|
+
this.animationName = animationName;
|
|
104
|
+
}
|
|
105
|
+
handle(direction, mainElement) {
|
|
106
|
+
mainElement.hidden = false;
|
|
107
|
+
this.ApplyAnimation(mainElement, this.animationName, this.duration, this.timing, direction);
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
// src/classes/KeyFramePreset.ts
|
|
112
|
+
var KeyFramePreset = class extends KeyFrameCustom {
|
|
113
|
+
constructor(kfType, duration, timing = "linear") {
|
|
114
|
+
const animationMap = {
|
|
115
|
+
fade: "fade",
|
|
116
|
+
fadeaway: "fadeaway",
|
|
117
|
+
fadetoleft: "fadetoleft",
|
|
118
|
+
fadetoright: "fadetoright"
|
|
119
|
+
};
|
|
120
|
+
super(animationMap[kfType], duration, timing);
|
|
121
|
+
}
|
|
122
|
+
handle(direction, mainElement) {
|
|
123
|
+
super.handle(direction, mainElement);
|
|
124
|
+
}
|
|
125
|
+
};
|
|
126
|
+
|
|
127
|
+
// src/classes/MultiElementAnimation.ts
|
|
128
|
+
var MultiElementAnimation = class extends KeyFrameBase {
|
|
129
|
+
animateableObjects;
|
|
130
|
+
mainElementAnimation;
|
|
131
|
+
constructor(animateableObjects, duration, timing = "linear", mainElementAnimation = "") {
|
|
132
|
+
super(duration, timing);
|
|
133
|
+
this.animateableObjects = animateableObjects;
|
|
134
|
+
this.mainElementAnimation = mainElementAnimation;
|
|
135
|
+
}
|
|
136
|
+
handle(direction, mainElement) {
|
|
137
|
+
let timing = this.timing;
|
|
138
|
+
for (const [selector, animationName] of Object.entries(this.animateableObjects)) {
|
|
139
|
+
mainElement.querySelectorAll(selector).forEach(
|
|
140
|
+
(element) => {
|
|
141
|
+
this.ApplyAnimation(element, animationName, this.duration, timing, direction);
|
|
142
|
+
}
|
|
143
|
+
);
|
|
144
|
+
}
|
|
145
|
+
if (this.mainElementAnimation != "") {
|
|
146
|
+
this.ApplyAnimation(mainElement, this.mainElementAnimation, this.duration, timing, direction);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
// src/classes/OverlayBase.ts
|
|
152
|
+
var OverlayBase = class {
|
|
153
|
+
duration;
|
|
154
|
+
timing;
|
|
155
|
+
color;
|
|
156
|
+
constructor(duration, color, timing = "linear") {
|
|
157
|
+
this.duration = duration;
|
|
158
|
+
this.color = color;
|
|
159
|
+
this.timing = timing;
|
|
160
|
+
}
|
|
161
|
+
handle(direction, mainElement) {
|
|
162
|
+
}
|
|
163
|
+
hidePage(options) {
|
|
164
|
+
const mainContent = document.getElementById(options.mainContentIdName);
|
|
165
|
+
if (document.getElementById(options.pageBlockerId)) {
|
|
166
|
+
const pageBlockerElement = document.getElementById(options.pageBlockerId);
|
|
167
|
+
pageBlockerElement.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`;
|
|
168
|
+
return;
|
|
169
|
+
}
|
|
170
|
+
for (const ele of document.getElementsByClassName("pagewave-overlay-div")) {
|
|
171
|
+
ele.remove();
|
|
172
|
+
}
|
|
173
|
+
const pageBlocker = document.createElement("div");
|
|
174
|
+
pageBlocker.id = options.pageBlockerId;
|
|
175
|
+
pageBlocker.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`;
|
|
176
|
+
mainContent.append(pageBlocker);
|
|
177
|
+
}
|
|
178
|
+
revealPage(options) {
|
|
179
|
+
const pageBlocker = document.getElementById(options.pageBlockerId);
|
|
180
|
+
const mainElement = document.getElementById(options.mainContentIdName);
|
|
181
|
+
if (mainElement) {
|
|
182
|
+
mainElement.hidden = false;
|
|
183
|
+
}
|
|
184
|
+
if (pageBlocker) {
|
|
185
|
+
pageBlocker.style.cssText = "";
|
|
186
|
+
} else {
|
|
187
|
+
this.waitForElementLoad(
|
|
188
|
+
`#${options.pageBlockerId}`,
|
|
189
|
+
(element) => {
|
|
190
|
+
element.style.cssText = "";
|
|
191
|
+
}
|
|
192
|
+
);
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
waitForElementLoad(selector, functionToExecute) {
|
|
196
|
+
const existingElement = document.querySelector(selector);
|
|
197
|
+
if (existingElement != null) {
|
|
198
|
+
functionToExecute(existingElement);
|
|
199
|
+
return;
|
|
200
|
+
}
|
|
201
|
+
const observer = new MutationObserver((mutations) => {
|
|
202
|
+
mutations.forEach((mutation) => {
|
|
203
|
+
mutation.addedNodes.forEach((node) => {
|
|
204
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
205
|
+
const element = node;
|
|
206
|
+
if (element.matches(selector)) {
|
|
207
|
+
observer.disconnect();
|
|
208
|
+
functionToExecute(element);
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
});
|
|
212
|
+
});
|
|
213
|
+
});
|
|
214
|
+
observer.observe(document.body, { childList: true, subtree: true });
|
|
215
|
+
}
|
|
216
|
+
};
|
|
217
|
+
|
|
218
|
+
// src/classes/OverlayCustom.ts
|
|
219
|
+
var OverlayCustom = class extends OverlayBase {
|
|
220
|
+
divAnimationObject;
|
|
221
|
+
mainElementAnimation;
|
|
222
|
+
constructor(divAnimationObject, duration, color, timing = "linear", mainElementAnimation = null) {
|
|
223
|
+
super(duration, color, timing);
|
|
224
|
+
this.divAnimationObject = divAnimationObject;
|
|
225
|
+
this.mainElementAnimation = mainElementAnimation;
|
|
226
|
+
}
|
|
227
|
+
handle(direction, mainElement) {
|
|
228
|
+
for (const ele of document.getElementsByClassName("pagewave-overlay-div")) {
|
|
229
|
+
ele.remove();
|
|
230
|
+
}
|
|
231
|
+
const root = document.documentElement;
|
|
232
|
+
root.style.setProperty("--div-color", this.color);
|
|
233
|
+
for (const [className, animationName] of Object.entries(this.divAnimationObject)) {
|
|
234
|
+
const divElement = document.createElement("div");
|
|
235
|
+
divElement.className = className + " pagewave-overlay-div";
|
|
236
|
+
divElement.style.animation = `${animationName} ${this.duration}ms ${this.timing} both ${direction}`;
|
|
237
|
+
divElement.style.backgroundColor = this.color;
|
|
238
|
+
divElement.style.position = "absolute";
|
|
239
|
+
mainElement.appendChild(divElement);
|
|
240
|
+
setTimeout(() => {
|
|
241
|
+
if (divElement.parentElement == mainElement) {
|
|
242
|
+
mainElement.removeChild(divElement);
|
|
243
|
+
}
|
|
244
|
+
}, this.duration);
|
|
245
|
+
}
|
|
246
|
+
if (this.mainElementAnimation !== null) {
|
|
247
|
+
this.mainElementAnimation.handle(direction, mainElement);
|
|
248
|
+
}
|
|
249
|
+
}
|
|
250
|
+
};
|
|
251
|
+
|
|
252
|
+
// src/classes/OverlayPreset.ts
|
|
253
|
+
var OverlayPreset = class extends OverlayCustom {
|
|
254
|
+
constructor(oType, duration, color, timing = "linear") {
|
|
255
|
+
const overlayMap = {
|
|
256
|
+
slide: { firstOverlayElement: "slide" },
|
|
257
|
+
inverseSlide: { firstOverlayElement: "inverseSlide" },
|
|
258
|
+
curtain: { firstOverlayElement: "rightcurtain", secondOverlayElement: "leftcurtain" },
|
|
259
|
+
rise: { firstOverlayElement: "rise" },
|
|
260
|
+
fall: { firstOverlayElement: "fall" },
|
|
261
|
+
bubble: { firstOverlayElement: "bubble" },
|
|
262
|
+
wipe: { firstOverlayElement: "wipe" }
|
|
263
|
+
};
|
|
264
|
+
super(overlayMap[oType], duration, color, timing);
|
|
265
|
+
}
|
|
266
|
+
handle(direction, mainElement) {
|
|
267
|
+
super.handle(direction, mainElement);
|
|
268
|
+
}
|
|
269
|
+
};
|
|
270
|
+
|
|
271
|
+
// src/classes/OverlayStyled.ts
|
|
272
|
+
var OverlayStyled = class extends OverlayBase {
|
|
273
|
+
divAnimationObject;
|
|
274
|
+
mainElementAnimation;
|
|
275
|
+
blockerDesign;
|
|
276
|
+
constructor(divAnimationObject, duration, color, timing = "linear", mainElementAnimation = null, blockerDesign = {}) {
|
|
277
|
+
super(duration, color, timing);
|
|
278
|
+
this.divAnimationObject = divAnimationObject;
|
|
279
|
+
this.mainElementAnimation = mainElementAnimation;
|
|
280
|
+
this.blockerDesign = blockerDesign;
|
|
281
|
+
}
|
|
282
|
+
hidePage(options) {
|
|
283
|
+
const mainContent = document.getElementById(options.mainContentIdName);
|
|
284
|
+
if (document.getElementById(options.pageBlockerId)) {
|
|
285
|
+
const pageBlockerElement = document.getElementById(options.pageBlockerId);
|
|
286
|
+
pageBlockerElement.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`;
|
|
287
|
+
for (const [styleKey, styleValue] of Object.entries(this.blockerDesign)) {
|
|
288
|
+
pageBlockerElement.style[styleKey] = styleValue;
|
|
289
|
+
}
|
|
290
|
+
return;
|
|
291
|
+
}
|
|
292
|
+
for (const ele of document.getElementsByClassName("pagewave-overlay-div")) {
|
|
293
|
+
ele.remove();
|
|
294
|
+
}
|
|
295
|
+
const pageBlocker = document.createElement("div");
|
|
296
|
+
pageBlocker.id = options.pageBlockerId;
|
|
297
|
+
pageBlocker.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`;
|
|
298
|
+
for (const [styleKey, styleValue] of Object.entries(this.blockerDesign)) {
|
|
299
|
+
pageBlocker.style[styleKey] = styleValue;
|
|
300
|
+
}
|
|
301
|
+
mainContent.append(pageBlocker);
|
|
302
|
+
}
|
|
303
|
+
handle(direction, mainElement) {
|
|
304
|
+
for (const ele of document.getElementsByClassName("pagewave-overlay-div")) {
|
|
305
|
+
ele.remove();
|
|
306
|
+
}
|
|
307
|
+
const root = document.documentElement;
|
|
308
|
+
root.style.setProperty("--div-color", this.color);
|
|
309
|
+
for (const [className, divProperties] of Object.entries(this.divAnimationObject)) {
|
|
310
|
+
const divElement = document.createElement("div");
|
|
311
|
+
divElement.className = className + " pagewave-overlay-div";
|
|
312
|
+
divElement.style.animation = `${divProperties.animationName} ${this.duration}ms ${this.timing} both ${direction}`;
|
|
313
|
+
divElement.style.backgroundColor = this.color;
|
|
314
|
+
divElement.style.position = "absolute";
|
|
315
|
+
for (const [styleKey, styleValue] of Object.entries(divProperties.cssDesign)) {
|
|
316
|
+
divElement.style[styleKey] = styleValue;
|
|
317
|
+
}
|
|
318
|
+
mainElement.appendChild(divElement);
|
|
319
|
+
setTimeout(() => {
|
|
320
|
+
}, this.duration);
|
|
321
|
+
}
|
|
322
|
+
if (this.mainElementAnimation !== null) {
|
|
323
|
+
this.mainElementAnimation.handle(direction, mainElement);
|
|
324
|
+
}
|
|
325
|
+
}
|
|
326
|
+
};
|
|
327
|
+
|
|
328
|
+
// src/classes/PageWave.ts
|
|
329
|
+
var PageWave = class {
|
|
330
|
+
defaultOptions;
|
|
331
|
+
finalOptions;
|
|
332
|
+
routeTransitions;
|
|
333
|
+
constructor(transitions, options = {}) {
|
|
334
|
+
this.defaultOptions = {
|
|
335
|
+
mainContentIdName: "main-content",
|
|
336
|
+
pageAnimationDelay: 100,
|
|
337
|
+
runAnimationOnPageReload: false,
|
|
338
|
+
runAnimationOnCrossSite: false,
|
|
339
|
+
pageRevealDelay: 0,
|
|
340
|
+
leavePageOnLink: true,
|
|
341
|
+
pageBlockerId: "pageBlocker",
|
|
342
|
+
classToIgnoreLink: "ignore-click",
|
|
343
|
+
animateIgnoredLinks: false,
|
|
344
|
+
animateSelfLink: true,
|
|
345
|
+
loadEvent: "DOMContentLoaded",
|
|
346
|
+
preferIgnore: false
|
|
347
|
+
};
|
|
348
|
+
this.finalOptions = { ...this.defaultOptions, ...options };
|
|
349
|
+
this.routeTransitions = transitions;
|
|
350
|
+
}
|
|
351
|
+
CallHook(hookName, details = {}) {
|
|
352
|
+
const event = new CustomEvent(hookName, {
|
|
353
|
+
detail: details
|
|
354
|
+
});
|
|
355
|
+
window.dispatchEvent(event);
|
|
356
|
+
}
|
|
357
|
+
isNavigationFromSameSite() {
|
|
358
|
+
const referrer = document.referrer;
|
|
359
|
+
if (referrer == "") {
|
|
360
|
+
return false;
|
|
361
|
+
}
|
|
362
|
+
const currentHost = window.location.hostname;
|
|
363
|
+
const referrerHost = new URL(referrer).hostname;
|
|
364
|
+
return referrerHost === currentHost;
|
|
365
|
+
}
|
|
366
|
+
isInternalLink(link) {
|
|
367
|
+
try {
|
|
368
|
+
const url = new URL(link, window.location.href);
|
|
369
|
+
return url.hostname === window.location.hostname;
|
|
370
|
+
} catch (e) {
|
|
371
|
+
return false;
|
|
372
|
+
}
|
|
373
|
+
}
|
|
374
|
+
HandleClickAnimation(e, defaultTransitionStyle, leaveFunction = (link) => {
|
|
375
|
+
window.location.href = link;
|
|
376
|
+
}, externalLeaveFunction = (link) => {
|
|
377
|
+
window.location.href = link;
|
|
378
|
+
}) {
|
|
379
|
+
if (!e.target || !(e.target instanceof HTMLAnchorElement)) {
|
|
380
|
+
return;
|
|
381
|
+
}
|
|
382
|
+
e.preventDefault();
|
|
383
|
+
e.stopPropagation();
|
|
384
|
+
if (e.target.tagName.toLowerCase() == "a") {
|
|
385
|
+
const correctLeaveFunction = this.isInternalLink(e.target.href) ? leaveFunction : externalLeaveFunction;
|
|
386
|
+
const matchedRoute = Array.from(e.target.classList).find((cls) => cls in this.routeTransitions);
|
|
387
|
+
const shouldIgnore = this.finalOptions.preferIgnore && !matchedRoute || e.target.classList.contains(this.finalOptions.classToIgnoreLink);
|
|
388
|
+
if (!shouldIgnore && (e.target.href != window.location.href || this.finalOptions.animateSelfLink)) {
|
|
389
|
+
e.preventDefault();
|
|
390
|
+
let duration = defaultTransitionStyle.duration;
|
|
391
|
+
this.CallHook("animateSSP", { style: defaultTransitionStyle, clickEvent: e });
|
|
392
|
+
if (matchedRoute && matchedRoute in this.routeTransitions) {
|
|
393
|
+
this.SaveAndTransition(matchedRoute, this.routeTransitions[matchedRoute]);
|
|
394
|
+
duration = this.routeTransitions[matchedRoute].duration;
|
|
395
|
+
} else {
|
|
396
|
+
this.SaveAndTransition("animation", defaultTransitionStyle);
|
|
397
|
+
duration = defaultTransitionStyle.duration;
|
|
398
|
+
}
|
|
399
|
+
setTimeout(
|
|
400
|
+
() => {
|
|
401
|
+
this.CallHook("animateESP", { style: defaultTransitionStyle, clickEvent: e });
|
|
402
|
+
if (this.finalOptions.leavePageOnLink) {
|
|
403
|
+
correctLeaveFunction(e.target.href);
|
|
404
|
+
}
|
|
405
|
+
},
|
|
406
|
+
duration
|
|
407
|
+
);
|
|
408
|
+
} else if (e.target.classList.contains(this.finalOptions.classToIgnoreLink) || e.target.href == window.location.href && !this.finalOptions.animateSelfLink) {
|
|
409
|
+
sessionStorage.setItem("animationType", "ignore");
|
|
410
|
+
if (this.finalOptions.leavePageOnLink) {
|
|
411
|
+
correctLeaveFunction(e.target.href);
|
|
412
|
+
}
|
|
413
|
+
}
|
|
414
|
+
}
|
|
415
|
+
}
|
|
416
|
+
ListenForChange(defaultTransitionStyle, leaveFunction = (link) => {
|
|
417
|
+
window.location.href = link;
|
|
418
|
+
}) {
|
|
419
|
+
this.EndPoint(defaultTransitionStyle);
|
|
420
|
+
this.SendPoint(defaultTransitionStyle, leaveFunction);
|
|
421
|
+
}
|
|
422
|
+
SendPoint(defaultTransitionStyle, leaveFunction = (link) => {
|
|
423
|
+
window.location.href = link;
|
|
424
|
+
}, externalLeaveFunction = (link) => {
|
|
425
|
+
window.location.href = link;
|
|
426
|
+
}) {
|
|
427
|
+
const mainElement = document.getElementById(this.finalOptions.mainContentIdName);
|
|
428
|
+
const linkElements = mainElement.getElementsByTagName("a");
|
|
429
|
+
for (let i = 0; i < linkElements.length; i++) {
|
|
430
|
+
const linkElement = linkElements[i];
|
|
431
|
+
linkElement.onclick = null;
|
|
432
|
+
linkElement.addEventListener("click", (e) => {
|
|
433
|
+
this.HandleClickAnimation(e, defaultTransitionStyle, leaveFunction, externalLeaveFunction);
|
|
434
|
+
});
|
|
435
|
+
}
|
|
436
|
+
}
|
|
437
|
+
getStorageRouteTransition(defaultTransitionStyle) {
|
|
438
|
+
const storageKey = sessionStorage.getItem("animationType");
|
|
439
|
+
if (storageKey != null && storageKey != "animation" && storageKey in this.routeTransitions) {
|
|
440
|
+
return this.routeTransitions[storageKey];
|
|
441
|
+
}
|
|
442
|
+
return defaultTransitionStyle;
|
|
443
|
+
}
|
|
444
|
+
EndPoint(defaultTransitionStyle) {
|
|
445
|
+
defaultTransitionStyle = this.getStorageRouteTransition(defaultTransitionStyle);
|
|
446
|
+
defaultTransitionStyle.hidePage(this.finalOptions);
|
|
447
|
+
const mainElement = document.getElementById(this.finalOptions.mainContentIdName);
|
|
448
|
+
mainElement.addEventListener(this.finalOptions.loadEvent, (e) => {
|
|
449
|
+
e.stopPropagation();
|
|
450
|
+
this.CallHook("animateSEP", { style: defaultTransitionStyle });
|
|
451
|
+
const doTransitionOnIgnoredLink = this.finalOptions.animateIgnoredLinks || sessionStorage.getItem("animationType") != "ignore";
|
|
452
|
+
const doAnimateOnReload = window.performance.getEntriesByType("navigation")[0]?.entryType != "reload" || this.finalOptions.runAnimationOnPageReload;
|
|
453
|
+
const doAnimateOnSameSite = this.isNavigationFromSameSite() || this.finalOptions.runAnimationOnCrossSite;
|
|
454
|
+
if (doAnimateOnReload && doAnimateOnSameSite && doTransitionOnIgnoredLink) {
|
|
455
|
+
setTimeout(
|
|
456
|
+
() => {
|
|
457
|
+
this.AnimatePageTransition(defaultTransitionStyle, "reverse");
|
|
458
|
+
setTimeout(
|
|
459
|
+
() => {
|
|
460
|
+
this.CallHook("animateEEP", { style: defaultTransitionStyle });
|
|
461
|
+
defaultTransitionStyle.revealPage(this.finalOptions);
|
|
462
|
+
},
|
|
463
|
+
this.finalOptions.pageRevealDelay
|
|
464
|
+
);
|
|
465
|
+
},
|
|
466
|
+
this.finalOptions.pageAnimationDelay
|
|
467
|
+
);
|
|
468
|
+
} else {
|
|
469
|
+
this.CallHook("animateEPNA", { style: defaultTransitionStyle });
|
|
470
|
+
defaultTransitionStyle.revealPage(this.finalOptions);
|
|
471
|
+
}
|
|
472
|
+
}, { once: true });
|
|
473
|
+
}
|
|
474
|
+
CallEndPoint() {
|
|
475
|
+
const dispatchEvent = new Event(this.finalOptions.loadEvent);
|
|
476
|
+
document.getElementById(this.finalOptions.mainContentIdName).dispatchEvent(dispatchEvent);
|
|
477
|
+
}
|
|
478
|
+
SaveAndTransition(animationName, aStyle, direction = "normal") {
|
|
479
|
+
this.AnimatePageTransition(aStyle, "normal");
|
|
480
|
+
sessionStorage.setItem("animationType", animationName);
|
|
481
|
+
}
|
|
482
|
+
AnimatePageTransition(aStyle, direction = "normal") {
|
|
483
|
+
const mainElement = document.getElementById(this.finalOptions.mainContentIdName);
|
|
484
|
+
if (direction == "normal") {
|
|
485
|
+
this.CallHook("animateSF", { style: aStyle, ele: mainElement });
|
|
486
|
+
} else if (direction == "reverse") {
|
|
487
|
+
this.CallHook("animateSR", { style: aStyle, ele: mainElement });
|
|
488
|
+
}
|
|
489
|
+
aStyle.handle(direction, mainElement);
|
|
490
|
+
setTimeout(
|
|
491
|
+
() => {
|
|
492
|
+
if (direction == "normal") {
|
|
493
|
+
this.CallHook("animateEF", { style: aStyle, ele: mainElement });
|
|
494
|
+
} else if (direction == "reverse") {
|
|
495
|
+
this.CallHook("animateER", { style: aStyle, ele: mainElement });
|
|
496
|
+
}
|
|
497
|
+
},
|
|
498
|
+
aStyle.duration
|
|
499
|
+
);
|
|
500
|
+
}
|
|
501
|
+
};
|
|
502
|
+
|
|
503
|
+
// src/classes/StyleTransition.ts
|
|
504
|
+
var StyleTransition = class extends KeyFrameBase {
|
|
505
|
+
styleString;
|
|
506
|
+
startValue;
|
|
507
|
+
endValue;
|
|
508
|
+
constructor(styleString, duration, startValue, endValue, timing = "linear") {
|
|
509
|
+
super(duration, timing);
|
|
510
|
+
this.styleString = styleString;
|
|
511
|
+
this.startValue = startValue;
|
|
512
|
+
this.endValue = endValue;
|
|
513
|
+
}
|
|
514
|
+
handle(direction, mainElement) {
|
|
515
|
+
if (direction == "normal") {
|
|
516
|
+
mainElement.style[this.styleString] = this.startValue;
|
|
517
|
+
mainElement.style.transition = this.styleString.toString() + " " + this.duration.toString() + "ms " + this.timing;
|
|
518
|
+
mainElement.style[this.styleString] = this.endValue;
|
|
519
|
+
} else if (direction == "reverse") {
|
|
520
|
+
mainElement.style[this.styleString] = this.endValue;
|
|
521
|
+
mainElement.style.transition = this.styleString.toString() + " " + this.duration.toString() + "ms " + this.timing;
|
|
522
|
+
setTimeout(
|
|
523
|
+
() => {
|
|
524
|
+
mainElement.style[this.styleString] = this.startValue;
|
|
525
|
+
},
|
|
526
|
+
40
|
|
527
|
+
);
|
|
528
|
+
}
|
|
529
|
+
}
|
|
530
|
+
};
|
|
531
|
+
export {
|
|
532
|
+
KeyFrameBase,
|
|
533
|
+
KeyFrameCustom,
|
|
534
|
+
KeyFramePreset,
|
|
535
|
+
MultiElementAnimation,
|
|
536
|
+
OverlayBase,
|
|
537
|
+
OverlayCustom,
|
|
538
|
+
OverlayPreset,
|
|
539
|
+
OverlayStyled,
|
|
540
|
+
PageWave,
|
|
541
|
+
StyleTransition
|
|
542
|
+
};
|
|
543
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/classes/KeyFrameBase.ts","../src/classes/KeyFrameCustom.ts","../src/classes/KeyFramePreset.ts","../src/classes/MultiElementAnimation.ts","../src/classes/OverlayBase.ts","../src/classes/OverlayCustom.ts","../src/classes/OverlayPreset.ts","../src/classes/OverlayStyled.ts","../src/classes/PageWave.ts","../src/classes/StyleTransition.ts"],"sourcesContent":["import type { DirectionType } from '../types/DirectionType';\r\nimport type { OptionsType } from '../types/OptionsType';\r\nimport type { TimingType } from '../types/TimingType';\r\nimport type { TransitionStyle } from '../types/TransitionStyleInterface';\r\n\r\nexport class KeyFrameBase implements TransitionStyle {\r\n duration: number;\r\n timing: TimingType;\r\n constructor(duration: number, timing: TimingType = \"linear\") {\r\n this.duration = duration;\r\n this.timing = timing;\r\n }\r\n\r\n public handle(direction: DirectionType, mainElement: HTMLElement): void {}\r\n\r\n public hidePage(options: OptionsType): void {\r\n for(const ele of document.getElementsByClassName(\"pagewave-overlay-div\")){\r\n ele.remove();\r\n }\r\n const mainContent = document.getElementById(options.mainContentIdName);\r\n if(mainContent){\r\n mainContent.hidden = true;\r\n }else{\r\n this.waitForElementLoad(\r\n `#${options.mainContentIdName}`, (element: HTMLElement) => {\r\n element.hidden = true;\r\n }\r\n )\r\n }\r\n }\r\n\r\n public revealPage(options: OptionsType): void {\r\n const mainContent = document.getElementById(options.mainContentIdName);\r\n if(mainContent){\r\n mainContent.hidden = false;\r\n }else{\r\n this.waitForElementLoad(\r\n `#${options.mainContentIdName}`, (element: HTMLElement) => {\r\n element.hidden = false;\r\n }\r\n )\r\n }\r\n }\r\n\r\n protected waitForElementLoad(selector: string, functionToExecute: (element: HTMLElement) => void) {\r\n const existingElement = document.querySelector(selector);\r\n if (existingElement != null) {\r\n functionToExecute(existingElement as HTMLElement);\r\n return;\r\n }\r\n \r\n const observer = new MutationObserver((mutations) => {\r\n mutations.forEach((mutation) => {\r\n mutation.addedNodes.forEach((node) => {\r\n if (node.nodeType === Node.ELEMENT_NODE) {\r\n const element = node as HTMLElement;\r\n if (element.matches(selector)) {\r\n observer.disconnect();\r\n functionToExecute(element);\r\n }\r\n }\r\n });\r\n });\r\n });\r\n \r\n observer.observe(document.body, { childList: true, subtree: true });\r\n }\r\n\r\n protected ApplyAnimation(element: HTMLElement, animationName: string, duration: number, timing: TimingType, direction: DirectionType) {\r\n element.style.animation = `${animationName} ${duration}ms ${timing} both ${direction}`;\r\n setTimeout(() => {\r\n element.style.animation = \"\";\r\n if (direction == \"normal\") {\r\n element.hidden = true;\r\n }\r\n }, duration);\r\n if (direction == \"reverse\") {\r\n let currentAnimation: Animation | null = null;\r\n element.getAnimations().forEach((animation) => {\r\n if (currentAnimation == null && animation.id == animationName) {\r\n currentAnimation = animation;\r\n }\r\n });\r\n\r\n function handleAnimation(event: AnimationEvent) {\r\n if (event.animationName == animationName && currentAnimation != null) {\r\n const animationKeyframes = currentAnimation.effect! as KeyframeEffect;\r\n const kfValues = Object.values(animationKeyframes.getKeyframes()[0]!);\r\n const kfKeys = Object.keys(animationKeyframes.getKeyframes()[0]!);\r\n const animationProperties = kfValues.slice(3, kfValues.length - 1);\r\n const animationKeys = kfKeys.slice(3, kfValues.length - 1);\r\n for (let i = 0; i < animationKeys.length; i++) {\r\n const animationKey: string = animationKeys[i]!.toString();\r\n const animationProperty: string = animationProperties[i]!.toString();\r\n element.style.setProperty(animationKey, animationProperty);\r\n }\r\n element.style.animation = \"\";\r\n element.removeEventListener(\"animationend\", handleAnimation);\r\n }\r\n }\r\n element.addEventListener(\"animationend\", handleAnimation);\r\n }\r\n }\r\n}","import type { DirectionType } from '../types/DirectionType';\r\nimport type { OptionsType } from '../types/OptionsType';\r\nimport type { TimingType } from '../types/TimingType';\r\nimport type { TransitionStyle } from '../types/TransitionStyleInterface';\r\nimport { KeyFrameBase } from './KeyFrameBase';\r\n\r\nexport class KeyFrameCustom extends KeyFrameBase {\r\n animationName: string;\r\n constructor(animationName: string, duration: number, timing: TimingType = \"linear\") {\r\n super(duration, timing);\r\n this.animationName = animationName;\r\n }\r\n\r\n public handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n mainElement.hidden = false;\r\n this.ApplyAnimation(mainElement, this.animationName, this.duration, this.timing, direction);\r\n }\r\n}","import type { DirectionType } from \"../types/DirectionType\";\r\nimport type { KeyFrameType } from \"../types/KeyFrameType\";\r\nimport type { TimingType } from \"../types/TimingType\";\r\nimport { KeyFrameCustom } from \"./KeyFrameCustom\";\r\n\r\nexport class KeyFramePreset extends KeyFrameCustom {\r\n constructor(kfType: KeyFrameType, duration: number, timing: TimingType = \"linear\") {\r\n const animationMap: Record<KeyFrameType, string> = {\r\n fade: \"fade\",\r\n fadeaway: \"fadeaway\",\r\n fadetoleft: \"fadetoleft\",\r\n fadetoright: \"fadetoright\",\r\n };\r\n super(animationMap[kfType], duration, timing);\r\n }\r\n handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n super.handle(direction, mainElement);\r\n }\r\n}","import type { DirectionType } from \"../types/DirectionType\";\r\nimport type { TimingType } from \"../types/TimingType\";\r\nimport { KeyFrameBase } from \"./KeyFrameBase\";\r\n\r\nexport class MultiElementAnimation extends KeyFrameBase {\r\n animateableObjects: { [selector: string]: string };\r\n mainElementAnimation: string;\r\n\r\n constructor(animateableObjects: { [selector: string]: string }, duration: number, timing: TimingType = \"linear\", mainElementAnimation = \"\") {\r\n super(duration, timing);\r\n this.animateableObjects = animateableObjects;\r\n this.mainElementAnimation = mainElementAnimation;\r\n }\r\n public handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n let timing = this.timing;\r\n for (const [selector, animationName] of Object.entries(this.animateableObjects)) {\r\n mainElement.querySelectorAll(selector).forEach(\r\n (element) => {\r\n this.ApplyAnimation(element as HTMLElement, animationName, this.duration, timing, direction);\r\n }\r\n );\r\n }\r\n if (this.mainElementAnimation != \"\") {\r\n this.ApplyAnimation(mainElement, this.mainElementAnimation, this.duration, timing, direction);\r\n }\r\n }\r\n}","import type { DirectionType } from '../types/DirectionType';\r\nimport type { OptionsType } from '../types/OptionsType';\r\nimport type { TimingType } from '../types/TimingType';\r\nimport type { TransitionStyle } from '../types/TransitionStyleInterface';\r\n\r\nexport class OverlayBase implements TransitionStyle {\r\n duration: number;\r\n timing: TimingType;\r\n color: string;\r\n\r\n constructor(duration: number, color: string, timing: TimingType = \"linear\") {\r\n this.duration = duration;\r\n this.color = color;\r\n this.timing = timing;\r\n }\r\n\r\n public handle(direction: DirectionType, mainElement: HTMLElement): void {}\r\n\r\n public hidePage(options: OptionsType): void {\r\n const mainContent = document.getElementById(options.mainContentIdName)!;\r\n if (document.getElementById(options.pageBlockerId)) {\r\n const pageBlockerElement = document.getElementById(options.pageBlockerId)!;\r\n pageBlockerElement.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`\r\n return;\r\n }\r\n for(const ele of document.getElementsByClassName(\"pagewave-overlay-div\")){\r\n ele.remove();\r\n }\r\n const pageBlocker = document.createElement('div');\r\n pageBlocker.id = options.pageBlockerId;\r\n pageBlocker.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`\r\n mainContent.append(pageBlocker);\r\n }\r\n\r\n public revealPage(options: OptionsType): void {\r\n const pageBlocker = document.getElementById(options.pageBlockerId);\r\n const mainElement = document.getElementById(options.mainContentIdName);\r\n if(mainElement){\r\n mainElement.hidden = false;\r\n }\r\n if (pageBlocker) {\r\n pageBlocker.style.cssText = '';\r\n //pageBlocker.remove();\r\n }else{\r\n this.waitForElementLoad(\r\n `#${options.pageBlockerId}`, (element: HTMLElement) => {\r\n element.style.cssText = '';\r\n //element.remove();\r\n }\r\n )\r\n }\r\n }\r\n\r\n private waitForElementLoad(selector: string, functionToExecute: (element: HTMLElement) => void) {\r\n const existingElement = document.querySelector(selector);\r\n if (existingElement != null) {\r\n functionToExecute(existingElement as HTMLElement);\r\n return;\r\n }\r\n \r\n const observer = new MutationObserver((mutations) => {\r\n mutations.forEach((mutation) => {\r\n mutation.addedNodes.forEach((node) => {\r\n if (node.nodeType === Node.ELEMENT_NODE) {\r\n const element = node as HTMLElement;\r\n if (element.matches(selector)) {\r\n observer.disconnect();\r\n functionToExecute(element);\r\n }\r\n }\r\n });\r\n });\r\n });\r\n \r\n observer.observe(document.body, { childList: true, subtree: true });\r\n }\r\n}","import type { DirectionType } from '../types/DirectionType';\r\nimport type { TimingType } from '../types/TimingType';\r\nimport type { KeyFrameBase } from './KeyFrameBase';\r\nimport { OverlayBase } from './OverlayBase';\r\n\r\n// ...existing code...\r\nexport class OverlayCustom extends OverlayBase {\r\n divAnimationObject: Record<string, string>;\r\n mainElementAnimation: KeyFrameBase | null;\r\n\r\n constructor(divAnimationObject: Record<string, string>, duration: number, color: string, timing: TimingType = \"linear\", mainElementAnimation: KeyFrameBase | null = null) {\r\n super(duration, color, timing);\r\n this.divAnimationObject = divAnimationObject;\r\n this.mainElementAnimation = mainElementAnimation;\r\n }\r\n\r\n handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n for(const ele of document.getElementsByClassName(\"pagewave-overlay-div\")){\r\n ele.remove();\r\n }\r\n const root = document.documentElement;\r\n root.style.setProperty(\"--div-color\", this.color);\r\n for (const [className, animationName] of Object.entries(this.divAnimationObject)) {\r\n const divElement = document.createElement(\"div\");\r\n divElement.className = className + \" pagewave-overlay-div\";\r\n divElement.style.animation = `${animationName} ${this.duration}ms ${this.timing} both ${direction}`;\r\n divElement.style.backgroundColor = this.color;\r\n \r\n divElement.style.position = \"absolute\";\r\n mainElement.appendChild(divElement);\r\n setTimeout(() => {\r\n if(divElement.parentElement == mainElement){\r\n mainElement.removeChild(divElement);\r\n }\r\n }, this.duration);\r\n }\r\n\r\n if (this.mainElementAnimation !== null) {\r\n this.mainElementAnimation.handle(direction, mainElement);\r\n }\r\n }\r\n}","import type { DirectionType } from \"../types/DirectionType\";\r\nimport type { OverlayType } from \"../types/OverlayType\";\r\nimport type { TimingType } from \"../types/TimingType\";\r\nimport { OverlayCustom } from \"./OverlayCustom\";\r\n\r\nexport class OverlayPreset extends OverlayCustom{\r\n constructor(oType: OverlayType, duration: number, color: string, timing: TimingType = \"linear\") {\r\n const overlayMap: Record<OverlayType, Record<string, string>> = {\r\n slide: { firstOverlayElement: \"slide\" },\r\n inverseSlide: { firstOverlayElement: \"inverseSlide\" },\r\n curtain: { firstOverlayElement: \"rightcurtain\", secondOverlayElement: \"leftcurtain\" },\r\n rise: { firstOverlayElement: \"rise\" },\r\n fall: { firstOverlayElement: \"fall\" },\r\n bubble: { firstOverlayElement: \"bubble\" },\r\n wipe: { firstOverlayElement: \"wipe\" }\r\n\r\n };\r\n super(overlayMap[oType], duration, color, timing);\r\n }\r\n handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n super.handle(direction, mainElement);\r\n }\r\n}","import type { DirectionType } from '../types/DirectionType';\r\nimport type { OptionsType } from '../types/OptionsType';\r\nimport type { TimingType } from '../types/TimingType';\r\nimport type { KeyFrameBase } from './KeyFrameBase';\r\nimport { OverlayBase } from './OverlayBase';\r\n\r\nexport type OverlayStyledDiv = {\r\n animationName: string;\r\n cssDesign: Partial<Record<keyof CSSStyleDeclaration, string>>;\r\n}\r\n\r\nexport class OverlayStyled extends OverlayBase {\r\n divAnimationObject: Record<string, OverlayStyledDiv>;\r\n mainElementAnimation: KeyFrameBase | null;\r\n blockerDesign: Partial<Record<keyof CSSStyleDeclaration, string>>;\r\n\r\n constructor(divAnimationObject: Record<string, OverlayStyledDiv>, duration: number, color: string, timing: TimingType = \"linear\", mainElementAnimation: KeyFrameBase | null = null, blockerDesign: Partial<Record<keyof CSSStyleDeclaration, string>> = {}) {\r\n super(duration, color, timing);\r\n this.divAnimationObject = divAnimationObject;\r\n this.mainElementAnimation = mainElementAnimation;\r\n this.blockerDesign = blockerDesign;\r\n }\r\n\r\n public hidePage(options: OptionsType): void {\r\n const mainContent = document.getElementById(options.mainContentIdName)!;\r\n if (document.getElementById(options.pageBlockerId)) {\r\n const pageBlockerElement = document.getElementById(options.pageBlockerId)!;\r\n pageBlockerElement.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`\r\n for (const [styleKey, styleValue] of Object.entries(this.blockerDesign)) {\r\n (pageBlockerElement.style as any)[styleKey] = styleValue;\r\n }\r\n return;\r\n }\r\n for(const ele of document.getElementsByClassName(\"pagewave-overlay-div\")){\r\n ele.remove();\r\n }\r\n const pageBlocker = document.createElement('div');\r\n pageBlocker.id = options.pageBlockerId;\r\n pageBlocker.style.cssText = `position: absolute; width: 100%; height: 100%; z-index: 100; top: 0; background-color: ${this.color}`\r\n for (const [styleKey, styleValue] of Object.entries(this.blockerDesign)) {\r\n (pageBlocker.style as any)[styleKey] = styleValue;\r\n }\r\n mainContent.append(pageBlocker);\r\n }\r\n\r\n handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n for(const ele of document.getElementsByClassName(\"pagewave-overlay-div\")){\r\n ele.remove();\r\n }\r\n const root = document.documentElement;\r\n root.style.setProperty(\"--div-color\", this.color);\r\n\r\n for (const [className, divProperties] of Object.entries(this.divAnimationObject)) {\r\n const divElement = document.createElement(\"div\");\r\n divElement.className = className + \" pagewave-overlay-div\";\r\n divElement.style.animation = `${divProperties.animationName} ${this.duration}ms ${this.timing} both ${direction}`;\r\n divElement.style.backgroundColor = this.color;\r\n divElement.style.position = \"absolute\";\r\n\r\n for (const [styleKey, styleValue] of Object.entries(divProperties.cssDesign)) {\r\n (divElement.style as any)[styleKey] = styleValue;\r\n }\r\n\r\n mainElement.appendChild(divElement);\r\n\r\n //TODO: Remove code possibly in all areas\r\n setTimeout(() => {\r\n //mainElement.removeChild(divElement);\r\n }, this.duration);\r\n }\r\n\r\n if (this.mainElementAnimation !== null) {\r\n this.mainElementAnimation.handle(direction, mainElement);\r\n }\r\n }\r\n}","import type { DirectionType } from \"../types/DirectionType.ts\";\r\nimport type { OptionsType } from \"../types/OptionsType.ts\";\r\nimport type { TransitionStyle } from \"../types/TransitionStyleInterface.ts\";\r\n\r\nexport class PageWave{\r\n public defaultOptions: OptionsType;\r\n public finalOptions: OptionsType;\r\n public routeTransitions: Record<string, TransitionStyle>\r\n constructor(transitions: Record<string, TransitionStyle>, options: Partial<OptionsType> = {}){\r\n this.defaultOptions = {\r\n mainContentIdName: \"main-content\",\r\n pageAnimationDelay: 100,\r\n runAnimationOnPageReload: false,\r\n runAnimationOnCrossSite: false,\r\n pageRevealDelay: 0,\r\n leavePageOnLink: true,\r\n pageBlockerId: \"pageBlocker\",\r\n classToIgnoreLink: \"ignore-click\",\r\n animateIgnoredLinks: false,\r\n animateSelfLink: true,\r\n loadEvent: \"DOMContentLoaded\",\r\n preferIgnore: false,\r\n }\r\n this.finalOptions = { ...this.defaultOptions, ...options };\r\n this.routeTransitions = transitions;\r\n }\r\n\r\n\r\n private CallHook(hookName: string, details: Record<string, unknown> = {}) {\r\n const event = new CustomEvent(hookName, {\r\n detail: details\r\n });\r\n window.dispatchEvent(event);\r\n }\r\n\r\n private isNavigationFromSameSite() {\r\n const referrer = document.referrer;\r\n if (referrer == \"\") {\r\n return false;\r\n }\r\n const currentHost = window.location.hostname;\r\n const referrerHost = new URL(referrer).hostname;\r\n\r\n return referrerHost === currentHost;\r\n }\r\n\r\n private isInternalLink(link: string): boolean {\r\n try {\r\n const url = new URL(link, window.location.href); // handles relative URLs\r\n return url.hostname === window.location.hostname;\r\n } catch (e) {\r\n // invalid URLs are considered external\r\n return false;\r\n }\r\n }\r\n\r\n private HandleClickAnimation(e: MouseEvent, defaultTransitionStyle: TransitionStyle, leaveFunction = (link: string) => {window.location.href = link;}, externalLeaveFunction = (link: string) => {window.location.href = link;}) {\r\n if(!e.target || !(e.target instanceof HTMLAnchorElement)) {\r\n return;\r\n }\r\n\r\n e.preventDefault();\r\n e.stopPropagation();\r\n \r\n if (e.target.tagName.toLowerCase() == \"a\") {\r\n const correctLeaveFunction = this.isInternalLink(e.target.href) ? leaveFunction : externalLeaveFunction;\r\n const matchedRoute = Array.from(e.target.classList).find(cls => cls in this.routeTransitions);\r\n const shouldIgnore = (this.finalOptions.preferIgnore && !matchedRoute) || e.target.classList.contains(this.finalOptions.classToIgnoreLink)\r\n if(!shouldIgnore && (e.target.href != window.location.href || this.finalOptions.animateSelfLink)){\r\n e.preventDefault();\r\n let duration = defaultTransitionStyle.duration;\r\n this.CallHook(\"animateSSP\", { style: defaultTransitionStyle, clickEvent: e });\r\n if (matchedRoute && matchedRoute in this.routeTransitions) {\r\n this.SaveAndTransition(matchedRoute, this.routeTransitions[matchedRoute]!);\r\n duration = this.routeTransitions[matchedRoute]!.duration;\r\n } else {\r\n this.SaveAndTransition(\"animation\", defaultTransitionStyle);\r\n duration = defaultTransitionStyle.duration;\r\n }\r\n setTimeout(\r\n () => {\r\n this.CallHook(\"animateESP\", { style: defaultTransitionStyle, clickEvent: e });\r\n if (this.finalOptions.leavePageOnLink) {\r\n correctLeaveFunction((e.target as HTMLAnchorElement).href);\r\n }\r\n }, duration\r\n );\r\n }\r\n else if (e.target.classList.contains(this.finalOptions.classToIgnoreLink) || (e.target.href == window.location.href && !this.finalOptions.animateSelfLink)) {\r\n sessionStorage.setItem(\"animationType\", \"ignore\");\r\n if (this.finalOptions.leavePageOnLink) {\r\n correctLeaveFunction((e.target as HTMLAnchorElement).href);\r\n }\r\n }\r\n } \r\n\r\n }\r\n\r\n public ListenForChange(defaultTransitionStyle: TransitionStyle, leaveFunction: (link: string) => void = (link) => {window.location.href = link;}) {\r\n this.EndPoint(defaultTransitionStyle);\r\n this.SendPoint(defaultTransitionStyle, leaveFunction);\r\n }\r\n\r\n public SendPoint(defaultTransitionStyle: TransitionStyle, leaveFunction = (link: string) => {window.location.href = link;}, externalLeaveFunction = (link: string) => {window.location.href = link;}) {\r\n const mainElement = document.getElementById(this.finalOptions.mainContentIdName)!;\r\n\r\n const linkElements = mainElement.getElementsByTagName(\"a\");\r\n for (let i = 0; i < linkElements.length; i++) {\r\n const linkElement = linkElements[i]!;\r\n linkElement.onclick = null;\r\n linkElement.addEventListener(\"click\", (e) => {this.HandleClickAnimation(e, defaultTransitionStyle, leaveFunction, externalLeaveFunction)});\r\n }\r\n }\r\n\r\n public getStorageRouteTransition(defaultTransitionStyle: TransitionStyle): TransitionStyle {\r\n const storageKey = sessionStorage.getItem(\"animationType\")\r\n if (storageKey != null && storageKey != \"animation\" && storageKey in this.routeTransitions) {\r\n return this.routeTransitions[storageKey]!;\r\n }\r\n return defaultTransitionStyle; \r\n }\r\n\r\n public EndPoint(defaultTransitionStyle: TransitionStyle) {\r\n defaultTransitionStyle = this.getStorageRouteTransition(defaultTransitionStyle);\r\n defaultTransitionStyle.hidePage(this.finalOptions);\r\n const mainElement = document.getElementById(this.finalOptions.mainContentIdName)!;\r\n mainElement.addEventListener(this.finalOptions.loadEvent, (e) => {\r\n e.stopPropagation();\r\n this.CallHook(\"animateSEP\", { style: defaultTransitionStyle });\r\n const doTransitionOnIgnoredLink = (this.finalOptions.animateIgnoredLinks || sessionStorage.getItem(\"animationType\") != \"ignore\");\r\n const doAnimateOnReload = (window.performance.getEntriesByType(\"navigation\")[0]?.entryType != \"reload\" || this.finalOptions.runAnimationOnPageReload);\r\n const doAnimateOnSameSite = this.isNavigationFromSameSite() || this.finalOptions.runAnimationOnCrossSite;\r\n if (doAnimateOnReload && doAnimateOnSameSite && doTransitionOnIgnoredLink) {\r\n setTimeout(\r\n () => {\r\n this.AnimatePageTransition(defaultTransitionStyle, \"reverse\");\r\n setTimeout(\r\n () => {\r\n this.CallHook(\"animateEEP\", { style: defaultTransitionStyle });\r\n defaultTransitionStyle.revealPage(this.finalOptions);\r\n }, this.finalOptions.pageRevealDelay\r\n );\r\n }, this.finalOptions.pageAnimationDelay\r\n );\r\n } else {\r\n this.CallHook(\"animateEPNA\", { style: defaultTransitionStyle })\r\n defaultTransitionStyle.revealPage(this.finalOptions);\r\n }\r\n }, { once: true });\r\n }\r\n\r\n public CallEndPoint(){\r\n const dispatchEvent = new Event(this.finalOptions.loadEvent);\r\n document.getElementById(this.finalOptions.mainContentIdName)!.dispatchEvent(dispatchEvent);\r\n }\r\n\r\n public SaveAndTransition(animationName: string, aStyle: TransitionStyle, direction: DirectionType = \"normal\") {\r\n this.AnimatePageTransition(aStyle, \"normal\");\r\n sessionStorage.setItem(\"animationType\", animationName);\r\n }\r\n\r\n public AnimatePageTransition(aStyle: TransitionStyle, direction: DirectionType = \"normal\") {\r\n const mainElement = document.getElementById(this.finalOptions.mainContentIdName)!;\r\n\r\n if (direction == \"normal\") {\r\n this.CallHook(\"animateSF\", { style: aStyle, ele: mainElement, });\r\n } else if (direction == \"reverse\") {\r\n this.CallHook(\"animateSR\", { style: aStyle, ele: mainElement, });\r\n }\r\n\r\n aStyle.handle(direction, mainElement);\r\n\r\n setTimeout(\r\n () => {\r\n if (direction == \"normal\") {\r\n this.CallHook(\"animateEF\", { style: aStyle, ele: mainElement, });\r\n } else if (direction == \"reverse\") {\r\n this.CallHook(\"animateER\", { style: aStyle, ele: mainElement, });\r\n }\r\n }, aStyle.duration\r\n );\r\n\r\n }\r\n}","import type { DirectionType } from \"../types/DirectionType\";\r\nimport type { TimingType } from \"../types/TimingType\";\r\nimport type { TransitionStyle } from \"../types/TransitionStyleInterface\";\r\nimport { KeyFrameBase } from \"./KeyFrameBase\";\r\n\r\nexport class StyleTransition extends KeyFrameBase {\r\n styleString: keyof CSSStyleDeclaration;\r\n startValue: string;\r\n endValue: string;\r\n constructor(styleString: keyof CSSStyleDeclaration, duration: number, startValue: string, endValue: string, timing: TimingType = \"linear\") {\r\n super(duration, timing);\r\n this.styleString = styleString;\r\n this.startValue = startValue\r\n this.endValue = endValue;\r\n }\r\n\r\n handle(direction: DirectionType, mainElement: HTMLElement): void {\r\n if (direction == \"normal\") {\r\n (mainElement.style as any)[this.styleString] = this.startValue;\r\n mainElement.style.transition = this.styleString.toString() + \" \" + this.duration.toString() + \"ms \" + this.timing;\r\n (mainElement.style as any)[this.styleString] = this.endValue;\r\n } else if (direction == \"reverse\") {\r\n (mainElement.style as any)[this.styleString] = this.endValue;\r\n mainElement.style.transition = this.styleString.toString() + \" \" + this.duration.toString() + \"ms \" + this.timing;\r\n setTimeout(\r\n () => {\r\n (mainElement.style as any)[this.styleString] = this.startValue;\r\n }, 40\r\n );\r\n\r\n }\r\n }\r\n}"],"mappings":"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","names":["handleAnimation"]}
|