From: will <greenwoodw50@gmail.com>
Date: Wed, 28 Aug 2024 23:44:13 +0000 (+0100)
Subject: Added autocue doomsday clock
X-Git-Url: https://git.ozva.co.uk/?a=commitdiff_plain;p=shopping-channel

Added autocue doomsday clock

+ Assets directory
---

diff --git a/assets/arrow.svg b/assets/arrow.svg
new file mode 100644
index 0000000..53f7a23
--- /dev/null
+++ b/assets/arrow.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200"
+   height="200"
+   viewBox="0 0 52.916665 52.916666"
+   version="1.1"
+   id="svg5"
+   inkscape:export-filename="clock.svg"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#5b5b5b"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="true"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showgrid="false" />
+  <defs
+     id="defs2">
+    <marker
+       style="overflow:visible"
+       id="Arrow1L"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       inkscape:stockid="Arrow1L"
+       markerWidth="5"
+       markerHeight="2.8571429"
+       viewBox="0 0 8.75 5"
+       inkscape:isstock="true"
+       inkscape:collect="always"
+       preserveAspectRatio="xMidYMid">
+      <path
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         d="M 0,0 5,-5 -12.5,0 5,5 Z"
+         id="arrow1L"
+         transform="scale(-0.5)" />
+    </marker>
+  </defs>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <circle
+       style="display:none;fill:none;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:none;stroke-opacity:1"
+       id="path111"
+       cx="26.458334"
+       cy="26.45833"
+       r="25.135416" />
+    <circle
+       style="display:none;fill:none;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:1.17475, 1.32292;stroke-dashoffset:0.529167;stroke-opacity:1"
+       id="path111-3"
+       cx="26.458334"
+       cy="26.458334"
+       r="23.846424"
+       inkscape:export-filename="clock.svg"
+       inkscape:export-xdpi="103.64"
+       inkscape:export-ydpi="103.64" />
+    <path
+       style="display:inline;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:none;stroke-dashoffset:2;stroke-opacity:1;marker-end:url(#Arrow1L)"
+       d="M 26.458333,26.458333 V 9.2604167"
+       id="path2766"
+       sodipodi:nodetypes="cc" />
+  </g>
+</svg>
diff --git a/assets/clock.svg b/assets/clock.svg
new file mode 100644
index 0000000..3ccaec9
--- /dev/null
+++ b/assets/clock.svg
@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="200"
+   height="200"
+   viewBox="0 0 52.916665 52.916666"
+   version="1.1"
+   id="svg5"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview7"
+     pagecolor="#5b5b5b"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="true"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showgrid="false" />
+  <defs
+     id="defs2">
+    <marker
+       style="overflow:visible"
+       id="Arrow1L"
+       refX="0"
+       refY="0"
+       orient="auto-start-reverse"
+       inkscape:stockid="Arrow1L"
+       markerWidth="5"
+       markerHeight="2.8571429"
+       viewBox="0 0 8.75 5"
+       inkscape:isstock="true"
+       inkscape:collect="always"
+       preserveAspectRatio="xMidYMid">
+      <path
+         style="fill:context-stroke;fill-rule:evenodd;stroke:none"
+         d="M 0,0 5,-5 -12.5,0 5,5 Z"
+         id="arrow1L"
+         transform="scale(-0.5)" />
+    </marker>
+  </defs>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <circle
+       style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:none;stroke-opacity:1"
+       id="path111"
+       cx="26.458334"
+       cy="26.45833"
+       r="25.135416" />
+    <circle
+       style="display:inline;fill:none;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:1.17475, 1.32292;stroke-dashoffset:0.529167;stroke-opacity:1"
+       id="path111-3"
+       cx="26.458334"
+       cy="26.458334"
+       r="23.846424"
+       inkscape:export-filename="clock.svg"
+       inkscape:export-xdpi="103.64"
+       inkscape:export-ydpi="103.64" />
+    <path
+       style="display:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.32292;stroke-dasharray:none;stroke-dashoffset:2;stroke-opacity:1;marker-end:url(#Arrow1L)"
+       d="M 26.458333,26.458333 V 9.2604167"
+       id="path2766"
+       sodipodi:nodetypes="cc" />
+  </g>
+</svg>
diff --git a/assets/star.svg b/assets/star.svg
new file mode 100644
index 0000000..dab960a
--- /dev/null
+++ b/assets/star.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="400"
+   height="400"
+   viewBox="0 0 105.83333 105.83333"
+   version="1.1"
+   id="svg1"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs1" />
+  <metadata
+     id="metadata1">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <path
+     style="fill:#bd0000;fill-opacity:1;stroke-width:0.264798;stroke-dasharray:none"
+     id="path1"
+     d="M 71.019533,63.52164 69.13196,77.122826 56.678371,71.338072 48.243092,82.173258 40.350345,70.93672 27.627586,76.102627 26.410535,62.425126 12.809349,60.537554 18.594102,48.083965 7.7589164,39.648686 18.995454,31.755938 13.829547,19.03318 27.507048,17.816129 29.394621,4.214943 41.84821,9.9996963 50.283489,-0.83548968 58.176236,10.401048 70.898995,5.2351411 l 1.217051,13.6775009 13.601186,1.887573 -5.784754,12.453589 10.835186,8.435278 -11.236537,7.892748 5.165907,12.722759 z"
+     transform="matrix(1.274966,0,0,1.274966,-9.8923536,1.065222)" />
+</svg>
diff --git a/autocue/index.html b/autocue/index.html
index 4b53a5c..51b0c8f 100644
--- a/autocue/index.html
+++ b/autocue/index.html
@@ -19,6 +19,17 @@ body {
 	bottom: 0;
 	left: 0;
 	margin: 20px;
+}
+#clock {
+	position: absolute;
+	bottom: 0;
+	right: 0;
+	width: 250px;
+	height: 250px;
+	margin: 10px;
+}
+#arrow {
+	transition: transform 1.5s;
 }
 		</style>
 		<script>
