enigmatic 0.9.15 → 0.9.16
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/{test.html → elements/test-runner/index.html} +0 -0
- package/enigmatic.css +3 -6
- package/enigmatic.js +27 -40
- package/index.html +17 -0
- package/package.json +1 -1
|
File without changes
|
package/enigmatic.css
CHANGED
package/enigmatic.js
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
// e
|
|
1
|
+
// e 0.9.16
|
|
2
2
|
window.$ = document.querySelector.bind(document)
|
|
3
3
|
window.$$ = document.querySelectorAll.bind(document)
|
|
4
|
-
window.body = document.body
|
|
5
|
-
|
|
6
4
|
window.loadJS = src => {
|
|
7
5
|
return new Promise((r, j) => {
|
|
8
6
|
if ($(`script[src="${src}"]`))
|
|
@@ -13,7 +11,6 @@ window.loadJS = src => {
|
|
|
13
11
|
document.head.appendChild(s)
|
|
14
12
|
})
|
|
15
13
|
}
|
|
16
|
-
|
|
17
14
|
window.loadCSS = src => {
|
|
18
15
|
return new Promise((r, j) => {
|
|
19
16
|
const s = document.createElement('link')
|
|
@@ -23,27 +20,29 @@ window.loadCSS = src => {
|
|
|
23
20
|
document.head.appendChild(s)
|
|
24
21
|
})
|
|
25
22
|
}
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
v = v[k]
|
|
35
|
-
}
|
|
36
|
-
e.set ? e.set(v) : e.textContent = v
|
|
23
|
+
window.wait = ms => new Promise(r => setTimeout(r, ms))
|
|
24
|
+
window.data = new Proxy({}, {
|
|
25
|
+
set: (obj, prop, value) => {
|
|
26
|
+
for (const e of $$(`[data*=${prop}]`)) {
|
|
27
|
+
const arr = e.getAttribute('data').split('.')
|
|
28
|
+
arr.shift()
|
|
29
|
+
for (const p of arr) value = value[p]
|
|
30
|
+
e.set ? e.set(value) : e.textContent = value
|
|
37
31
|
}
|
|
38
|
-
|
|
39
|
-
ret[name] = value
|
|
40
|
-
return ret
|
|
32
|
+
return prop
|
|
41
33
|
}
|
|
34
|
+
})
|
|
35
|
+
window.ready = async () => {
|
|
36
|
+
return new Promise(r => {
|
|
37
|
+
if (document.readyState === 'complete')
|
|
38
|
+
r(true)
|
|
39
|
+
document.onreadystatechange = () => {
|
|
40
|
+
if (document.readyState === 'complete')
|
|
41
|
+
r()
|
|
42
|
+
}
|
|
43
|
+
})
|
|
42
44
|
}
|
|
43
45
|
|
|
44
|
-
window.data = new Data ()
|
|
45
|
-
window.wait = ms => new Promise(r => setTimeout(r, ms))
|
|
46
|
-
|
|
47
46
|
class EnigmaticElement extends HTMLElement {
|
|
48
47
|
constructor () {
|
|
49
48
|
super ()
|
|
@@ -105,28 +104,16 @@ class EnigmaticElement extends HTMLElement {
|
|
|
105
104
|
return e
|
|
106
105
|
}
|
|
107
106
|
}
|
|
107
|
+
//customElements.define ('e-e', EnigmaticElement)
|
|
108
108
|
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
window.addEventListener('DOMContentLoaded', (event) => {
|
|
109
|
+
(async () => {
|
|
110
|
+
await window.ready()
|
|
112
111
|
window.body = document.body
|
|
113
|
-
body.child = (type, id) => {
|
|
112
|
+
body.child = (type = 'div', id = Math.random()) => {
|
|
114
113
|
const child = document.createElement(type)
|
|
115
|
-
if(id) child.id = id
|
|
114
|
+
if (id) child.id = id
|
|
116
115
|
body.appendChild(child)
|
|
117
116
|
return child
|
|
118
117
|
}
|
|
119
|
-
if(main) main(document)
|
|
120
|
-
|
|
121
|
-
})
|
|
122
|
-
|
|
123
|
-
window.ready = async () => {
|
|
124
|
-
return new Promise(r => {
|
|
125
|
-
if(document.readyState === 'complete')
|
|
126
|
-
r(true)
|
|
127
|
-
document.onreadystatechange = () => {
|
|
128
|
-
if (document.readyState === 'complete')
|
|
129
|
-
r()
|
|
130
|
-
}
|
|
131
|
-
})
|
|
132
|
-
}
|
|
118
|
+
if (window.main) window.main(document)
|
|
119
|
+
})()
|
package/index.html
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
<script src='enigmatic.js'></script>
|
|
2
|
+
<script type='module' src='elements/index.mjs'></script>
|
|
3
|
+
<link rel='stylesheet' href='enigmatic.css'>
|
|
4
|
+
|
|
5
|
+
<body style='--rows:1fr 1fr; --cols:1fr 1fr'>
|
|
6
|
+
<div data='mykey'></div>
|
|
7
|
+
<div data='mykey2.k'></div>
|
|
8
|
+
<div>three</div>
|
|
9
|
+
</body>
|
|
10
|
+
|
|
11
|
+
<script>
|
|
12
|
+
window.main = () => {
|
|
13
|
+
body.child().innerHTML = 'main'
|
|
14
|
+
data.mykey = 'somevalue'
|
|
15
|
+
data.mykey2 = {k: 'v'}
|
|
16
|
+
}
|
|
17
|
+
</script>
|
package/package.json
CHANGED