braid-blob 0.0.77 → 0.0.79
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/img-live.js +69 -45
- package/package.json +1 -1
package/img-live.js
CHANGED
|
@@ -3,46 +3,70 @@
|
|
|
3
3
|
|
|
4
4
|
;(function() {
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var subscriptions = new Map() // base_url -> sub
|
|
7
7
|
|
|
8
8
|
function sync(img) {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
img.src = ''
|
|
33
|
-
img.src = url
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
on_delete: () => {
|
|
37
|
-
img.src = ''
|
|
38
|
-
img.src = url
|
|
39
|
-
},
|
|
40
|
-
on_error: (error) => {
|
|
41
|
-
console.error('Live image error for', url, error)
|
|
42
|
-
}
|
|
9
|
+
if (!img._img_live_base_url) img._img_live_base_url = img.src
|
|
10
|
+
var base_url = img._img_live_base_url
|
|
11
|
+
|
|
12
|
+
var sub = subscriptions.get(base_url)
|
|
13
|
+
if (sub) {
|
|
14
|
+
// Cancel any pending teardown
|
|
15
|
+
clearTimeout(sub.teardown_timer)
|
|
16
|
+
sub.teardown_timer = null
|
|
17
|
+
} else {
|
|
18
|
+
// Create cache-bust helper for this base URL
|
|
19
|
+
var param = 'img-live'
|
|
20
|
+
var u = new URL(base_url)
|
|
21
|
+
while (u.searchParams.has(param)) param = '-' + param
|
|
22
|
+
function cache_bust() {
|
|
23
|
+
u.searchParams.set(param, Math.random().toString(36).slice(2))
|
|
24
|
+
return u.toString()
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
subscriptions.set(base_url, sub = {
|
|
28
|
+
imgs: new Set(),
|
|
29
|
+
ac: new AbortController(),
|
|
30
|
+
current_src: null,
|
|
31
|
+
teardown_timer: null
|
|
43
32
|
})
|
|
44
|
-
|
|
45
|
-
|
|
33
|
+
|
|
34
|
+
function set_src(src) {
|
|
35
|
+
sub.current_src = src
|
|
36
|
+
sub.imgs.forEach(img => img.src = sub.current_src)
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
var client_p = (async () => {
|
|
40
|
+
var res = await braid_fetch(cache_bust(), {
|
|
41
|
+
method: 'HEAD',
|
|
42
|
+
headers: { "Merge-Type": "aww" },
|
|
43
|
+
subscribe: true,
|
|
44
|
+
retry: () => true,
|
|
45
|
+
signal: sub.ac.signal
|
|
46
|
+
})
|
|
47
|
+
return braid_blob_client(cache_bust(), {
|
|
48
|
+
signal: sub.ac.signal,
|
|
49
|
+
parents: res.version,
|
|
50
|
+
on_update: (body, content_type, version, from_local_update) =>
|
|
51
|
+
set_src(!from_local_update ? cache_bust() :
|
|
52
|
+
URL.createObjectURL(new Blob(
|
|
53
|
+
[body], { type: content_type || 'image/png' }))),
|
|
54
|
+
on_delete: () => set_src(cache_bust()),
|
|
55
|
+
on_error: (error) =>
|
|
56
|
+
console.error('Live image error for', base_url, error)
|
|
57
|
+
})
|
|
58
|
+
})()
|
|
59
|
+
|
|
60
|
+
sub.update = async (body, content_type) => {
|
|
61
|
+
await (await client_p).update(body, content_type)
|
|
62
|
+
set_src(cache_bust())
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
sub.imgs.add(img)
|
|
67
|
+
|
|
68
|
+
// Immediately set to the most recent known src
|
|
69
|
+
if (sub.current_src) img.src = sub.current_src
|
|
46
70
|
|
|
47
71
|
if (img.hasAttribute('droppable')) {
|
|
48
72
|
img.addEventListener('dragenter', function() {
|
|
@@ -69,20 +93,20 @@ function sync(img) {
|
|
|
69
93
|
if (!file || !file.type.startsWith('image/')) return
|
|
70
94
|
|
|
71
95
|
var reader = new FileReader()
|
|
72
|
-
reader.onload =
|
|
73
|
-
await (await client_p).update(reader.result, file.type)
|
|
74
|
-
img.src = url
|
|
75
|
-
}
|
|
96
|
+
reader.onload = () => sub.update(reader.result, file.type)
|
|
76
97
|
reader.readAsArrayBuffer(file)
|
|
77
98
|
})
|
|
78
99
|
}
|
|
79
100
|
}
|
|
80
101
|
|
|
81
102
|
function unsync(img) {
|
|
82
|
-
var
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
103
|
+
var base_url = img._img_live_base_url
|
|
104
|
+
var sub = subscriptions.get(base_url)
|
|
105
|
+
if (sub?.imgs.delete(img) && !sub.imgs.size) {
|
|
106
|
+
sub.teardown_timer = setTimeout(() => {
|
|
107
|
+
sub.ac.abort()
|
|
108
|
+
subscriptions.delete(base_url)
|
|
109
|
+
}, 5000)
|
|
86
110
|
}
|
|
87
111
|
}
|
|
88
112
|
|