[Fix #15] update read indicator if window is not focused

cli/data.js

@@ -42,10 +42,9 @@ SlackWrapper.prototype.update = function(data) {
                 history.pushAll(data["live"][i]);
         }
         for (var roomId in data["live"]) {
+            onMsgReceived(this.context.getChannel(roomId), data["live"][roomId]);
             if (SELECTED_ROOM && data["live"][SELECTED_ROOM.id])
                 onRoomUpdated();
-            else
-                onMsgReceived(this.context.getChannel(roomId), data["live"][roomId]);
         }
     }
 };

cli/ui.js

@@ -74,15 +74,10 @@ function onRoomSelected() {
         name = members.join(", ");
     }
     var roomLi = document.getElementById(SELECTED_ROOM.id);
-    roomLi.classList.remove(R.klass.unread);
-    roomLi.classList.remove(R.klass.unreadHi);
     document.getElementById(R.id.currentRoom.title).textContent = name;
     onRoomUpdated();
 
-    if (UNREAD_CHANS[SELECTED_ROOM.id]) {
-        UNREAD_CHANS[SELECTED_ROOM.id] = 0;
-        updateTitle();
-    }
+    markRoomAsRead(SELECTED_ROOM);
 }
 
 function createMessageDom(channelId, msg) {
@@ -137,7 +132,7 @@ function updateTitle() {
  * @param {Array.<*>} msg
 **/
 function onMsgReceived(chan, msg) {
-    if (chan) {
+    if (chan && (chan !== SELECTED_ROOM || !window.hasFocus)) {
         document.getElementById(chan.id).classList.add(R.klass.unread);
         var count = UNREAD_CHANS[chan.id] || 0;
         UNREAD_CHANS[chan.id] = count + msg.length;
@@ -145,6 +140,19 @@ function onMsgReceived(chan, msg) {
     }
 }
 
+/**
+ * @param {SlackChan|SlackGroup|SlackIms} room
+**/
+function markRoomAsRead(room) {
+    if (UNREAD_CHANS[room.id]) {
+        UNREAD_CHANS[room.id] = 0;
+        updateTitle();
+    }
+    var roomLi = document.getElementById(room.id);
+    roomLi.classList.remove(R.klass.unread);
+    roomLi.classList.remove(R.klass.unreadHi);
+}
+
 function onRoomUpdated() {
     var chatFrag = document.createDocumentFragment()
         ,currentRoomId = SELECTED_ROOM.id;
@@ -225,6 +233,15 @@ document.addEventListener('DOMContentLoaded', function() {
         }
         return false;
     });
+    window.addEventListener('blur', function() {
+        window.hasFocus = false;
+    });
+    window.addEventListener('focus', function() {
+        window.hasFocus = true;
+        if (SELECTED_ROOM)
+            markRoomAsRead(SELECTED_ROOM);
+    });
+    window.hasFocus = true;
 
     startPolling();
 });

srv/public/slack.min.js

@@ -4,10 +4,11 @@ function r(b){this.id=b.id;this.name=b.name;this.status=b.status;this.b={w:b.pro
 a=A.a.a?Object.keys(A.a.a):[];a.sort(function(b,a){return A.a.a[b].name.localeCompare(A.a.a[a].name)});a.forEach(function(a){a=A.a.a[a].a;var c=document.createElement("li");c.id=a.id;c.className="slack-context-room";c.textContent=a.f.name;c&&b.appendChild(c)});document.getElementById("chanList").textContent="";document.getElementById("chanList").appendChild(b)}function B(b){b?document.body.classList.remove("no-network"):document.body.classList.add("no-network")}
 function C(b,a){var c=document.createElement("div"),e=document.createElement("div"),f=document.createElement("div"),d=document.createElement("div"),l=document.createElement("img"),n=document.createElement("span"),k=document.createElement("ul"),p=document.createElement("li"),t=a.raw.user?A.a.a[a.raw.user]:A.a.i[a.raw.bot_id];c.id=b+"_"+a.g;c.className="slackmsg-item";e.className="slackmsg-ts";f.className="slackmsg-msg";d.className="slackmsg-author";l.className="slackmsg-author-img";n.className="slackmsg-author-name";
 k.className="slackmsg-hover";p.className="slackmsg-hover-reply";e.textContent=(new Date(1E3*a.g)).toLocaleTimeString();f.textContent=a.raw.text;n.textContent=t?t.name:a.raw.username||"?";l.src=t?t.b.j:"";d.appendChild(l);d.appendChild(n);k.appendChild(p);c.appendChild(d);c.appendChild(f);c.appendChild(e);c.appendChild(k);return c}function D(){var b=0,a;for(a in E)E.hasOwnProperty(a)&&(b+=E[a]);document.title=(b?"("+b+")":"")+" - gate"}
-function F(){var b=document.createDocumentFragment(),a=G.id;document.getElementById("chatWindow").textContent="";A.b[a]&&A.b[a].a.forEach(function(c){b.appendChild(C(a,c))});var c=document.getElementById("chatWindow");c.appendChild(b);c.scrollTop=c.scrollHeight-c.clientHeight}
-function H(b){for(;b.target!==b.currentTarget&&b.target;){if(b.target.classList.contains("slack-context-room")){if((b=A.a.c[b.target.id]||A.a.f[b.target.id]||A.a.b[b.target.id])&&b!==G){G&&document.getElementById(G.id).classList.remove("selected");document.getElementById(b.id).classList.add("selected");document.body.classList.remove("no-room-selected");G=b;b=void 0;var a=G.name||(G.f?G.f.name:void 0);if(!a){a=[];for(b in G.a)a.push(G.a[b].name);a=a.join(", ")}b=document.getElementById(G.id);b.classList.remove("unread");
-b.classList.remove("unreadHi");document.getElementById("currentRoomTitle").textContent=a;F();E[G.id]&&(E[G.id]=0,D());G.b&&!A.b[G.id]&&(b=new XMLHttpRequest,b.open("GET","api/hist?room="+G.id,!0),b.send(null))}break}b.target=b.target.parentElement}}
-function I(b){for(var a=b.target;a!==b.currentTarget&&a&&!a.classList.contains("slackmsg-hover");){if(a.classList.contains("slackmsg-hover-reply")){a:{for(a=a||b.target;a!==b.currentTarget&&a;){if(a.classList.contains("slackmsg-item")){b=a.id;break a}a=a.parentElement}b=void 0}if(b){b=parseFloat(b.split("_")[1]);for(var a=A.b[G.id].a,c=0,e=a.length;c<e&&a[c].g<=b;c++)if(a[c].g===b){console.log("Replying to ",a[c]);break}}break}a=a.parentElement}}
-document.addEventListener("DOMContentLoaded",function(){document.getElementById("chatList").addEventListener("click",H);document.getElementById("chatWindow").addEventListener("click",I);document.getElementById("msgForm").addEventListener("submit",function(b){b.preventDefault();b=document.getElementById("msgInput");if(G&&b.value){var a=new XMLHttpRequest;a.open("POST","api/msg?room="+G.id+"&text="+encodeURIComponent(b.value),!0);a.send(null);b.value=""}return!1});J()});var A,E={};A=new function(){this.f=0;this.a=new v;this.b={}};var K=0,G=null;function L(b){var a=new XMLHttpRequest;a.timeout=6E4;a.onreadystatechange=function(){if(4===a.readyState)if(a.status){var c=null,e=2===Math.floor(a.status/100);if(e){K&&(K=0,B(!0));c=a.response;try{c=JSON.parse(c)}catch(f){c=null}}else K?(K+=Math.floor((K||5)/2),K=Math.min(60,K)):(K=5,B(!1));b(e,c)}else K&&(K=0,B(!0)),L(b)};a.open("GET","api?v="+A.f,!0);a.send(null)}
-function M(b,a){if(b){if(a){var c=A;a.v&&(c.f=a.v);if(a["static"]){for(var e=c.a,f=a["static"],d=0,l=f.bots.length;d<l;d++)e.i[f.bots[d].id]=new u(f.bots[d]);d=0;for(l=f.users.length;d<l;d++)e.a[f.users[d].id]=new r(f.users[d]);d=0;for(l=f.ims.length;d<l;d++){var n=h(e,f.ims[d].user);n&&(n.a=new q(n,f.ims[d]),e.f[n.a.id]=n.a)}d=0;for(l=f.channels.length;d<l;d++)e.c[f.channels[d].id]=new g(f.channels[d],e);d=0;for(l=f.groups.length;d<l;d++)e.b[f.groups[d].id]=new m(e,f.groups[d]);e.h=h(e,f.self.id);
-z()}if(a.live){for(var k in a.live)(e=c.b[k])?y(e,a.live[k]):c.b[k]=new x(k,500,a.live[k]);for(var p in a.live)G&&a.live[G.id]?F():(k=c.a,k=k.c[p]||k.f[p]||k.b[p]||null,e=a.live[p],k&&(document.getElementById(k.id).classList.add("unread"),E[k.id]=(E[k.id]||0)+e.length,D()))}}J()}else setTimeout(J,1E3*K)}function J(){L(M)};
+function F(){var b=G;E[b.id]&&(E[b.id]=0,D());b=document.getElementById(b.id);b.classList.remove("unread");b.classList.remove("unreadHi")}function H(){var b=document.createDocumentFragment(),a=G.id;document.getElementById("chatWindow").textContent="";A.b[a]&&A.b[a].a.forEach(function(c){b.appendChild(C(a,c))});var c=document.getElementById("chatWindow");c.appendChild(b);c.scrollTop=c.scrollHeight-c.clientHeight}
+function I(b){for(;b.target!==b.currentTarget&&b.target;){if(b.target.classList.contains("slack-context-room")){if((b=A.a.c[b.target.id]||A.a.f[b.target.id]||A.a.b[b.target.id])&&b!==G){G&&document.getElementById(G.id).classList.remove("selected");document.getElementById(b.id).classList.add("selected");document.body.classList.remove("no-room-selected");G=b;b=void 0;var a=G.name||(G.f?G.f.name:void 0);if(!a){a=[];for(b in G.a)a.push(G.a[b].name);a=a.join(", ")}document.getElementById("currentRoomTitle").textContent=
+a;H();F();G.b&&!A.b[G.id]&&(b=new XMLHttpRequest,b.open("GET","api/hist?room="+G.id,!0),b.send(null))}break}b.target=b.target.parentElement}}
+function J(b){for(var a=b.target;a!==b.currentTarget&&a&&!a.classList.contains("slackmsg-hover");){if(a.classList.contains("slackmsg-hover-reply")){a:{for(a=a||b.target;a!==b.currentTarget&&a;){if(a.classList.contains("slackmsg-item")){b=a.id;break a}a=a.parentElement}b=void 0}if(b){b=parseFloat(b.split("_")[1]);for(var a=A.b[G.id].a,c=0,e=a.length;c<e&&a[c].g<=b;c++)if(a[c].g===b){console.log("Replying to ",a[c]);break}}break}a=a.parentElement}}
+document.addEventListener("DOMContentLoaded",function(){document.getElementById("chatList").addEventListener("click",I);document.getElementById("chatWindow").addEventListener("click",J);document.getElementById("msgForm").addEventListener("submit",function(b){b.preventDefault();b=document.getElementById("msgInput");if(G&&b.value){var a=new XMLHttpRequest;a.open("POST","api/msg?room="+G.id+"&text="+encodeURIComponent(b.value),!0);a.send(null);b.value=""}return!1});window.addEventListener("blur",function(){window.hasFocus=
+!1});window.addEventListener("focus",function(){window.hasFocus=!0;G&&F()});window.hasFocus=!0;K()});var A,E={};A=new function(){this.f=0;this.a=new v;this.b={}};var L=0,G=null;function M(b){var a=new XMLHttpRequest;a.timeout=6E4;a.onreadystatechange=function(){if(4===a.readyState)if(a.status){var c=null,e=2===Math.floor(a.status/100);if(e){L&&(L=0,B(!0));c=a.response;try{c=JSON.parse(c)}catch(f){c=null}}else L?(L+=Math.floor((L||5)/2),L=Math.min(60,L)):(L=5,B(!1));b(e,c)}else L&&(L=0,B(!0)),M(b)};a.open("GET","api?v="+A.f,!0);a.send(null)}
+function N(b,a){if(b){if(a){var c=A;a.v&&(c.f=a.v);if(a["static"]){for(var e=c.a,f=a["static"],d=0,l=f.bots.length;d<l;d++)e.i[f.bots[d].id]=new u(f.bots[d]);d=0;for(l=f.users.length;d<l;d++)e.a[f.users[d].id]=new r(f.users[d]);d=0;for(l=f.ims.length;d<l;d++){var n=h(e,f.ims[d].user);n&&(n.a=new q(n,f.ims[d]),e.f[n.a.id]=n.a)}d=0;for(l=f.channels.length;d<l;d++)e.c[f.channels[d].id]=new g(f.channels[d],e);d=0;for(l=f.groups.length;d<l;d++)e.b[f.groups[d].id]=new m(e,f.groups[d]);e.h=h(e,f.self.id);
+z()}if(a.live){for(var k in a.live)(e=c.b[k])?y(e,a.live[k]):c.b[k]=new x(k,500,a.live[k]);for(var p in a.live)k=c.a,k=k.c[p]||k.f[p]||k.b[p]||null,e=a.live[p],!k||k===G&&window.hasFocus||(document.getElementById(k.id).classList.add("unread"),E[k.id]=(E[k.id]||0)+e.length,D()),G&&a.live[G.id]&&H()}}K()}else setTimeout(K,1E3*L)}function K(){M(N)};