From 220a8d480e2b1e01fadc8b34b2bf6e286fdb22c7 Mon Sep 17 00:00:00 2001
From: Michael Wallner <mike@php.net>
Date: Fri, 11 Feb 2022 14:38:59 +0100
Subject: [PATCH] remove external deps

---
 public/index.css   | 35 +++++++++++++----
 public/index.js    | 96 ++++++++++++++++++++--------------------------
 views/layout.phtml |  7 ----
 3 files changed, 70 insertions(+), 68 deletions(-)

diff --git a/public/index.css b/public/index.css
index 063b6a1..5ce2db6 100644
--- a/public/index.css
+++ b/public/index.css
@@ -1,12 +1,19 @@
 html {
-	font-size: 18px;
+	font-size: 16px;
 }
 html, body{
 	height: 100%;
 	min-height: 100%;
 }
 body, code {
-	font-family: Inconsolata, 'Inconsolata Awesome', 'Andale Mono', Monaco, 'Courier New', Courier, monospace;
+	font-family:
+			'DejaVu Sans Mono', 'Liberation Mono',
+			'Andale Mono', Monaco, Menlo,
+			monospace;
+	/*
+		Mitra Mono has broken kerning?
+		Ubuntu Mono is too small!
+	 */
 }
 body {
 	line-height: 1.5;
@@ -175,6 +182,21 @@ a.permalink {
 	color: #999999;
 	opacity: 0.25;
 }
+.blink {
+	color: red !important;
+}
+.fade-out {
+	opacity: 0;
+}
+.fade-in {
+	opacity: 1;
+}
+.trans-slow {
+	transition: all 600ms;
+}
+.trans-fast {
+	transition: all 200ms;
+}
 
 .var {
 	color: #800000;
@@ -261,13 +283,12 @@ li h3 a:hover {
 	text-decoration: underline;
 }
 
-#disqus_thread {
-	margin-top: 8em;
-	margin-right: 2em;
+.comments {
+	width: 80%;
 }
-#disqus_activator {
+.comments .activator {
+	width: 100%;
 	margin: auto;
-	width: 80%;
 	padding: 1em;
 	background-color: slategrey;
 	color: white;
diff --git a/public/index.js b/public/index.js
index 5c4d8f1..e9b65c1 100644
--- a/public/index.js
+++ b/public/index.js
@@ -1,61 +1,49 @@
 "use strict";
 
-$(function() {
-	var mdref = {
-		log: function log() {
-			console.log.apply(console, arguments);
-		},
-		blink: function blink(c) {
-			var $c = $(c);
-
-			$c.fadeOut("fast").queue(function(next) {
-				this.style.color = "red";
-				next();
-			}).fadeIn("fast").fadeOut("slow").queue(function(next) {
-				this.style.color = "";
-				next();
-			}).fadeIn("slow");
-		},
-		hashchange: function hashchange() {
-			if (location.hash.length > 1) {
-				var hash = decodeURIComponent(location.hash.substring(1));
-				var e;
-				if ((e = document.getElementById(location.hash.substring(1)))) {
-					mdref.blink(e);
-				} else {
-					var scrolled = false;
-
-					if (hash.substring(hash.length-1) === "*") {
-						hash = hash.substring(0, hash.length-1);
-					}
-					$((hash.substring(0,1) === "$") ? ".var" : ".constant").each(function(i, c) {
-						if (c.textContent.substring(0, hash.length) === hash) {
-							if (!scrolled) {
-								$(window).scrollTop($(c).offset().top - 100);
-								scrolled = true;
-							}
-							mdref.blink(c);
-						}
-					});
+document.addEventListener("DOMContentLoaded", function() {
+	const doTransition = function(e, trans, state, speed) {
+		e.classList.remove(trans + "-in", trans + "-out", "trans-slow", "trans-fast");
+		e.classList.add(trans + "-" + state, "trans-" + speed);
+		return (cb) => setTimeout(cb, speed === "slow" ? 600 : 200);
+	};
+	const letElementBlink = function(e, last) {
+		setTimeout(() => doTransition(e, "fade", "out", "fast")(function() {
+			e.classList.add("blink");
+			doTransition(e, "fade", "in", "fast")(function() {
+				e.classList.remove("blink");
+				doTransition(e, "fade", "out", "slow")(function () {
+					doTransition(e, "fade", "in", "slow");
+				});
+			});
+		}), 200);
+	};
+	const onHashChange = function() {
+		if (location.hash.length > 1) {
+			let hash = decodeURIComponent(location.hash.substring(1));
+			let e = document.getElementById(hash) || document.getElementById(location.hash.substring(1));
+			if (e) {
+				letElementBlink(e);
+			} else {
+				if (hash.substring(hash.length-1) === "*") {
+					hash = hash.substring(0, hash.length-1);
 				}
+				let klass = (hash.substring(0,1) === "$") ? "var" : "constant";
+				let scrolled = false;
+				Array.prototype.forEach.call(document.getElementsByClassName(klass), function(e) {
+					if (e.textContent.substring(0, hash.length) !== hash) {
+						return;
+					}
+					if (!scrolled) {
+						scrolled = true;
+						window.scrollTo(0, e.offsetTop > 64 ? e.offsetTop - 64 : 0);
+					}
+					letElementBlink(e);
+				});
 			}
 		}
 	};
 
-	$(window).on("hashchange", mdref.hashchange);
-	mdref.hashchange();
-
-	$("#disqus_activator").on("click", function() {
-		var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
-		dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
-		(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
-	});
-	$.ajax("https://disqus.com/api/3.0/threads/details.json?thread:ident="+(disqus_identifier||"index")+"&forum=mdref&api_key=VmhVG4z5jjtY8SCaMstOjfUuwniMv43Xy9FCU9YfEzhsrl95dNz1epykXSJn8jt9"). then(function(json) {
-		if (json && json.response) {
-			$("#disqus_activator span").text(json.response.posts);
-		}
-	});
-	setTimeout(function() {
-		$("footer").addClass("hidden");
-	}, 1000);
-});
+	onHashChange();
+	window.addEventListener("hashchange", onHashChange);
+	setTimeout(()=>document.getElementsByTagName("footer")[0].classList.add("hidden"), 1000);
+})
diff --git a/views/layout.phtml b/views/layout.phtml
index e49d520..b0e96a8 100644
--- a/views/layout.phtml
+++ b/views/layout.phtml
@@ -17,8 +17,6 @@
 			<link rel="stylesheet" href="index.css">
 		<?php endif; ?>
 
-		<link href="https://fonts.googleapis.com/css?family=Inconsolata&amp;subset=latin-ext" rel="stylesheet">
-		<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
 		<link rel="shortcut icon" href="<?= $baseUrl . "favicon.ico" ?>">
 	</head>
 	<body>
@@ -32,11 +30,6 @@
 			<?php include __DIR__."/index.phtml" ?>
 		<?php endif; ?>
 
-			<div id="disqus_thread"><button id="disqus_activator">Show <span> </span> Comment(s)</button></div>
-			<script>
-				var disqus_shortname = 'mdref';
-				var disqus_identifier = '<?=$ref?>';
-			</script>
 
 			<footer>
 				<?php include __DIR__."/footer.phtml" ?>
-- 
2.30.2