]> OzVa Git service - shopping-channel/commitdiff
Small changes and pricing extension
authorMax Value <greenwoodw50@gmail.com>
Sat, 12 Apr 2025 15:37:10 +0000 (16:37 +0100)
committerMax Value <greenwoodw50@gmail.com>
Sat, 12 Apr 2025 15:37:10 +0000 (16:37 +0100)
+ favicons to all pages
+ pricing extension
- sigils other than one

16 files changed:
extensions/pricing.html
extensions/pricing.js [new file with mode: 0644]
extensions/product.html
schema
static/assets/fringe.svg [new file with mode: 0644]
static/static.json
templates/admin.html
templates/autocue.html
templates/clock.html
templates/display.html [new file with mode: 0644]
templates/docs.html
templates/gfx.html
templates/price.html
templates/sounds.html
templates/text.html
templates/timer.html

index 8404bfde14516085f2ec3f38d6e8995ea6d1b09c..cbb5f35af7f70b9fd7bff8154ddea632d1a773b8 100644 (file)
@@ -3,12 +3,72 @@
        <head>
                <meta charset="utf-8">
                <title>XMDV</title>
+
+               <link rel="preconnect" href="https://fonts.googleapis.com">
+               <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+               <link href="https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&family=Pacifico&display=swap" rel="stylesheet">
+
                <style>
+
+body {
+       background-color: white;
+       font-family: "Archivo", sans-serif;
+    color: black;
+}
+#main > *:not(hr) {
+       margin: 5px;
+}
+#rating {
+    margin: 5px;
+    margin-top: 0;
+    font-size: 2em;
+    line-height: 1em;
+    background-color: purple;
+    box-shadow: pink 0px 1px 3px, pink 0px 1px 2px;
+    transition: color 1.5s;
+}
+#subtext {
+    color: white;
+    font-family: "Pacifico", cursive;
+    background-color: violet;
+}
+hr {
+       margin: 0 1vh;
+       padding: 0;
+       border-color: var(--dark);
+}
+
+.white {
+    color: rgba(255,255,255,1);
+    transition: color 1.5s;
+}
+.black {
+    color: rgba(0,0,0,1);
+    transition: color 1.5s;
+}
+#main.hide > .white {
+    color: rgba(255,255,255,0);
+}
+#main.hide > .black {
+    color: rgba(0,0,0,0);
+}
+
                </style>
                <script src="https://extension-files.twitch.tv/helper/v1/twitch-ext.min.js"></script>
+               <script src="./pricing.js"></script>
        </head>
        <body>
-               <h1>This is some text</h1>
-               <h2>You are accesing the pricing version of this document.</h2>
-       </body>
+               <div id="main">
+                       <h1 class="black" id="code">XMDV</h1>
+                       <h3 class="white" id="rating">&starf;&starf;&starf;&starf;&starf;</h3>
+                       <h2 class="white" id="subtext">Back soon!</h2>
+                       <h3 class="black" id="description">Please wait... XMDV will be back soon!</h3>
+
+                       <hr>
+
+                       <h3 class="black">Now Only: <span id="price"></span></h3>
+               </div>
+               <div id="buy">
+                       <img src="https://shopping.ozva.co.uk/static/assets/fringe.svg"></img>
+               </div>
 </html>
