all repos — honk @ a4404276b31370652ab7cf8734096a153344ccd2

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	}
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		}
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	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	document.getElementById("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	var el = document.getElementById("donkdescriptor")
391	el.style.display = ""
392	var 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			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	div = document.getElementById("emupicker")
426	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})();