Skip to content
Snippets Groups Projects
Select Git revision
  • master default
  • zs-dobrichovice
2 results

main.html

Blame
    • main.html 2.98 KiB 
    <!DOCTYPE html>
<html>
<head>
	<style>
		body {
			background-color: white;
			color: black;
		}
		#intro {
			max-width: 50em;
		}
		#heading {
			position: relative;
			height: 2.5ex;
		}
		#schedule {
			position: relative;
		}
		.room {
			border: 1px solid green;
		}
		.slot {
			border-bottom: 1px solid green;
		}
		.slotlabel {
			display: flex;
			justify-content: center;
			align-items: center;
			margin: 0;
			font-weight: bold;
		}
		.roomhead p {
			text-align: center;
			font-weight: bold;
			margin: 0;
		}
		.meeting {
			border: 1px solid blue;
			background-color: #ccccff;
			overflow: hidden;
		}
		.meeting:hover {
			background-color: #aaaaff;
		}
		.collision {
			border: 1px solid red;
			background-color: #ffcccc;
		}
		.collision:hover {
			background-color: #ffaaaa;
		}
		.mtime {
			margin: 0;
			font-size: 11px;
		}
		.mdesc {
			margin: 0;
			margin-top: 0.5ex;
			font-size: 9px;
		}

	</style>
</head>
<body>
	<h1>MFF Zoom</h1>
	<p id=intro>This table summarizes meetings scheduled in our Zoom accounts. Use standard Zoom interface
	to create and modify reservations. Please keep in mind that there is a slight delay between Zoom
	and this table. Please report all bugs to Martin Mareš.</p>
	<form method=GET action="?">
		<label for=date>Date:</label>
    		<input id=date type=date name=date value="{{ g.date }}">
		<select name=hours>
			<option value=0{{ " selected" if g.hours==0 else "" }}>Study hours</option>
			<option value=1{{ " selected" if g.hours==1 else "" }}>Working hours</option>
			<option value=2{{ " selected" if g.hours==2 else "" }}>Whole day</option>
		</select>
		<select name=rooms>
			<option value=i{{ " selected" if g.rooms=="i" else "" }}>CompSci rooms</option>
			<option value=m{{ " selected" if g.rooms=="m" else "" }}>Math rooms</option>
		</select>
		<input type=submit name=submit value="Submit">
	</form>

	<h2>Schedule for {{ g.dow }} {{ g.date }}</h2>

	<div id=heading>
{% for r in g.room_boxes %}
		<div class=roomhead style='position: absolute; left: {{ r.x }}px; top: 0px; width: {{ r.w }}px;'>
			<p>{{ r.name }}</p>
		</div>
{% endfor %}
	</div>
	<div id=schedule>
{% for r in g.room_boxes %}
		<div class=room style='position: absolute; left: {{ r.x }}px; top: 0px; width: {{ r.w }}px; height: {{ r.h }}px;'></div>
{% endfor %}
{% for h in g.slot_boxes %}
		<div class=slot style='position: absolute; left: {{ h.x }}px; top: {{ h.y }}px; width: {{ h.w }}px; height: {{ h.h }}px;'></div>
{% endfor %}
{% for h in g.slot_labels %}
		<div class=slotlabel style='position: absolute; left: {{ h.x }}px; top: {{ h.y }}px; width: {{ h.w }}px; height: {{ h.h }}px;'>{{ h.label }}</div>
{% endfor %}
{% for m in g.meetings %}
		<div class='meeting{{ " collision" if m.coll else "" }}' style='position: absolute; left: {{ m.x }}px; top: {{ m.y }}px; width: {{ m.w }}px; height: {{ m.h }}px;' title='{{ m.start + "–" + m.end + ": " + m.topic|e }}'>
			<p class=mtime>{{ m.start }}–{{ m.end }}
			<p class=mdesc>{{ m.topic }}
		</div>
{% endfor %}
	</div>
</body>
</html>