views/honkpage.js (view raw)
1var csrftoken = ""
2var honksforpage = { }
3var curpagestate = { name: "", arg : "" }
4var tophid = { }
5var servermsgs = { }
6
7function encode(hash) {
8 var s = []
9 for (var key in hash) {
10 var val = hash[key]
11 s.push(encodeURIComponent(key) + "=" + encodeURIComponent(val))
12 }
13 return s.join("&")
14}
15function post(url, data) {
16 var x = new XMLHttpRequest()
17 x.open("POST", url)
18 x.timeout = 30 * 1000
19 x.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
20 x.send(data)
21}
22function get(url, whendone, whentimedout) {
23 var x = new XMLHttpRequest()
24 x.open("GET", url)
25 x.timeout = 15 * 1000
26 x.responseType = "json"
27 x.onload = function() { whendone(x) }
28 if (whentimedout) {
29 x.ontimeout = function(e) { whentimedout(x, e) }
30 }
31 x.send()
32}
33function bonk(el, xid) {
34 el.innerHTML = "bonked"
35 el.disabled = true
36 post("/bonk", encode({"js": "2", "CSRF": csrftoken, "xid": xid}))
37 return false
38}
39function unbonk(el, xid) {
40 el.innerHTML = "unbonked"
41 el.disabled = true
42 post("/zonkit", encode({"CSRF": csrftoken, "wherefore": "unbonk", "what": xid}))
43}
44function muteit(el, convoy) {
45 el.innerHTML = "muted"
46 el.disabled = true
47 post("/zonkit", encode({"CSRF": csrftoken, "wherefore": "zonvoy", "what": convoy}))
48 var els = document.querySelectorAll('article.honk')
49 for (var i = 0; i < els.length; i++) {
50 var e = els[i]
51 if (e.getAttribute("data-convoy") == convoy) {
52 e.remove()
53 }
54 }
55}
56function zonkit(el, xid) {
57 el.innerHTML = "zonked"
58 el.disabled = true
59 post("/zonkit", encode({"CSRF": csrftoken, "wherefore": "zonk", "what": xid}))
60 var p = el
61 while (p && p.tagName != "ARTICLE") {
62 p = p.parentElement
63 }
64 if (p) {
65 p.remove()
66 }
67}
68function flogit(el, how, xid) {
69 var s = how
70 if (s[s.length-1] != "e") { s += "e" }
71 s += "d"
72 if (s == "untaged") s = "untagged"
73 if (s == "reacted") s = "badonked"
74 el.innerHTML = s
75 el.disabled = true
76 post("/zonkit", encode({"CSRF": csrftoken, "wherefore": how, "what": xid}))
77}
78
79var lehonkform = document.getElementById("honkform")
80var lehonkbutton = document.getElementById("honkingtime")
81
82function oldestnewest(btn) {
83 var els = document.getElementsByClassName("glow")
84 if (els.length) {
85 els[els.length-1].scrollIntoView()
86 }
87}
88function removeglow() {
89 var els = document.getElementsByClassName("glow")
90 while (els.length) {
91 els[0].classList.remove("glow")
92 }
93}
94
95function fillinhonks(xhr, glowit) {
96 var resp = xhr.response
97 var stash = curpagestate.name + ":" + curpagestate.arg
98 tophid[stash] = resp.Tophid
99 var doc = document.createElement( 'div' );
100 doc.innerHTML = resp.Srvmsg
101 var srvmsg = doc
102 doc = document.createElement( 'div' );
103 doc.innerHTML = resp.Honks
104 var honks = doc.children
105
106 var mecount = document.getElementById("mecount")
107 if (resp.MeCount) {
108 mecount.innerHTML = "(" + resp.MeCount + ")"
109 } else {
110 mecount.innerHTML = ""
111 }
112 var chatcount = document.getElementById("chatcount")
113 if (resp.ChatCount) {
114 chatcount.innerHTML = "(" + resp.ChatCount + ")"
115 } else {
116 chatcount.innerHTML = ""
117 }
118
119 var srvel = document.getElementById("srvmsg")
120 while (srvel.children[0]) {
121 srvel.children[0].remove()
122 }
123 srvel.prepend(srvmsg)
124
125 var frontload = true
126 if (curpagestate.name == "convoy") {
127 frontload = false
128 }
129
130 var honksonpage = document.getElementById("honksonpage")
131 var holder = honksonpage.children[0]
132 var lenhonks = honks.length
133 for (var i = honks.length; i > 0; i--) {
134 var h = honks[i-1]
135 if (glowit)
136 h.classList.add("glow")
137 if (frontload) {
138 holder.prepend(h)
139 } else {
140 holder.append(h)
141 }
142
143 }
144 relinklinks()
145 return lenhonks
146}
147function hydrargs() {
148 var name = curpagestate.name
149 var arg = curpagestate.arg
150 var args = { "page" : name }
151 if (name == "convoy") {
152 args["c"] = arg
153 } else if (name == "combo") {
154 args["c"] = arg
155 } else if (name == "honker") {
156 args["xid"] = arg
157 } else if (name == "user") {
158 args["uname"] = arg
159 }
160 return args
161}
162function refreshupdate(msg) {
163 var el = document.querySelector("#refreshbox p span")
164 if (el) {
165 el.innerHTML = msg
166 }
167}
168function refreshhonks(btn) {
169 removeglow()
170 btn.innerHTML = "refreshing"
171 btn.disabled = true
172 var args = hydrargs()
173 var stash = curpagestate.name + ":" + curpagestate.arg
174 args["tophid"] = tophid[stash]
175 get("/hydra?" + encode(args), function(xhr) {
176 btn.innerHTML = "refresh"
177 btn.disabled = false
178 if (xhr.status == 200) {
179 var lenhonks = fillinhonks(xhr, true)
180 refreshupdate(" " + lenhonks + " new")
181 } else {
182 refreshupdate(" status: " + xhr.status)
183 }
184 }, function(xhr, e) {
185 btn.innerHTML = "refresh"
186 btn.disabled = false
187 refreshupdate(" timed out")
188 })
189}
190function statechanger(evt) {
191 var data = evt.state
192 if (!data) {
193 return
194 }
195 switchtopage(data.name, data.arg)
196}
197function switchtopage(name, arg) {
198 var stash = curpagestate.name + ":" + curpagestate.arg
199 var honksonpage = document.getElementById("honksonpage")
200 var holder = honksonpage.children[0]
201 holder.remove()
202 var srvel = document.getElementById("srvmsg")
203 var msg = srvel.children[0]
204 if (msg) {
205 msg.remove()
206 servermsgs[stash] = msg
207 }
208 showelement("refreshbox")
209
210 honksforpage[stash] = holder
211
212 curpagestate.name = name
213 curpagestate.arg = arg
214 // get the holder for the target page
215 var stash = name + ":" + arg
216 holder = honksforpage[stash]
217 if (holder) {
218 honksonpage.prepend(holder)
219 msg = servermsgs[stash]
220 if (msg) {
221 srvel.prepend(msg)
222 }
223 } else {
224 // or create one and fill it
225 honksonpage.prepend(document.createElement("div"))
226 var args = hydrargs()
227 get("/hydra?" + encode(args), function(xhr) {
228 if (xhr.status == 200) {
229 var lenhonks = fillinhonks(xhr, false)
230 } else {
231 refreshupdate(" status: " + xhr.status)
232 }
233 }, function(xhr, e) {
234 refreshupdate(" timed out")
235 })
236 }
237 refreshupdate("")
238}
239function newpagestate(name, arg) {
240 return { "name": name, "arg": arg }
241}
242function pageswitcher(name, arg) {
243 return function(evt) {
244 var topmenu = document.getElementById("topmenu")
245 topmenu.open = false
246 if (name == curpagestate.name && arg == curpagestate.arg) {
247 return false
248 }
249 switchtopage(name, arg)
250 var url = evt.srcElement.href
251 if (!url) {
252 url = evt.srcElement.parentElement.href
253 }
254 history.pushState(newpagestate(name, arg), "some title", url)
255 window.scrollTo(0, 0)
256 return false
257 }
258}
259function relinklinks() {
260 var els = document.getElementsByClassName("convoylink")
261 while (els.length) {
262 els[0].onclick = pageswitcher("convoy", els[0].text)
263 els[0].classList.remove("convoylink")
264 }
265 els = document.getElementsByClassName("combolink")
266 while (els.length) {
267 els[0].onclick = pageswitcher("combo", els[0].text)
268 els[0].classList.remove("combolink")
269 }
270 els = document.getElementsByClassName("honkerlink")
271 while (els.length) {
272 var el = els[0]
273 var xid = el.getAttribute("data-xid")
274 el.onclick = pageswitcher("honker", xid)
275 el.classList.remove("honkerlink")
276 }
277
278 els = document.querySelectorAll("#honksonpage article button")
279 els.forEach(function(el) {
280 var honk = el.closest("article")
281 var convoy = honk.dataset.convoy
282 var hname = honk.dataset.hname
283 var xid = honk.dataset.xid
284 var id = Number(honk.dataset.id)
285
286 if (!(id > 0)) {
287 console.error("could not determine honk id")
288 return
289 }
290
291 if (el.classList.contains("unbonk")) {
292 el.onclick = function() {
293 unbonk(el, xid);
294 }
295 } else if (el.classList.contains("bonk")) {
296 el.onclick = function() {
297 bonk(el, xid)
298 }
299 } else if (el.classList.contains("honkback")) {
300 el.onclick = function() {
301 return showhonkform(el, xid, hname)
302 }
303 } else if (el.classList.contains("mute")) {
304 el.onclick = function() {
305 muteit(el, convoy);
306 }
307 } else if (el.classList.contains("evenmore")) {
308 var more = document.querySelector("#evenmore"+id);
309 el.onclick = function() {
310 more.classList.toggle("hide");
311 }
312 } else if (el.classList.contains("zonk")) {
313 el.onclick = function() {
314 zonkit(el, xid);
315 }
316 } else if (el.classList.contains("flogit-deack")) {
317 el.onclick = function() {
318 flogit(el, "deack", xid);
319 }
320 } else if (el.classList.contains("flogit-ack")) {
321 el.onclick = function() {
322 flogit(el, "ack", xid);
323 }
324 } else if (el.classList.contains("flogit-unsave")) {
325 el.onclick = function() {
326 flogit(el, "unsave", xid);
327 }
328 } else if (el.classList.contains("flogit-save")) {
329 el.onclick = function() {
330 flogit(el, "save", xid);
331 }
332 } else if (el.classList.contains("flogit-untag")) {
333 el.onclick = function() {
334 flogit(el, "untag", xid);
335 }
336 } else if (el.classList.contains("flogit-react")) {
337 el.onclick = function() {
338 flogit(el, "react", xid);
339 }
340 } else if (el.classList.contains("playit")) {
341 var noise = el.dataset.noise
342 var wonk = el.dataset.wonk
343 el.onclick = function() {
344 playit(el, noise, wonk, xid)
345 }
346 }
347 })
348}
349function showhonkform(elem, rid, hname) {
350 var form = lehonkform
351 form.style = "display: block"
352 if (elem) {
353 form.remove()
354 elem.parentElement.parentElement.parentElement.insertAdjacentElement('beforebegin', form)
355 } else {
356 hideelement(lehonkbutton)
357 elem = document.getElementById("honkformhost")
358 elem.insertAdjacentElement('afterend', form)
359 }
360 var ridinput = document.getElementById("ridinput")
361 if (rid) {
362 ridinput.value = rid
363 if (hname) {
364 honknoise.value = hname + " "
365 } else {
366 honknoise.value = ""
367 }
368 } else {
369 ridinput.value = ""
370 honknoise.value = ""
371 }
372 var updateinput = document.getElementById("updatexidinput")
373 updateinput.value = ""
374 document.getElementById("honknoise").focus()
375 return false
376}
377function cancelhonking() {
378 hideelement(lehonkform)
379 showelement(lehonkbutton)
380}
381function showelement(el) {
382 if (typeof(el) == "string")
383 el = document.getElementById(el)
384 if (!el) return
385 el.style.display = "block"
386}
387function hideelement(el) {
388 if (typeof(el) == "string")
389 el = document.getElementById(el)
390 if (!el) return
391 el.style.display = "none"
392}
393function updatedonker() {
394 var el = document.getElementById("donker")
395 el.children[1].textContent = el.children[0].value.slice(-20)
396 var el = document.getElementById("donkdescriptor")
397 el.style.display = ""
398 var el = document.getElementById("saveddonkxid")
399 el.value = ""
400}
401var checkinprec = 100.0
402var gpsoptions = {
403 enableHighAccuracy: false,
404 timeout: 1000,
405 maximumAge: 0
406};
407function fillcheckin() {
408 if (navigator.geolocation) {
409 navigator.geolocation.getCurrentPosition(function(pos) {
410 showelement("placedescriptor")
411 var el = document.getElementById("placelatinput")
412 el.value = Math.round(pos.coords.latitude * checkinprec) / checkinprec
413 el = document.getElementById("placelonginput")
414 el.value = Math.round(pos.coords.longitude * checkinprec) / checkinprec
415 checkinprec = 10000.0
416 gpsoptions.enableHighAccuracy = true
417 gpsoptions.timeout = 2000
418 }, function(err) {
419 showelement("placedescriptor")
420 el = document.getElementById("placenameinput")
421 el.value = err.message
422 }, gpsoptions)
423 }
424}
425function playit(elem, word, wordlist, xid) {
426 import('/wonk.js').then(module => {
427 makeaguess = module.makeaguess
428 module.addguesscontrols(elem, word, wordlist, xid)
429 })
430}
431function addemu(elem) {
432 const data = elem.alt
433 const box = document.getElementById("honknoise");
434 box.value += data;
435}
436function loademus() {
437 div = document.getElementById("emupicker")
438 request = new XMLHttpRequest()
439 request.open('GET', '/emus')
440 request.onload = function() {
441 div.innerHTML = request.responseText
442 div.querySelectorAll(".emu").forEach(function(el) {
443 el.onclick = function() {
444 addemu(el)
445 }
446 })
447 }
448 if (div.style.display === "none") {
449 div.style.display = "block";
450 } else {
451 div.style.display = "none";
452 }
453 request.send()
454}
455
456// init
457(function() {
458 var me = document.currentScript;
459 csrftoken = me.dataset.csrf
460 curpagestate.name = me.dataset.pagename
461 curpagestate.arg = me.dataset.pagearg
462 tophid[curpagestate.name + ":" + curpagestate.arg] = me.dataset.tophid
463 servermsgs[curpagestate.name + ":" + curpagestate.arg] = me.dataset.srvmsg
464
465 var el = document.getElementById("homelink")
466 el.onclick = pageswitcher("home", "")
467 el = document.getElementById("atmelink")
468 el.onclick = pageswitcher("atme", "")
469 el = document.getElementById("firstlink")
470 el.onclick = pageswitcher("first", "")
471 el = document.getElementById("savedlink")
472 el.onclick = pageswitcher("saved", "")
473 el = document.getElementById("longagolink")
474 el.onclick = pageswitcher("longago", "")
475
476 var totop = document.querySelector(".nophone")
477 if (totop) {
478 totop.onclick = function() {
479 window.scrollTo(0,0)
480 }
481 }
482
483 var refreshbox = document.getElementById("refreshbox")
484 if (refreshbox) {
485 refreshbox.querySelectorAll("button").forEach(function(el) {
486 if (el.classList.contains("refresh")) {
487 el.onclick = function() {
488 refreshhonks(el)
489 }
490 } else if (el.classList.contains("scrolldown")) {
491 el.onclick = function() {
492 oldestnewest(el)
493 }
494 }
495 })
496
497 if (me.dataset.srvmsg == "one honk maybe more") {
498 hideelement(refreshbox)
499 }
500 }
501
502 var td = document.getElementById("timedescriptor")
503 document.getElementById("addtimebutton").onclick = function() {
504 td.classList.toggle("hide")
505 }
506 document.getElementById("honkingtime").onclick = function() {
507 return showhonkform()
508 }
509 document.getElementById("checkinbutton").onclick = fillcheckin
510 document.getElementById("emuload").onclick = loademus
511 document.querySelector("#donker input").onchange = updatedonker
512 document.querySelector("button[name=cancel]").onclick = cancelhonking
513
514 relinklinks()
515 window.onpopstate = statechanger
516 history.replaceState(curpagestate, "some title", "")
517
518 hideelement("donkdescriptor")
519})();