diff --git a/extensions/pricing.js b/extensions/pricing.js
new file mode 100644 (file)
index 0000000..1f17b46
--- /dev/null
@@ -0,0 +1,62 @@
+let pastId = 0;
+
+function update() {
+
+       // setup and hide the main element & the image element
+       const main = document.getElementById("main");
+
+       const code = document.getElementById("code");
+       const rating = document.getElementById("rating");
+       const subtext = document.getElementById("subtext");
+       const description = document.getElementById("description");
+
+       const price = document.getElementById("price");
+
+
+       fetch("https://shopping.ozva.co.uk/api/items", {cache: "default"})
+       .then(data => data.json())
+       .then(dataStatic => {
+               fetch("https://shopping.ozva.co.uk/api", {cache: "no-store"})
+               .then(data => data.json())
+               .then(data => {
+
+                       // some variable setup
+                       let id = data.item_id;
+
+                       // change the data if the id is different
+                       if (id != pastId) {
+                               main.classList.add("hide");
+
+                               const items = dataStatic.items;
+                               const item = items[id];
+
+                               // register function to change the data when the animation is done
+                               setTimeout(function () {
+
+                                       code.innerHTML = item.code;
+                                       rating.innerHTML = item.rating;
+                                       subtext.innerHTML = item.subtext;
+                                       description.innerHTML = item.description;
+
+                                       let priceValue = item.origional_price * (data.discount / 100);
+
+                                       if (data.bool_rounding) {
+                                               priceValue = Math.round(priceValue * 100) / 100;
+                                       }
+
+                                       if (items[id].prefix) {
+                                               price.innerHTML = `${items[id].currency}${priceValue}`;
+                                       } else {
+                                               price.innerHTML = `${priceValue}${items[id].currency}`;
+                                               }
+
+                                       main.classList.remove("hide");
+                                       pastId = id;
+
+                               }, 1500);
+                       }
+               });
+       });
+}
+
+setInterval(update, 5000);
index 823ad2dcdb0a1fc402c8090f6b6d33937d6796ff..f64f78ce14e534fdba37d34962e637c609ef9ba2 100644 (file)
@@ -3,6 +3,11 @@
        <head>
                <meta charset="utf-8">
                <title>XMDV</title>
