--- /dev/null
+<?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>
--- /dev/null
+<?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>
--- /dev/null
+<?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>
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>
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())
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>
<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>
+++ /dev/null
-<?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>