diff --git a/events.py b/events.py
index 7725f14..3ebba10 100644
--- a/events.py
+++ b/events.py
@@ -3,13 +3,14 @@
 SocketIO events.
 """
 import time
+import random
 
 import bleach
 from flask import session
 from flask_socketio import SocketIO, emit, join_room
 
-import database as db
 import tools
+import database as db
 
 socketio = SocketIO()
 
@@ -93,3 +94,18 @@ def update_post(data):
 	post_id = data["post_id"]
 	db.update_quest_post(post_id, post)
 	emit("update_post", data, room=room)
+
+
+@socketio.on('dice_post')
+def dice_post(data):
+	"""
+	Called when the QM posts a new dice call.
+	"""
+	print(data)
+	room = data["room"]
+	res = db.get_quest_meta(quest_id=room)
+	if not res:
+		return
+	if session.get("user_id") != res[3]:
+		return
+	emit("dice_post", data, room=room)
diff --git a/templates/base.html b/templates/base.html
index 84412e1..2de60af 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -5,7 +5,7 @@
 	<link rel="stylesheet" type="text/css" href="/static/anonkun.css">
 	<script>
 		function toggleHeader() {
-			var xhr = new XMLHttpRequest();
+			let xhr = new XMLHttpRequest();
 			if (document.getElementById('header').style.display == 'initial') {
 				document.getElementById('header').style.display = 'none';
 				document.getElementById('headerHidden').style.display = 'initial';
@@ -23,12 +23,12 @@
 </head>
 <body>
 	<ul id="header" class="header" style="{% if session.get("hide_header") == True %}display:none;{% else %}display:initial;{% endif %}">
-		<li><a onclick="toggleHeader();" href="javascript:void(0);">^</a></li>
+		<li><a onclick="toggleHeader();" href="javascript:void(0);">⤒</a></li>
 		<li><a href="{{ url_for('.index') }}">Home</a></li>
 		{% block header %}{% endblock %}
 	</ul>
 	<ul id="headerHidden" class="header" style="{% if session.get("hide_header") == True %}display:initial;{% else %}display:none;{% endif %}">
-		<li><a onclick="toggleHeader();" href="javascript:void(0);">^</a></li>
+		<li><a onclick="toggleHeader();" href="javascript:void(0);">⤓</a></li>
 	</ul>
 	<div id="content">{% block content %}{% endblock %}	</div>
 </body>
diff --git a/templates/quest.html b/templates/quest.html
index dfb44ce..05133a7 100644
--- a/templates/quest.html
+++ b/templates/quest.html
@@ -15,30 +15,32 @@
 				socket.emit('joined', {room: {{ room_id }}});
 			});
 			socket.on('message', function(data) {
-				var date = new Date(data.date * 1000);
-				var date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' ';
+				let date = new Date(data.date * 1000);
+				let date_str = date.getFullYear() + '-' + padToTwo(date.getMonth()+1) + '-' + padToTwo(date.getDate()) + ' ';
 				date_str += padToTwo(date.getHours()) + ':' + padToTwo(date.getMinutes()) + ':' + padToTwo(date.getSeconds());
 
-				var msg_str = '<div class="messageHeader">\n<span class="messageName">' + data.name + '</span> ';
+				let msg_str = '<div class="messageHeader">\n<span class="messageName">' + data.name + '</span> ';
 				msg_str += '<span class="messageDate">' + date_str + '</span>\n</div>\n';
-				msg_str += '<div class="message">' + data.message + '</div>\n';
+				msg_str += '<div class="message">' + data.message + '</div>\n<hr>';
 
-				var mbox = document.getElementById('chatWindow');
+				let mbox = document.getElementById('chatWindow');
 				mbox.innerHTML = mbox.innerHTML + msg_str;
 				mbox.scrollTop = mbox.scrollHeight;
 			});
 			socket.on('new_post', function(data) {
-				var qposts = document.getElementById('questPosts');
+				let qposts = document.getElementById('questPosts');
 				qposts.innerHTML = qposts.innerHTML + '<div class="questPost">' + data.post + '</div>';
 			});
 			socket.on('update_post', function(data) {
-				var post_id = data.post_id;
+				let post_id = data.post_id;
 				document.getElementById('questPostData-' + post_id).innerHTML = data.post;
 			});
-			var mtarea = document.getElementById('messageTextArea');
+			socket.on('dice_post', function(data) {
+			});
+			let mtarea = document.getElementById('messageTextArea');
 			mtarea.addEventListener('keypress', function(event) {
 				if (event.key == 'Enter' && !event.shiftKey) {
-					var text = mtarea.value.trim();
+					let text = mtarea.value.trim();
 					mtarea.value = '';
 					if (text == '') { return; }
 					socket.emit('message', {message: text, name: 'Anonymous', room: {{ room_id }}});
@@ -55,8 +57,8 @@
 	{% if session.get("user_id") == owner_id %}
 	<script>
 		function makePost() {
-			var qparea = document.getElementById('postTextArea');
-			var text = qparea.value.trim();
+			let qparea = document.getElementById('postTextArea');
+			let text = qparea.value.trim();
 			qparea.value = '';
 			if (text == '') { return; }
 			socket.emit('new_post', {post: text, room: {{ room_id }}});
@@ -70,14 +72,24 @@
 		function save_post(post_id) {
 			document.getElementById('questPostData-' + post_id).contentEditable = 'false';
 			document.getElementById('questPostData-' + post_id).style.border = null;
-			var text = document.getElementById('questPostData-' + post_id).innerHTML;
+			let text = document.getElementById('questPostData-' + post_id).innerHTML;
 			socket.emit('update_post', {post_id: post_id, post: text, room: {{ room_id }}});
 			document.getElementById('savePost-' + post_id).style.display = 'none';
 		}
+		function dice_post() {
+			let formData = new FormData(document.getElementById('QMDicePostForm'));
+			formData.append('room', {{ room_id }});
+			let obj = {};
+			formData.forEach(function(value, key) {
+				obj[key] = value;
+			});
+			socket.emit('dice_post', obj);
+			document.getElementById('QMDicePostForm').reset();
+		}
 	</script>
 	<script>
 		function openPostTab(event, modeName) {
-			var i, QMPostTabContent, QMPostTab;
+			let i, QMPostTabContent, QMPostTab;
 
 			QMPostTabContent = document.getElementsByClassName("QMPostTabContent");
 			for (i = 0; i < QMPostTabContent.length; i++) {
@@ -136,7 +148,24 @@
 					<input type="submit" name="newPost" value="Post" onclick="makePost();"/>
 				</div>
 				<div id="QMPostDice" class="QMPostTabContent" style="display:none;">
-					Dice for the dice god.
+					Dice for the dice god.<br />
+					<form id="QMDicePostForm" action="javascript:void(0);" onsubmit="dice_post();">
+						Dice: <input type="number" name="diceNum" min="1" max="99"/>
+						d <input type="number" name="diceSides" min="1" max="99"/>
+						±<input type="number" name="diceMod" min="-999" max="999"/>
+						<input type="checkbox" name="diceStrict"/>
+						<span class="tooltip" title="Only take matching rolls.">Strict</span><br />
+						<input type="checkbox" onclick="document.getElementById('diceChal').disabled=!this.checked;"/>
+						<span class="tooltip" title="Dice challenge">DC:</span>
+						<input type="number" name="diceChal" id="diceChal" min="1" max="99" disabled/><br />
+						<input type="checkbox" onclick="document.getElementById('diceRolls').disabled=!this.checked;"/>
+						<span class="tooltip" title="Automatically close the dice call after this many rolls have been made.">Rolls Taken:</span>
+						<input type="number" name="diceRolls" id="diceRolls" min="1" max="99" disabled/><br />
+						<input type="checkbox" onclick="document.getElementById('diceBest').disabled=!this.checked;"/>
+						<span class="tooltip" title="Pick out the N highest rolls after the dice call has been closed. This should be lower than the number of rolls taken.">Best:</span>
+						<input type="number" name="diceBest" id="diceBest" min="1" max="99" disabled/><br />
+						<input type="submit" name="submit" value="Roll 'em"/>
+					</form>
 				</div>
 				<div id="QMPostPoll" class="QMPostTabContent" style="display:none;">
 					The polls are rigged.
@@ -157,6 +186,7 @@
 					</div>
 					<div class="messageMessage">{{ message[4] }}</div>
 				</div>
+				<hr>
 				{% endfor %}
 				{% endautoescape %}
 			</div>