+
+               <link rel="preconnect" href="https://fonts.googleapis.com">
+               <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+               <link href="https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
+
                <style>
 body {
        overflow: hidden;
@@ -45,7 +50,7 @@ body {
        width: 100vw;
        color: white;
        text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
-       font-family: sans-serif;
+       font-family: "Archivo", sans-serif;
        font-size: 5vw;
        line-height: 10vw;
        text-align: left;
diff --git a/schema b/schema
index c117b71527cf7a2aeecdca7e6ffb49c06c319933..a2a35afd170a53acaae90579e4b8f7d40a41f490 100644 (file)
--- a/schema
+++ b/schema
@@ -16,10 +16,7 @@ CREATE TABLE state (
        bool_product INTEGER,
        bool_extra INTEGER,
        bool_banner INTEGER,
-       bool_sigil_1 INTEGER,
-       bool_sigil_2 INTEGER,
-       bool_sigil_3 INTEGER,
-       bool_sigil_4 INTEGER,
+       bool_sigil INTEGER,
        bool_number INTEGER,
        end_timer_1 INTEGER,
        end_timer_2 INTEGER,
@@ -61,10 +58,7 @@ INSERT INTO state (
        bool_product,
        bool_extra,
        bool_banner,
-       bool_sigil_1,
-       bool_sigil_2,
-       bool_sigil_3,
-       bool_sigil_4,
+       bool_sigil,
        bool_number,
        end_timer_1,
        end_timer_2,
@@ -85,4 +79,4 @@ INSERT INTO state (
        movement_speed,
        movement_function,
        shout,
-       note) VALUES (1, 0, 0.0, 0.0, 0.0, 0.0, 0.0, 50, 100, 0, '[0,1]', 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 2, 2, 2, 2, 2, 2, 0, 0, 40, 'linear', 'test shout', 'test note');
+       note) VALUES (1, 0, 0.0, 0.0, 0.0, 0.0, 0.0, 50, 100, 0, '[0,1]', 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 2, 2, 2, 2, 2, 2, 0, 0, 40, 'linear', 'test shout', 'test note');
diff --git a/static/assets/fringe.svg b/static/assets/fringe.svg
new file mode 100644 (file)
index 0000000..fb37c05
--- /dev/null
@@ -0,0 +1,195 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="100mm"
+   height="100mm"
+   viewBox="0 0 100 100"
+   version="1.1"
+   id="svg1"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   sodipodi:docname="fringe.svg"
+   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="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showguides="true"
+     inkscape:zoom="0.9030063"
+     inkscape:cx="238.09358"
+     inkscape:cy="126.24497"
+     inkscape:window-width="1366"
+     inkscape:window-height="704"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1">
+    <sodipodi:guide
+       position="9.9999999,100"
+       orientation="-1,0"
+       id="guide1"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="20,86.649613"
+       orientation="-1,0"
+       id="guide2"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="30,89.383232"
+       orientation="-1,0"
+       id="guide3"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="40,76.46072"
+       orientation="-1,0"
+       id="guide4"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="50,90.28585"
+       orientation="-1,0"
+       id="guide5"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="60,69.17788"
+       orientation="-1,0"
+       id="guide6"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="69.999999,77.257188"
+       orientation="-1,0"
+       id="guide7"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="20,94.999999"
+       orientation="0,1"
+       id="guide8"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="79.999999,85.88301"
+       orientation="-1,0"
+       id="guide9"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="89.999999,84.382394"
+       orientation="-1,0"
+       id="guide10"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="0,99.999999"
+       orientation="0,-1"
+       id="guide11"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="5,112.399"
+       orientation="-1,0"
+       id="guide12"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="15,115.37717"
+       orientation="-1,0"
+       id="guide13"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="25,112.1358"
+       orientation="-1,0"
+       id="guide14"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="35,111.08752"
+       orientation="-1,0"
+       id="guide15"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="45,109.7168"
+       orientation="-1,0"
+       id="guide16"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="55,108.44514"
+       orientation="-1,0"
+       id="guide17"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="65,108.05456"
+       orientation="-1,0"
+       id="guide18"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="74.999999,106.95804"
+       orientation="-1,0"
+       id="guide19"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="84.999999,97.499999"
+       orientation="-1,0"
+       id="guide20"
+       inkscape:locked="false"
+       inkscape:label=""
+       inkscape:color="rgb(0,134,229)" />
+    <sodipodi:guide
+       position="94.999999,97.499999"
+       orientation="1,0"
+       id="guide21"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
+  <defs
+     id="defs1" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <path
+       style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:3;stroke-linecap:round;paint-order:markers stroke fill"
+       d="M 0,0 5,5 9.9999997,0 15,5 l 5,-5 5,5 5,-5 5.000001,5 4.999998,-5 5,5 L 50,0 l 5,5 5.000001,-5 4.999998,5 5,-5 L 75,5 l 4.999998,-5 5,5 5.000001,-5 5,5 4.999998,-5 V 100 H 0 Z"
+       id="path21-5" />
+    <path
+       style="fill:#ffa32a;fill-opacity:1;stroke:none;stroke-width:3;stroke-linecap:round;paint-order:markers stroke fill"
+       d="m 0,0.5000002 5,5.0000001 5,-5.0000001 5,5.0000001 5,-5.0000001 5,5.0000001 5,-5.0000001 5.000001,5.0000001 4.999998,-5.0000001 5,5.0000001 L 50,0.5000002 l 5,5.0000001 5.000001,-5.0000001 4.999998,5.0000001 5,-5.0000001 L 75,5.5000003 l 4.999998,-5.0000001 5,5.0000001 5.000001,-5.0000001 5,5.0000001 L 100,0.5 v 100 H 0 Z"
+       id="path21" />
+  </g>
+</svg>
index 1b2598dd7833821ae2693f2d6e554eb7d7d6ab03..19fa2fd0a018298a991cf3ad0eefc93d565e8266 100755 (executable)
                {
                        "code":"XMDV",
                        "rating":"&starf;&starf;&starf;&starf;&starf;",
-                       "subtext":"Starting soon!",
-                       "description":"The show will be starting soon!",
+                       "subtext":"Back soon!",
+                       "description":"Please wait... XMDV will be back soon!",
                        "currency":" Units",
                        "prefix":false,
                        "origional_price":1,
index f7dae2ec21f151dc7c70fddffdf1128629a7df01..bb9cc3f5867bacdf543a3f71448be489190a4e0b 100644 (file)
@@ -2,11 +2,20 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Admin</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star4.svg">
        </head>
        <body>
                <h1>Hello!</h1>
                <h2>Get ready!</h2>
+               <fieldset>
+                       <legend>Facing</legend>
+                       <ul>
+                               <li><a href="/">GFX Main page</a></li>
+                               <li><a href="/autocue">Autocue</a></li>
+                               <li><a href="/display">Information display</a></li>
+                       </ul>
+               </fieldset>
                <fieldset>
                        <legend>Control pannels</legend>
                        <ul>
index e16330b6019aa57e8e63f947ef6353750242c51d..31caa057d2a84b69437c0b536a5c9c6fa43191c6 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Autocue</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star3.svg">
                <style>
 body {
        font-family: sans-serif;
index 00b3d6d654a9641e944e018e1c187afc46133872..114892cf4da4183ec6c721df9ab9f6882404f0c7 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Admin - Doomsday</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star2.svg">
                <style>
 /*
 clock styling
diff --git a/templates/display.html b/templates/display.html
new file mode 100644 (file)
index 0000000..f03eedb
--- /dev/null
@@ -0,0 +1,125 @@
+<!DOCTYPE html>
+<html lang="en">
+       <head>
+               <meta charset="utf-8">
+               <title>XMDV Display</title>
+               <style>
+body {
+       font-family: sans-serif;
+       color: white;
+       background-color: black;
+}
+#slider {
+       position: fixed;
+       top: 10px;
+       left: 10px;
+}
+body > div {
+       position: absolute;
+       top: 0;
+       left: 0;
+       margin: 20px;
+}
+#discountBox {
+       opacity: 0;
+       transition: opacity 1s;
+}
+#discountBox.show {
+       opacity: 1;
+}
+               </style>
+               <script>
+
+function makeTime(end, offset, strike) {
+       let current = Math.round((Date.now() + offset) / 1000);
+       var time = end - current;
+
+       if (Math.sign(time) == -1) {time = 0;}
+       var minutes = Math.floor(time / 60);
+       var seconds = (time - (minutes * 60));
+
+       var minutesString = minutes.toString().padStart(2, "0");
+       var secondsString = seconds.toString().padStart(2, "0");
+       if (strike) {
+               return `${minutesString}:${secondsString}`;
+       } else {
+               return `<s>${minutesString}:${secondsString}</s>`;
+       }
+}
+
+// dynamically resize the UI
+function resize() {
+       var slider = document.getElementById("slider");
+       document.getElementsByTagName("body")[0].style.fontSize = `${slider.value}px`;
+}
+
+function update () {
+       // fetch the item manifest and chache it
+       fetch("./api/items", {cache: "default"})
+                       .then(data => data.json())
+                       .then(data => data.items)
+                       .then(items => {
+                               // fetch the current state without cache
+                               fetch("./api", {cache: "no-store"})
+                                       .then(data => data.json())
+                                       .then(data => {
+                                               let id = data.item_id;
+
+                                               // update the total items and the items sold already
+                                               document.getElementById("left").innerHTML = Math.round(
+                                                       items[id].stock_count * (data.percent_remaining / 100)
+                                                       );
+                                               document.getElementById("stock").innerHTML = items[id].stock_count;
+
+                                               // update the timers
+                                               for (let t = 1; t <= 3; t++) {
+                                                       document.getElementById(`timer_${t}`).innerHTML = makeTime(
+                                                               data[`end_timer_${t}`],
+                                                               data['timer_offset'],
+                                                               data[`bool_timer_${t}`]
+                                                               )
+                                               }
+
+                                               // update the discount
+                                               document.getElementById("discount").innerHTML = data.discount;
+                                               document.getElementById("gallery").innerHTML = items[id].gallery_price * 100;
+                                               document.getElementById("cost").innerHTML = items[id].cost_price * 100;
+                                               if (data.discount != 0) {
+                                                       document.getElementById("discountBox").classList.add("show");
+                                               } else {
+                                                       document.getElementById("discountBox").classList.remove("show");
+                                               }
+
+                                               // update the prices
+                                               const price = document.getElementById("price");
+                                               const currentPrice = document.getElementById("currentPrice");
+                                               if (items[id].prefix) {
+                                                       price.innerHTML = `${items[id].currency}${items[id].origional_price}`;
+                                                       currentPrice.innerHTML = `${items[id].currency}${Math.round(items[id].origional_price * data.discount) / 100}`;
+                                               } else {
+                                                       price.innerHTML = `${items[id].origional_price}${items[id].currency}`;
+                                                       currentPrice.innerHTML = `${Math.round(items[id].origional_price * data.discount) / 100}${items[id].currency}`;
+                                               }
+                                       })
+                               });
+}
+
+setInterval(resize, 50);
+setInterval(update, 1000);
+
+               </script>
+       </head>
+       <body onload="resize(); update();">
+               <input type="range" min="30" max="100" value="95" id="slider">
+               <div>
+                       T1: <span style="background-color: green;" id="timer_1">00:00</span> -
+                       T2: <span style="background-color: purple;" id="timer_2">00:00</span> -
+                       T3: <span style="background-color: blue;" id="timer_3">00:00</span><br>
+                       Left: <span id="left">0</span> out of <span id="stock">0</span><br>
+                       Start price: <span style="background-color:deeppink" id="price">0.00</span>
+                       &DownArrowBar;<span style="color:orange" id="gallery">00</span>%
+                       &#10504;<span style="color:red" id="cost">00</span>%<br>
+                       <span id="discountBox">Discount: <span style="background-color:darkviolet"><span id="discount">00</span>%</span> (<em>Now <span id="currentPrice">0.00</span></em>)</span>
+               </div>
+       </body>
+</html>
index 42f867f65fa9410a03eeb5ec60846966cb6effa2..dfe405d29ccc8f056b25da80a0da8364205aad1a 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Docs</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star3.svg">
                <style>
 
 table {
index 2ad39d5cc16f7e7bc1cdd083af191800d37dad2e..0a25ef005787205dfac246b06cee4b78844b1245 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Teleshopping</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star1.svg">
                <style>
 
 body {
@@ -212,30 +213,6 @@ body {
     font-weight: bold;
     text-align: center;
 }
-.sigilBox {
-    opacity: 0;
-    transition: opacity 10s;
-}
-.sigil {
-    width: 20vh;
-    height: 20vh;
-}
-#sigil1 {
-    right: 4vh;
-    top: 4vh;
-}
-#sigil2 {
-    right: 4vh;
-    bottom: 4vh;
-}
-#sigil3 {
-    left: 4vh;
-    bottom: 4vh;
-}
-#sigil4 {
-    left: 4vh;
-    top: 4vh;
-}
 #origionalPrice {
     color: var(--red);
     font-size: 2em;
@@ -506,7 +483,16 @@ body {
 #banner.show {
     width: 50vh;
 }
-.sigilBox.show {
+#sigil {
+    top: 50vh;
+    right: 50vw;
+    width: 20vh;
+    height: 20vh;
+    transform: translate(-50%,-50%);
+    opacity: 0;
+    transition: opacity 10s;
+}
+#sigil.show {
     opacity: 0.9;
 }
 @keyframes spinBox {
@@ -514,18 +500,6 @@ body {
     50% {}
     100% {}
 
-}
-line, polyline, circle {
-    fill: none;
-    stroke: #00FF00;
-    stroke-width: 3;
-}
-circle {
-    fill: none;
-}
-.sigilGrid {
-    stroke: none;
-    stroke-width: 1;
 }
 
                </style>
@@ -594,50 +568,7 @@ circle {
             </div>
                </div>
 
-               <div class="container box sigilBox" id="sigil1">
-                       <svg class="sigil" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
-                               <path class="sigilGrid" d="
-                                       M 10,10 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100
-                                       M 10,10 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20
-                               " />
-
-                               <line class="sigilCap"/>
-                               <polyline class="sigilLine"/>
-                               <circle class="sigilEnd" r="3">
-                       </svg>
-               </div>
-               <div class="container box sigilBox" id="sigil2">
-                       <svg class="sigil" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
-                               <path class="sigilGrid" d="
-                                       M 10,10 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100
-                                       M 10,10 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20
-                               " />
-                               <line class="sigilCap"/>
-                               <polyline class="sigilLine"/>
-                               <circle class="sigilEnd" r="3">
-                       </svg>
-               </div>
-               <div class="container box sigilBox" id="sigil3">
-                       <svg class="sigil" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
-                               <path class="sigilGrid" d="
-                                       M 10,10 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100
-                                       M 10,10 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20
-                               " />
-                               <line class="sigilCap"/>
-                               <polyline class="sigilLine"/>
-                               <circle class="sigilEnd" r="3">
-                       </svg>
-               </div>
-               <div class="container box sigilBox" id="sigil4">
-                       <svg class="sigil" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
-                               <path class="sigilGrid" d="
-                                       M 10,10 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100 v 100 m 20,-100
-                                       M 10,10 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20 h 100 m -100,20
-                               " />
-                               <line class="sigilCap"/>
-                               <polyline class="sigilLine"/>
-                               <circle class="sigilEnd" r="3">
-                       </svg>
+               <div  id="sigil">
                </div>
                <script>
 
@@ -683,12 +614,7 @@ const badgeContainer = [
     document.getElementById("badge4Container")
     ]
 // 1:NE 2:SE 3:SW 4:NW
-const sigils = [
-    document.getElementById("sigil1"),
-    document.getElementById("sigil2"),
-    document.getElementById("sigil3"),
-    document.getElementById("sigil4")
-];
+const sigil = document.getElementById("sigil");
 const remaining = document.getElementById("unitsLeft");
 const origional = document.getElementById("origionalPrice");
 const topTextElement = document.getElementById("topText");
@@ -697,11 +623,6 @@ const shout = document.getElementById("shout");
 
 const marqueeContainer = document.getElementById("marquee");
 
-// sigil cap end and line lists
-const sigilCap = document.getElementsByClassName("sigilCap");
-const sigilLine = document.getElementsByClassName("sigilLine");
-const sigilEnd = document.getElementsByClassName("sigilEnd");
-
 // all dynamic variables used between functions
 
 let discountRate = 0;
@@ -848,6 +769,9 @@ function update() {
                 badgeContainer.classList.remove("show");
             }
 
+            if (data.bool_sigil) { sigil.classList.add("show"); }
+            else { sigil.classList.remove("show"); }
+
             // Shout
             shout.innerHTML = data.shout;
             let current = Math.round((Date.now() + data['timer_offset']) / 1000);
@@ -858,33 +782,6 @@ function update() {
                 document.getElementById("shoutContainer").classList.remove("show");
             }
 
-            // Sigil handling
-            for (let s = 0; s < 4; s++) {
-                if (data[`bool_sigil_${s+1}`]) {
-                    let phrase = dataStatic.text.sigil[Math.floor(Math.random()*dataStatic.text.sigil.length)];
-                    let pointString = "";
-                    for (let i = 0; i < phrase.length; i++) {
-                        let point = phrase.charCodeAt(i) - 97; // get the coords of the letter
-                        if (i == 0) {var startPoint = dataStatic.text.square[point].split(",");} // get the start and end points
-                        else if (i == phrase.length - 1) {var endPoint = dataStatic.text.square[point].split(",");}
-
-                        pointString += `${dataStatic.text.square[point]} `;
-                    }
-
-                    sigilCap[s].setAttribute("x1", Number(startPoint[0]) - 5)
-                    sigilCap[s].setAttribute("y1", startPoint[1])
-                    sigilCap[s].setAttribute("x2", Number(startPoint[0]) + 5)
-                    sigilCap[s].setAttribute("y2", startPoint[1])
-                    sigilLine[s].setAttribute("points", pointString);
-                    sigilEnd[s].setAttribute("cx", endPoint[0]);
-                    sigilEnd[s].setAttribute("cy", endPoint[1]);
-
-                    sigils[s].classList.add("show");
-                } else {
-                    sigils[s].classList.remove("show");
-                }
-            }
-
             // set item properties
             document.getElementById("code").innerHTML = item.code;
             document.getElementById("raiting").innerHTML = item.rating;
index f456b01cedc075f86849f24219cc3e9a218a3240..6203b2d203d9e5b1208a77bf061ebd673300b81d 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Admin - Pricing</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star2.svg">
        </head>
        <body>
                <a href="/admin">.. Back to admin pannel</a>
index 04206817d89799595c20510e47a8cd60de68ae6c..d79d627bd9946342c8d848004e4053324e3d776e 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Sounds</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star3.svg">
        </head>
        <body>
                <a href="/admin">. Admin pannel</a>
index 71140a503f19c01647329ef4c098c870b159e1c1..ebc77df40b61fd0c9318e2785a643c8806739387 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Admin - Text</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star2.svg">
        </head>
        <body>
                <a href="/admin">.. Back to admin pannel</a>
 
 
                        <fieldset>
-                               <legend>Sigil display</legend>
-                               {% for t in (1,2,3,4) %}
-                                       {% if data['bool_sigil_' ~ t] %}
-                                               <input type='radio' name='bool_sigil_{{t}}' value='0'>
-                                               <label>Hide sigil {{t}}</label>
-                                               <input type='radio' name='bool_sigil_{{t}}' value='1' checked='checked'>
-                                               <label style='color: red;'>Show sigil {{t}}</label>
-                                       {% else %}
-                                               <input type='radio' name='bool_sigil_{{t}}' value='0' checked='checked'>
-                                               <label style='color: red;'>Hide sigil {{t}}</label>
-                                               <input type='radio' name='bool_sigil_{{t}}' value='1'>
-                                               <label>Show sigil {{t}}</label>
-                                       {% endif %}
-                                       <br>
-                               {% endfor %}
-                       </fieldset>
+                               <legend>Flags</legend>
+                               {% if data['bool_sigil'] %}
+                                       <input type='radio' name='bool_sigil' value='0'>
+                                       <label>Hide sigil</label>
+                                       <input type='radio' name='bool_sigil' value='1' checked='checked'>
+                                       <label style='color: red;'>Show sigil</label>
+                               {% else %}
+                                       <input type='radio' name='bool_sigil' value='0' checked='checked'>
+                                       <label style='color: red;'>Hide sigil</label>
+                                       <input type='radio' name='bool_sigil' value='1'>
+                                       <label>Show sigil</label>
+                               {% endif %}
+
+                               <br>
 
-                       <fieldset>
-                               <legend>Number</legend>
                                {% if data.bool_number %}
                                        <input type='radio' name='bool_number' value='0'>
                                        <label>Redact number</label>
index 7fe045eb7db10bfb9d255b6911a48a3b595a31e3..bbd22da4e79c0c34612b8b24e3ea098f2b8a6f07 100644 (file)
@@ -2,7 +2,8 @@
 <html lang="en">
        <head>
                <meta charset="utf-8">
-               <title>XMDV</title>
+               <title>XMDV Admin - Timer</title>
+               <link rel="icon" type="image/x-icon" href="/static/assets/star2.svg">
        </head>
        <body onload="update();">
                <a href="/admin">.. Back to admin pannel</a>