<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">★★★★★</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>
--- /dev/null
+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);
<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;
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;
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,
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,
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');
--- /dev/null
+<?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>
{
"code":"XMDV",
"rating":"★★★★★",
- "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,
<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>
<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;
<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
--- /dev/null
+<!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>
+ ⤓<span style="color:orange" id="gallery">00</span>%
+ ⤈<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>
<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 {
<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 {
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;
#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 {
50% {}
100% {}
-}
-line, polyline, circle {
- fill: none;
- stroke: #00FF00;
- stroke-width: 3;
-}
-circle {
- fill: none;
-}
-.sigilGrid {
- stroke: none;
- stroke-width: 1;
}
</style>
</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>
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");
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;
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);
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;
<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>
<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>
<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>
<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>