Placeholder UX, probably

1 files changed, 34 insertions, 0 deletions

diff --git a/js/channel.js b/js/channel.js
new file mode 100644
index 0000000..96d1061
--- /dev/null
+++ b/js/channel.js
@@ -0,0 +1,34 @@
+"use strict";
+
+function ready(callback) {
+	if (document.readyState === 'loading') {
+		document.addEventListener('DOMContentLoaded', callback);
+	} else {
+		callback();
+	}
+}
+
+ready(() => {
+	let template = document.querySelector('#message').content;
+
+	document.querySelectorAll('link[rel=events]').forEach(elem => {
+		let url = elem.getAttribute("href");
+		let source = new EventSource(url);
+		source.addEventListener('message', message => {
+			let body = JSON.parse(message.data);
+
+			document.querySelectorAll('.messages').forEach(elem => {
+				let message = template.cloneNode(true);
+
+				message.querySelectorAll('.sender')
+					.forEach(elem => elem.textContent = body.sender.name);
+				message.querySelectorAll('.message')
+					.forEach(elem => elem.textContent = body.body);
+				message.querySelectorAll('.sent_at')
+					.forEach(elem => elem.textContent = body.sent_at);
+
+				message.childNodes.forEach(node => elem.appendChild(node));
+			});
+		});
+	});
+})