html5 notifications (disabled by default) for PMs when PM tab is not active

client/dcwebui.js

@@ -148,6 +148,26 @@ var date_format = function(d, format) {
 	return ret;
 };
 
+/* */
+
+var notify = function(title, body) {
+	if (!("Notification" in window)) {
+		return; // not supported by browser
+	}
+	
+	if (window.Notification.permission === "granted") {
+		var nn = new Notification(title, {
+			body: body,
+			icon: DCWEBUI_CONF.extern + "/favicon.ico"
+		});
+		
+	} else if (window.Notification.permission !== "denied") {
+		Notification.requestPermission(function(permission) {
+			notify(title, body);
+		});
+	}
+};
+
 /* Tab writers */ 
 
 var write = function(tab) {
@@ -608,6 +628,7 @@ var menu = new MenuList($("#menubutton"));
 menu.reset = function() {
 	this.clear();
 	this.add(joinparts_getstr(),  toggle_joinparts);
+	this.add(desktop_notifications_fmtstr(), desktop_notifications_toggle);
 	this.add(timestamp_display(), timestamp_toggle);
 };
 
@@ -740,6 +761,30 @@ var timestamp_toggle = function(ev) {
 	$el.innerHTML = timestamp_display();
 };
 
+var desktop_notifications_enabled = false;
+
+var desktop_notifications_fmtstr = function() {
+	return (desktop_notifications_enabled ? "☑" : "☐") + " Show desktop popups";
+};
+
+var desktop_notifications_toggle = function(ev) {
+	var $el = ev.target || ev.srcElement;	
+	desktop_notifications_enabled = !desktop_notifications_enabled;
+	persistence_set("notifications", desktop_notifications_enabled);
+	
+	if (desktop_notifications_enabled) {
+		desktop_notifications_onEnable();
+	}
+	
+	persistence_set("popups", desktop_notifications_enabled);
+	
+	$el.innerHTML = desktop_notifications_fmtstr();
+};
+
+var desktop_notifications_onEnable = function() {
+	notify(hub_hubname, "Desktop popups enabled");
+}
+
 var scrollback_move = function(delta) {
 	if (chat_scrollback.length === 0) {
 		return; // no effect
@@ -867,6 +912,12 @@ window.onload = function() {
 	
 	timestamp_format_index = persistence_get("timestamps", 0);
 	
+	desktop_notifications_enabled = persistence_get("popups");
+	if (desktop_notifications_enabled) {
+		// prompt for permissions
+		desktop_notifications_onEnable();
+	}
+	
 	menu.reset();
 	
 	tab_addHandlers();
@@ -917,12 +968,19 @@ window.onload = function() {
 	});
 	sock.on('priv', function(data) {
 		writerFor(data.user).pub(data.user, data.message);
-		if (last_tab !== pm_tabs[data.user] &&
+		if (last_tab !== pm_tabs[data.user]) {
-			($("#tabitem-"+pm_tabs[data.user]).className.indexOf('unread') === -1)
+			// Got PM, but tab isn't focused
-		) {
+			
+			// Mark tab as unread
+			if ($("#tabitem-"+pm_tabs[data.user]).className.indexOf('unread') === -1) {
 				$("#tabitem-"+pm_tabs[data.user]).className += " unread";
 				updateTitle();
 			}
+			
+			if (desktop_notifications_enabled) {
+				notify("Message from " + data.user, data.message);
+			}
+		}
 	});
 	sock.on('hello', function() {
 		transition(STATE_ACTIVE);