@kizmann/pico-js 0.4.4 → 0.4.5
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/pico-js.js +1 -1
- package/dist/pico-js.js.map +1 -1
- package/docs/element/ready.html +7 -4
- package/package.json +1 -1
- package/src/library/element.js +53 -1
- package/src/utility/dom.js +5 -4
- package/src/utility/object.js +9 -0
package/docs/element/ready.html
CHANGED
|
@@ -20,11 +20,14 @@
|
|
|
20
20
|
<body>
|
|
21
21
|
|
|
22
22
|
<div id="app">
|
|
23
|
-
<div js-test="foo: 'bar';">
|
|
24
|
-
<span>Hallo!</span>
|
|
23
|
+
<div js-test="foo: 'bar'; inview: true">
|
|
24
|
+
<span>Hallo test!</span>
|
|
25
25
|
</div>
|
|
26
|
-
<div
|
|
27
|
-
<span>
|
|
26
|
+
<div style="height: 2000px">
|
|
27
|
+
<span>Spacer!</span>
|
|
28
|
+
</div>
|
|
29
|
+
<div js-test2="foo: 'bar'; inview: true">
|
|
30
|
+
<span>Hallo test2!</span>
|
|
28
31
|
</div>
|
|
29
32
|
</div>
|
|
30
33
|
|
package/package.json
CHANGED
package/src/library/element.js
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import { Str, Obj, Dom, Any, Arr } from "../index.js";
|
|
2
2
|
|
|
3
|
+
|
|
4
|
+
Dom.ready(() => {
|
|
5
|
+
|
|
6
|
+
document.addEventListener("scroll",
|
|
7
|
+
Element.scroll);
|
|
8
|
+
|
|
9
|
+
Element.scroll();
|
|
10
|
+
});
|
|
11
|
+
|
|
12
|
+
|
|
3
13
|
export class Element
|
|
4
14
|
{
|
|
5
15
|
/**
|
|
@@ -22,6 +32,25 @@ export class Element
|
|
|
22
32
|
*/
|
|
23
33
|
static runs = [];
|
|
24
34
|
|
|
35
|
+
/**
|
|
36
|
+
* Instance storage.
|
|
37
|
+
*/
|
|
38
|
+
static invi = [];
|
|
39
|
+
|
|
40
|
+
static scroll()
|
|
41
|
+
{
|
|
42
|
+
Arr.each(this.invi, (item, index) => {
|
|
43
|
+
|
|
44
|
+
if ( ! Dom.find(item.el).inviewY() ) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
Arr.removeIndex(this.invi, index);
|
|
49
|
+
|
|
50
|
+
item.cb();
|
|
51
|
+
});
|
|
52
|
+
}
|
|
53
|
+
|
|
25
54
|
/**
|
|
26
55
|
* Bind a class on selector.
|
|
27
56
|
*/
|
|
@@ -56,6 +85,7 @@ export class Element
|
|
|
56
85
|
el: el.get(0), prefix: prefix, deamon: cb
|
|
57
86
|
});
|
|
58
87
|
|
|
88
|
+
|
|
59
89
|
el.data(prefix, cb);
|
|
60
90
|
|
|
61
91
|
return cb.bind !== undefined ?
|
|
@@ -130,6 +160,12 @@ export class Element
|
|
|
130
160
|
options = { _plain: Dom.find(el).attr(selector) };
|
|
131
161
|
}
|
|
132
162
|
|
|
163
|
+
let inview = Obj.pluck(options, 'inview', false);
|
|
164
|
+
|
|
165
|
+
if ( inview ) {
|
|
166
|
+
Arr.remove(this.invi, { el });
|
|
167
|
+
}
|
|
168
|
+
|
|
133
169
|
if ( document.body.contains(el) ) {
|
|
134
170
|
return;
|
|
135
171
|
}
|
|
@@ -147,7 +183,13 @@ export class Element
|
|
|
147
183
|
options = { _plain: Dom.find(el).attr(selector) };
|
|
148
184
|
}
|
|
149
185
|
|
|
150
|
-
|
|
186
|
+
let inview = Obj.pluck(options, 'inview', false);
|
|
187
|
+
|
|
188
|
+
let bindCb = () => {
|
|
189
|
+
this.bind(key, el, options);
|
|
190
|
+
};
|
|
191
|
+
|
|
192
|
+
inview ? this.bindInview(el, bindCb) : bindCb();
|
|
151
193
|
});
|
|
152
194
|
|
|
153
195
|
};
|
|
@@ -160,6 +202,16 @@ export class Element
|
|
|
160
202
|
return this;
|
|
161
203
|
}
|
|
162
204
|
|
|
205
|
+
static bindInview(el, cb)
|
|
206
|
+
{
|
|
207
|
+
Arr.add(this.invi, { el, cb }, { el });
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
static unbindInview(el, cb)
|
|
211
|
+
{
|
|
212
|
+
Arr.remove(this.invi, { el, cb }, { el });
|
|
213
|
+
}
|
|
214
|
+
|
|
163
215
|
|
|
164
216
|
|
|
165
217
|
/**
|
package/src/utility/dom.js
CHANGED
|
@@ -31,7 +31,7 @@ export class Dom
|
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
if ( delay !== 0 && (ready === false || count <= delay) ) {
|
|
34
|
-
setTimeout(() => Dom.ready(callback, delay, count +
|
|
34
|
+
setTimeout(() => Dom.ready(callback, delay, count + 50), 50);
|
|
35
35
|
return this;
|
|
36
36
|
}
|
|
37
37
|
|
|
@@ -42,15 +42,16 @@ export class Dom
|
|
|
42
42
|
|
|
43
43
|
static complete(callback, delay = 0, count = 0)
|
|
44
44
|
{
|
|
45
|
-
let ready = document.readyState === 'complete'
|
|
45
|
+
let ready = document.readyState === 'complete' ||
|
|
46
|
+
document.readyState === 'interactive';
|
|
46
47
|
|
|
47
48
|
if ( delay === 0 && (ready === false || count < delay) ) {
|
|
48
|
-
Dom.find(document).on('
|
|
49
|
+
Dom.find(document).on('load', callback);
|
|
49
50
|
return this;
|
|
50
51
|
}
|
|
51
52
|
|
|
52
53
|
if ( delay !== 0 && (ready === false || count < delay) ) {
|
|
53
|
-
setTimeout(() => Dom.ready(callback, delay, count +
|
|
54
|
+
setTimeout(() => Dom.ready(callback, delay, count + 50), 50);
|
|
54
55
|
return this;
|
|
55
56
|
}
|
|
56
57
|
|
package/src/utility/object.js
CHANGED
|
@@ -158,6 +158,15 @@ export class Obj
|
|
|
158
158
|
return this.unset(obj[key], keys);
|
|
159
159
|
}
|
|
160
160
|
|
|
161
|
+
static pluck(obj, keys, fallback = null)
|
|
162
|
+
{
|
|
163
|
+
let value = this.get(obj, keys, fallback);
|
|
164
|
+
|
|
165
|
+
this.unset(obj, keys);
|
|
166
|
+
|
|
167
|
+
return value;
|
|
168
|
+
}
|
|
169
|
+
|
|
161
170
|
static only(obj, keys, assign = null)
|
|
162
171
|
{
|
|
163
172
|
let result = {};
|