From a324b33294551d340482f75c67b439885b847206 Mon Sep 17 00:00:00 2001
From: Ted Unangst <tedu@tedunangst.com>
Date: Tue, 29 Oct 2019 00:26:05 -0400
Subject: [PATCH] glow effect for new honks

---
 views/honkpage.js | 21 ++++++++++++++++-----
 views/style.css   |  4 ++++
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/views/honkpage.js b/views/honkpage.js
index 27746a5..420c656 100644
--- a/views/honkpage.js
+++ b/views/honkpage.js
@@ -66,7 +66,14 @@ function flogit(el, how, xid) {
 var lehonkform = document.getElementById("honkform")
 var lehonkbutton = document.getElementById("honkingtime")
 
-function fillinhonks(xhr) {
+function removeglow() {
+	var els = document.getElementsByClassName("glow")
+	while (els.length) {
+		els[0].classList.remove("glow")
+	}
+}
+
+function fillinhonks(xhr, glowit) {
 	var doc = xhr.responseXML
 	var stash = curpagestate.name + ":" + curpagestate.arg
 	tophid[stash] = doc.children[0].children[1].children[0].innerText
@@ -88,10 +95,13 @@ function fillinhonks(xhr) {
 	var holder = honksonpage.children[0]
 	var lenhonks = honks.length
 	for (var i = honks.length; i > 0; i--) {
+		var h = honks[i-1]
+		if (glowit)
+			h.classList.add("glow")
 		if (frontload) {
-			holder.prepend(honks[i-1])
+			holder.prepend(h)
 		} else {
-			holder.append(honks[i-1])
+			holder.append(h)
 		}
 			
 	}
@@ -118,13 +128,14 @@ function refreshupdate(msg) {
 	}
 }
 function refreshhonks(btn) {
+	removeglow()
 	btn.innerHTML = "refreshing"
 	btn.disabled = true
 	var args = hydrargs()
 	var stash = curpagestate.name + ":" + curpagestate.arg
 	args["tophid"] = tophid[stash]
 	get("/hydra?" + encode(args), function(xhr) {
-		var lenhonks = fillinhonks(xhr)
+		var lenhonks = fillinhonks(xhr, true)
 		btn.innerHTML = "refresh"
 		btn.disabled = false
 		refreshupdate(" " + lenhonks + " new")
@@ -166,7 +177,7 @@ function switchtopage(name, arg) {
 		// or create one and fill it
 		honksonpage.prepend(document.createElement("div"))
 		var args = hydrargs()
-		get("/hydra?" + encode(args), fillinhonks)
+		get("/hydra?" + encode(args), function(xhr) { fillinhonks(xhr, false) })
 	}
 	refreshupdate("")
 }
diff --git a/views/style.css b/views/style.css
index 7c431c3..cc104dc 100644
--- a/views/style.css
+++ b/views/style.css
@@ -152,6 +152,10 @@ input[type=file] {
 	display: none;
 }
 
+.glow {
+	box-shadow: 0px 0px 16px $fg;
+}
+
 .honk {
 	margin: auto;
 	background: $bg-dark;