added message ids, quoting, quotelink scrolling/previews

database.py

@@ -90,16 +90,12 @@ def verify_username(username):
 		return False
 
 
-def log_chat_message(data):
+def log_chat_message(message, date, room_id, user_id):
 	"""
 	Logs chat messages into the database.
 	'data' should be a dict containing: message, date, room_id, name, and
 	user_id (optional).
 	"""
-	message = data["message"]
-	date = data["date"]
-	room_id = data["room"]
-	user_id = data.get("user_id")
 	_DB.execute(
 		"INSERT INTO `chat_messages` (" \
 		+ "`message`, `room_id`, `date`, `name_id`) VALUES (" \

events.py

@@ -53,39 +53,52 @@ def message(data):
 	"""
 	Sent by a client when the user entered a new message.
 	"""
-	room = int(data["room"])
+	room = data["room"]
 	message = data["message"]
 	name = data["name"]
 	user_id = data.get("user_id")
 
-	data = {}
-	date = int(time.time())
-	data["date"] = date
-	data["name"] = name
-	data["user_id"] = user_id
-	data["room"] = room
-
 	message = message.strip()
 	if not message:
 		return
 	tags = ["b", "code", "i", "s"]
 	message = bleach.clean(message, tags=tags)
+
 	lines = []
 	for line in message.splitlines():
-		if line.startswith(">"):
+		if line.startswith(">") and not line.startswith(">>"):
 			line = '<span class="greenText">' + line + '</span>'
 		lines.append(line)
 	message = "<br />".join(lines)
+
+	quotes = re.findall(r"&gt;&gt;\d+", message)
+	for quote in quotes:
+		msg_id = quote.replace("&gt;&gt;", "")
+		msg = '<a class="quotelink" '
+		msg += 'href="javascript:scrollToMsg(\'' + msg_id + '\')" '
+		msg += 'onmousemove="showPreview(event, \'' + msg_id + '\')" '
+		msg += 'onmouseout="clearPreview()">' + quote + '</a>'
+		message = message.replace(quote, msg)
+
 	message = tools.handle_img(message)
-	data["message"] = message
 
 	roll_msg = ""
 	if message.startswith("/dice") or message.startswith("/roll"):
 		roll_msg = handle_dice(data)
 		if roll_msg:
-			data["message"] += '<hr class="msgSrvHr" /><b>' + roll_msg + "</b>"
+			roll_msg += '<hr class="msgSrvHr" /><b>' + roll_msg + "</b>"
 
-	message_id = db.log_chat_message(data)
+	date = int(time.time())
+	message_id = db.log_chat_message(message, date, room, user_id)
+	if roll_msg:
+		message += roll_msg
+
+	data = {}
+	data["date"] = date
+	data["name"] = name
+	data["user_id"] = user_id
+	data["message"] = message
+	data["message_id"] = message_id
 	emit("message", data, room=room)
 
 	if roll_msg:

static/anonkun.css

@@ -183,7 +183,7 @@ h3 {
 	flex: 1;
 }
 
-.message {
+.messageContent {
 	width: 100%;
 	word-wrap: break-word;
 }
@@ -210,6 +210,19 @@ h3 {
 	box-sizing: border-box;
 }
 
+#preview {
+	display: block;
+	position: fixed;
+	background: white;
+	word-wrap: break-word;
+	border: 1px solid #ccc;
+	padding: 0.25em;
+}
+
 .greenText {
 	color: green;
 }
+
+.quotelink {
+	color: red;
+}

static/anonkunQM.js

@@ -10,9 +10,11 @@ var tid = setInterval( function () {
 		socket.emit('joined', {room: room_id});
 	});
 	socket.on('message', function(data) {
-		let msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
+		let msg_str = '<div id="msg-' + data.message_id + '" class="message">';
-		msg_str += '<span class="messageDate">' + strftime(data.date) + '</span></div>';
+		msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
-		msg_str += '<div class="message">' + data.message + '</div><hr>';
+		msg_str += '<span class="messageDate">' + strftime(data.date) + '</span> ';
+		msg_str += '<span class="messageID">No.<a href="javascript:quote(' + data.message_id + ')">' + data.message_id + '</a></span></div>';
+		msg_str += '<div class="messageContent">' + data.message + '</div></div><hr>';
 
 		let mbox = document.getElementById('chatWindow');
 		mbox.innerHTML = mbox.innerHTML + msg_str;
@@ -170,6 +172,33 @@ function submitWritein(post_id) {
 	if (!option_text) { return; }
 	socket.emit('write_in', {option_text: option_text, post_id: post_id, room: room_id});
 }
+function quote(message_id) {
+	let textbox = document.getElementById('messageTextArea');
+	textbox.value += '>>' + message_id + '\n';
+	textbox.focus();
+}
+function scrollToMsg(message_id) {
+	let elem = document.getElementById('msg-' + message_id);
+	if (!elem) { return; }
+	elem.scrollIntoView();
+}
+function showPreview(event, message_id) {
+	let elem = document.getElementById('msg-' + message_id);
+	if (!elem) { return; }
+	let preview = document.getElementById('preview');
+	preview.innerHTML = elem.innerHTML;
+	preview.style.display = '';
+	let x = event.clientX + 20 + 'px';
+	let y = event.clientY + 20 + 'px';
+	let maxWidth = window.innerWidth - event.clientX - 80 + 'px';
+	preview.style.top = y;
+	preview.style.left = x;
+	preview.style.maxWidth = maxWidth;
+}
+function clearPreview() {
+	document.getElementById('preview').innerHTML = '';
+	document.getElementById('preview').style.display = 'none';
+}
 function deactivate_post() {
 	let post = document.getElementsByClassName('active_post');
 	if (post.length == 0) { return; }

static/anonkunUser.js

@@ -10,9 +10,11 @@ var tid = setInterval( function () {
 		socket.emit('joined', {room: room_id});
 	});
 	socket.on('message', function(data) {
-		let msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
+		let msg_str = '<div id="msg-' + data.message_id + '" class="message">';
-		msg_str += '<span class="messageDate">' + strftime(data.date) + '</span></div>';
+		msg_str = '<div class="messageHeader"><span class="messageName">' + data.name + '</span> ';
-		msg_str += '<div class="message">' + data.message + '</div><hr>';
+		msg_str += '<span class="messageDate">' + strftime(data.date) + '</span> ';
+		msg_str += '<span class="messageID">No.<a href="javascript:quote(' + data.message_id + ')">' + data.message_id + '</a></span></div>';
+		msg_str += '<div class="messageContent">' + data.message + '</div></div><hr>';
 
 		let mbox = document.getElementById('chatWindow');
 		mbox.innerHTML = mbox.innerHTML + msg_str;
@@ -156,6 +158,33 @@ function submitWritein(post_id) {
 	if (!option_text) { return; }
 	socket.emit('write_in', {option_text: option_text, post_id: post_id, room: room_id});
 }
+function quote(message_id) {
+	let textbox = document.getElementById('messageTextArea');
+	textbox.value += '>>' + message_id + '\n';
+	textbox.focus();
+}
+function scrollToMsg(message_id) {
+	let elem = document.getElementById('msg-' + message_id);
+	if (!elem) { return; }
+	elem.scrollIntoView();
+}
+function showPreview(event, message_id) {
+	let elem = document.getElementById('msg-' + message_id);
+	if (!elem) { return; }
+	let preview = document.getElementById('preview');
+	preview.innerHTML = elem.innerHTML;
+	preview.style.display = '';
+	let x = event.clientX + 20 + 'px';
+	let y = event.clientY + 20 + 'px';
+	let maxWidth = window.innerWidth - event.clientX - 80 + 'px';
+	preview.style.top = y;
+	preview.style.left = x;
+	preview.style.maxWidth = maxWidth;
+}
+function clearPreview() {
+	document.getElementById('preview').innerHTML = '';
+	document.getElementById('preview').style.display = 'none';
+}
 function deactivate_post() {
 	let post = document.getElementsByClassName('active_post');
 	if (post.length == 0) { return; }

templates/quest.html

@@ -139,11 +139,13 @@
 			<div id="chatWindow">
 				{% autoescape false %}
 				{% for message in messages %}
-				<div class="message">
+				<div id="msg-{{ message[0] }}" class="message">
 					<div class="messageHeader">
-						<span class="messageName">Anonymous</span> <span class="messageDate">{{ message[3] | strftime }}</span>
+						<span class="messageName">Anonymous</span>
+						<span class="messageDate">{{ message[3] | strftime }}</span>
+						<span class="messageID">No.<a href="javascript:quote('{{ message[0] }}')">{{ message[0] }}</a></span>
 					</div>
-					<div class="messageMessage">{{ message[4] }}</div>
+					<div class="messageContent">{{ message[4] }}</div>
 				</div>
 				<hr>
 				{% endfor %}
@@ -152,4 +154,5 @@
 			<div id="messageTextDiv"><textarea id="messageTextArea"></textarea></div>
 		</div>
 	</div>
+	<div id="preview"></div>
 {% endblock %}

todo

@@ -0,0 +1,29 @@
+New Features:
+Pages/appendixes
+Live indicator/countdown
+Notifications
+Anonymous names
+Banner images
+Search page
+Front page to show new quests
+Webm posting
+Chat message quoting
+(you) counter
+Enable namefagging
+Account managament/logout
+Display profile link in header bar
+Tagging system
+
+Improvements:
+Revamp post editing
+More options for text posts (lists and so on)
+More rigorous input checking in events.py
+New post displays chat message
+New chat message doesn't take chat window to the bottom if it was scrolled up
+Record email on signup
+Change urls
+Poll vote highlights entire option
+Poll vote doesn't disappear checkbox
+Total voters per poll
+Chat archives
+Only last 100 (50?) chat messages are loaded on page load

views.py

@@ -208,5 +208,4 @@ def index():
 	"""
 	The index page.
 	"""
-	print(request.remote_addr)
 	return render_template("index.html")