frayerjj-frontend 0.4.6 → 0.4.7
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/package.json +1 -1
- package/src/loading.js +26 -16
package/package.json
CHANGED
package/src/loading.js
CHANGED
|
@@ -5,10 +5,14 @@ export const loading = {
|
|
|
5
5
|
|
|
6
6
|
planetarium: {
|
|
7
7
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
8
|
+
// Corona Shadow Offset: top: -80, left: -65 (Difference of -15)
|
|
9
|
+
// Corona Logo Offset: top: -20, left: -52 (Difference of +32)
|
|
10
|
+
// Range 100px
|
|
11
|
+
|
|
12
|
+
shadowOffset: session.getIntVar('loadingShadowOffset', -67), // Initial Position One Step After Corona
|
|
13
|
+
logoOffset: session.getIntVar('loadingLogoOffset', -50), // Initial Position One Step After Corona
|
|
14
|
+
wait: session.getIntVar('loadingWait', 20), // Number of Frames to Wait at Corona
|
|
15
|
+
delay: session.getIntVar('loadingDelay', 10), // Interval Delay
|
|
12
16
|
|
|
13
17
|
build: el => {
|
|
14
18
|
if (loading.interval != null) loading.clear();
|
|
@@ -17,7 +21,7 @@ export const loading = {
|
|
|
17
21
|
'<div class="loader planetarium">' +
|
|
18
22
|
'<div class="loader-circle"></div>' +
|
|
19
23
|
'<div class="loader-shadow" style="margin-top:' + (loading.planetarium.shadowOffset - 15) + 'px;margin-left:' + loading.planetarium.shadowOffset + 'px;">' +
|
|
20
|
-
'<div class="loader-logo" style="margin-top:' + (loading.planetarium.logoOffset +
|
|
24
|
+
'<div class="loader-logo" style="margin-top:' + (loading.planetarium.logoOffset + 32) + 'px;margin-left:' + loading.planetarium.logoOffset + 'px;"></div>' +
|
|
21
25
|
'</div>' +
|
|
22
26
|
'<div class="loader-text">Loading</div>' +
|
|
23
27
|
'</div>');
|
|
@@ -28,34 +32,40 @@ export const loading = {
|
|
|
28
32
|
clearInterval(loading.interval);
|
|
29
33
|
loading.interval = null;
|
|
30
34
|
} else {
|
|
35
|
+
// Slow Down for Corona Approach
|
|
31
36
|
if (loading.shadowOffset == -45) {
|
|
32
37
|
clearInterval(loading.interval);
|
|
33
38
|
loading.planetarium.delay = 20;
|
|
34
39
|
loading.interval = setInterval(loading.animation, loading.planetarium.delay);
|
|
35
40
|
}
|
|
41
|
+
// Speed Up for Corona Departure
|
|
36
42
|
if (loading.shadowOffset == -105) {
|
|
37
43
|
clearInterval(loading.interval);
|
|
38
44
|
loading.planetarium.delay = 10;
|
|
39
45
|
loading.interval = setInterval(loading.animation, loading.planetarium.delay);
|
|
40
46
|
}
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
loading.planetarium.
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
} else {
|
|
47
|
+
// Stop at Corona for Delay
|
|
48
|
+
if (loading.planetarium.shadowOffset == -65 && loading.planetarium.wait > 0)
|
|
49
|
+
loading.planetarium.wait--;
|
|
50
|
+
// Standard Movement Per Frame
|
|
51
|
+
else {
|
|
47
52
|
loading.planetarium.shadowOffset -= 2;
|
|
48
53
|
loading.planetarium.logoOffset += 2;
|
|
49
54
|
loading.planetarium.wait = 20;
|
|
50
55
|
}
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
loading.planetarium.
|
|
56
|
+
// Reset Animation
|
|
57
|
+
if (loading.planetarium.shadowOffset == -165) {
|
|
58
|
+
loading.planetarium.shadowOffset = 35;
|
|
59
|
+
loading.planetarium.logoOffset = -50;
|
|
54
60
|
}
|
|
61
|
+
// Apply Movement
|
|
55
62
|
let shadow = document.querySelector('.loader-shadow');
|
|
56
|
-
if (shadow)
|
|
63
|
+
if (shadow)
|
|
64
|
+
shadow.style.cssText = 'margin-top:' + (loading.planetarium.shadowOffset - 15) + 'px;margin-left:' + loading.planetarium.shadowOffset + 'px;';
|
|
57
65
|
let logo = document.querySelector('.loader-logo');
|
|
58
|
-
if (logo)
|
|
66
|
+
if (logo)
|
|
67
|
+
logo.style.cssText = 'margin-top:' + (loading.planetarium.logoOffset + 21) + 'px;margin-left:' + loading.planetarium.logoOffset + 'px;';
|
|
68
|
+
// Save State
|
|
59
69
|
session.set('loadingShadowOffset', loading.planetarium.shadowOffset);
|
|
60
70
|
session.set('loadingLogoOffset', loading.planetarium.logoOffset);
|
|
61
71
|
session.set('loadingWait', loading.planetarium.wait);
|