Move message notification code to msg file

client/js/lounge.js

@@ -11,13 +11,12 @@ const fuzzy = require("fuzzy");
 // our libraries
 require("./libs/jquery/inputhistory");
 require("./libs/jquery/stickyscroll");
-const helpers_roundBadgeNumber = require("./libs/handlebars/roundBadgeNumber");
 const slideoutMenu = require("./libs/slideout");
 const templates = require("../views");
 const socket = require("./socket");
 require("./socket-events");
 const storage = require("./localStorage");
-const options = require("./options");
+require("./options");
 const utils = require("./utils");
 require("./autocompletion");
 require("./webpush");
@@ -29,20 +28,6 @@ $(function() {
 
 	$(document.body).data("app-name", document.title);
 
-	var pop;
-	try {
-		pop = new Audio();
-		pop.src = "audio/pop.ogg";
-	} catch (e) {
-		pop = {
-			play: $.noop
-		};
-	}
-
-	$("#play").on("click", function() {
-		pop.play();
-	});
-
 	var windows = $("#windows");
 	var viewport = $("#viewport");
 	var sidebarSlide = slideoutMenu(viewport[0], sidebar[0]);
@@ -494,77 +479,6 @@ $(function() {
 		container.html(templates.user_filtered({matches: result})).show();
 	});
 
-	chat.on("msg", ".messages", function(e, target, msg) {
-		var unread = msg.unread;
-		msg = msg.msg;
-
-		if (msg.self) {
-			return;
-		}
-
-		var button = sidebar.find(".chan[data-target='" + target + "']");
-		if (msg.highlight || (options.notifyAllMessages && msg.type === "message")) {
-			if (!document.hasFocus() || !$(target).hasClass("active")) {
-				if (options.notification) {
-					try {
-						pop.play();
-					} catch (exception) {
-						// On mobile, sounds can not be played without user interaction.
-					}
-				}
-				utils.toggleNotificationMarkers(true);
-
-				if (options.desktopNotifications && Notification.permission === "granted") {
-					var title;
-					var body;
-
-					if (msg.type === "invite") {
-						title = "New channel invite:";
-						body = msg.from + " invited you to " + msg.channel;
-					} else {
-						title = msg.from;
-						if (!button.hasClass("query")) {
-							title += " (" + button.data("title").trim() + ")";
-						}
-						if (msg.type === "message") {
-							title += " says:";
-						}
-						body = msg.text.replace(/\x03(?:[0-9]{1,2}(?:,[0-9]{1,2})?)?|[\x00-\x1F]|\x7F/g, "").trim();
-					}
-
-					try {
-						var notify = new Notification(title, {
-							body: body,
-							icon: "img/logo-64.png",
-							tag: target
-						});
-						notify.addEventListener("click", function() {
-							window.focus();
-							button.click();
-							this.close();
-						});
-					} catch (exception) {
-						// `new Notification(...)` is not supported and should be silenced.
-					}
-				}
-			}
-		}
-
-		if (button.hasClass("active")) {
-			return;
-		}
-
-		if (!unread) {
-			return;
-		}
-
-		var badge = button.find(".badge").html(helpers_roundBadgeNumber(unread));
-
-		if (msg.highlight) {
-			badge.addClass("highlight");
-		}
-	});
-
 	chat.on("click", ".show-more-button", function() {
 		var self = $(this);
 		var lastMessage = self.parent().next(".messages").children(".msg").first();

client/js/socket-events/msg.js

@@ -4,7 +4,22 @@ const $ = require("jquery");
 const socket = require("../socket");
 const render = require("../render");
 const utils = require("../utils");
+const options = require("../options");
+const helpers_roundBadgeNumber = require("../libs/handlebars/roundBadgeNumber");
 const chat = $("#chat");
+const sidebar = $("#sidebar");
+
+let pop;
+try {
+	pop = new Audio();
+	pop.src = "audio/pop.ogg";
+} catch (e) {
+	pop = {
+		play: $.noop
+	};
+}
+
+$("#play").on("click", () => pop.play());
 
 socket.on("msg", function(data) {
 	// We set a maximum timeout of 2 seconds so that messages don't take too long to appear.
@@ -27,14 +42,13 @@ function processReceivedMessage(data) {
 	render.appendMessage(
 		container,
 		targetId,
-		$(target).attr("data-type"),
+		channel.attr("data-type"),
 		data.msg
 	);
 
-	container.trigger("msg", [
+	container.trigger("keepToBottom");
-		target,
+
-		data
+	notifyMessage(targetId, channel, data);
-	]).trigger("keepToBottom");
 
 	var lastVisible = container.find("div:visible").last();
 	if (data.msg.self
@@ -70,3 +84,71 @@ function processReceivedMessage(data) {
 		}
 	}
 }
+
+function notifyMessage(targetId, channel, msg) {
+	const unread = msg.unread;
+	msg = msg.msg;
+
+	if (msg.self) {
+		return;
+	}
+
+	const button = sidebar.find(".chan[data-id='" + targetId + "']");
+	if (msg.highlight || (options.notifyAllMessages && msg.type === "message")) {
+		if (!document.hasFocus() || !channel.hasClass("active")) {
+			if (options.notification) {
+				try {
+					pop.play();
+				} catch (exception) {
+					// On mobile, sounds can not be played without user interaction.
+				}
+			}
+
+			utils.toggleNotificationMarkers(true);
+
+			if (options.desktopNotifications && Notification.permission === "granted") {
+				let title;
+				let body;
+
+				if (msg.type === "invite") {
+					title = "New channel invite:";
+					body = msg.from + " invited you to " + msg.channel;
+				} else {
+					title = msg.from;
+					if (!button.hasClass("query")) {
+						title += " (" + button.data("title").trim() + ")";
+					}
+					if (msg.type === "message") {
+						title += " says:";
+					}
+					body = msg.text.replace(/\x03(?:[0-9]{1,2}(?:,[0-9]{1,2})?)?|[\x00-\x1F]|\x7F/g, "").trim();
+				}
+
+				try {
+					const notify = new Notification(title, {
+						body: body,
+						icon: "img/logo-64.png",
+						tag: `lounge-${targetId}`
+					});
+					notify.addEventListener("click", function() {
+						window.focus();
+						button.click();
+						this.close();
+					});
+				} catch (exception) {
+					// `new Notification(...)` is not supported and should be silenced.
+				}
+			}
+		}
+	}
+
+	if (!unread || button.hasClass("active")) {
+		return;
+	}
+
+	const badge = button.find(".badge").html(helpers_roundBadgeNumber(unread));
+
+	if (msg.highlight) {
+		badge.addClass("highlight");
+	}
+}