From: Max Value <greenwoodw50@gmail.com> Date: Thu, 6 Mar 2025 22:39:15 +0000 (+0000) Subject: Visual changes prep for 7th X-Git-Url: https://git.ozva.co.uk/?a=commitdiff_plain;h=8e1e13504d3a0d90f9bea74c526ab87798f278a8;p=shopping-channel Visual changes prep for 7th + 2 more fonts + 3 more discounts + some test items ~ changed all colors --- diff --git a/data.db b/data.db index 6a23893..8921e71 100644 Binary files a/data.db and b/data.db differ diff --git a/schema b/schema index 24fac1c..13b859a 100644 --- a/schema +++ b/schema @@ -1,10 +1,10 @@ CREATE TABLE state ( id INTEGER PRIMARY KEY, item_id INTEGER, - discount_1 REAL, - discount_2 REAL, - discount_3 REAL, - discount_4 REAL, + discount_1 INTEGER, + discount_2 INTEGER, + discount_3 INTEGER, + discount_4 INTEGER, discount_change INTEGER, percent_remaining INTEGER, currency_symbol TEXT, diff --git a/static/assets/star.svg b/static/assets/star.svg deleted file mode 100644 index dab960a..0000000 --- a/static/assets/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> diff --git a/static/assets/star1.svg b/static/assets/star1.svg new file mode 100644 index 0000000..9f1a8f9 --- /dev/null +++ b/static/assets/star1.svg @@ -0,0 +1,54 @@ +<?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" + sodipodi:docname="star1.svg" + inkscape:version="1.4 (e7c3feb100, 2024-10-09)" + 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" + 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/"> + <sodipodi:namedview + id="namedview1" + pagecolor="#696969" + bordercolor="#000000" + borderopacity="0.25" + inkscape:showpageshadow="2" + inkscape:pageopacity="0.0" + inkscape:pagecheckerboard="0" + inkscape:deskcolor="#d1d1d1" + inkscape:zoom="0.71411936" + inkscape:cx="171.53995" + inkscape:cy="168.03914" + inkscape:window-width="1366" + inkscape:window-height="704" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:window-maximized="1" + inkscape:current-layer="svg1" /> + <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:none;stroke-width:1.5875;stroke-dasharray:none;stroke-opacity:1" + id="path1" + d="M 79.313561,81.033139 76.99122,97.76711 61.669173,90.649944 51.290981,103.98082 41.580283,90.156147 25.927069,96.511927 24.429692,79.684063 7.6957206,77.361723 14.812886,62.039676 1.4820128,51.661484 15.306682,41.950785 8.9509023,26.297572 25.778767,24.800195 28.101108,8.0662237 43.423154,15.183389 53.801346,1.8525158 63.512044,15.677185 79.165259,9.3214063 80.662636,26.14927 l 16.733971,2.322341 -7.117167,15.322047 13.33087,10.37819 -13.824664,9.710699 6.355779,15.653215 z" /> +</svg> diff --git a/static/assets/star2.svg b/static/assets/star2.svg new file mode 100644 index 0000000..23bc6aa --- /dev/null +++ b/static/assets/star2.svg @@ -0,0 +1,68 @@ +<?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" + sodipodi:docname="star2.svg" + inkscape:version="1.4 (e7c3feb100, 2024-10-09)" + 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" + 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/"> + <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:zoom="1.0745014" + inkscape:cx="174.96487" + inkscape:cy="154.49026" + inkscape:window-width="1366" + inkscape:window-height="704" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:window-maximized="1" + inkscape:current-layer="svg1" /> + <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 + sodipodi:type="star" + style="fill:#a500cf;fill-opacity:1;stroke:none;stroke-width:3.15574;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1" + id="path1" + inkscape:flatsided="false" + sodipodi:sides="3" + sodipodi:cx="50.232597" + sodipodi:cy="48.262691" + sodipodi:r1="62.690723" + sodipodi:r2="31.345362" + sodipodi:arg1="0.80206329" + sodipodi:arg2="1.8492608" + inkscape:rounded="0" + inkscape:randomized="0" + d="M 93.816763,93.324286 41.616397,78.400588 -10.583971,63.476888 28.440514,25.731895 67.465001,-12.0131 80.640881,40.655592 Z" + inkscape:transform-center-x="0.040078743" + inkscape:transform-center-y="-13.105393" + transform="matrix(0.80646422,-0.22922661,0.2292323,0.80648423,1.6641526,26.083336)" /> +</svg> diff --git a/static/assets/star3.svg b/static/assets/star3.svg new file mode 100644 index 0000000..925bb8d --- /dev/null +++ b/static/assets/star3.svg @@ -0,0 +1,66 @@ +<?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" + sodipodi:docname="star3.svg" + inkscape:version="1.4 (e7c3feb100, 2024-10-09)" + 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" + 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/"> + <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:zoom="0.86956539" + inkscape:cx="205.27496" + inkscape:cy="221.37496" + inkscape:window-width="1366" + inkscape:window-height="704" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:window-maximized="1" + inkscape:current-layer="svg1" /> + <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 + sodipodi:type="star" + style="fill:#fff612;fill-opacity:1;stroke:none;stroke-width:1.54949;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1" + id="path2" + inkscape:flatsided="false" + sodipodi:sides="12" + sodipodi:cx="51.117489" + sodipodi:cy="52.0303" + sodipodi:r1="51.662281" + sodipodi:r2="74.872871" + sodipodi:arg1="0.78539816" + sodipodi:arg2="1.0471976" + inkscape:rounded="0" + inkscape:randomized="0" + d="M 87.648238,88.561049 88.553921,116.87211 64.488671,101.93223 51.117485,126.90317 37.746307,101.93223 13.68105,116.87211 14.58674,88.56105 -13.724322,89.466733 1.2155574,65.401483 -23.755383,52.030296 1.2155573,38.659118 -13.724318,14.593861 14.586739,15.499551 13.681056,-12.81151 37.746306,2.1283687 51.117493,-22.842571 64.488671,2.1283686 88.553928,-12.811507 l -0.90569,28.311058 28.311062,-0.905683 -14.93988,24.06525 24.97094,13.371186 -24.97094,13.371178 14.93988,24.065257 z" + transform="matrix(0.68302111,0,0,0.68302111,18.028789,18.01386)" /> +</svg> diff --git a/static/assets/star4.svg b/static/assets/star4.svg new file mode 100644 index 0000000..eacf030 --- /dev/null +++ b/static/assets/star4.svg @@ -0,0 +1,66 @@ +<?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" + sodipodi:docname="star4.svg" + inkscape:version="1.4 (e7c3feb100, 2024-10-09)" + 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" + 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/"> + <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:zoom="0.76491564" + inkscape:cx="179.75839" + inkscape:cy="181.06572" + inkscape:window-width="1366" + inkscape:window-height="704" + inkscape:window-x="0" + inkscape:window-y="0" + inkscape:window-maximized="1" + inkscape:current-layer="svg1" /> + <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 + sodipodi:type="star" + style="fill:#00bd11;fill-opacity:1;stroke:none;stroke-width:5.4325;stroke-linecap:round;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1" + id="path1" + inkscape:flatsided="false" + sodipodi:sides="5" + sodipodi:cx="53.985233" + sodipodi:cy="50.386215" + sodipodi:r1="67.578911" + sodipodi:r2="28.383142" + sodipodi:arg1="0.82557753" + sodipodi:arg2="1.4538961" + inkscape:rounded="0" + inkscape:randomized="0" + d="M 99.812698,100.05263 57.295677,78.575641 20.911132,109.31849 28.198479,62.245646 -12.28315,37.14195 34.737699,29.526321 46.103221,-16.731466 67.876357,25.63466 115.38227,22.149473 81.817954,55.948808 Z" + transform="matrix(0.77438917,0,0,0.77438917,10.45016,13.788966)" /> +</svg> diff --git a/static/fonts.css b/static/fonts.css index 08eb412..3ac9069 100644 --- a/static/fonts.css +++ b/static/fonts.css @@ -30,3 +30,24 @@ local("Archivo"), url("fonts/Archivo-SemiBoldItalic.woff") format("woff"), } + +@font-face { + font-family: 'Calculator'; + src: url('fonts/DSEG7ClassicMini-Italic.woff2') format('woff2'), + url('fonts/DSEG7ClassicMini-Italic.woff') format('woff'), + url('fonts/DSEG7ClassicMini-Italic.ttf') format('truetype'); + font-weight: normal; +} +@font-face { + font-family: 'Calculator'; + src: url('fonts/DSEG7ClassicMini-BoldItalic.woff2') format('woff2'), + url('fonts/DSEG7ClassicMini-BoldItalic.woff') format('woff'), + url('fonts/DSEG7ClassicMini-BoldItalic.ttf') format('truetype'); + font-weight: bold; +} +@font-face { + font-family: 'Pacifico'; + src: url('fonts/Pacifico-Regular.woff2') format('woff2'), + url('fonts/Pacifico-Regular.woff') format('woff'), + url('fonts/Pacifico-Regular.ttf') format('truetype'); +} diff --git a/static/fonts/DSEG7ClassicMini-BoldItalic.ttf b/static/fonts/DSEG7ClassicMini-BoldItalic.ttf new file mode 100644 index 0000000..b98a714 Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-BoldItalic.ttf differ diff --git a/static/fonts/DSEG7ClassicMini-BoldItalic.woff b/static/fonts/DSEG7ClassicMini-BoldItalic.woff new file mode 100644 index 0000000..1d1ed5f Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-BoldItalic.woff differ diff --git a/static/fonts/DSEG7ClassicMini-BoldItalic.woff2 b/static/fonts/DSEG7ClassicMini-BoldItalic.woff2 new file mode 100644 index 0000000..23fdc57 Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-BoldItalic.woff2 differ diff --git a/static/fonts/DSEG7ClassicMini-Italic.ttf b/static/fonts/DSEG7ClassicMini-Italic.ttf new file mode 100644 index 0000000..1defc9c Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-Italic.ttf differ diff --git a/static/fonts/DSEG7ClassicMini-Italic.woff b/static/fonts/DSEG7ClassicMini-Italic.woff new file mode 100644 index 0000000..7b16442 Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-Italic.woff differ diff --git a/static/fonts/DSEG7ClassicMini-Italic.woff2 b/static/fonts/DSEG7ClassicMini-Italic.woff2 new file mode 100644 index 0000000..83ea8b8 Binary files /dev/null and b/static/fonts/DSEG7ClassicMini-Italic.woff2 differ diff --git a/static/fonts/Pacifico-Regular.ttf b/static/fonts/Pacifico-Regular.ttf new file mode 100644 index 0000000..e7def95 Binary files /dev/null and b/static/fonts/Pacifico-Regular.ttf differ diff --git a/static/fonts/Pacifico-Regular.woff b/static/fonts/Pacifico-Regular.woff new file mode 100644 index 0000000..5b28909 Binary files /dev/null and b/static/fonts/Pacifico-Regular.woff differ diff --git a/static/fonts/Pacifico-Regular.woff2 b/static/fonts/Pacifico-Regular.woff2 new file mode 100644 index 0000000..b3972fd Binary files /dev/null and b/static/fonts/Pacifico-Regular.woff2 differ diff --git a/static/static.json b/static/static.json index 3e83cca..37f253d 100755 --- a/static/static.json +++ b/static/static.json @@ -1,29 +1,53 @@ { "text": { "crawler_top":[ - "Test top text 1", - "Test top text 2", + "Buy now!", + "XMDV Teleshopping!", + "Exciting products coming!", + "Plenty more coming to get you!", + "Imagine thinking on a piece of paper!", + "On Air 24/7!", + "Tick!", + "Anchor", + "Sale Sale Sale Sale Sale Sale Sale", + "Doomsday", "It's here!" ], "crawler_bottom":[ "Something bright and radiant for all of you at home!", "I take your life and raise you 10 over the hour!", "We grab the bullion counterweight and throw ourselves down!", - "We have been falling for a looong time people!", + "We have been falling for a looong time!", "Let me slip into something less spacious!", "Down the side of a large golden pyramid!", + "Get ahead of the drop!", "So we dress ourselves in your Ballast!", + "Whats the significance of callers?", + "Someone on the other end of the phone?", + "Sell you? On this?", + "All holding", + "THE THREAT", "I used to be so unimaginably tall!", + "Doomsday", "It's here!" ], "banner":[ "Buy XMDV!", "Discounts on XMDV!", - "Imagine thinking on a piece of paper!", - "Imagine thinking on a dime!", - "Imagine thinking on a dollar!", "The quant we created!", "The quant we fear!", + "Dynamite!", + "Suicidal price cuts!", + "Eyes on us!", + "We're all eyes!", + "Ending soon!", + "Closing down!", + "Sold!", + "Kill!", + "Oh", + "Anchor", + "Look", + "Doomsday", "It's here!" ], "sigil":[ @@ -82,34 +106,94 @@ }, "items": [ { - "code":"Placeholder item code", + "code":"XMDV", "rating":"★★★★★", - "subtext":"Test item name", - "description":"Test item description", - "origional_price":0, - "stock_count":0, + "subtext":"Starting soon!", + "description":"The show will be starting soon!", + "origional_price":1, + "stock_count":1, "notes":"<p>[autocue] Showing: test product.<br>Commencing shortly.</p>", - "crew_notes":"testing" + "crew_notes":"Test crew notes" + }, + { + "code":"526F74", + "rating":"★★★★★", + "subtext":"Hyperclean™! Teethpaste", + "description":"Hyperclean™! Professional Dentist-grade Teethpaste with a dark shine and a matte-finish. Dentists want it off the air!", + "origional_price":14.99, + "stock_count":230, + "notes":"<ul><li>Dentists have got the manufacturers shut down</li><li>Leaves a matte finish and a stange smell</li><li>Limited supply, last time on air</li><li>Larger capacity tube 10% more paste</li><li>Strange texture feel through tube</li><li>Only 230 in stock (tooth joke)</li></ul>", + "crew_notes":"Test crew notes" + }, + { + "code":"454747", + "rating":"★★★★★", + "subtext":"Is that a hairline fracture? A crack?", + "description":"Don't look too close! Detailed painting from a long time ago! Decades of a careful hand in observation of the bright and round moon.", + "origional_price":4500, + "stock_count":5, + "notes":"<ul><li>Paining of the moon thats difficult to look at</li><li>Look away tell cameraman to look away</li><li>Cover it with your jacket</li><li>Represents the moon hatching into an egg</li><li>Something the grandchildren would love</li></ul>", + "crew_notes":"Test crew notes" + }, + { + "code":"434947", + "rating":"★★★★★", + "subtext":"Abundance Declared Cigarettes", + "description":"Smoke breaks too short? borrow the time! Try royal abundance.", + "origional_price":35, + "stock_count":111, + "notes":"<ul><li>Play up the whole not ment to be selling them thing</li><li>Each one takes an entire tobacco plant to make</li><li>each cigarette is 2ft long</li></ul>", + "crew_notes":"Test crew notes" }, { - "code":"Item 1", - "rating":"✶✶✶✶✶", - "subtext":"Gold <em>Stick-Strip</em>™", - "description":"50m shiny gold <em>Stick-Strip</em>™! Origional beautiful formula! Cannot be broken! Too beautiful! Stuck!", - "origional_price":500, + "code":"435550", + "rating":"★★★★★", + "subtext":"Coffee. we killed the sheep!", + "description":"Bad dreams? Never sleep again. <em>New</em> formula, 100x strength", + "origional_price":12, "stock_count":100, - "notes":"<p>ITEM IS A REEL OF GOLDEN TAPE THAT CANNOT BE TORN</p><ul><li>EMPASIZE AS MUCH AS POSSIBLE HOW BEAUTIFUL IT IS</li></ul>", - "crew_notes":"testing" + "notes":"<ul><li>Stops you sleeping possibly perminently</li><li>Enhanced with special chemical that comes from adrenial glands</li><li>Describe vividly fever dreams</li></ul>", + "crew_notes":"Test crew notes" + }, + { + "code":"594F55", + "rating":"★★★★★", + "subtext":"The replacement mirror", + "description":"Ready to move on? Look over your shoulder to the person replacing you when you go.", + "origional_price":2000, + "stock_count":40, + "notes":"<ul><li>Something about the generation your handing the battone to</li><li>See nothing in the mirror but play up that you do because you're scared of nothing coming after you</li></ul>", + "crew_notes":"Test crew notes" }, { - "code":"Item 2", - "rating":"✦✦✦", - "subtext":"Item subtext", - "description":"Product 2 description. It's really long to see if the badge element moves down the page at all. I f**king hate CSS positioning. Oops family show.", - "origional_price":170, - "stock_count":200, - "notes":"Some more notes...", - "crew_notes":"testing" + "code":"777777", + "rating":"★★★★★", + "subtext":"The number previously known as 7", + "description":"Ready to move on? Look over your shoulder to the person replacing you when you go.", + "origional_price":823543, + "stock_count":7, + "notes":"<ul><li>Do the 7 ate 9 joke</li><li>Discount by 7s (70%, 7%)</li><li>List plenty of things that begin with 7</li></ul>", + "crew_notes":"Test crew notes" + }, + { + "code":"424F58", + "rating":"★★★★★", + "subtext":"Supprise jack-in-the-box, shock your friends!", + "description":"Suprise-Box™ Limited edition, only 100 EVER made!. Beautiful handpainted sides.", + "origional_price":45, + "stock_count":99, + "notes":"<ul><li>JACK IN THE BOX IS FULL OF BLOOD</li><li>Dont tell the audience its full of blood</li><li>Dont turn the crank unless instructed</li></ul>", + "crew_notes":"Test crew notes" + }, + { + "code":"422657", + "rating":"★★★★★", + "subtext":"Black and White Blood Chocolate Sauce", + "description":"The perfect topping for noir detectives in ice-cream bars! Sweet and thick chocolate, made from all natural ingredients.", + "origional_price":8, + "stock_count":300, + "notes":"<ul><li>Novelty chocolate sauce that looks like blood in black and white</li><li>Describe how refreshing a nice bowl of ice cream would be</li><li>Treat yourself</li></ul>", + "crew_notes":"Test crew notes" } ] } diff --git a/teleshopping.py b/teleshopping.py index 686e1fb..fd65974 100755 --- a/teleshopping.py +++ b/teleshopping.py @@ -189,9 +189,10 @@ if __name__ == "__main__": pass except sqlite3.OperationalError: print("Table missing or corrupt...") - cursor.execute("DROP TABLE state;") + try: cursor.execute("DROP TABLE state;") # catch if there is no table "state" + except: pass cursor.execute(schema) cursor.execute(load) connection.commit() - app.run(host='192.168.8.143', port=5080, debug=True) + app.run(host='127.0.0.1', port=8000, debug=True) diff --git a/templates/gfx.html b/templates/gfx.html index a80f848..775e336 100644 --- a/templates/gfx.html +++ b/templates/gfx.html @@ -6,18 +6,9 @@ <style> body { - --star-light: #FFE0B3; - --star-dark: #FFC266; - --dark: #DEDEDE; - --black: #3b3b45; - --feature-dark: #AAAAEE; - --feature-light: #BBBBEE; - --feature-white: #EAEAFA; - --background-light: #FFFFFF; - --background-dark: #EEEEEE; - --feature-gradient: linear-gradient(var(--feature-dark), var(--feature-light)); - --background: linear-gradient(var(--background-light), var(--background-dark)); - --clock: conic-gradient(var(--background-light) 0deg, var(--background-light) 0deg, rgb(0,0,0,0) 0.1deg), rgb(0,0,0,0) 360deg); + --magenta: purple; + --blue: violet; + --red: red; font-family: "Archivo", sans-serif; font-size: 1.6vh; @@ -28,8 +19,10 @@ body { } @keyframes spin { 0% {transform: rotate(0turn) scale(1.2);} - 50% {transform: rotate(0.25turn) scale(1);} - 100% {transform: rotate(0.5turn) scale(1.2);} + 25% {transform: rotate(0.25turn) scale(1);} + 50% {transform: rotate(0.5turn) scale(1.2);} + 75% {transform: rotate(0.75turn) scale(1);} + 100% {transform: rotate(1turn) scale(1.2);} } @keyframes spinText { 0% {transform: rotate(-0.01turn);} @@ -38,25 +31,23 @@ body { } .container { position: absolute; - border-radius: 1vh; } -.box { - border-radius: 1vh; +/*.box { box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; background-image: var(--background); -} +}*/ #side { -left: 6vh; -top: 6vh; -width: 40vh; -opacity: 0; -transition: opacity 1.5s; + left: 6vh; + top: 6vh; + width: 40vh; + opacity: 0; + transition: opacity 1.5s; } .soldBox { margin: 5px; padding: 5px; - border-radius: 5px; - background-image: var(--background); + color: blue; + background-color: white; box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.19) 0px 1px 2px; } .soldBox > * { @@ -68,45 +59,46 @@ transition: opacity 1.5s; font-style: normal; } #raiting { -margin: 5px; -margin-top: 0; -border-radius: 5px; -font-size: 2em; -line-height: 1em; -color: var(--star-dark); -text-shadow: -1px -1px 0 var(--star-light), 1px -1px 0 var(--star-light), -1px 1px 0 var(--star-light), 1px 1px 0 var(--star-light), 2px 2px 0 var(--dark); -background-image: linear-gradient(var(--background-dark), var(--dark)); -box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.19) 0px 1px 2px; + margin: 5px; + margin-top: 0; + font-size: 2em; + line-height: 1em; + color: white; + background-color: var(--magenta); + box-shadow: pink 0px 1px 3px, pink 0px 1px 2px; } .main { + background-color: white; z-index: 0; } +#subtext { + color: white; + font-family: "Pacifico"; + background-color: var(--blue); +} #banner { -left: 48vh; -top: 6vh; -height: 2em; -width: 0vh; -padding: 0.5vh; -overflow: hidden; -opacity: 0; -transition: opacity 1.5s, width 1.5s, left 1.5s; -background: linear-gradient(var(--feature-white), rgb(0,0,0,0), var(--feature-white)), var(--background); -border: 1px solid var(--feature-dark); -} -#banner.moved, #timer2.moved { -left: 6vh; -} -#timer2.movedUp { -top: 6vh; + right: 6vh; + top: 6vh; + height: 2em; + width: 0vh; + padding: 0.5vh; + overflow: hidden; + opacity: 0; + transition: opacity 1.5s, width 1.5s, left 1.5s; + color: white; + background-color: var(--magenta); +} +#timer2.moved { + top: 6vh; } #timer3.focus { -bottom: calc(50% - 15vh); -right: calc(50% - 15vh); -width: 30vh; -height: 30vh; -border-radius: 15vh; -font-size: 6em; -line-height: 30vh; + bottom: calc(50% - 15vh); + right: calc(50% - 15vh); + width: 30vh; + height: 30vh; + border-radius: 15vh; + font-size: 5em; + line-height: 30vh; } .extra { position: relative; @@ -115,7 +107,8 @@ line-height: 30vh; transform: translateY(-100%); padding-top: 2vh; padding-bottom: 1px; - background-image: var(--feature-gradient); + color: white; + background-color: var(--magenta); transition: transform 1.5s; } .showExtra > .extra { @@ -126,13 +119,13 @@ line-height: 30vh; padding: 0.5vh 1vh; } #banner > h1 { -width: 49vh; -margin: 0; -font-size: 2em; -line-height: 1; -font-style: italic; -font-weight: normal; -text-align: center; + width: 49vh; + margin: 0; + font-size: 2em; + line-height: 1; + font-style: italic; + font-weight: bold; + text-align: center; } .sigilBox { opacity: 0; @@ -143,26 +136,63 @@ text-align: center; height: 20vh; } #sigil1 { -right: 4vh; -top: 4vh; + right: 4vh; + top: 4vh; } #sigil2 { -right: 4vh; -bottom: 4vh; + right: 4vh; + bottom: 4vh; } #sigil3 { -left: 4vh; -bottom: 4vh; + left: 4vh; + bottom: 4vh; } #sigil4 { -left: 4vh; -top: 4vh; + left: 4vh; + top: 4vh; +} +#origionalPrice { + color: var(--red); + font-size: 2em; } -#badgeContainer { -position: relative; -padding: 0; +#unitsLeft { + font-size: 3em; } -.badge { +#badge1Container { + position: relative; + padding: 0; + transform: translateX(12vh) scale(0%); + transition: transform 1.5s; +} +#badge1Container > img { + position: absolute; + top: -9vh; + left: 36vh; + width: 12vh; + height: 12vh; + padding: 0; + animation: spin 12s linear 0s infinite; + animation-direction: reverse; +} +#badge1Text { + position: absolute; + top: -7.5vh; + left: 31.5vh; + color: yellow; + width: 22vh; + animation: spinText 7s linear 0s infinite; + rotate: -0.015turn; + font-size: 2em; + text-align: center; + /*text-shadow: -2px -2px 0 green, 2px -2px 0 green, -2px 2px 0 green, 2px 2px 0 green;*/ +} +#badge2Container { + position: relative; + padding: 0; + transform: translateX(12vh) scale(0%); + transition: transform 1.5s; +} +#badge2Container > img { position: absolute; top: -2vh; left: 32vh; @@ -171,129 +201,182 @@ padding: 0; padding: 0; animation: spin 10s linear 0s infinite; } -h2.badge { +#badge2Text { + position: absolute; top: -1vh; left: 26.5vh; - color: white; + color: black; + width: 20vh; + animation: spinText 10s linear 0s infinite; + rotate: 0.025turn; + text-align: center; + /*text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;*/ +} +#badge3Container { + position: relative; + padding: 0; + transform: translateX(12vh) scale(0%); + transition: transform 1.5s; +} +#badge3Container > img { + position: absolute; + top: 3vh; + left: 38vh; + width: 10vh; + height: 10vh; + padding: 0; + animation: spin 10s linear 0s infinite; + animation-direction: reverse; +} +#badge3Text { + position: absolute; + top: 4.9vh; + left: 33.9vh; + color: blue; + width: 20vh; + animation: spinText 10s linear 0s infinite; + rotate: -0.03turn; + text-align: center; + /*text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;*/ +} +#badge4Container { + position: relative; + padding: 0; + transform: translateX(12vh) scale(0%); + transition: transform 1.5s; +} +#badge4Container > img { + position: absolute; + top: 10vh; + left: 32vh; + width: 14vh; + height: 14vh; + padding: 0; + animation: spin 10s linear 0s infinite; +} +#badge4Text { + position: absolute; + top: 11.8vh; + left: 28.4vh; + color: var(--blue); width: 20vh; animation: spinText 10s linear 0s infinite; rotate: 0.025turn; + font-size: 2.2em; + line-height: 0.6em; text-align: center; - text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; + /*text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;*/ } -#badgeContainer { -transform: translateX(12vh) scale(0%); -transition: transform 1.5s; +#currentPrice { + line-height: 0.5em; +} +#monthlyPrice { + line-height: 1em; + font-family: "Pacifico"; } .main > hr, .extra > hr { margin: 0 1vh; padding: 0; border-color: var(--dark); } -.feature { - border-top: 2px solid var(--dark); - border-bottom: 2px solid var(--dark); - background-image: var(--feature-gradient); -} .bottom { left: 6vh; bottom: 6vh; width: 100vh; + background-color: white; } .bottom > *:not(#timer1) { display: inline-block; vertical-align: top; } #topTextBox { -width: calc(100% - 20px); -margin: 5px; -margin-bottom: 0; -padding: 5px; -border-radius: 5px; -background-image: linear-gradient(0.25turn, var(--feature-dark), rgba(0,0,0,0) 40%), var(--background); -box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.19) 0px 1px 2px; + width: calc(100% - 20px); + margin: 5px; + margin-bottom: 0; + padding: 5px; + color: white; + background-color: var(--blue); + box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.19) 0px 1px 2px; } #topText { -display: inline-block; -width: 50%; -padding: 0; + display: inline-block; + width: 50%; + padding: 0; } #idText { -display: inline-block; -width: 50%; -padding: 0; -text-align: right; -font-size: 1.5em; -font-weight: bold; -font-style: italic; -text-shadow: 0 0 3px rgba(0,0,0,0.25); -color: var(--feature-dark); + display: inline-block; + width: 50%; + padding: 0; + text-align: right; + font-size: 1.5em; + font-weight: bold; + font-style: italic; + text-shadow: 0 0 3px rgba(0,0,0,0.25); } #marquee { -padding: 0; -width: 100%; -mask-image: linear-gradient(0.25turn, transparent, black 5%, black 95%, transparent); -overflow: hidden; + padding: 0; + width: 100%; + mask-image: linear-gradient(0.25turn, transparent, black 5%, black 95%, transparent); + color: var(--magenta); + overflow: hidden; } #marqueeText { -white-space: nowrap; -overflow: hidden; + white-space: nowrap; + overflow: hidden; } #timer1 { -position: absolute; -left: 101vh; -padding: 0.5vh; -opacity: 0; -text-align: center; -border: 2px solid var(--dark); -border-radius: calc(1vh - 2px); -transition: opacity 1.5s; + position: absolute; + left: 101vh; + padding: 0.5vh; + opacity: 0; + text-align: center; + color: white; + background-color: var(--magenta); + transition: opacity 1.5s; } #timer2 { -position: absolute; -left: calc(48vh + 2px); -top: calc(11.5vh + 2px); -height: 1.2em; -width: 3em; -margin: 0; -text-align: center; -font-size: 2em; -font-weight: bold; -line-height: 1.2em; -border: 2px solid var(--dark); -outline: 2px solid var(--feature-dark); -opacity: 0; -transition: opacity 1.5s, left 1.5s, top 1.5s; + position: absolute; + right: calc(6vh + 2px); + top: calc(11.5vh + 2px); + height: 1.2em; + width: 3em; + margin: 0; + text-align: center; + color: white; + font-size: 2em; + font-weight: bold; + line-height: 1.2em; + opacity: 0; + transition: opacity 1.5s, left 1.5s, top 1.5s; } #timer3 { -position: absolute; -bottom: 4vh; -right: 4vh; -opacity: 0; -width: 12vh; -height: 12vh; -border-radius: 6vh; -margin: 0; -text-align: center; -vertical-align: center; -font-size: 2em; -font-weight: bold; -line-height: 12vh; -background-image: var(--background); -border: 2px solid var(--feature-dark); -outline: 2px solid var(--dark); -opacity: 0; -transition: opacity 1.5s, bottom 1.5s, right 1.5s, width 1.5s, height 1.5s, border-radius 1.5s, font-size 1.5s, line-height 1.5s, transform 1.5s; -animation: spinText 10s linear 0s infinite; + position: absolute; + bottom: 4vh; + right: 4vh; + opacity: 0; + width: 12vh; + height: 12vh; + border-radius: 6vh; + margin: 0; + color: white; + text-align: center; + vertical-align: center; + font-family: "Calculator"; + font-size: 2em; + font-weight: bold; + line-height: 12vh; + opacity: 0; + transition: opacity 1.5s, bottom 1.5s, right 1.5s, width 1.5s, height 1.5s, border-radius 1.5s, font-size 1.5s, line-height 1.5s, transform 1.5s; + animation: spinText 10s linear 0s infinite; } .show { opacity: 1 !important; } -#badgeContainer.show { -transform: translateX(0vh) scale(100%); +#badge1Container.show, #badge2Container.show, #badge3Container.show, #badge4Container.show { + transform: translateX(0vh) scale(100%); } #banner.show { -width: 50vh; + width: 50vh; } .sigilBox.show { opacity: 0.9; @@ -306,14 +389,14 @@ width: 50vh; } line, polyline, circle { fill: none; - stroke: var(--feature-dark); + stroke: #00FF00; stroke-width: 3; } circle { - fill: #F2F2F2; + fill: none; } .sigilGrid { - stroke: var(--dark); + stroke: none; stroke-width: 1; } @@ -332,9 +415,21 @@ circle { <h3 id="description">Description</h3> <hr> <h4 id="origionalPrice">Origional Price</h4> - <div id="badgeContainer"> - <img class="badge" src="./static/assets/star.svg"></img> - <h2 class="badge" id="badgeText">Percent off</h2> + <div id="badge1Container"> + <img class="badge" src="./static/assets/star1.svg"></img> + <h2 class="badge" id="badge1Text">Percent off</h2> + </div> + <div id="badge2Container"> + <img class="badge" src="./static/assets/star2.svg"></img> + <h2 class="badge" id="badge2Text">Percent off</h2> + </div> + <div id="badge3Container"> + <img class="badge" src="./static/assets/star3.svg"></img> + <h2 class="badge" id="badge3Text">Percent off</h2> + </div> + <div id="badge4Container"> + <img class="badge" src="./static/assets/star4.svg"></img> + <h2 class="badge" id="badge4Text">Percent off</h2> </div> </div> <div class="box extra"> @@ -342,7 +437,7 @@ circle { <p id="monthlyPrice">Monthly Price</p> <div class="soldBox"> <p style="font-size: 1.2em;">In stock: <span style="margin-right:10px;" id="stock"></span> Sold: <span id="sold"></span></p> - <p style="font-size: 1.6em;" class="alert" id="unitsLeft"></p> + <p class="alert" id="unitsLeft"></p> </div> </div> </div> @@ -350,7 +445,7 @@ circle { <div class="container box bottom"> <h3 id="timer1" class="feature box"></h3> <div id="topTextBox"> - <h2 id="topText"></h2><p id="idText">Welcome to <span style="font-family: serif;">XMDV</span> Shopping!</p> + <h2 id="topText"></h2><p id="idText">Welcome to <span style="font-family: 'Pacifico';">XMDV</span> Shopping!</p> </div> <div id="marquee"> <h1 class="marqueeText" id="bottomText"></h1> @@ -445,7 +540,12 @@ timer6 ]; const banner = document.getElementById("banner"); const side = document.getElementById("side"); -const badgeContainer = document.getElementById("badgeContainer"); +const badgeContainer = [ + document.getElementById("badge1Container"), + document.getElementById("badge2Container"), + document.getElementById("badge3Container"), + document.getElementById("badge4Container") + ] // 1:NE 2:SE 3:SW 4:NW const sigils = [ document.getElementById("sigil1"), @@ -467,8 +567,19 @@ const sigilEnd = document.getElementsByClassName("sigilEnd"); // all dynamic variables used between functions -let discountHard = 0; let discountRate = 0; +let discountHard = [ + 0, + 0, + 0, + 0 +] +let discount = [ + 0, + 0, + 0, + 0 +] let topText = ""; let bottomText = []; @@ -491,7 +602,12 @@ function update() { const item = items[id]; // frame function variable hand-over - discountHard = data.discount_1; + discountHard = [ + 1-(data.discount_1 / 100), + 1-(data.discount_2 / 100), + 1-(data.discount_3 / 100), + 1-(data.discount_4 / 100) + ] discountRate = data.discount_change / 200; // happens 200x per second in the frame function topText = dataStatic.text.crawler_top[data.crawler_top_index] bottomText = []; @@ -533,9 +649,9 @@ function update() { conic-gradient( rgb(0,0,0,0) 0deg, rgb(0,0,0,0) ${angle}deg, - var(--feature-light) ${angle}.1deg, - var(--feature-light) 360deg - ), var(--background)`; + var(--blue) ${angle}.1deg, + var(--blue) 360deg + ), white`; } case 3: { @@ -545,9 +661,9 @@ function update() { timer3.style.background = ` linear-gradient( rgb(0,0,0,0) 0%, rgb(0,0,0,0) ${radius}%, - var(--feature-light) ${radius}.1%, - var(--feature-dark) 100% - ), var(--background)`; + purple ${radius}.1%, + purple 100% + ), lightblue`; } } } @@ -559,36 +675,37 @@ function update() { document.getElementById("bannerText").innerHTML = dataStatic.text.banner[data.banner_index]; } banner.classList.add("show"); - timer2.classList.remove("movedUp"); + timer2.classList.remove("moved"); } else { banner.classList.remove("show"); - timer2.classList.add("movedUp"); + timer2.classList.add("moved"); } // handle element showing // hierarchy: main product information -> extra information -> discount badge if (data.bool_product) { side.classList.add("show"); - banner.classList.remove("moved"); - timer2.classList.remove("moved"); if (data.bool_extra) { side.classList.add("showExtra"); - if (discount <= 0.99) { - badgeContainer.classList.add("show"); - } else { - badgeContainer.classList.remove("show"); + for (let d = 0; d < 4; d++) { + if (discount[d] <= 0.99) { + badgeContainer[d].classList.add("show"); + } else { + badgeContainer[d].classList.remove("show"); + } } } else { side.classList.remove("showExtra"); + for (let d = 0; d < 4; d++) { + badgeContainer[d].classList.remove("show"); + } } } else { side.classList.remove("show"); - banner.classList.add("moved"); - timer2.classList.add("moved"); side.classList.remove("showExtra"); badgeContainer.classList.remove("show"); } @@ -627,7 +744,7 @@ function update() { document.getElementById("description").innerHTML = item.description; // calculate the price sting with the pre/postfix - let price = item.origional_price * discount; + let price = item.origional_price * discount.reduce((a, b)=> a*b, 1); if (data.bool_rounding) { price = Math.round(price * 100) / 100; } @@ -643,11 +760,14 @@ function update() { // set discount, pricing and ez pay document.getElementById("currentPrice").innerHTML = `<em>Now only:</em> ${priceString}`; document.getElementById("monthlyPrice").innerHTML = `12 monthly payments of <b>${ezString}</b>`; - document.getElementById("badgeText").innerHTML = `${Math.round((1 - discount) * 100)}% OFF`; + document.getElementById("badge1Text").innerHTML = `${Math.round((1 - discount[0]) * 100)}% OFF`; + document.getElementById("badge2Text").innerHTML = `ONLY ${Math.round((discount[1]) * 100)}%`; + document.getElementById("badge3Text").innerHTML = `${Math.round((1 - discount[2]) * 100)}% REMOVED`; + document.getElementById("badge4Text").innerHTML = `10 FOR ${Math.round(discount[3] * 10)}<br><span style='font-size: 0.7em;'>WHAT?</span>`; document.getElementById("stock").innerHTML = `${item.stock_count} units`; - document.getElementById("sold").innerHTML = `${Math.round(item.stock_count * (1 - data.percent_remaining))} units`; + document.getElementById("sold").innerHTML = `${Math.round(item.stock_count * (1 - (data.percent_remaining / 100)))} units`; - if (discount <= 0.99) { + if (discount.reduce((a, b)=> a*b, 1) <= 0.99) { let origionalPrice = Math.round(item.origional_price); if (data.bool_prefix) {origionalString = `${data.currency_symbol}${origionalPrice}`} else {origionalString = `${origionalPrice}${data.currency_symbol}`}; @@ -666,7 +786,7 @@ function update() { else if (data.percent_remaining < 0.5) {descriptor = "Just"} else {descriptor = ""} remaining.innerHTML = ` - ${descriptor} ${Math.round(item.stock_count * (data.percent_remaining))} left! + ${descriptor} <span style='font-family: "Calculator"; font-size: 0.75em;'>${Math.round(item.stock_count * (data.percent_remaining / 100))}</span> left! `; } }); }); @@ -674,7 +794,6 @@ function update() { // frame dynamic variables -let discount = 0; let marqueeOffset = 0; let bottomTextIndex = 0; @@ -682,12 +801,10 @@ let bottomTextIndex = 0; function frame() { // move the current discount towards the target distance at the supplied rate - if (Math.abs(discount - discountHard) <= discountRate) { // if the discount is within one tick, snap to current discount - discount = discountHard; - } else if (discount > discountHard) { - discount -= discountRate; - } else { - discount += discountRate; + for (let d = 0; d < 4; d++) { + if (Math.abs(discount[d] - discountHard[d]) <= discountRate) {discount[d] = discountHard[d];} + else if (discount[d] > discountHard[d]) {discount[d] -= discountRate;} + else {discount[d] += discountRate;} } bottomTextElement.style.transform = `translateX(${marqueeOffset}px)`; diff --git a/templates/price.html b/templates/price.html index 6d41814..1cb8c44 100644 --- a/templates/price.html +++ b/templates/price.html @@ -77,11 +77,11 @@ <br> <input type='number' name='percent_remaining' value='{{data.percent_remaining}}'> - <label>Unsold (%)</label> <label style='color: red;'>was {{data.percent_remaining}}</label><br> + <label>Stock left (%)</label> <label style='color: red;'>was {{data.percent_remaining}}</label><br> <br> {% for d in (1,2,3,4) %} - <input type='number' name='discount_{{d}}' step='0.01' value='{{data['discount_' ~ d]}}'> + <input type='number' name='discount_{{d}}' step='1' value='{{data['discount_' ~ d]}}'> <label>Discount {{d}} (%)</label> <label style='color: red;'>was {{data['discount_' ~ d]}}</label><br> {% endfor %} <br>