prenota: vagamente usabile

This commit is contained in:
boyska 2021-10-09 21:15:08 +02:00
parent 0d293873c3
commit a82b082a2f
5 changed files with 38 additions and 12 deletions

View file

@ -27,7 +27,7 @@ img, svg, text {
</head> </head>
<body data-cid="0"> <body data-cid="0">
<nav> <nav>
<a href="/">Home</a> <a class="active" href="/">Home</a>
<a href="/prenota">Prenotati</a> <a href="/prenota">Prenotati</a>
</nav> </nav>
<!--h1 id="counter">asd</h1--> <!--h1 id="counter">asd</h1-->

View file

@ -7,16 +7,20 @@
<body> <body>
<nav> <nav>
<a href="/">Home</a> <a href="/">Home</a>
<a href="/prenota">Prenotati</a> <a class="active" href="/prenota">Prenotati</a>
</nav> </nav>
<div id="form-section"> <section id="form-section">
<form id="form" class="hide"> <form id="form" class="hide">
<label for="tuonumero">Imposta una notifica al numero</label> <label for="tuonumero">Imposta una notifica al numero</label>
<input type="number" id="tuonumero" name="tuonumero" min="1" max="5000"> <input type="number" id="tuonumero" name="tuonumero" min="1" max="5000">
<a href="#" id="btn-prenotati" >Prenotati</button> <a href="#" class="btn btn-default" id="btn-prenotati" >Prenotati</a>
</form> </form>
</div> </section>
<section id="now-section" class="hide">
<header><h2>Serviamo il numero</h2>
<div id="now"></div>
</section>
<div id="errors"> </div> <div id="errors"> </div>
<script src="/static/js/common.js"></script> <script src="/static/js/common.js"></script>
<script src="/static/js/prenota.js"></script> <script src="/static/js/prenota.js"></script>

View file

@ -171,5 +171,5 @@ async def root_page():
return await get_page("pages/index.html") return await get_page("pages/index.html")
@app.get("/prenota") @app.get("/prenota")
async def root_page(): async def prenota_page():
return await get_page("pages/prenotati.html") return await get_page("pages/prenotati.html")

View file

@ -1,3 +1,23 @@
body { font-family: sans-serif; } body { font-family: sans-serif; }
nav { font-size: 200%; margin-bottom: 0.5em; } nav { font-size: 200%; margin-bottom: 0.5em; background-color: black; }
nav a { padding-right: 2em; } nav a { margin-right: 2em; padding: 0 0.5em; color: white; text-decoration: none; }
nav a.active { color: black; background-color: white; }
.btn {
margin-right: 0.5em;
padding: 0.2em 0.5em;
text-decoration: none;
border-radius: 0.2em;
}
.btn-default {
background-color: green;
color: white;
font-weight: bold;
}
.btn[disabled] {
background-color: gray;
color: darkgray;
}
a[disabled] {
pointer-events: none;
}

View file

@ -49,8 +49,8 @@ function prenotatiWorker(worker, prenotato) {
notify("sbrigati: siamo al " + e.data) notify("sbrigati: siamo al " + e.data)
worker.postMessage({cmd: "close"}) worker.postMessage({cmd: "close"})
} else { } else {
var field = document.querySelector('#tuonumero'); var field = document.querySelector('#now');
field.value = e.data field.textContent = e.data
} }
} }
@ -100,18 +100,20 @@ function inizializzaNumero() {
inizializzaNumero() inizializzaNumero()
document.getElementById('btn-prenotati').onclick = function () { var btn = document.getElementById('btn-prenotati')
btn.onclick = function () {
var val = document.querySelector('#form > input').value var val = document.querySelector('#form > input').value
initNotify() initNotify()
var field = document.querySelector('#tuonumero'); var field = document.querySelector('#tuonumero');
field.setAttribute('disabled', 'disabled') field.setAttribute('disabled', 'disabled')
document.getElementById('now-section').classList.remove('hide')
btn.setAttribute('disabled', 'disabled')
var value = parseInt(val,10) var value = parseInt(val,10)
if(SERVICEWORKER) { if(SERVICEWORKER) {
prenotatiWorker(webSocketWorker, value) prenotatiWorker(webSocketWorker, value)
} else { } else {
prenotati(value) prenotati(value)
} }
field.value = ""
} }
})() })()