coonlink-luxy 26.1.7 → 26.1.9
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/dist/index.d.ts.map +1 -1
- package/dist/index.js +45 -15
- package/package.json +1 -1
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAYA,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC;IAC7C,OAAO,IAAI,IAAI,CAAC;CACjB;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAYA,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,OAAO,CAAC;IAC7C,OAAO,IAAI,IAAI,CAAC;CACjB;AAiND,wBAAgB,kBAAkB,IAAI,oBAAoB,CAEzD;AAED,wBAAgB,uBAAuB,IAAI,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC,CAEjF"}
|
package/dist/index.js
CHANGED
|
@@ -39,18 +39,44 @@ class Engine {
|
|
|
39
39
|
this.settings = defaults;
|
|
40
40
|
this.wrapper = null;
|
|
41
41
|
this.targets = [];
|
|
42
|
+
this.contentHeight = 0;
|
|
42
43
|
this.wrapperOffset = 0;
|
|
43
44
|
this.scrollTop = 0;
|
|
44
45
|
this.rafId = 0;
|
|
45
46
|
this.pauseForOverlay = false;
|
|
46
47
|
this.overlayObserver = null;
|
|
48
|
+
this.spacerObserver = null;
|
|
47
49
|
this.onWindowResize = () => {
|
|
48
50
|
cancelAnimationFrame(this.rafId);
|
|
49
51
|
this.rafId = 0;
|
|
50
|
-
setTimeout(() => { if (this.wrapper)
|
|
51
|
-
this.
|
|
52
|
+
setTimeout(() => { if (this.wrapper) {
|
|
53
|
+
this.syncBodyHeight();
|
|
54
|
+
this.startLoop();
|
|
55
|
+
} }, 200);
|
|
52
56
|
};
|
|
53
57
|
}
|
|
58
|
+
syncBodyHeight() {
|
|
59
|
+
if (!this.wrapper)
|
|
60
|
+
return;
|
|
61
|
+
const h = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
|
|
62
|
+
if (this.contentHeight === h)
|
|
63
|
+
return;
|
|
64
|
+
this.contentHeight = h;
|
|
65
|
+
document.body.style.height = `${h}px`;
|
|
66
|
+
}
|
|
67
|
+
attachSpacerObserver() {
|
|
68
|
+
this.detachSpacerObserver();
|
|
69
|
+
if (!this.wrapper)
|
|
70
|
+
return;
|
|
71
|
+
this.syncBodyHeight();
|
|
72
|
+
this.spacerObserver = new ResizeObserver(() => this.syncBodyHeight());
|
|
73
|
+
this.spacerObserver.observe(this.wrapper);
|
|
74
|
+
}
|
|
75
|
+
detachSpacerObserver() {
|
|
76
|
+
var _a;
|
|
77
|
+
(_a = this.spacerObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
78
|
+
this.spacerObserver = null;
|
|
79
|
+
}
|
|
54
80
|
syncOverlayPause() {
|
|
55
81
|
if (!this.settings.respectOpenModalOverlay) {
|
|
56
82
|
this.pauseForOverlay = false;
|
|
@@ -85,14 +111,9 @@ class Engine {
|
|
|
85
111
|
this.rafId = 0;
|
|
86
112
|
return;
|
|
87
113
|
}
|
|
88
|
-
// Keep body height in sync with wrapper content height
|
|
89
|
-
const h = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
|
|
90
|
-
if (parseInt(document.body.style.height) !== h) {
|
|
91
|
-
document.body.style.height = `${h}px`;
|
|
92
|
-
}
|
|
93
114
|
if (!this.pauseForOverlay) {
|
|
94
|
-
this.scrollTop = getScrollTop();
|
|
95
|
-
this.wrapperUpdate(
|
|
115
|
+
this.scrollTop = Math.round(getScrollTop());
|
|
116
|
+
this.wrapperUpdate();
|
|
96
117
|
for (let i = 0; i < this.targets.length; i++)
|
|
97
118
|
this.targetsUpdate(this.targets[i]);
|
|
98
119
|
}
|
|
@@ -100,12 +121,20 @@ class Engine {
|
|
|
100
121
|
};
|
|
101
122
|
this.rafId = window.requestAnimationFrame(loop);
|
|
102
123
|
}
|
|
103
|
-
wrapperUpdate(
|
|
124
|
+
wrapperUpdate() {
|
|
104
125
|
if (!this.wrapper)
|
|
105
126
|
return;
|
|
106
|
-
|
|
107
|
-
const
|
|
108
|
-
|
|
127
|
+
const maxOffset = Math.max(0, this.contentHeight - window.innerHeight);
|
|
128
|
+
const target = Math.max(0, Math.min(this.scrollTop, maxOffset));
|
|
129
|
+
const delta = target - this.wrapperOffset;
|
|
130
|
+
if (Math.abs(delta) < 0.1) {
|
|
131
|
+
if (this.wrapperOffset !== target) {
|
|
132
|
+
this.wrapperOffset = target;
|
|
133
|
+
this.wrapper.style.transform = `translate3d(0, ${-Math.round(this.wrapperOffset)}px, 0)`;
|
|
134
|
+
}
|
|
135
|
+
return;
|
|
136
|
+
}
|
|
137
|
+
this.wrapperOffset += delta * this.settings.wrapperSpeed;
|
|
109
138
|
const y = Math.round(-this.wrapperOffset * 100) / 100;
|
|
110
139
|
this.wrapper.style.transform = `translate3d(0, ${y}px, 0)`;
|
|
111
140
|
}
|
|
@@ -137,8 +166,6 @@ class Engine {
|
|
|
137
166
|
return false;
|
|
138
167
|
this.wrapper = el;
|
|
139
168
|
const nodeList = document.querySelectorAll(this.settings.targets);
|
|
140
|
-
const scrollHeight = Math.max(this.wrapper.scrollHeight, this.wrapper.clientHeight);
|
|
141
|
-
document.body.style.height = `${scrollHeight}px`;
|
|
142
169
|
this.wrapper.style.width = '100%';
|
|
143
170
|
this.wrapper.style.position = 'fixed';
|
|
144
171
|
this.targets = [];
|
|
@@ -162,11 +189,13 @@ class Engine {
|
|
|
162
189
|
});
|
|
163
190
|
}
|
|
164
191
|
window.addEventListener('resize', this.onWindowResize);
|
|
192
|
+
this.attachSpacerObserver();
|
|
165
193
|
this.attachOverlayWatcher();
|
|
166
194
|
this.startLoop();
|
|
167
195
|
return true;
|
|
168
196
|
}
|
|
169
197
|
destroy() {
|
|
198
|
+
this.detachSpacerObserver();
|
|
170
199
|
this.detachOverlayWatcher();
|
|
171
200
|
cancelAnimationFrame(this.rafId);
|
|
172
201
|
this.rafId = 0;
|
|
@@ -180,6 +209,7 @@ class Engine {
|
|
|
180
209
|
this.targets[i].elm.removeAttribute('style');
|
|
181
210
|
this.targets = [];
|
|
182
211
|
this.wrapperOffset = 0;
|
|
212
|
+
this.contentHeight = 0;
|
|
183
213
|
}
|
|
184
214
|
}
|
|
185
215
|
export function createCoonlinkLuxy() {
|
package/package.json
CHANGED