all repos — honk @ 2134c5c95464e7958a62b5bf686726e2caf38ecc

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    console.log("pageswitcher: ", arg)
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].href)
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		}
341	})
342}
343function showhonkform(elem, rid, hname) {
344	var form = lehonkform
345	form.style = "display: block"
346	if (elem) {
347		form.remove()
348		elem.parentElement.parentElement.parentElement.insertAdjacentElement('beforebegin', form)
349	} else {
350		hideelement(lehonkbutton)
351		elem = document.getElementById("honkformhost")
352		elem.insertAdjacentElement('afterend', form)
353	}
354	var ridinput = document.getElementById("ridinput")
355	var honknoise = document.getElementById("honknoise")
356	if (rid) {
357		ridinput.value = rid
358		if (hname) {
359			honknoise.value = hname + " "
360		} else {
361			honknoise.value = ""
362		}
363	} else {
364		ridinput.value = ""
365		honknoise.value = ""
366	}
367	var updateinput = document.getElementById("updatexidinput")
368	updateinput.value = ""
369	honknoise.focus()
370	return false
371}
372function cancelhonking() {
373	hideelement(lehonkform)
374	showelement(lehonkbutton)
375}
376function showelement(el) {
377	if (typeof(el) == "string")
378		el = document.getElementById(el)
379	if (!el) return
380	el.style.display = "block"
381}
382function hideelement(el) {
383	if (typeof(el) == "string")
384		el = document.getElementById(el)
385	if (!el) return
386	el.style.display = "none"
387}
388function updatedonker() {
389	var el = document.getElementById("donker")
390	el.children[1].textContent = el.children[0].value.slice(-20)
391	el = document.getElementById("donkdescriptor")
392	el.style.display = ""
393	el = document.getElementById("saveddonkxid")
394	el.value = ""
395}
396var checkinprec = 100.0
397var gpsoptions = {
398	enableHighAccuracy: false,
399	timeout: 1000,
400	maximumAge: 0
401};
402function fillcheckin() {
403	if (navigator.geolocation) {
404		navigator.geolocation.getCurrentPosition(function(pos) {
405			showelement("placedescriptor")
406			var el = document.getElementById("placelatinput")
407			el.value = Math.round(pos.coords.latitude * checkinprec) / checkinprec
408			el = document.getElementById("placelonginput")
409			el.value = Math.round(pos.coords.longitude * checkinprec) / checkinprec
410			checkinprec = 10000.0
411			gpsoptions.enableHighAccuracy = true
412			gpsoptions.timeout = 2000
413		}, function(err) {
414			showelement("placedescriptor")
415			var el = document.getElementById("placenameinput")
416			el.value = err.message
417		}, gpsoptions)
418	}
419}
420function addemu(elem) {
421	const data = elem.alt
422	const box = document.getElementById("honknoise");
423	box.value += data;
424}
425function loademus() {
426	var div = document.getElementById("emupicker")
427	var request = new XMLHttpRequest()
428	request.open('GET', '/emus')
429	request.onload = function() {
430		div.innerHTML = request.responseText
431		div.querySelectorAll(".emu").forEach(function(el) {
432			el.onclick = function() {
433				addemu(el)
434			}
435		})
436	}
437	if (div.style.display === "none") {
438		div.style.display = "block";
439	} else {
440		div.style.display = "none";
441	}
442	request.send()
443}
444
445// init
446(function() {
447	var me = document.currentScript;
448	csrftoken = me.dataset.csrf
449	curpagestate.name = me.dataset.pagename
450	curpagestate.arg = me.dataset.pagearg
451	tophid[curpagestate.name + ":" + curpagestate.arg] = me.dataset.tophid
452	servermsgs[curpagestate.name + ":" + curpagestate.arg] = me.dataset.srvmsg
453
454	var el = document.getElementById("homelink")
455	el.onclick = pageswitcher("home", "")
456	el = document.getElementById("atmelink")
457	el.onclick = pageswitcher("atme", "")
458	el = document.getElementById("firstlink")
459	el.onclick = pageswitcher("first", "")
460	el = document.getElementById("savedlink")
461	el.onclick = pageswitcher("saved", "")
462	el = document.getElementById("longagolink")
463	el.onclick = pageswitcher("longago", "")
464
465	var totop = document.querySelector(".nophone")
466	if (totop) {
467		totop.onclick = function() {
468			window.scrollTo(0,0)
469		}
470	}
471
472	var refreshbox = document.getElementById("refreshbox")
473	if (refreshbox) {
474		refreshbox.querySelectorAll("button").forEach(function(el) {
475			if (el.classList.contains("refresh")) {
476				el.onclick = function() {
477					refreshhonks(el)
478				}
479			} else if (el.classList.contains("scrolldown")) {
480				el.onclick = function() {
481					oldestnewest(el)
482				}
483			}
484		})
485
486		if (me.dataset.srvmsg == "one honk maybe more") {
487			hideelement(refreshbox)
488		}
489	}
490
491	var td = document.getElementById("timedescriptor")
492	document.getElementById("addtimebutton").onclick = function() {
493		td.classList.toggle("hide")
494	}
495	document.getElementById("honkingtime").onclick = function() {
496		return showhonkform()
497	}
498	document.getElementById("checkinbutton").onclick = fillcheckin
499	document.getElementById("emuload").onclick = loademus
500	document.querySelector("#donker input").onchange = updatedonker
501	document.querySelector("button[name=cancel]").onclick = cancelhonking
502
503	relinklinks()
504	window.onpopstate = statechanger
505	history.replaceState(curpagestate, "some title", "")
506
507	hideelement("donkdescriptor")
508})();