@linear_non/stellar-libs 1.0.22 → 1.0.24
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 +2 -2
- package/src/Smooth/index.js +2 -2
- package/src/SplitOnScroll/index.js +15 -33
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@linear_non/stellar-libs",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.24",
|
|
4
4
|
"description": "Reusable JavaScript libraries for Non-Linear Studio projects.",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"author": "Non-Linear Studio",
|
|
26
26
|
"license": "MIT",
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@linear_non/stellar-kit": "^2.1.
|
|
28
|
+
"@linear_non/stellar-kit": "^2.1.3"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@linear_non/prettier-config": "^1.0.6",
|
package/src/Smooth/index.js
CHANGED
|
@@ -13,6 +13,7 @@ export default class Smooth {
|
|
|
13
13
|
this.sections = null
|
|
14
14
|
this.scrollbar = null
|
|
15
15
|
this.dpr = Math.max(1, Math.round(window.devicePixelRatio || 1))
|
|
16
|
+
this.init()
|
|
16
17
|
}
|
|
17
18
|
|
|
18
19
|
getSections() {
|
|
@@ -99,7 +100,6 @@ export default class Smooth {
|
|
|
99
100
|
const { vh } = kitStore.sizes
|
|
100
101
|
const rect = bounds(el)
|
|
101
102
|
const height = rect.height
|
|
102
|
-
|
|
103
103
|
const centering = vh / 2 - height / 2
|
|
104
104
|
const offset = rect.top < vh ? 0 : (rect.top - centering) * speed - (rect.top - centering)
|
|
105
105
|
|
|
@@ -136,7 +136,7 @@ export default class Smooth {
|
|
|
136
136
|
kitStore.flags.isResizing = true
|
|
137
137
|
this.scroll.setScrollBounds()
|
|
138
138
|
this.elems = elems || qsa("[data-smooth]")
|
|
139
|
-
this.scrollbar
|
|
139
|
+
this.scrollbar?.update()
|
|
140
140
|
this.getSections()
|
|
141
141
|
this.transformSections()
|
|
142
142
|
kitStore.flags.isResizing = false
|
|
@@ -6,7 +6,7 @@ export default class SplitonScroll {
|
|
|
6
6
|
constructor({
|
|
7
7
|
el,
|
|
8
8
|
splitText,
|
|
9
|
-
|
|
9
|
+
isReady,
|
|
10
10
|
reverse,
|
|
11
11
|
start = "top bottom", // "top top+=100%",
|
|
12
12
|
end = "bottom top", // "bottom bottom-=100%",
|
|
@@ -28,40 +28,22 @@ export default class SplitonScroll {
|
|
|
28
28
|
if (!this.targets.length) return
|
|
29
29
|
|
|
30
30
|
this.splits = null
|
|
31
|
-
|
|
32
|
-
this.animateCallback = animate || (() => {})
|
|
31
|
+
this.isReadyCallback = isReady || (() => {})
|
|
33
32
|
this.reverseCallback = reverse || (() => {})
|
|
34
33
|
this.start = start
|
|
35
34
|
this.end = end
|
|
36
35
|
this.scrub = scrub
|
|
37
36
|
this.once = once
|
|
38
37
|
|
|
39
|
-
<<<<<<< HEAD
|
|
40
|
-
// this.initScrollTrigger()
|
|
41
|
-
=======
|
|
42
|
-
if (!this.splitText[0]) return
|
|
43
|
-
|
|
44
|
-
>>>>>>> origin
|
|
45
38
|
this.addObserver()
|
|
46
39
|
}
|
|
47
40
|
|
|
48
|
-
initScrollTrigger() {
|
|
49
|
-
this.myScrollTrigger = ScrollTrigger.create({
|
|
50
|
-
trigger: this.element,
|
|
51
|
-
start: this.start,
|
|
52
|
-
end: this.end,
|
|
53
|
-
scrub: this.scrub,
|
|
54
|
-
once: this.once,
|
|
55
|
-
onEnter: () => this.handleEnter(),
|
|
56
|
-
onLeave: () => this.handleLeave(),
|
|
57
|
-
})
|
|
58
|
-
}
|
|
59
|
-
|
|
60
41
|
addObserver() {
|
|
61
42
|
this.observer = new Observer({
|
|
62
43
|
trigger: this.element,
|
|
63
44
|
start: this.start,
|
|
64
45
|
end: this.end,
|
|
46
|
+
once: this.once,
|
|
65
47
|
scrub: this.scrub,
|
|
66
48
|
})
|
|
67
49
|
|
|
@@ -69,19 +51,20 @@ export default class SplitonScroll {
|
|
|
69
51
|
this.observer.on("leave", () => this.handleLeave())
|
|
70
52
|
}
|
|
71
53
|
|
|
72
|
-
handleEnter() {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
const split = splitText(this.splitText)
|
|
78
|
-
>>>>>>> origin
|
|
79
|
-
split.on(EVENTS.APP_SPLITTEXT_READY, splits => {
|
|
80
|
-
this.splits = splits
|
|
81
|
-
this.hasSplit = true
|
|
54
|
+
async handleEnter() {
|
|
55
|
+
if (this.splits) {
|
|
56
|
+
this.isReadyCallback(this.splits)
|
|
57
|
+
return
|
|
58
|
+
}
|
|
82
59
|
|
|
83
|
-
|
|
60
|
+
const split = splitText(this.targets)
|
|
61
|
+
const splits = await new Promise(resolve => {
|
|
62
|
+
split.on(EVENTS.APP_SPLITTEXT_READY, readySplits => {
|
|
63
|
+
resolve(readySplits)
|
|
64
|
+
})
|
|
84
65
|
})
|
|
66
|
+
this.splits = splits
|
|
67
|
+
this.isReadyCallback(splits)
|
|
85
68
|
}
|
|
86
69
|
|
|
87
70
|
handleLeave() {
|
|
@@ -102,7 +85,6 @@ export default class SplitonScroll {
|
|
|
102
85
|
|
|
103
86
|
destroy() {
|
|
104
87
|
this.observer?.kill()
|
|
105
|
-
|
|
106
88
|
this.splits = null
|
|
107
89
|
this.targets = null
|
|
108
90
|
this.element = null
|