105 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			105 lines
		
	
	
		
			2.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!DOCTYPE html>
 | 
						|
<html>
 | 
						|
	<head>
 | 
						|
		<title>FTracker</title>
 | 
						|
		<script>
 | 
						|
			var cbt = {
 | 
						|
				'arrival': 'I have read and will adhere to the <a href="/guidelines" target="_blank">protection guidelines</a>',
 | 
						|
				'departure': 'I have cleaned my workspace'
 | 
						|
			}
 | 
						|
			function getParams() {
 | 
						|
				var h = document.location.href
 | 
						|
				var qparam = h.split('?')[1] || null
 | 
						|
				if (qparam == null) {
 | 
						|
					alert("Query parameter(s) missing")
 | 
						|
					return null
 | 
						|
				}
 | 
						|
				var vals = qparam.split('=')
 | 
						|
				if (vals.length < 2 || !cbt.hasOwnProperty(vals[0])) {
 | 
						|
					alert("Invalid query parameter")
 | 
						|
					return null
 | 
						|
				}
 | 
						|
				return {
 | 
						|
					action: vals[0],
 | 
						|
					room: vals[1]
 | 
						|
				}
 | 
						|
			}
 | 
						|
			var qp = getParams()
 | 
						|
		</script>
 | 
						|
	</head>
 | 
						|
	<body>
 | 
						|
		<main>
 | 
						|
			<h1><script>
 | 
						|
				document.write(qp.action + " " + qp.room)
 | 
						|
			</script></h1>
 | 
						|
			<form>
 | 
						|
				<label>
 | 
						|
					Full Name:<br>
 | 
						|
					<input type="text" name="name" id="name" required>
 | 
						|
				</label><br>
 | 
						|
				<label>
 | 
						|
					<input type="checkbox" name="agree" id="agree" required>
 | 
						|
					<script>document.write(cbt[qp.action])</script>
 | 
						|
				</label><br>
 | 
						|
				<input type="submit">
 | 
						|
			</form>
 | 
						|
		</main>
 | 
						|
		<script>
 | 
						|
			// Prefill the name field if it was successfully entered before
 | 
						|
			var savedName = localStorage.getItem('name')
 | 
						|
			if (savedName)
 | 
						|
				document.getElementById('name').value = savedName
 | 
						|
 | 
						|
			form = document.querySelector('form')
 | 
						|
			form.onsubmit= function(e) {
 | 
						|
				e.preventDefault()
 | 
						|
				console.log(e)
 | 
						|
 | 
						|
				var name = e.srcElement[0].value
 | 
						|
				var agreed = e.srcElement[1].checked
 | 
						|
 | 
						|
				var payload = (qp.action == 'arrival') ?
 | 
						|
					{
 | 
						|
						'room': qp.room,
 | 
						|
						'name': name,
 | 
						|
						'agreetoguidelines': agreed
 | 
						|
					} :
 | 
						|
					{
 | 
						|
						'name': name,
 | 
						|
						'cleanedworkspace': agreed
 | 
						|
					}
 | 
						|
 | 
						|
				console.log(payload)
 | 
						|
 | 
						|
				fetch("/" + qp.action, {
 | 
						|
					method: "POST",
 | 
						|
					body: JSON.stringify(payload)
 | 
						|
				}).then(res => {
 | 
						|
					console.log("Request complete! response:", res)
 | 
						|
					if (Math.floor(res.status / 100) == 2) {
 | 
						|
 | 
						|
						form.innerHTML = "<h2>Done. Thanks!</h2>"
 | 
						|
						localStorage.setItem('name', name)
 | 
						|
 | 
						|
					} else if (res.status == 409) {
 | 
						|
 | 
						|
						// Conflict, more data requested
 | 
						|
						res.json().then(function (json) {
 | 
						|
							// TODO: Ask
 | 
						|
							alert(json.message)
 | 
						|
						})
 | 
						|
 | 
						|
					} else {
 | 
						|
 | 
						|
						// Any other generic error
 | 
						|
						res.text().then(function (text) {
 | 
						|
							alert(text)
 | 
						|
						})
 | 
						|
 | 
						|
					}
 | 
						|
				})
 | 
						|
			}
 | 
						|
		</script>
 | 
						|
	</body>
 | 
						|
</html>
 |