Split up static files into static and django_static
This commit is contained in:
parent
3a9b2c25e7
commit
0f4b1d9da2
22 changed files with 9 additions and 4 deletions
|
|
@ -1,572 +0,0 @@
|
|||
/* Font */
|
||||
|
||||
@font-face {
|
||||
font-family: "Inter";
|
||||
src: url('/static/fonts/Inter-Regular.ttf');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Inter";
|
||||
src: url('/static/fonts/Inter-Bold.ttf');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* Variables */
|
||||
|
||||
:root {
|
||||
--font-family: "Inter";
|
||||
--color: #fafafa;
|
||||
--color-error: #ff682c;
|
||||
--bg-page-color: #222222;
|
||||
--bg-color: #4e4e4e;
|
||||
--bg-hover-color: #636363;
|
||||
--bg-color2: #383838;
|
||||
--bg-hover-color2: #4a4a4a;
|
||||
--border-color: #808080;
|
||||
--bg-globalmessage: #161616;
|
||||
--border-radius: .5rem;
|
||||
}
|
||||
|
||||
/* General */
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100vw;
|
||||
min-height: 100vh;
|
||||
font-family: var(--font-family);
|
||||
background: var(--bg-page-color);
|
||||
color: var(--color);
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--color);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
input[type="number"] {
|
||||
width: 8rem;
|
||||
-webkit-appearance: textfield;
|
||||
-moz-appearance: textfield;
|
||||
appearance: textfield;
|
||||
}
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="text"], input[type="password"], input[type="number"], select {
|
||||
padding: .6rem .8rem;
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
color: var(--color);
|
||||
border: none;
|
||||
outline: none;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
border-radius: var(--border-radius);
|
||||
background: var(--bg-color);
|
||||
font-family: "Inter";
|
||||
}
|
||||
|
||||
select {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
height: 2.5rem;
|
||||
background-image: url("/static/material-icons/arrow-drop-down.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
background-size: 1.5rem;
|
||||
padding-right: 1.8rem;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
text-align: left;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
tr > th,
|
||||
tr > td {
|
||||
background: var(--bg-color);
|
||||
}
|
||||
|
||||
tr:nth-child(2n+2) > td {
|
||||
background: var(--bg-color2);
|
||||
}
|
||||
|
||||
/*
|
||||
Rounded corners on table cells apparently don't work with
|
||||
Firefox, so Firefox users won't have rounded corners
|
||||
on tables. Can't fix that by myself.
|
||||
*/
|
||||
|
||||
table tr:first-child th:first-child {
|
||||
border-top-left-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
table tr:first-child th:last-child {
|
||||
border-top-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
table tr:last-child td:first-child {
|
||||
border-bottom-left-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
table tr:last-child td:last-child {
|
||||
border-bottom-right-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
td, th {
|
||||
padding: .5rem .8rem;
|
||||
}
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
/* Basic Layout */
|
||||
|
||||
.baselayout {
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
width: 100vw;
|
||||
max-width: 100vw;
|
||||
}
|
||||
|
||||
.globalmessage {
|
||||
width: 100vw;
|
||||
z-index: 999;
|
||||
background: var(--bg-globalmessage);
|
||||
padding: .3rem 0;
|
||||
}
|
||||
|
||||
.globalmessage > div {
|
||||
width: 96%;
|
||||
word-break: keep-all;
|
||||
word-wrap: break-word;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.userpanel {
|
||||
flex-direction: row;
|
||||
margin-top: 1rem;
|
||||
width: 94%;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.userinfo {
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.userinfo > span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.userinfo > img {
|
||||
vertical-align: middle;
|
||||
width: 1.8rem;
|
||||
height: 1.8rem;
|
||||
margin: .5rem;
|
||||
}
|
||||
|
||||
.userpanel-buttons {
|
||||
gap: .5rem;
|
||||
}
|
||||
|
||||
.userpanel-buttons > .button, .userpanel-buttons button {
|
||||
height: 1.2rem;
|
||||
}
|
||||
|
||||
.userbalancewarn {
|
||||
color: var(--color-error);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
main {
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.content {
|
||||
justify-content: start;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
padding: 2rem 0;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
z-index: 900;
|
||||
margin-top: auto;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: 1.5rem;
|
||||
padding-bottom: .3rem;
|
||||
text-align: center;
|
||||
pointer-events: initial;
|
||||
}
|
||||
|
||||
.footer > div {
|
||||
font-size: .95rem;
|
||||
margin-top: .15rem;
|
||||
margin-bottom: .15rem;
|
||||
}
|
||||
|
||||
.footer > div::after {
|
||||
margin-left: .5rem;
|
||||
content: "-";
|
||||
margin-right: .5rem;
|
||||
}
|
||||
|
||||
.footer > div:last-child::after {
|
||||
content: none;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/* Common */
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.flex-column {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.text-align-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.text-align-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gap-1rem {
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.fill {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fill-vertical {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: end;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.button, button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-family: var(--font-family);
|
||||
text-decoration: none;
|
||||
text-align: center !important;
|
||||
background: var(--bg-color);
|
||||
color: var(--color);
|
||||
font-size: 1rem;
|
||||
padding: .6rem .8rem;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
border-radius: var(--border-radius);
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
box-sizing: content-box;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.button:hover, button:hover, .button:active, button:active {
|
||||
background: var(--bg-hover-color);
|
||||
}
|
||||
|
||||
.button:disabled, button:disabled {
|
||||
opacity: 40%;
|
||||
}
|
||||
|
||||
.appform > .forminfo {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.forminfo > span:last-child {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.appform > .forminput {
|
||||
width: 100%;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.appform > .statusinfo {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
|
||||
.dropdownmenu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.dropdownbutton {
|
||||
z-index: 190;
|
||||
}
|
||||
|
||||
.dropdownbutton > img {
|
||||
width: auto;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.dropdownlist {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
pointer-events: none;
|
||||
border-radius: var(--border-radius) !important;
|
||||
z-index: 200;
|
||||
margin-top: 3.2rem;
|
||||
opacity: 0%;
|
||||
transition: opacity 100ms;
|
||||
box-shadow: 0 .25rem 1rem #00000090;
|
||||
}
|
||||
|
||||
.dropdownchoice {
|
||||
border-radius: 0 !important;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
background: var(--bg-color2) !important;
|
||||
backdrop-filter: none !important;
|
||||
width: initial;
|
||||
}
|
||||
|
||||
.dropdownchoice:hover {
|
||||
background: var(--bg-hover-color2) !important;
|
||||
}
|
||||
|
||||
.dropdownlist :first-child {
|
||||
border-top-left-radius: var(--border-radius) !important;
|
||||
border-top-right-radius: var(--border-radius) !important;
|
||||
}
|
||||
|
||||
.dropdownlist :last-child {
|
||||
border-bottom-left-radius: var(--border-radius) !important;
|
||||
border-bottom-right-radius: var(--border-radius) !important;
|
||||
}
|
||||
|
||||
.dropdownvisible .dropdownlist {
|
||||
opacity: 100%;
|
||||
visibility: visible;
|
||||
pointer-events: visible;
|
||||
}
|
||||
|
||||
.customnumberinput {
|
||||
height: 2.5rem;
|
||||
}
|
||||
|
||||
.customnumberinput button {
|
||||
min-width: 2.5rem !important;
|
||||
width: 2.5rem !important;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.customnumberinput-minus {
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.customnumberinput-plus {
|
||||
border-bottom-left-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.customnumberinput input[type="number"] {
|
||||
height: 100%;
|
||||
width: 4rem;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background: var(--bg-color2);
|
||||
border-radius: 0 !important;
|
||||
-webkit-appearance: textfield;
|
||||
-moz-appearance: textfield;
|
||||
appearance: textfield;
|
||||
}
|
||||
|
||||
.errortext {
|
||||
color: var(--color-error);
|
||||
}
|
||||
|
||||
.nodisplay {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* Login */
|
||||
|
||||
.userlist {
|
||||
width: 60%;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.userlist > li {
|
||||
margin-bottom: .5rem;
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
.userlist > li > img {
|
||||
margin-right: auto;
|
||||
margin-left: 0;
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.userlist > li > div {
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
padding: .8rem 1.1rem;
|
||||
}
|
||||
|
||||
.loginform {
|
||||
gap: 1rem;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.loginform > .buttons {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* Drinks List */
|
||||
|
||||
.drinks-list {
|
||||
justify-content: center;
|
||||
align-items: start;
|
||||
padding: 0;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.drinks-list > li {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.drinks-list > li > .button {
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
padding: .8rem 1.1rem;
|
||||
}
|
||||
|
||||
/* Statistics */
|
||||
|
||||
.statistics-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
max-width: 90vw;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.statistics-container > div {
|
||||
height: 100%;
|
||||
width: 16rem;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.userlist {
|
||||
width: 75%;
|
||||
}
|
||||
.drinks-list {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1000px) {
|
||||
.userlist {
|
||||
width: 90%;
|
||||
}
|
||||
.drinks-list {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 700px) {
|
||||
.userpanel {
|
||||
flex-direction: column;
|
||||
}
|
||||
.userlist {
|
||||
gap: 0.25rem;
|
||||
}
|
||||
.userlist > li {
|
||||
width: 100%;
|
||||
}
|
||||
.userlist > li > div {
|
||||
margin-right: 2rem;
|
||||
}
|
||||
.loginform {
|
||||
flex-direction: column;
|
||||
}
|
||||
.drinks-list {
|
||||
width: 90%;
|
||||
}
|
||||
.dropdownlist {
|
||||
width: 14rem;
|
||||
right: calc(50vw - 7rem);
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
/*!
|
||||
*
|
||||
* simple-keyboard v3.5.22
|
||||
* https://github.com/hodgef/simple-keyboard
|
||||
*
|
||||
* Copyright (c) Francisco Hodge (https://github.com/hodgef) and project contributors.
|
||||
*
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*
|
||||
*/.hg-theme-default{background-color:#ececec;border-radius:5px;box-sizing:border-box;font-family:HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;overflow:hidden;padding:5px;touch-action:manipulation;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.hg-theme-default .hg-button span{pointer-events:none}.hg-theme-default button.hg-button{border-width:0;font-size:inherit;outline:0}.hg-theme-default .hg-button{display:inline-block;flex-grow:1}.hg-theme-default .hg-row{display:flex}.hg-theme-default .hg-row:not(:last-child){margin-bottom:5px}.hg-theme-default .hg-row .hg-button-container,.hg-theme-default .hg-row .hg-button:not(:last-child){margin-right:5px}.hg-theme-default .hg-row>div:last-child{margin-right:0}.hg-theme-default .hg-row .hg-button-container{display:flex}.hg-theme-default .hg-button{-webkit-tap-highlight-color:rgba(0,0,0,0);align-items:center;background:#fff;border-bottom:1px solid #b5b5b5;border-radius:5px;box-shadow:0 0 3px -1px rgba(0,0,0,.3);box-sizing:border-box;cursor:pointer;display:flex;height:40px;justify-content:center;padding:5px}.hg-theme-default .hg-button.hg-standardBtn{width:20px}.hg-theme-default .hg-button.hg-activeButton{background:#efefef}.hg-theme-default.hg-layout-numeric .hg-button{align-items:center;display:flex;height:60px;justify-content:center;width:33.3%}.hg-theme-default .hg-button.hg-button-numpadadd,.hg-theme-default .hg-button.hg-button-numpadenter{height:85px}.hg-theme-default .hg-button.hg-button-numpad0{width:105px}.hg-theme-default .hg-button.hg-button-com{max-width:85px}.hg-theme-default .hg-button.hg-standardBtn.hg-button-at{max-width:45px}.hg-theme-default .hg-button.hg-selectedButton{background:rgba(5,25,70,.53);color:#fff}.hg-theme-default .hg-button.hg-standardBtn[data-skbtn=".com"]{max-width:82px}.hg-theme-default .hg-button.hg-standardBtn[data-skbtn="@"]{max-width:60px}.hg-candidate-box{background:#ececec;border-bottom:2px solid #b5b5b5;border-radius:5px;display:inline-flex;margin-top:-10px;max-width:272px;position:absolute;transform:translateY(-100%);-webkit-user-select:none;-moz-user-select:none;user-select:none}ul.hg-candidate-box-list{display:flex;flex:1;list-style:none;margin:0;padding:0}li.hg-candidate-box-list-item{align-items:center;display:flex;height:40px;justify-content:center;width:40px}li.hg-candidate-box-list-item:hover{background:rgba(0,0,0,.03);cursor:pointer}li.hg-candidate-box-list-item:active{background:rgba(0,0,0,.1)}.hg-candidate-box-prev:before{content:"◄"}.hg-candidate-box-next:before{content:"►"}.hg-candidate-box-next,.hg-candidate-box-prev{align-items:center;background:#d0d0d0;color:#969696;cursor:pointer;display:flex;padding:0 10px}.hg-candidate-box-next{border-bottom-right-radius:5px;border-top-right-radius:5px}.hg-candidate-box-prev{border-bottom-left-radius:5px;border-top-left-radius:5px}.hg-candidate-box-btn-active{color:#444}
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
.simple-keyboard.darkTheme.numeric {
|
||||
width: 13rem;
|
||||
}
|
||||
.simple-keyboard.darkTheme {
|
||||
width: 50rem;
|
||||
max-width: 100%;
|
||||
background: transparent;
|
||||
font-family: "Inter";
|
||||
}
|
||||
.simple-keyboard.darkTheme .hg-button {
|
||||
height: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: var(--bg-color);
|
||||
color: white;
|
||||
border: none;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.simple-keyboard.darkTheme .hg-button:active,
|
||||
.simple-keyboard.darkTheme .hg-button:hover {
|
||||
color: white;
|
||||
background: var(--bg-hover-color);
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 43 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 41 KiB |
Binary file not shown.
Binary file not shown.
|
|
@ -1,3 +0,0 @@
|
|||
setInterval(() => {
|
||||
location.reload();
|
||||
}, 1000*60*2); // reload after 2 minutes
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
document.addEventListener("DOMContentLoaded", () => {
|
||||
// elements
|
||||
let customForm = document.getElementById("customform");
|
||||
let statusInfo = document.getElementById("statusinfo");
|
||||
let submitButton = document.getElementById("submitbtn");
|
||||
// event listener for deposit form
|
||||
// this implements a custom submit method
|
||||
customForm.addEventListener("submit", (event) => {
|
||||
submitButton.disabled = true;
|
||||
event.preventDefault(); // Don't do the default submit action!
|
||||
let xhr = new XMLHttpRequest();
|
||||
let formData = new FormData(customForm);
|
||||
xhr.addEventListener("load", (event) => {
|
||||
status_ = event.target.status;
|
||||
response_ = event.target.responseText;
|
||||
if (status_ == 200 && response_ == "success") {
|
||||
statusInfo.innerText = "Success. Redirecting soon.";
|
||||
window.location.replace("/");
|
||||
}
|
||||
else {
|
||||
statusInfo.classList.add("errortext");
|
||||
statusInfo.innerText = "An error occured. Redirecting in 5 seconds...";
|
||||
window.setTimeout(() => { window.location.replace("/") }, 5000);
|
||||
}
|
||||
})
|
||||
xhr.addEventListener("error", (event) => {
|
||||
statusInfo.classList.add("errortext");
|
||||
statusInfo.innerText = "An error occured. Redirecting in 5 seconds...";
|
||||
window.setTimeout(() => { window.location.replace("/") }, 5000);
|
||||
})
|
||||
xhr.open("POST", customForm.action);
|
||||
xhr.send(formData);
|
||||
});
|
||||
});
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
(() => {
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
// get all customnumberinput Elements
|
||||
let customNumberInputElements = document.getElementsByClassName("customnumberinput");
|
||||
// Add Event Handler to the elements of the customnumberinputs
|
||||
[...customNumberInputElements].forEach(element => {
|
||||
// number input
|
||||
let numberFieldElement = element.getElementsByClassName("customnumberinput-field")[0];
|
||||
// minus button
|
||||
element.getElementsByClassName("customnumberinput-minus")[0].addEventListener("click", () => alterCustomNumberField(numberFieldElement, -1));
|
||||
// plus button
|
||||
element.getElementsByClassName("customnumberinput-plus")[0].addEventListener("click", () => alterCustomNumberField(numberFieldElement, +1));
|
||||
})
|
||||
})
|
||||
function alterCustomNumberField(numberFieldElement, n) {
|
||||
numberFieldElement.value = Math.min(
|
||||
Math.max(
|
||||
(parseInt(numberFieldElement.value) + n), numberFieldElement.min || Number.MIN_VALUE
|
||||
),
|
||||
numberFieldElement.max || Number.MAX_VALUE
|
||||
);
|
||||
}
|
||||
})();
|
||||
|
|
@ -1 +0,0 @@
|
|||
window.location.replace("/");
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
(() => {
|
||||
// Define variables
|
||||
let usernameInputElement;
|
||||
let passwordInputElement;
|
||||
let submitButton;
|
||||
let passwordOverlayElement;
|
||||
let pwOverlayCancelButton;
|
||||
let userlistButtons;
|
||||
let userlistContainerElement;
|
||||
// Add event listeners after DOM Content loaded
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
// elements
|
||||
usernameInputElement = document.getElementById("id_username");
|
||||
passwordInputElement = document.getElementById("id_password");
|
||||
submitButton = document.getElementById("submit_login");
|
||||
passwordOverlayElement = document.getElementById("passwordoverlay-container");
|
||||
pwOverlayCancelButton = document.getElementById("pwocancel");
|
||||
userlistContainerElement = document.getElementById("userlistcontainer");
|
||||
userlistButtons = document.getElementsByClassName("userlistbutton");
|
||||
// event listeners
|
||||
// [...<html-collection>] converts an html collection to an array
|
||||
[...userlistButtons].forEach(element => {
|
||||
element.addEventListener("click", () => {
|
||||
set_username(element.dataset.username);
|
||||
show_password_overlay();
|
||||
})
|
||||
});
|
||||
pwOverlayCancelButton.addEventListener("click", () => {
|
||||
hide_password_overlay();
|
||||
});
|
||||
})
|
||||
function set_username(username) {
|
||||
usernameInputElement.value = username;
|
||||
}
|
||||
function show_password_overlay() {
|
||||
window.scrollTo(0, 0);
|
||||
passwordOverlayElement.classList.remove("nodisplay");
|
||||
}
|
||||
function hide_password_overlay() {
|
||||
passwordOverlayElement.classList.add("nodisplay");
|
||||
passwordInputElement.value = "";
|
||||
// Dispatch an Input Event to the input element to trigger the on-
|
||||
// screen keyboard to update its buffer. This fixes a security
|
||||
// issue on the login page.
|
||||
passwordInputElement.dispatchEvent(new Event("input", {bubbles: true}));
|
||||
}
|
||||
})();
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
document.addEventListener("DOMContentLoaded", () => {
|
||||
let dropdownmenuElement = document.getElementById("dropdownmenu");
|
||||
let dropdownmenuButtonElement = document.getElementById("dropdownmenu-button");
|
||||
if (dropdownmenuButtonElement != null) {
|
||||
dropdownmenuButtonElement.addEventListener("click", () => {
|
||||
if (dropdownmenuElement.classList.contains("dropdownvisible")) {
|
||||
dropdownmenuElement.classList.remove("dropdownvisible");
|
||||
}
|
||||
else {
|
||||
dropdownmenuElement.classList.add("dropdownvisible");
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
document.addEventListener("DOMContentLoaded", () => {
|
||||
// elements
|
||||
let orderNumberofdrinksInput = document.getElementById("numberofdrinks");
|
||||
let orderNumberofdrinksBtnA = document.getElementById("numberofdrinks-btn-minus");
|
||||
let orderNumberofdrinksBtnB = document.getElementById("numberofdrinks-btn-plus");
|
||||
let orderSumElement = document.getElementById("ordercalculatedsum");
|
||||
let orderFormElement = document.getElementById("orderform");
|
||||
let statusInfoElement = document.getElementById("statusinfo");
|
||||
let orderSubmitButton = document.getElementById("ordersubmitbtn");
|
||||
// calculate & display sum
|
||||
let orderPricePerDrink = parseFloat(document.getElementById("priceperdrink").dataset.drinkPrice);
|
||||
function calculateAndDisplaySum() {
|
||||
setTimeout(() => {
|
||||
let numberOfDrinks = parseFloat(orderNumberofdrinksInput.value);
|
||||
if (isNaN(numberOfDrinks)) {
|
||||
numberOfDrinks = 1;
|
||||
}
|
||||
let calculated_sum = orderPricePerDrink * numberOfDrinks;
|
||||
orderSumElement.innerText = new Intl.NumberFormat(undefined, {minimumFractionDigits: 2}).format(calculated_sum);
|
||||
}, 25);
|
||||
}
|
||||
orderNumberofdrinksInput.addEventListener("input", calculateAndDisplaySum);
|
||||
orderNumberofdrinksBtnA.addEventListener("click", calculateAndDisplaySum);
|
||||
orderNumberofdrinksBtnB.addEventListener("click", calculateAndDisplaySum);
|
||||
// custom submit method
|
||||
orderFormElement.addEventListener("submit", (event) => {
|
||||
orderSubmitButton.disabled = true;
|
||||
event.preventDefault(); // Don't do the default submit action!
|
||||
if (isNaN(parseFloat(orderNumberofdrinksInput.value))) {
|
||||
orderNumberofdrinksInput.value = 1;
|
||||
}
|
||||
let xhr = new XMLHttpRequest();
|
||||
let formData = new FormData(orderFormElement);
|
||||
xhr.addEventListener("load", (event) => {
|
||||
status_ = event.target.status;
|
||||
response_ = event.target.responseText;
|
||||
if (status_ == 200 && response_ == "success") {
|
||||
statusInfoElement.innerText = "Success.";
|
||||
window.location.replace("/");
|
||||
}
|
||||
else {
|
||||
statusInfoElement.classList.add("errortext");
|
||||
statusInfoElement.innerText = "An error occured.";
|
||||
window.setTimeout(() => { window.location.reload() }, 5000);
|
||||
}
|
||||
})
|
||||
xhr.addEventListener("error", (event) => {
|
||||
statusInfoElement.classList.add("errortext");
|
||||
statusInfoElement.innerText = "An error occured.";
|
||||
window.setTimeout(() => { window.location.reload() }, 5000);
|
||||
})
|
||||
xhr.open("POST", "/api/order-drink");
|
||||
xhr.send(formData);
|
||||
});
|
||||
});
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,100 +0,0 @@
|
|||
(() => {
|
||||
// layouts derived from
|
||||
// https://github.com/simple-keyboard/simple-keyboard-layouts/blob/master/src/lib/layouts/
|
||||
const layout_de = {
|
||||
default: [
|
||||
"^ 1 2 3 4 5 6 7 8 9 0 \u00DF \u00B4 {bksp}",
|
||||
"{tab} q w e r t z u i o p \u00FC +",
|
||||
"{lock} a s d f g h j k l \u00F6 \u00E4 #",
|
||||
"{shift} < y x c v b n m , . - {shift}",
|
||||
"@ {space}",
|
||||
],
|
||||
shift: [
|
||||
'\u00B0 ! " \u00A7 $ % & / ( ) = ? ` {bksp}',
|
||||
"{tab} Q W E R T Z U I O P \u00DC *",
|
||||
"{lock} A S D F G H J K L \u00D6 \u00C4 '",
|
||||
"{shift} > Y X C V B N M ; : _ {shift}",
|
||||
"@ {space}",
|
||||
],
|
||||
}
|
||||
const layout_en = {
|
||||
default: [
|
||||
"` 1 2 3 4 5 6 7 8 9 0 - = {bksp}",
|
||||
"{tab} q w e r t y u i o p [ ] \\",
|
||||
"{lock} a s d f g h j k l ; '",
|
||||
"{shift} z x c v b n m , . / {shift}",
|
||||
"@ {space}",
|
||||
],
|
||||
shift: [
|
||||
"~ ! @ # $ % ^ & * ( ) _ + {bksp}",
|
||||
"{tab} Q W E R T Y U I O P { } |",
|
||||
'{lock} A S D F G H J K L : "',
|
||||
"{shift} Z X C V B N M < > ? {shift}",
|
||||
"@ {space}",
|
||||
],
|
||||
}
|
||||
const layout_numeric = {
|
||||
default: [
|
||||
"1 2 3",
|
||||
"4 5 6",
|
||||
"7 8 9",
|
||||
"0 . ,",
|
||||
"{bksp}"
|
||||
]
|
||||
}
|
||||
// Check if on smartphone
|
||||
let onSmartphone = navigator.userAgent.toLowerCase().match(/android|webos|iphone|ipod|blackberry/i) != null;
|
||||
// Configure keyboard when all DOM content has loaded
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
if (!onSmartphone) {
|
||||
// Get element to send input to
|
||||
let keyboardInputElement = document.querySelector(".keyboard-input");
|
||||
// Get language code
|
||||
let layoutCode = document.getElementById("keyboard").dataset.layout;
|
||||
// Determine keyboard layout (default: en)
|
||||
let layout;
|
||||
switch (layoutCode) {
|
||||
case "de":
|
||||
layout = layout_de;
|
||||
break;
|
||||
case "numeric":
|
||||
layout = layout_numeric;
|
||||
break;
|
||||
default:
|
||||
layout = layout_en;
|
||||
}
|
||||
// determine if the numeric class has to be added
|
||||
if (layoutCode == "numeric") {
|
||||
theme = "hg-theme-default darkTheme numeric";
|
||||
}
|
||||
else {
|
||||
theme = "hg-theme-default darkTheme";
|
||||
}
|
||||
// virtual keyboard
|
||||
const Keyboard = window.SimpleKeyboard.default;
|
||||
const keyboard = new Keyboard({
|
||||
theme: theme,
|
||||
// choose german layout if language is de,
|
||||
// else choose english layout
|
||||
layout: layout,
|
||||
onChange: (input) => {
|
||||
keyboardInputElement.value = input;
|
||||
},
|
||||
onKeyPress: (button) => {
|
||||
if (button === "{shift}" || button === "{lock}") handleShift();
|
||||
}
|
||||
});
|
||||
// additional handlers
|
||||
keyboardInputElement.addEventListener("input", event => {
|
||||
keyboard.setInput(event.target.value);
|
||||
});
|
||||
function handleShift(input) {
|
||||
let currentLayout = keyboard.options.layoutName;
|
||||
let shiftToggle = currentLayout === "default" ? "shift" : "default";
|
||||
keyboard.setOptions({
|
||||
layoutName: shiftToggle
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" height="48" viewBox="0 96 960 960" width="48"><path d="M480 696 280 497h400L480 696Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 145 B |
|
|
@ -1 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" height="48" viewBox="0 96 960 960" width="48"><path d="M115.935 822.696v-68.131h728.13v68.131h-728.13Zm0-212.631v-68.13h728.13v68.13h-728.13Zm0-212.63v-68.37h728.13v68.37h-728.13Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 240 B |
Loading…
Add table
Add a link
Reference in a new issue