From 867da930a46ce0ca788b07ae53ad771807f7b3f5 Mon Sep 17 00:00:00 2001
From: Bel LaPointe <breel@qualtrics.com>
Date: Tue, 8 Feb 2022 16:49:45 -0700
Subject: [PATCH] traverse with urls

---
 spike/review/reinvent/ezmded/ui/index.html | 28 +++++++++++++++++-----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/spike/review/reinvent/ezmded/ui/index.html b/spike/review/reinvent/ezmded/ui/index.html
index a6f07b2..352384a 100644
--- a/spike/review/reinvent/ezmded/ui/index.html
+++ b/spike/review/reinvent/ezmded/ui/index.html
@@ -35,9 +35,27 @@
 		<script>
 			function init() {
 				drawTree()
+				function drawTreeLoop() {
+					drawTree()
+					setInterval(drawTreeLoop, 10000)
+				}
+				drawTreeLoop()
+				var queryF = getParameterByName("f")
+				console.log("init query f:", queryF)
+				if (queryF && queryF.length != "") {
+					drawFile(queryF)
+				}
+			}
+			function getParameterByName(name, url = window.location.href) {
+				name = name.replace(/[\[\]]/g, '\\$&');
+				var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
+					results = regex.exec(url);
+				if (!results) return null;
+				if (!results[2]) return '';
+				return decodeURIComponent(results[2].replace(/\+/g, ' '));
 			}
 			function drawFile(id) {
-				if (id.length < 1) {
+				if (!id || id.length < 1) {
 					return
 				}
 				http("GET", "/api/v0/files/"+id, (body, status, headers) => {
@@ -45,7 +63,7 @@
 						throw Exception(`ERR loading file: ${status}: ${body}`)
 					}
 					const pid = headers("pid")
-					document.getElementById("titlePath").innerHTML = `${pid ? "... / " : ""}<input type="button" value="${pid ? pid : ""}" onclick="drawFile('${pid}'); return false;"> / `
+					document.getElementById("titlePath").innerHTML = `${pid ? "... / " : ""}<a href="#?f=${pid ? pid : ""}"><input type="button" value="${pid ? pid : ""}" onclick="drawFile('${pid}');"></a> / `
 					if (!pid) {
 						document.getElementById("titlePath").innerHTML = "/"
 					}
@@ -62,7 +80,7 @@
 						<details open>
 							<summary>
 								<div>
-									<a href="#"><input type="button" value="${branch.Title}" onclick="drawFile('${id}'); return false;"/></a>
+									<a href="#?f=${id}"><input type="button" value="${branch.Title}" onclick="drawFile('${id}');"/></a>
 									<input type="button" value="+" onclick="alert('todo'); return false;"/>
 								</div>
 							</summary>
@@ -109,10 +127,8 @@
 				<article style="flex-grow: 1; margin-left: 1em;">
 					<h1 style="display: flex; flex-direction: row;">
 						<span id="titlePath">
-							<a href="#">Tree</a> /
-							<a href="#">L1</a> /
 						</span>
-						<span id="title" contenteditable style="flex-grow: 1;">L2</span>
+						<span id="title" contenteditable style="flex-grow: 1;"></span>
 					</h1>
 					<textarea id="my-text-area"></textarea>
 				</article>