all repos — honk @ 4b0d5649760218643d6499419158c2543dc94dad

my fork of honk

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	relinklinks()
144	return lenhonks
145}
146function hydrargs() {
147	var name = curpagestate.name
148	var arg = curpagestate.arg
149	var args = { "page" : name }
150	if (name == "convoy") {
151		args["c"] = arg
152	} else if (name == "combo") {
153		args["c"] = arg
154	} else if (name == "honker") {
155		args["xid"] = arg
156	} else if (name == "user") {
157		args["uname"] = arg
158	}
159	return args
160}
161function refreshupdate(msg) {
162	var el = document.querySelector("#refreshbox p span")
163	if (el) {
164		el.innerHTML = msg
165	}
166}
167function refreshhonks(btn) {
168	removeglow()
169	btn.innerHTML = "refreshing"
170	btn.disabled = true
171	var args = hydrargs()
172	var stash = curpagestate.name + ":" + curpagestate.arg
173	args["tophid"] = tophid[stash]
174	get("/hydra?" + encode(args), function(xhr) {
175		btn.innerHTML = "refresh"
176		btn.disabled = false
177		if (xhr.status == 200) {
178			var lenhonks = fillinhonks(xhr, true)
179			refreshupdate(" " + lenhonks + " new")
180		} else {
181			refreshupdate(" status: " + xhr.status)
182		}
183	}, function(xhr, e) {
184		btn.innerHTML = "refresh"
185		btn.disabled = false
186		refreshupdate(" timed out")
187	})
188}
189function statechanger(evt) {
190	var data = evt.state
191	if (!data) {
192		return
193	}
194	switchtopage(data.name, data.arg)
195}
196function switchtopage(name, arg) {
197	var stash = curpagestate.name + ":" + curpagestate.arg
198	var honksonpage = document.getElementById("honksonpage")
199	var holder = honksonpage.children[0]
200	holder.remove()
201	var srvel = document.getElementById("srvmsg")
202	var msg = srvel.children[0]
203	if (msg) {
204		msg.remove()
205		servermsgs[stash] = msg
206	}
207	showelement("refreshbox")
208
209	honksforpage[stash] = holder
210
211	curpagestate.name = name
212	curpagestate.arg = arg
213	// get the holder for the target page
214	stash = name + ":" + arg
215	holder = honksforpage[stash]
216	if (holder) {
217		honksonpage.prepend(holder)
218		msg = servermsgs[stash]
219		if (msg) {
220			srvel.prepend(msg)
221		}
222	} else {
223		// or create one and fill it
224		honksonpage.prepend(document.createElement("div"))
225		var args = hydrargs()
226		get("/hydra?" + encode(args), function(xhr) {
227			if (xhr.status == 200) {
228				fillinhonks(xhr, false)
229			} else {
230				refreshupdate(" status: " + xhr.status)
231			}
232		}, function(xhr, e) {
233			refreshupdate(" timed out")
234		})
235	}
236	refreshupdate("")
237}
238function newpagestate(name, arg) {
239	return { "name": name, "arg": arg }
240}
241function pageswitcher(name, arg) {
242	return function(evt) {
243		var topmenu = document.getElementById("topmenu")
244		topmenu.open = false
245		if (name == curpagestate.name && arg == curpagestate.arg) {
246			return false
247		}
248		switchtopage(name, arg)
249		var url = evt.srcElement.href
250		if (!url) {
251			url = evt.srcElement.parentElement.href
252		}
253		history.pushState(newpagestate(name, arg), "some title", url)
254		window.scrollTo(0, 0)
255		return false
256	}
257}
258function relinklinks() {
259	var els = document.getElementsByClassName("convoylink")
260	while (els.length) {
261    var s = (new URL(els[0].href)).search
262    var c = new URLSearchParams(s).get('c')
263		els[0].onclick = pageswitcher("convoy", c)
264		els[0].classList.remove("convoylink")
265	}
266	els = document.getElementsByClassName("combolink")
267	while (els.length) {
268		els[0].onclick = pageswitcher("combo", els[0].text)
269		els[0].classList.remove("combolink")
270	}
271	els = document.getElementsByClassName("honkerlink")
272	while (els.length) {
273		var el = els[0]
274		var xid = el.getAttribute("data-xid")
275		el.onclick = pageswitcher("honker", xid)
276		el.classList.remove("honkerlink")
277	}
278
279	els = document.querySelectorAll("#honksonpage article button")
280	els.forEach(function(el) {
281		var honk = el.closest("article")
282		var convoy = honk.dataset.convoy
283		var hname = honk.dataset.hname
284		var xid = honk.dataset.xid
285		var id = Number(honk.dataset.id)
286
287		if (!(id > 0)) {
288			console.error("could not determine honk id")
289			return
290		}
291
292		if (el.classList.contains("unbonk")) {
293			el.onclick = function() {
294				unbonk(el, xid);
295			}
296		} else if (el.classList.contains("bonk")) {
297			el.onclick = function() {
298				bonk(el, xid)
299			}
300		} else if (el.classList.contains("honkback")) {
301			el.onclick = function() {
302				return showhonkform(el, xid, hname)
303			}
304		} else if (el.classList.contains("mute")) {
305			el.onclick = function() {
306				muteit(el, convoy);
307			}
308		} else if (el.classList.contains("evenmore")) {
309			var more = document.querySelector("#evenmore"+id);
310			el.onclick = function() {
311				more.classList.toggle("hide");
312			}
313		} else if (el.classList.contains("zonk")) {
314			el.onclick = function() {
315				zonkit(el, xid);
316			}
317		} else if (el.classList.contains("flogit-deack")) {
318			el.onclick = function() {
319				flogit(el, "deack", xid);
320			}
321		} else if (el.classList.contains("flogit-ack")) {
322			el.onclick = function() {
323				flogit(el, "ack", xid);
324			}
325		} else if (el.classList.contains("flogit-unsave")) {
326			el.onclick = function() {
327				flogit(el, "unsave", xid);
328			}
329		} else if (el.classList.contains("flogit-save")) {
330			el.onclick = function() {
331				flogit(el, "save", xid);
332			}
333		} else if (el.classList.contains("flogit-untag")) {
334			el.onclick = function() {
335				flogit(el, "untag", xid);
336			}
337		} else if (el.classList.contains("flogit-react")) {
338			el.onclick = function() {
339				flogit(el, "react", xid);
340			}
341		}
342	})
343}
344function showhonkform(elem, rid, hname) {
345	var form = lehonkform
346	form.style = "display: block"
347	if (elem) {
348		form.remove()
349		elem.parentElement.parentElement.parentElement.insertAdjacentElement('beforebegin', form)
350	} else {
351		hideelement(lehonkbutton)
352		elem = document.getElementById("honkformhost")
353		elem.insertAdjacentElement('afterend', form)
354	}
355	var ridinput = document.getElementById("ridinput")
356	var honknoise = document.getElementById("honknoise")
357	if (rid) {
358		ridinput.value = rid
359		if (hname) {
360			honknoise.value = hname + " "
361		} else {
362			honknoise.value = ""
363		}
364	} else {
365		ridinput.value = ""
366		honknoise.value = ""
367	}
368	var updateinput = document.getElementById("updatexidinput")
369	updateinput.value = ""
370	honknoise.focus()
371	return false
372}
373function cancelhonking() {
374	hideelement(lehonkform)
375	showelement(lehonkbutton)
376}
377function showelement(el) {
378	if (typeof(el) == "string")
379		el = document.getElementById(el)
380	if (!el) return
381	el.style.display = "block"
382}
383function hideelement(el) {
384	if (typeof(el) == "string")
385		el = document.getElementById(el)
386	if (!el) return
387	el.style.display = "none"
388}
389function updatedonker() {
390	var el = document.getElementById("donker")
391	el.children[1].textContent = el.children[0].value.slice(-20)
392	el = document.getElementById("donkdescriptor")
393	el.style.display = ""
394	el = document.getElementById("saveddonkxid")
395	el.value = ""
396}
397var checkinprec = 100.0
398var gpsoptions = {
399	enableHighAccuracy: false,
400	timeout: 1000,
401	maximumAge: 0
402};
403function fillcheckin() {
404	if (navigator.geolocation) {
405		navigator.geolocation.getCurrentPosition(function(pos) {
406			showelement("placedescriptor")
407			var el = document.getElementById("placelatinput")
408			el.value = Math.round(pos.coords.latitude * checkinprec) / checkinprec
409			el = document.getElementById("placelonginput")
410			el.value = Math.round(pos.coords.longitude * checkinprec) / checkinprec
411			checkinprec = 10000.0
412			gpsoptions.enableHighAccuracy = true
413			gpsoptions.timeout = 2000
414		}, function(err) {
415			showelement("placedescriptor")
416			var el = document.getElementById("placenameinput")
417			el.value = err.message
418		}, gpsoptions)
419	}
420}
421function addemu(elem) {
422	const data = elem.alt
423	const box = document.getElementById("honknoise");
424	box.value += data;
425}
426function loademus() {
427	var div = document.getElementById("emupicker")
428	var request = new XMLHttpRequest()
429	request.open('GET', '/emus')
430	request.onload = function() {
431		div.innerHTML = request.responseText
432		div.querySelectorAll(".emu").forEach(function(el) {
433			el.onclick = function() {
434				addemu(el)
435			}
436		})
437	}
438	if (div.style.display === "none") {
439		div.style.display = "block";
440	} else {
441		div.style.display = "none";
442	}
443	request.send()
444}
445
446// init
447(function() {
448	var me = document.currentScript;
449	csrftoken = me.dataset.csrf
450	curpagestate.name = me.dataset.pagename
451	curpagestate.arg = me.dataset.pagearg
452	tophid[curpagestate.name + ":" + curpagestate.arg] = me.dataset.tophid
453	servermsgs[curpagestate.name + ":" + curpagestate.arg] = me.dataset.srvmsg
454
455	var el = document.getElementById("homelink")
456	el.onclick = pageswitcher("home", "")
457	el = document.getElementById("atmelink")
458	el.onclick = pageswitcher("atme", "")
459	el = document.getElementById("firstlink")
460	el.onclick = pageswitcher("first", "")
461	el = document.getElementById("savedlink")
462	el.onclick = pageswitcher("saved", "")
463	el = document.getElementById("longagolink")
464	el.onclick = pageswitcher("longago", "")
465
466	var totop = document.querySelector(".nophone")
467	if (totop) {
468		totop.onclick = function() {
469			window.scrollTo(0,0)
470		}
471	}
472
473	var refreshbox = document.getElementById("refreshbox")
474	if (refreshbox) {
475		refreshbox.querySelectorAll("button").forEach(function(el) {
476			if (el.classList.contains("refresh")) {
477				el.onclick = function() {
478					refreshhonks(el)
479				}
480			} else if (el.classList.contains("scrolldown")) {
481				el.onclick = function() {
482					oldestnewest(el)
483				}
484			}
485		})
486
487		if (me.dataset.srvmsg == "one honk maybe more") {
488			hideelement(refreshbox)
489		}
490	}
491
492	var td = document.getElementById("timedescriptor")
493	document.getElementById("addtimebutton").onclick = function() {
494		td.classList.toggle("hide")
495	}
496	document.getElementById("honkingtime").onclick = function() {
497		return showhonkform()
498	}
499	document.getElementById("checkinbutton").onclick = fillcheckin
500	document.getElementById("emuload").onclick = loademus
501	document.querySelector("#donker input").onchange = updatedonker
502	document.querySelector("button[name=cancel]").onclick = cancelhonking
503
504	relinklinks()
505	window.onpopstate = statechanger
506	history.replaceState(curpagestate, "some title", "")
507
508	hideelement("donkdescriptor")
509})();