From df3f5fdb58ac69dac3e5af1575f665d44cb45777 Mon Sep 17 00:00:00 2001 From: grey Date: Sun, 20 Mar 2022 18:41:05 +0100 Subject: [PATCH] Cleaning up, some other preperation --- README.MD | 8 +- package-lock.json | 62 ++------ package.json | 2 +- static/bootstrap-duration-picker | 1 + static/coloris/coloris.min.css | 1 + static/coloris/coloris.min.js | 6 + static/css/fonts/bootstrap-icons.woff | 1 + static/css/fonts/bootstrap-icons.woff2 | 1 + static/css/mainStyle.css | 4 + static/js/interface.js | 20 +-- templates/newAdminPanel.html | 198 ++++++++----------------- templates/timerPage.html | 1 + 12 files changed, 96 insertions(+), 209 deletions(-) create mode 120000 static/bootstrap-duration-picker create mode 100644 static/coloris/coloris.min.css create mode 100644 static/coloris/coloris.min.js create mode 120000 static/css/fonts/bootstrap-icons.woff create mode 120000 static/css/fonts/bootstrap-icons.woff2 diff --git a/README.MD b/README.MD index 06ad406..412f15a 100644 --- a/README.MD +++ b/README.MD @@ -1,11 +1,5 @@ # openCountdown # ToDo -- [X] Pausing functions -- [X] Presets -- [X] time on countdown page -- [X] one-way messaging -- [P] Better UI - - [ ] Error popups -- [X] Progress bar +- [ ] Improve duration picker in table view - [P] Endpoint docs diff --git a/package-lock.json b/package-lock.json index f6a47af..03d3600 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7,15 +7,14 @@ "": { "name": "opencountdown", "version": "1.0.0", - "license": "ISC", + "license": "LGPL-3.0", "dependencies": { "body-parser": "^1.19.2", "bootstrap": "^5.1.3", - "bootstrap-colorpicker": "^3.4.0", + "bootstrap-duration-picker": "^2.1.3", "bootstrap-icons": "^1.8.1", "countdown": "^2.6.0", "darkreader": "^4.9.44", - "eta": "^1.12.3", "express": "^4.17.3", "jquery": "^3.6.0", "js-cookie": "^3.0.1", @@ -83,15 +82,10 @@ "@popperjs/core": "^2.10.2" } }, - "node_modules/bootstrap-colorpicker": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.4.0.tgz", - "integrity": "sha512-7vA0hvLrat3ptobEKlT9+6amzBUJcDAoh6hJRQY/AD+5dVZYXXf1ivRfrTwmuwiVLJo9rZwM8YB4lYzp6agzqg==", - "dependencies": { - "bootstrap": ">=4.0", - "jquery": ">=2.2", - "popper.js": ">=1.10" - } + "node_modules/bootstrap-duration-picker": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/bootstrap-duration-picker/-/bootstrap-duration-picker-2.1.3.tgz", + "integrity": "sha1-vxctw2psm4lQBpYqLYGIwzYPsmU=" }, "node_modules/bootstrap-icons": { "version": "1.8.1", @@ -194,17 +188,6 @@ "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" }, - "node_modules/eta": { - "version": "1.12.3", - "resolved": "https://registry.npmjs.org/eta/-/eta-1.12.3.tgz", - "integrity": "sha512-qHixwbDLtekO/d51Yr4glcaUJCIjGVJyTzuqV4GPlgZo1YpgOKG+avQynErZIYrfM6JIJdtiG2Kox8tbb+DoGg==", - "engines": { - "node": ">=6.0.0" - }, - "funding": { - "url": "https://github.com/eta-dev/eta?sponsor=1" - } - }, "node_modules/etag": { "version": "1.8.1", "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz", @@ -439,16 +422,6 @@ "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz", "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w=" }, - "node_modules/popper.js": { - "version": "1.16.1", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", - "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==", - "deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1", - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/popperjs" - } - }, "node_modules/proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", @@ -682,15 +655,10 @@ "integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==", "requires": {} }, - "bootstrap-colorpicker": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/bootstrap-colorpicker/-/bootstrap-colorpicker-3.4.0.tgz", - "integrity": "sha512-7vA0hvLrat3ptobEKlT9+6amzBUJcDAoh6hJRQY/AD+5dVZYXXf1ivRfrTwmuwiVLJo9rZwM8YB4lYzp6agzqg==", - "requires": { - "bootstrap": ">=4.0", - "jquery": ">=2.2", - "popper.js": ">=1.10" - } + "bootstrap-duration-picker": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/bootstrap-duration-picker/-/bootstrap-duration-picker-2.1.3.tgz", + "integrity": "sha1-vxctw2psm4lQBpYqLYGIwzYPsmU=" }, "bootstrap-icons": { "version": "1.8.1", @@ -768,11 +736,6 @@ "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" }, - "eta": { - "version": "1.12.3", - "resolved": "https://registry.npmjs.org/eta/-/eta-1.12.3.tgz", - "integrity": "sha512-qHixwbDLtekO/d51Yr4glcaUJCIjGVJyTzuqV4GPlgZo1YpgOKG+avQynErZIYrfM6JIJdtiG2Kox8tbb+DoGg==" - }, "etag": { "version": "1.8.1", "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz", @@ -950,11 +913,6 @@ "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz", "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w=" }, - "popper.js": { - "version": "1.16.1", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz", - "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==" - }, "proxy-addr": { "version": "2.0.7", "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz", diff --git a/package.json b/package.json index b64a7e1..4480ea6 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "dependencies": { "body-parser": "^1.19.2", "bootstrap": "^5.1.3", - "bootstrap-colorpicker": "^3.4.0", + "bootstrap-duration-picker": "^2.1.3", "bootstrap-icons": "^1.8.1", "countdown": "^2.6.0", "darkreader": "^4.9.44", diff --git a/static/bootstrap-duration-picker b/static/bootstrap-duration-picker new file mode 120000 index 0000000..3b83664 --- /dev/null +++ b/static/bootstrap-duration-picker @@ -0,0 +1 @@ +../node_modules/bootstrap-duration-picker/dist/ \ No newline at end of file diff --git a/static/coloris/coloris.min.css b/static/coloris/coloris.min.css new file mode 100644 index 0000000..1e50bd4 --- /dev/null +++ b/static/coloris/coloris.min.css @@ -0,0 +1 @@ +.clr-picker{display:none;flex-wrap:wrap;position:absolute;width:200px;z-index:1000;border-radius:10px;background-color:#fff;justify-content:space-between;box-shadow:0 0 5px rgba(0,0,0,.05),0 5px 20px rgba(0,0,0,.1);-moz-user-select:none;-webkit-user-select:none;user-select:none}.clr-picker.clr-open{display:flex}.clr-gradient{position:relative;width:100%;height:100px;margin-bottom:15px;border-radius:3px 3px 0 0;background-image:linear-gradient(rgba(0,0,0,0),#000),linear-gradient(90deg,#fff,currentColor);cursor:pointer}.clr-marker{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border:1px solid #fff;border-radius:50%;background-color:currentColor;cursor:pointer}.clr-picker input[type=range]::-webkit-slider-runnable-track{width:100%;height:8px}.clr-picker input[type=range]::-webkit-slider-thumb{width:8px;height:8px;-webkit-appearance:none}.clr-picker input[type=range]::-moz-range-track{width:100%;height:8px;border:0}.clr-picker input[type=range]::-moz-range-thumb{width:8px;height:8px;border:0}.clr-hue{background-image:linear-gradient(to right,red 0,#ff0 16.66%,#0f0 33.33%,#0ff 50%,#00f 66.66%,#f0f 83.33%,red 100%)}.clr-alpha,.clr-hue{position:relative;width:calc(100% - 40px);height:8px;margin:5px 20px;border-radius:4px}.clr-alpha span{display:block;height:100%;width:100%;border-radius:inherit;background-image:linear-gradient(90deg,rgba(0,0,0,0),currentColor)}.clr-alpha input,.clr-hue input{position:absolute;width:calc(100% + 16px);height:16px;left:-8px;top:-4px;margin:0;background-color:transparent;opacity:0;cursor:pointer;appearance:none;-webkit-appearance:none}.clr-alpha div,.clr-hue div{position:absolute;width:16px;height:16px;left:0;top:50%;margin-left:-8px;transform:translateY(-50%);border:2px solid #fff;border-radius:50%;background-color:currentColor;box-shadow:0 0 1px #888;pointer-events:none}.clr-alpha div:before{content:'';position:absolute;height:100%;width:100%;left:0;top:0;border-radius:50%;background-color:currentColor}.clr-format{display:none;order:1;width:calc(100% - 40px);margin:0 20px 20px}.clr-segmented{display:flex;position:relative;width:100%;margin:0;padding:0;border:1px solid #ddd;border-radius:15px;box-sizing:border-box;color:#999;font-size:12px}.clr-segmented input,.clr-segmented legend{position:absolute;width:100%;height:100%;margin:0;padding:0;border:0;left:0;top:0;opacity:0;pointer-events:none}.clr-segmented label{flex-grow:1;padding:4px 0;text-align:center;cursor:pointer}.clr-segmented label:first-of-type{border-radius:10px 0 0 10px}.clr-segmented label:last-of-type{border-radius:0 10px 10px 0}.clr-segmented input:checked+label{color:#fff;background-color:#666}.clr-swatches{order:2;width:calc(100% - 32px);margin:0 16px}.clr-swatches div{display:flex;flex-wrap:wrap;padding-bottom:12px;justify-content:center}.clr-swatches button{position:relative;width:20px;height:20px;margin:0 4px 6px 4px;border:0;border-radius:50%;color:inherit;text-indent:-1000px;white-space:nowrap;overflow:hidden;cursor:pointer}.clr-swatches button:after{content:'';display:block;position:absolute;width:100%;height:100%;left:0;top:0;border-radius:inherit;background-color:currentColor;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}input.clr-color{order:1;width:calc(100% - 80px);height:32px;margin:15px 20px 20px 0;padding:0 10px;border:1px solid #ddd;border-radius:16px;color:#444;background-color:#fff;font-family:sans-serif;font-size:14px;text-align:center;box-shadow:none}input.clr-color:focus{outline:0;border:1px solid #1e90ff}.clr-clear{display:none;order:2;height:24px;margin:0 20px 20px auto;padding:0 20px;border:0;border-radius:12px;color:#fff;background-color:#666;font-family:inherit;font-size:12px;font-weight:400;cursor:pointer}.clr-preview{position:relative;width:32px;height:32px;margin:15px 0 20px 20px;border:0;border-radius:50%;overflow:hidden;cursor:pointer}.clr-preview:after,.clr-preview:before{content:'';position:absolute;height:100%;width:100%;left:0;top:0;border:1px solid #fff;border-radius:50%}.clr-preview:after{border:0;background-color:currentColor;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1)}.clr-alpha div,.clr-color,.clr-hue div,.clr-marker{box-sizing:border-box}.clr-field{display:inline-block;position:relative;color:transparent}.clr-field button{position:absolute;width:30px;height:100%;right:0;top:50%;transform:translateY(-50%);border:0;color:inherit;text-indent:-1000px;white-space:nowrap;overflow:hidden;pointer-events:none}.clr-field button:after{content:'';display:block;position:absolute;width:100%;height:100%;left:0;top:0;border-radius:inherit;background-color:currentColor;box-shadow:inset 0 0 1px rgba(0,0,0,.5)}.clr-alpha,.clr-alpha div,.clr-field button,.clr-preview:before,.clr-swatches button{background-image:repeating-linear-gradient(45deg,#aaa 25%,transparent 25%,transparent 75%,#aaa 75%,#aaa),repeating-linear-gradient(45deg,#aaa 25%,#fff 25%,#fff 75%,#aaa 75%,#aaa);background-position:0 0,4px 4px;background-size:8px 8px}.clr-marker:focus{outline:0}.clr-keyboard-nav .clr-alpha input:focus+div,.clr-keyboard-nav .clr-hue input:focus+div,.clr-keyboard-nav .clr-marker:focus,.clr-keyboard-nav .clr-segmented input:focus+label{outline:0;box-shadow:0 0 0 2px #1e90ff,0 0 2px 2px #fff}.clr-picker[data-alpha=false] .clr-alpha{display:none}.clr-picker[data-minimal=true]{padding-top:16px}.clr-picker[data-minimal=true] .clr-alpha,.clr-picker[data-minimal=true] .clr-color,.clr-picker[data-minimal=true] .clr-gradient,.clr-picker[data-minimal=true] .clr-hue,.clr-picker[data-minimal=true] .clr-preview{display:none}.clr-dark{background-color:#444}.clr-dark .clr-segmented{border-color:#777}.clr-dark .clr-swatches button:after{box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}.clr-dark input.clr-color{color:#fff;border-color:#777;background-color:#555}.clr-dark input.clr-color:focus{border-color:#1e90ff}.clr-dark .clr-preview:after{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}.clr-dark .clr-alpha,.clr-dark .clr-alpha div,.clr-dark .clr-preview:before,.clr-dark .clr-swatches button{background-image:repeating-linear-gradient(45deg,#666 25%,transparent 25%,transparent 75%,#888 75%,#888),repeating-linear-gradient(45deg,#888 25%,#444 25%,#444 75%,#888 75%,#888)}.clr-picker.clr-polaroid{border-radius:6px;box-shadow:0 0 5px rgba(0,0,0,.1),0 5px 30px rgba(0,0,0,.2)}.clr-picker.clr-polaroid:before{content:'';display:block;position:absolute;width:16px;height:10px;left:20px;top:-10px;border:solid transparent;border-width:0 8px 10px 8px;border-bottom-color:currentColor;box-sizing:border-box;color:#fff;filter:drop-shadow(0 -4px 3px rgba(0,0,0,.1));pointer-events:none}.clr-picker.clr-polaroid.clr-dark:before{color:#444}.clr-picker.clr-polaroid.clr-left:before{left:auto;right:20px}.clr-picker.clr-polaroid.clr-top:before{top:auto;bottom:-10px;transform:rotateZ(180deg)}.clr-polaroid .clr-gradient{width:calc(100% - 20px);height:120px;margin:10px;border-radius:3px}.clr-polaroid .clr-alpha,.clr-polaroid .clr-hue{width:calc(100% - 30px);height:10px;margin:6px 15px;border-radius:5px}.clr-polaroid .clr-alpha div,.clr-polaroid .clr-hue div{box-shadow:0 0 5px rgba(0,0,0,.2)}.clr-polaroid .clr-format{width:calc(100% - 20px);margin:0 10px 15px}.clr-polaroid .clr-swatches{width:calc(100% - 12px);margin:0 6px}.clr-polaroid .clr-swatches div{padding-bottom:10px}.clr-polaroid .clr-swatches button{width:22px;height:22px}.clr-polaroid input.clr-color{width:calc(100% - 60px);margin:10px 10px 15px 0}.clr-polaroid .clr-clear{margin:0 10px 15px auto}.clr-polaroid .clr-preview{margin:10px 0 15px 10px}.clr-picker.clr-large{width:275px}.clr-large .clr-gradient{height:150px}.clr-large .clr-swatches button{width:22px;height:22px} \ No newline at end of file diff --git a/static/coloris/coloris.min.js b/static/coloris/coloris.min.js new file mode 100644 index 0000000..f6a773f --- /dev/null +++ b/static/coloris/coloris.min.js @@ -0,0 +1,6 @@ +/*! + * Copyright (c) 2021 Momo Bassit. + * Licensed under the MIT License (MIT) + * https://github.com/mdbassit/Coloris + */ +!function(d,p,s){var h,f,v,c,u,y,i,b,l,g,m,w,k,x,a=p.createElement("canvas").getContext("2d"),E={r:0,g:0,b:0,h:0,s:0,v:0,a:1},L={el:"[data-coloris]",parent:null,theme:"default",themeMode:"light",wrap:!0,margin:2,format:"hex",formatToggle:!1,swatches:[],swatchesOnly:!1,alpha:!0,focusInput:!0,autoClose:!1,clearButton:{show:!1,label:"Clear"},a11y:{open:"Open color picker",close:"Close color picker",marker:"Saturation: {s}. Brightness: {v}.",hueSlider:"Hue slider",alphaSlider:"Opacity slider",input:"Color value field",format:"Color format",swatch:"Color swatch",instruction:"Saturation and brightness selector. Use up, down, left and right arrow keys to select."}};function o(e){if("object"==typeof e)for(var t in e)switch(t){case"el":S(e.el),!1!==e.wrap&&T(e.el);break;case"parent":L.parent=p.querySelector(e.parent),L.parent&&L.parent.appendChild(h);break;case"themeMode":L.themeMode=e.themeMode,"auto"===e.themeMode&&d.matchMedia&&d.matchMedia("(prefers-color-scheme: dark)").matches&&(L.themeMode="dark");case"theme":e.theme&&(L.theme=e.theme),h.className="clr-picker clr-"+L.theme+" clr-"+L.themeMode;break;case"margin":e.margin*=1,L.margin=(isNaN(e.margin)?L:e).margin;break;case"wrap":e.el&&e.wrap&&T(e.el);break;case"formatToggle":N("clr-format").style.display=e.formatToggle?"block":"none",e.formatToggle&&(L.format="auto");break;case"swatches":Array.isArray(e.swatches)&&function(){var a=[];e.swatches.forEach(function(e,t){a.push('")}),a.length&&(N("clr-swatches").innerHTML="
"+a.join("")+"
")}();break;case"swatchesOnly":L.swatchesOnly=!!e.swatchesOnly,h.setAttribute("data-minimal",L.swatchesOnly),L.swatchesOnly&&(L.autoClose=!0);break;case"alpha":L.alpha=!!e.alpha,h.setAttribute("data-alpha",L.alpha);break;case"clearButton":var a="none";e.clearButton.show&&(a="block"),e.clearButton.label&&(i.innerHTML=e.clearButton.label),i.style.display=a;break;case"a11y":var l,r=e.a11y,o=!1;if("object"==typeof r)for(var n in r)r[n]&&L.a11y[n]&&(L.a11y[n]=r[n],o=!0);o&&(l=N("clr-open-label"),a=N("clr-swatch-label"),l.innerHTML=L.a11y.open,a.innerHTML=L.a11y.swatch,u.setAttribute("aria-label",L.a11y.close),b.setAttribute("aria-label",L.a11y.hueSlider),g.setAttribute("aria-label",L.a11y.alphaSlider),y.setAttribute("aria-label",L.a11y.input),f.setAttribute("aria-label",L.a11y.instruction));default:L[t]=e[t]}}function S(e){O(p,"click",e,function(e){var t=L.parent,a=e.target.getBoundingClientRect(),l=d.scrollY,r={left:!1,top:!1},o={x:0,y:0},n=a.x,i=l+a.y+a.height+L.margin;w=e.target,x=w.value,k=function(e){e=e.substring(0,3).toLowerCase();return"rgb"!==e&&"hsl"!==e?"hex":e}(x),h.classList.add("clr-open");var c,s=h.offsetWidth,u=h.offsetHeight;t?(c=d.getComputedStyle(t),e=parseFloat(c.marginTop),c=parseFloat(c.borderTopWidth),(o=t.getBoundingClientRect()).y+=c+l,n-=o.x,i-=o.y,n+s>t.clientWidth&&(n+=a.width-s,r.left=!0),i+u>t.clientHeight-e&&(i-=a.height+u+2*L.margin,r.top=!0),i+=t.scrollTop):(n+s>p.documentElement.clientWidth&&(n+=a.width-s,r.left=!0),i+u-l>p.documentElement.clientHeight&&(i=l+a.y-u-L.margin,r.top=!0)),h.classList.toggle("clr-left",r.left),h.classList.toggle("clr-top",r.top),h.style.left=n+"px",h.style.top=i+"px",v={width:f.offsetWidth,height:f.offsetHeight,x:h.offsetLeft+f.offsetLeft+o.x,y:h.offsetTop+f.offsetTop+o.y},A(x),L.focusInput&&y.focus({preventScroll:!0})}),O(p,"input",e,function(e){var t=e.target.parentNode;t.classList.contains("clr-field")&&(t.style.color=e.target.value)})}function T(e){p.querySelectorAll(e).forEach(function(e){var t,a=e.parentNode;a.classList.contains("clr-field")||((t=p.createElement("div")).innerHTML='',a.insertBefore(t,e),t.setAttribute("class","clr-field"),t.style.color=e.value,t.appendChild(e))})}function n(e){w&&(e&&x!==w.value&&(w.value=x,w.dispatchEvent(new Event("input",{bubbles:!0}))),x!==w.value&&w.dispatchEvent(new Event("change",{bubbles:!0})),h.classList.remove("clr-open"),L.focusInput&&w.focus({preventScroll:!0}),w=null)}function A(e){var t=function(e){var t;a.fillStyle="#000",a.fillStyle=e,(e=/^((rgba)|rgb)[\D]+([\d.]+)[\D]+([\d.]+)[\D]+([\d.]+)[\D]*?([\d.]+|$)/i.exec(a.fillStyle))?(t={r:+e[3],g:+e[4],b:+e[5],a:+e[6]}).a=+t.a.toFixed(2):(e=a.fillStyle.replace("#","").match(/.{2}/g).map(function(e){return parseInt(e,16)}),t={r:e[0],g:e[1],b:e[2],a:1});return t}(e),e=function(e){var t=e.r/255,a=e.g/255,l=e.b/255,r=s.max(t,a,l),o=s.min(t,a,l),n=r-o,i=r,c=0,o=0;n&&(r===t&&(c=(a-l)/n),r===a&&(c=2+(l-t)/n),r===l&&(c=4+(t-a)/n),r&&(o=n/r));return{h:(c=s.floor(60*c))<0?c+360:c,s:s.round(100*o),v:s.round(100*i),a:e.a}}(t);M(e.s,e.v),H(t,e),b.value=e.h,h.style.color="hsl("+e.h+", 100%, 50%)",l.style.left=e.h/360*100+"%",c.style.left=v.width*e.s/100+"px",c.style.top=v.height-v.height*e.v/100+"px",g.value=100*e.a,m.style.left=100*e.a+"%"}function r(e){w&&(w.value=void 0!==e?e:y.value,w.dispatchEvent(new Event("input",{bubbles:!0})))}function C(e,t){e={h:+b.value,s:e/v.width*100,v:100-t/v.height*100,a:g.value/100},t=function(e){var t=e.s/100,a=e.v/100,l=t*a,r=e.h/60,o=l*(1-s.abs(r%2-1)),n=a-l;l+=n,o+=n;t=s.floor(r)%6,a=[l,o,n,n,o,l][t],r=[o,l,l,o,n,n][t],t=[n,n,o,l,l,o][t];return{r:s.round(255*a),g:s.round(255*r),b:s.round(255*t),a:e.a}}(e);M(e.s,e.v),H(t,e),r()}function M(e,t){var a=L.a11y.marker;e=+e.toFixed(1),t=+t.toFixed(1),a=(a=a.replace("{s}",e)).replace("{v}",t),c.setAttribute("aria-label",a)}function t(e){var t={pageX:((a=e).changedTouches?a.changedTouches[0]:a).pageX,pageY:(a.changedTouches?a.changedTouches[0]:a).pageY},a=t.pageX-v.x,t=t.pageY-v.y;L.parent&&(t+=L.parent.scrollTop),a=a<0?0:a>v.width?v.width:a,t=t<0?0:t>v.height?v.height:t,c.style.left=a+"px",c.style.top=t+"px",C(a,t),e.preventDefault(),e.stopPropagation()}function H(e,t){void 0===t&&(t={});var a,l,r=L.format;for(a in e=void 0===e?{}:e)E[a]=e[a];for(l in t)E[l]=t[l];var o,n=function(e){var t=e.r.toString(16),a=e.g.toString(16),l=e.b.toString(16),r="";e.r<16&&(t="0"+t);e.g<16&&(a="0"+a);e.b<16&&(l="0"+l);L.alpha&&e.a<1&&(e=255*e.a|0,r=e.toString(16),e<16&&(r="0"+r));return"#"+t+a+l+r}(E),i=n.substring(0,7);switch(c.style.color=i,m.parentNode.style.color=i,m.style.color=n,u.style.color=n,f.style.display="none",f.offsetHeight,f.style.display="",m.nextElementSibling.style.display="none",m.nextElementSibling.offsetHeight,m.nextElementSibling.style.display="","mixed"===r?r=1===E.a?"hex":"rgb":"auto"===r&&(r=k),r){case"hex":y.value=n;break;case"rgb":y.value=(o=E,L.alpha&&1!==o.a?"rgba("+o.r+", "+o.g+", "+o.b+", "+o.a+")":"rgb("+o.r+", "+o.g+", "+o.b+")");break;case"hsl":y.value=(o=function(e){var t,a=e.v/100,l=a*(1-e.s/100/2);0
'+L.a11y.format+'
",p.body.appendChild(h),f=N("clr-color-area"),c=N("clr-color-marker"),i=N("clr-clear"),u=N("clr-color-preview"),y=N("clr-color-value"),b=N("clr-hue-slider"),l=N("clr-hue-marker"),g=N("clr-alpha-slider"),m=N("clr-alpha-marker"),S(L.el),T(L.el),O(h,"mousedown",function(e){h.classList.remove("clr-keyboard-nav"),e.stopPropagation()}),O(f,"mousedown",function(e){O(p,"mousemove",t)}),O(f,"touchstart",function(e){p.addEventListener("touchmove",t,{passive:!1})}),O(c,"mousedown",function(e){O(p,"mousemove",t)}),O(c,"touchstart",function(e){p.addEventListener("touchmove",t,{passive:!1})}),O(y,"change",function(e){A(y.value),r()}),O(i,"click",function(e){r(""),n()}),O(u,"click",function(e){r(),n()}),O(p,"click",".clr-format input",function(e){k=e.target.value,H(),r()}),O(h,"click",".clr-swatches button",function(e){A(e.target.textContent),r(),L.autoClose&&n()}),O(p,"mouseup",function(e){p.removeEventListener("mousemove",t)}),O(p,"touchend",function(e){p.removeEventListener("touchmove",t)}),O(p,"mousedown",function(e){h.classList.remove("clr-keyboard-nav"),n()}),O(p,"keydown",function(e){"Escape"===e.key?n(!0):"Tab"===e.key&&h.classList.add("clr-keyboard-nav")}),O(p,"click",".clr-field button",function(e){e.target.nextElementSibling.dispatchEvent(new Event("click",{bubbles:!0}))}),O(c,"keydown",function(e){var t={ArrowUp:[0,-1],ArrowDown:[0,1],ArrowLeft:[-1,0],ArrowRight:[1,0]};-1!==Object.keys(t).indexOf(e.key)&&(!function(e,t){e=+c.style.left.replace("px","")+e,t=+c.style.top.replace("px","")+t,c.style.left=e+"px",c.style.top=t+"px",C(e,t)}.apply(void 0,t[e.key]),e.preventDefault())}),O(f,"click",t),O(b,"input",e),O(g,"input",B)})}(window,document,Math); \ No newline at end of file diff --git a/static/css/fonts/bootstrap-icons.woff b/static/css/fonts/bootstrap-icons.woff new file mode 120000 index 0000000..6a1958f --- /dev/null +++ b/static/css/fonts/bootstrap-icons.woff @@ -0,0 +1 @@ +../../../node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff \ No newline at end of file diff --git a/static/css/fonts/bootstrap-icons.woff2 b/static/css/fonts/bootstrap-icons.woff2 new file mode 120000 index 0000000..90ff4c9 --- /dev/null +++ b/static/css/fonts/bootstrap-icons.woff2 @@ -0,0 +1 @@ +../../../node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff2 \ No newline at end of file diff --git a/static/css/mainStyle.css b/static/css/mainStyle.css index 47a3d40..29bd68c 100644 --- a/static/css/mainStyle.css +++ b/static/css/mainStyle.css @@ -113,4 +113,8 @@ pre { overflow: auto; word-wrap: normal; white-space: pre; +} + +.hidden { + display: none !important; } \ No newline at end of file diff --git a/static/js/interface.js b/static/js/interface.js index 9e61b55..84b8d38 100644 --- a/static/js/interface.js +++ b/static/js/interface.js @@ -4,7 +4,6 @@ function convertTimeOffset() { } - function convertColorSegments(elementId) { const raw = document.getElementById(elementId); console.log(raw) @@ -313,9 +312,7 @@ $(document).ready(function () { console.log(value, parseInt(event.currentTarget.id.replace("btnradio", ""))) saveOption("/api/v1/set/mode?mode=" + value, function (event) { setTimeout(function () { - $("#sendMessage")[0].innerHTML = ' \ - \ - ' + $("#sendMessage")[0].innerHTML = '' }, 200) }) @@ -327,9 +324,7 @@ $(document).ready(function () { let value = $("#messageContent").val() saveOption("/api/v1/ctrl/message/show?msg=" + value, function (event) { setTimeout(function () { - $("#sendMessage")[0].innerHTML = ' \ - \ - ' + $("#sendMessage")[0].innerHTML = '' }, 200) }) @@ -339,10 +334,7 @@ $(document).ready(function () { $("#ctrlRemoveMessage")[0].innerHTML = '' saveOption("/api/v1/ctrl/message/hide", function (event) { setTimeout(function () { - $("#ctrlRemoveMessage")[0].innerHTML = '\ - \ - \ - ' + $("#ctrlRemoveMessage")[0].innerHTML = '' }, 200) }) @@ -352,7 +344,7 @@ $(document).ready(function () { $("#funcPlay")[0].innerHTML = '' saveOption("/api/v1/ctrl/timer/play", function (event) { setTimeout(function () { - $("#funcPlay")[0].innerHTML = '' + $("#funcPlay")[0].innerHTML = '' }, 200); }) }) @@ -363,7 +355,7 @@ $(document).ready(function () { saveOption("/api/v1/ctrl/timer/pause", function (event) { setTimeout(function () { - $("#funcPause")[0].innerHTML = '' + $("#funcPause")[0].innerHTML = '' }, 200); }) }) @@ -372,7 +364,7 @@ $(document).ready(function () { $("#funcRestart")[0].innerHTML = '' saveOption("/api/v1/ctrl/timer/restart", function (event) { setTimeout(function () { - $("#funcRestart")[0].innerHTML = '' + $("#funcRestart")[0].innerHTML = '' }, 200) }) }) diff --git a/templates/newAdminPanel.html b/templates/newAdminPanel.html index 9e73b19..ce2649b 100644 --- a/templates/newAdminPanel.html +++ b/templates/newAdminPanel.html @@ -21,89 +21,16 @@ - - + + + + + + - - - Bootstrap - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
@@ -116,25 +43,19 @@
@@ -392,9 +282,11 @@
- + - @@ -417,8 +309,44 @@

Full size thumbnail

-
- + + + +

+ + + + +
+
+ + +
+ +
+ + + + + + + + + + +

Raw server reponse

@@ -446,8 +374,8 @@ diff --git a/templates/timerPage.html b/templates/timerPage.html index 62e0a3c..96a5b1a 100644 --- a/templates/timerPage.html +++ b/templates/timerPage.html @@ -11,6 +11,7 @@ +