1
2
3
4
5
6
7
8
9
10
11
12
..
38
39
40
41
42
43
44
45
46
47
48
49
50
|
/* first things first, we need to scan over the document and see
* if there are any UI elements unfortunate enough to need
* interactivity beyond what native HTML+CSS can provide. if so,
* we attach the appropriate listeners to them. */
window.addEventListener('load', function() {
/* update hue-picker background when slider is adjusted */
document.querySelectorAll('.color-picker').forEach(function(box) {
let slider = box.querySelector('[data-color-pick]');
box.style.setProperty('--hue', slider.value);
slider.addEventListener('input', function(e) {
box.style.setProperty('--hue', e.target.value);
});
................................................................................
return;
}
container._liveLastArrival = newest
resp.text().then(function(htmlbody) {
var parser = new DOMParser();
var newdoc = parser.parseFromString(htmlbody,'text/html')
container.innerHTML = newdoc.getElementById(container.id).innerHTML
})
})
}, interv)
});
});
|
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
|
>
>
>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
..
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
/* first things first, we need to scan over the document and see
* if there are any UI elements unfortunate enough to need
* interactivity beyond what native HTML+CSS can provide. if so,
* we attach the appropriate listeners to them. */
window.addEventListener('load', function() {
/* social media is less fun when you can't just click on a tweet
* to insta-like or -retweet it. this is unfortunately not possible
* (except in various hideously shitty ways) without javascript. */
function mk(elt) { return document.createElement(elt); }
function attachButtons() {
document.querySelectorAll('body:not(.post) main div.post').forEach(function(post){
let url = post.querySelector('.permalink').attributes.getNamedItem('href').value;
function postReq(act,elt) {
fetch(new Request(url, {
method: 'POST',
body: 'act='+act
})).then(function(resp) {
if (resp.ok && resp.status == 200) {
var i = parseInt(elt.innerHTML)
if (isNaN(i)) {i=0}
elt.innerHTML = (i+1).toString()
}
})
}
var stats = post.querySelector('.stats');
if (stats == null) {
/* no stats box; create one */
var n = mk('div');
n.classList.add('stats');
post.appendChild(n);
stats = n
}
function ensureElt(cls, before) {
let s = stats.querySelector('.' + cls);
if (s == null) {
var n = mk('div');
n.classList.add(cls);
if (before == null) { stats.appendChild(n) } else {
stats.insertBefore(n,stats.querySelector(before))
}
return n
} else { return s }
}
var like = ensureElt('like', null);
var rt = ensureElt('rt','.like');
function activate(elt,name) {
elt.addEventListener('click', function(e) { postReq(name,elt) });
elt.style.setProperty('cursor','pointer');
}
activate(like,'like');
activate(rt,'rt');
});
}
/* update hue-picker background when slider is adjusted */
document.querySelectorAll('.color-picker').forEach(function(box) {
let slider = box.querySelector('[data-color-pick]');
box.style.setProperty('--hue', slider.value);
slider.addEventListener('input', function(e) {
box.style.setProperty('--hue', e.target.value);
});
................................................................................
return;
}
container._liveLastArrival = newest
resp.text().then(function(htmlbody) {
var parser = new DOMParser();
var newdoc = parser.parseFromString(htmlbody,'text/html')
container.innerHTML = newdoc.getElementById(container.id).innerHTML;
attachButtons();
})
})
}, interv)
});
attachButtons();
});
|