From 293fc20c6b040ef6ea7026396b67838f90a25a57 Mon Sep 17 00:00:00 2001
From: etherware-novice <73374039+etherware-novice@users.noreply.github.com>
Date: Sun, 25 Aug 2024 11:21:54 -0500
Subject: [PATCH] webboot searchbar

---
 personal/webboot/index.css  | 27 +++++++++----
 personal/webboot/index.html | 75 ++++++++++++++++++++++++-------------
 2 files changed, 69 insertions(+), 33 deletions(-)

diff --git a/personal/webboot/index.css b/personal/webboot/index.css
index 5689d56..10ba088 100644
--- a/personal/webboot/index.css
+++ b/personal/webboot/index.css
@@ -27,10 +27,17 @@ html {
 	background-color: white;
 }
 
-#links {
+#poketch-int {
 	position: absolute;
-	top: 15%; left: 6%;
-	width: 75%; height: 65%;
+	width: 67%; height: 71%;
+	left: 10%; top: 12%;
+	overflow-y: scroll;
+}
+#poketch-int::-webkit-scrollbar { display: none; }
+#poketch-int { -ms-overflow-style: none; scrollbar-width: none; }
+
+#links {
+	width: 100%; height: 100%;
 	margin: auto;
 	text-align: center;
 
@@ -62,15 +69,13 @@ html {
 	height: 60vh; width: 40vw;
 	bottom: -5vw;
 	left: 32vw;
-
-	overflow: scroll;
 }
-#poketch>img { width: 100%; }
+#poketch>img { width: 95%; position: absolute; }
 #poketch a { color: inherit; text-decoration: none; }
 
 #swatchClock {
 	position: absolute;
-	top: 40%; width: 83%;
+	top: 40%; width: 100%;
 	text-align: center;
 	font-size: 6rem;
 	margin: auto;
@@ -102,3 +107,11 @@ html {
 	font-family: LCDNUM;
 	font-size: 3rem;
 }
+
+#searchbar {
+	width: 75%; height: 1.5rem;
+	margin: 10px;
+}
+
+#searchgo { height: 1.5rem; margin: 10px; }
+#searchselect { width: 95%; }
diff --git a/personal/webboot/index.html b/personal/webboot/index.html
index 443c962..c744d0c 100644
--- a/personal/webboot/index.html
+++ b/personal/webboot/index.html
@@ -31,32 +31,46 @@ layout: null
 
 		<div id="poketch" class="border">
 			<img src="images/poketch.png" usemap="#map">
-			<p id="swatchClock"></p>
-			<div id="links">
-				<a href="https://bsky.app">
-					<img src="images/icons1.png">
-					<p>bluesky</p>
-				</a>
-				<a href="https://tumblr.com">
-					<img src="images/icons2.png">
-					<p>tumblr</p>
-				</a>
-				<a href="https://forum.melonland.net/index.php">
-					<img src="images/icons3.png">
-					<p>melonforum</p>
-				</a>
-				<a href="https://neocities.org">
-					<img src="images/icons4.png">
-					<p>neocities</p>
-				</a>
-				<a href="https://minesweeper.online">
-					<img src="images/icons5.png">
-					<p>mines</p>
-				</a>
-				<a href="/personal/pokeblog">
-					<img src="images/icons6.png">
-					<p>my pokeblog</p>
-				</a>
+			<div id="poketch-int">
+				<p id="swatchClock"></p>
+				<div id="links">
+
+					<select id="searchselect">
+						<option value="https://duckduckgo.com/?q=">DuckDuckGo</option>
+						<option value="https://en.wikipedia.org/w/index.php?go=Go&search=">Wikipedia</option>
+						<option disabled>--code pages--</option>
+						<option value="https://github.com/search?q=">Github</option>
+						<option value="https://archive.org/search?query=">Internet Archive</option>
+						<option value="http://theoldnet.com/find?query=">TheOldNet</option>
+					</select>
+					<input type="text" id="searchbar">
+
+					<img src="images/icons6.png" id="searchgo" onclick="searchwww()">
+					<a href="https://bsky.app">
+						<img src="images/icons1.png">
+						<p>bluesky</p>
+					</a>
+					<a href="https://tumblr.com">
+						<img src="images/icons2.png">
+						<p>tumblr</p>
+					</a>
+					<a href="https://forum.melonland.net/index.php">
+						<img src="images/icons3.png">
+						<p>melonforum</p>
+					</a>
+					<a href="https://neocities.org">
+						<img src="images/icons4.png">
+						<p>neocities</p>
+					</a>
+					<a href="https://minesweeper.online">
+						<img src="images/icons5.png">
+						<p>mines</p>
+					</a>
+					<a href="/personal/pokeblog">
+						<img src="images/icons6.png">
+						<p>my pokeblog</p>
+					</a>
+				</div>
 			</div>
 		</div>
 
@@ -93,6 +107,15 @@ layout: null
 				return quotesel;
 			}
 
+			function searchwww() {
+				var url = document.getElementById("searchbar");
+				var searcher = document.getElementById("searchselect");
+				if(url.value && searcher.value)
+				{
+					window.location.assign(searcher.value + encodeURI(url.value));
+				}
+			}
+
 			dispTime();
 			setInterval(updateFancyTime, 1000);
 		</script>