all repos — honk @ 1e8975efecd83676e93cd1faa8217049ab80c370

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		els[0].onclick = pageswitcher("convoy", els[0].text)
262		els[0].classList.remove("convoylink")
263	}
264	els = document.getElementsByClassName("combolink")
265	while (els.length) {
266		els[0].onclick = pageswitcher("combo", els[0].text)
267		els[0].classList.remove("combolink")
268	}
269	els = document.getElementsByClassName("honkerlink")
270	while (els.length) {
271		var el = els[0]
272		var xid = el.getAttribute("data-xid")
273		el.onclick = pageswitcher("honker", xid)
274		el.classList.remove("honkerlink")
275	}
276
277	els = document.querySelectorAll("#honksonpage article button")
278	els.forEach(function(el) {
279		var honk = el.closest("article")
280		var convoy = honk.dataset.convoy
281		var hname = honk.dataset.hname
282		var xid = honk.dataset.xid
283		var id = Number(honk.dataset.id)
284
285		if (!(id > 0)) {
286			console.error("could not determine honk id")
287			return
288		}
289
290		if (el.classList.contains("unbonk")) {
291			el.onclick = function() {
292				unbonk(el, xid);
293			}
294		} else if (el.classList.contains("bonk")) {
295			el.onclick = function() {
296				bonk(el, xid)
297			}
298		} else if (el.classList.contains("honkback")) {
299			el.onclick = function() {
300				return showhonkform(el, xid, hname)
301			}
302		} else if (el.classList.contains("mute")) {
303			el.onclick = function() {
304				muteit(el, convoy);
305			}
306		} else if (el.classList.contains("evenmore")) {
307			var more = document.querySelector("#evenmore"+id);
308			el.onclick = function() {
309				more.classList.toggle("hide");
310			}
311		} else if (el.classList.contains("zonk")) {
312			el.onclick = function() {
313				zonkit(el, xid);
314			}
315		} else if (el.classList.contains("flogit-deack")) {
316			el.onclick = function() {
317				flogit(el, "deack", xid);
318			}
319		} else if (el.classList.contains("flogit-ack")) {
320			el.onclick = function() {
321				flogit(el, "ack", xid);
322			}
323		} else if (el.classList.contains("flogit-unsave")) {
324			el.onclick = function() {
325				flogit(el, "unsave", xid);
326			}
327		} else if (el.classList.contains("flogit-save")) {
328			el.onclick = function() {
329				flogit(el, "save", xid);
330			}
331		} else if (el.classList.contains("flogit-untag")) {
332			el.onclick = function() {
333				flogit(el, "untag", xid);
334			}
335		} else if (el.classList.contains("flogit-react")) {
336			el.onclick = function() {
337				flogit(el, "react", xid);
338			}
339		}
340	})
341}
342function showhonkform(elem, rid, hname) {
343	var form = lehonkform
344	form.style = "display: block"
345	if (elem) {
346		form.remove()
347		elem.parentElement.parentElement.parentElement.insertAdjacentElement('beforebegin', form)
348	} else {
349		hideelement(lehonkbutton)
350		elem = document.getElementById("honkformhost")
351		elem.insertAdjacentElement('afterend', form)
352	}
353	var ridinput = document.getElementById("ridinput")
354	var honknoise = document.getElementById("honknoise")
355	if (rid) {
356		ridinput.value = rid
357		if (hname) {
358			honknoise.value = hname + " "
359		} else {
360			honknoise.value = ""
361		}
362	} else {
363		ridinput.value = ""
364		honknoise.value = ""
365	}
366	var updateinput = document.getElementById("updatexidinput")
367	updateinput.value = ""
368	honknoise.focus()
369	return false
370}
371function cancelhonking() {
372	hideelement(lehonkform)
373	showelement(lehonkbutton)
374}
375function showelement(el) {
376	if (typeof(el) == "string")
377		el = document.getElementById(el)
378	if (!el) return
379	el.style.display = "block"
380}
381function hideelement(el) {
382	if (typeof(el) == "string")
383		el = document.getElementById(el)
384	if (!el) return
385	el.style.display = "none"
386}
387function updatedonker() {
388	var el = document.getElementById("donker")
389	el.children[1].textContent = el.children[0].value.slice(-20)
390	el = document.getElementById("donkdescriptor")
391	el.style.display = ""
392	el = document.getElementById("saveddonkxid")
393	el.value = ""
394}
395var checkinprec = 100.0
396var gpsoptions = {
397	enableHighAccuracy: false,
398	timeout: 1000,
399	maximumAge: 0
400};
401function fillcheckin() {
402	if (navigator.geolocation) {
403		navigator.geolocation.getCurrentPosition(function(pos) {
404			showelement("placedescriptor")
405			var el = document.getElementById("placelatinput")
406			el.value = Math.round(pos.coords.latitude * checkinprec) / checkinprec
407			el = document.getElementById("placelonginput")
408			el.value = Math.round(pos.coords.longitude * checkinprec) / checkinprec
409			checkinprec = 10000.0
410			gpsoptions.enableHighAccuracy = true
411			gpsoptions.timeout = 2000
412		}, function(err) {
413			showelement("placedescriptor")
414			var el = document.getElementById("placenameinput")
415			el.value = err.message
416		}, gpsoptions)
417	}
418}
419function addemu(elem) {
420	const data = elem.alt
421	const box = document.getElementById("honknoise");
422	box.value += data;
423}
424function loademus() {
425	var div = document.getElementById("emupicker")
426	var request = new XMLHttpRequest()
427	request.open('GET', '/emus')
428	request.onload = function() {
429		div.innerHTML = request.responseText
430		div.querySelectorAll(".emu").forEach(function(el) {
431			el.onclick = function() {
432				addemu(el)
433			}
434		})
435	}
436	if (div.style.display === "none") {
437		div.style.display = "block";
438	} else {
439		div.style.display = "none";
440	}
441	request.send()
442}
443
444// init
445(function() {
446	var me = document.currentScript;
447	csrftoken = me.dataset.csrf
448	curpagestate.name = me.dataset.pagename
449	curpagestate.arg = me.dataset.pagearg
450	tophid[curpagestate.name + ":" + curpagestate.arg] = me.dataset.tophid
451	servermsgs[curpagestate.name + ":" + curpagestate.arg] = me.dataset.srvmsg
452
453	var el = document.getElementById("homelink")
454	el.onclick = pageswitcher("home", "")
455	el = document.getElementById("atmelink")
456	el.onclick = pageswitcher("atme", "")
457	el = document.getElementById("firstlink")
458	el.onclick = pageswitcher("first", "")
459	el = document.getElementById("savedlink")
460	el.onclick = pageswitcher("saved", "")
461	el = document.getElementById("longagolink")
462	el.onclick = pageswitcher("longago", "")
463
464	var totop = document.querySelector(".nophone")
465	if (totop) {
466		totop.onclick = function() {
467			window.scrollTo(0,0)
468		}
469	}
470
471	var refreshbox = document.getElementById("refreshbox")
472	if (refreshbox) {
473		refreshbox.querySelectorAll("button").forEach(function(el) {
474			if (el.classList.contains("refresh")) {
475				el.onclick = function() {
476					refreshhonks(el)
477				}
478			} else if (el.classList.contains("scrolldown")) {
479				el.onclick = function() {
480					oldestnewest(el)
481				}
482			}
483		})
484
485		if (me.dataset.srvmsg == "one honk maybe more") {
486			hideelement(refreshbox)
487		}
488	}
489
490	var td = document.getElementById("timedescriptor")
491	document.getElementById("addtimebutton").onclick = function() {
492		td.classList.toggle("hide")
493	}
494	document.getElementById("honkingtime").onclick = function() {
495		return showhonkform()
496	}
497	document.getElementById("checkinbutton").onclick = fillcheckin
498	document.getElementById("emuload").onclick = loademus
499	document.querySelector("#donker input").onchange = updatedonker
500	document.querySelector("button[name=cancel]").onclick = cancelhonking
501
502	relinklinks()
503	window.onpopstate = statechanger
504	history.replaceState(curpagestate, "some title", "")
505
506	hideelement("donkdescriptor")
507})();