@@ -76,6 +87,12 @@ function update() {
 			left.innerHTML = Math.round(data[itemId].stockCount * unsold);
 			stock.innerHTML = data[itemId].stockCount;
 
+		})
+	fetch("../clock.json", {cache: "no-store"})
+		.then(data => data.json())
+		.then(data => {
+			document.getElementById("arrow").style.transform = `rotate(${data.currentPosition}deg)`;
+
 		})
 	fetch("../note", {cache: "no-store"})
 		.then(data => data.text())
@@ -99,5 +116,8 @@ setInterval(update, 1000);
 			T3: <span style="background-color: blue; margin-right: 40px;" class="time"></span>
 			Left: <span id="left"></span>/<span id="stock"></span>
 		</div>
+		<div id="clock">
+			<img style="width: 100%; margin-right: -100%;" src="../assets/clock.svg"><img id="arrow" style="width: 100%;" src="../assets/arrow.svg">
+		</div>
 	</body>
 </html>
diff --git a/index.html b/index.html
index 768f746..497a0c5 100644
--- a/index.html
+++ b/index.html
@@ -704,7 +704,7 @@ setInterval(draw, 500)
 				<hr>
 				<h4 id="origionalPrice">Origional Price</h4>
 				<div class="badgeContainer">
-					<img class="badge" src="./star.svg"></img>
+					<img class="badge" src="./assets/star.svg"></img>
 					<h2 class="badge" id="badgeText">Percent off</h2>
 				</div>
 			</div>
diff --git a/star.svg b/star.svg
deleted file mode 100644
index dab960a..0000000
--- a/star.svg
+++ /dev/null
@@ -1,33 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   width="400"
-   height="400"
-   viewBox="0 0 105.83333 105.83333"
-   version="1.1"
-   id="svg1"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:dc="http://purl.org/dc/elements/1.1/">
-  <defs
-     id="defs1" />
-  <metadata
-     id="metadata1">
-    <rdf:RDF>
-      <cc:Work
-         rdf:about="">
-        <dc:format>image/svg+xml</dc:format>
-        <dc:type
-           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-      </cc:Work>
-    </rdf:RDF>
-  </metadata>
-  <path
-     style="fill:#bd0000;fill-opacity:1;stroke-width:0.264798;stroke-dasharray:none"
-     id="path1"
-     d="M 71.019533,63.52164 69.13196,77.122826 56.678371,71.338072 48.243092,82.173258 40.350345,70.93672 27.627586,76.102627 26.410535,62.425126 12.809349,60.537554 18.594102,48.083965 7.7589164,39.648686 18.995454,31.755938 13.829547,19.03318 27.507048,17.816129 29.394621,4.214943 41.84821,9.9996963 50.283489,-0.83548968 58.176236,10.401048 70.898995,5.2351411 l 1.217051,13.6775009 13.601186,1.887573 -5.784754,12.453589 10.835186,8.435278 -11.236537,7.892748 5.165907,12.722759 z"
-     transform="matrix(1.274966,0,0,1.274966,-9.8923536,1.065222)" />
-</svg>