Add the ability to filter messages by username

src/renderer/index.html

@@ -32,6 +32,12 @@
         </select>
       </div>
       
+      <div> <!-- needed to stop the select from messing up -->
+        <select id="opt-messages-by-user">
+          <option value="">Filter messages by user&nbsp;</option>
+        </select>
+      </div>
+
       <div class="nav">
         <button id="nav-first" data-nav="first">&laquo;</button>
         <button id="nav-prev" data-nav="prev">&lsaquo;</button>

src/renderer/scr.exec.js

@@ -26,6 +26,10 @@ document.addEventListener("DOMContentLoaded", () => {
   
   STATE.setMessagesPerPage(GUI.getOptionMessagesPerPage());
   
+  GUI.onOptionMessagesByUserChanged(() => {
+    STATE.setMessagesByUser(GUI.getOptionMessagesByUser());
+  });
+
   GUI.onNavigationButtonClicked(action => {
     STATE.updateCurrentPage(action);
   });
@@ -39,4 +43,8 @@ document.addEventListener("DOMContentLoaded", () => {
     GUI.updateMessageList(messages);
     GUI.scrollMessagesToTop();
   });
+
+  STATE.onUsersRefreshed(users => {
+    GUI.updateUserFilter(users);
+  });
 });

src/renderer/scr.gui.js

@@ -1,6 +1,7 @@
 var GUI = (function(){
   var eventOnFileUploaded;
   var eventOnOptMessagesPerPageChanged;
+  var eventOnOptMessagesByUserChanged;
   var eventOnNavButtonClicked;
   
   var showModal = function(width, html){
@@ -73,6 +74,10 @@ var GUI = (function(){
         eventOnOptMessagesPerPageChanged && eventOnOptMessagesPerPageChanged();
       });
       
+      DOM.id("opt-messages-by-user").addEventListener("change", () => {
+        eventOnOptMessagesByUserChanged && eventOnOptMessagesByUserChanged();
+      });
+
       DOM.tag("button", DOM.fcls("nav")).forEach(button => {
         button.disabled = true;
         
@@ -113,6 +118,13 @@ var GUI = (function(){
       eventOnOptMessagesPerPageChanged = callback;
     },
     
+    /*
+     * Sets a callback for when the user changes the messages by user option. The callback is not passed any arguments.
+     */
+    onOptionMessagesByUserChanged: function(callback){
+      eventOnOptMessagesByUserChanged = callback;
+    },
+
     /*
      * Sets a callback for when the user clicks a navigation button. The callback is passed one of the following strings: first, prev, next, last.
      */
@@ -131,6 +143,13 @@ var GUI = (function(){
       return parseInt(DOM.id("opt-messages-per-page").value, 10);
     },
     
+    /*
+     * Returns the user which to filter messages by.
+     */
+    getOptionMessagesByUser: function(){
+      return DOM.id("opt-messages-by-user").value;
+    },
+
     /*
      * Updates the navigation text and buttons.
      */
@@ -158,7 +177,7 @@ var GUI = (function(){
         eleChannels.innerHTML = "";
       }
       else{
-        eleChannels.innerHTML = channels.map(channel => DISCORD.getChannelHTML(channel)).join("");
+        eleChannels.innerHTML = channels.filter(channel => channel.msgcount > 0).map(channel => DISCORD.getChannelHTML(channel)).join("");
         
         Array.prototype.forEach.call(eleChannels.children, ele => {
           ele.addEventListener("click", e => {
@@ -186,6 +205,34 @@ var GUI = (function(){
       DOM.id("messages").innerHTML = messages ? messages.map(message => DISCORD.getMessageHTML(message)).join("") : "";
     },
     
+    /*
+     * Updates the select box with all possibly user names.
+     */
+    updateUserFilter: function(users){
+      var select = DOM.id("opt-messages-by-user");
+
+      // Remove all but first option
+      for (var i = select.length; i > 0; i--) {
+        select.remove(i);
+      }
+
+      var options = [];
+      for (var key in users) {
+        // Skip loop if the property is from prototype
+        if (!users.hasOwnProperty(key)) continue;
+
+        var option = document.createElement("option");
+        option.value = key;
+        option.text = users[key].name;
+        options.push(option);
+      }
+      options.sort((a, b) => {
+        return a.text.toLowerCase().localeCompare(b.text.toLowerCase());
+      }).forEach(option => {
+        select.add(option);
+      });
+    },
+
     /*
      * Scrolls the message div to the top.
      */

src/renderer/scr.savefile.js

@@ -38,6 +38,16 @@ SAVEFILE.prototype.getMessageCount = function(channel){
   return Object.keys(this.getMessages(channel)).length;
 };
 
+SAVEFILE.prototype.getFilteredMessageCount = function(channel, userindex){
+  if (userindex === -1) return this.getMessageCount(channel);
+
+  var count = 0;
+  UTILS.forEachValue(this.getMessages(channel), messageObject => {
+    if (messageObject.u === userindex) count++;
+  });
+  return count;
+};
+
 SAVEFILE.prototype.getAllMessages = function(){
   var messages = {};
   

src/renderer/scr.state.js

@@ -11,6 +11,7 @@ var STATE = (function(){
   var selectedChannel;
   var currentPage;
   var messagesPerPage;
+  var messagesByUser;
   
   // ----------------------------------
   // Channel and message refresh events
@@ -18,6 +19,7 @@ var STATE = (function(){
   
   var eventOnChannelsRefreshed;
   var eventOnMessagesRefreshed;
+  var eventOnUsersRefreshed;
   
   var triggerChannelsRefreshed = function(){
     eventOnChannelsRefreshed && eventOnChannelsRefreshed(ROOT.getChannelList());
@@ -27,6 +29,10 @@ var STATE = (function(){
     eventOnMessagesRefreshed && eventOnMessagesRefreshed(ROOT.getMessageList());
   };
   
+  var triggerUsersRefreshed = function(){
+    eventOnUsersRefreshed && eventOnUsersRefreshed(ROOT.getUserList());
+  };
+
   ROOT.onChannelsRefreshed = function(callback){
     eventOnChannelsRefreshed = callback;
   };
@@ -35,6 +41,10 @@ var STATE = (function(){
     eventOnMessagesRefreshed = callback;
   };
   
+  ROOT.onUsersRefreshed = function(callback){
+    eventOnUsersRefreshed = callback;
+  };
+
   // ------------------------------------
   // File upload and basic data retrieval
   // ------------------------------------
@@ -46,6 +56,7 @@ var STATE = (function(){
 
     triggerChannelsRefreshed();
     triggerMessagesRefreshed();
+    triggerUsersRefreshed();
   };
 
   ROOT.getChannelName = function(channel){
@@ -66,12 +77,13 @@ var STATE = (function(){
 
   ROOT.getChannelList = function(){
     var channels = FILE.getChannels();
+    var userindex = messagesByUser ? FILE.meta.userindex.indexOf(messagesByUser) : -1;
 
     return Object.keys(channels).map(key => ({
       "id": key,
       "name": channels[key].name,
       "server": FILE.getServer(channels[key].server),
-      "msgcount": FILE.getMessageCount(key)
+      "msgcount": FILE.getFilteredMessageCount(key, userindex)
     }));
   };
 
@@ -90,6 +102,19 @@ var STATE = (function(){
   // ------------
   // Message list
   // ------------
+  ROOT.getFilteredMessageList = function(){
+    if (!messagesByUser) {
+      return MSGS;
+    }
+
+    var pos = FILE.meta.userindex.indexOf(messagesByUser);
+    var messages = FILE.getMessages(selectedChannel);
+    return MSGS.filter(key =>  {
+      var message = messages[key];
+      return message.u == pos;
+    });
+  };
+
   
   ROOT.getMessageList = function(){
     if (!MSGS){
@@ -99,7 +124,7 @@ var STATE = (function(){
     var messages = FILE.getMessages(selectedChannel);
     var startIndex = messagesPerPage*(ROOT.getCurrentPage()-1);
 
-    return MSGS.slice(startIndex, !messagesPerPage ? undefined : startIndex+messagesPerPage).map(key => {
+    return ROOT.getFilteredMessageList().slice(startIndex, !messagesPerPage ? undefined : startIndex+messagesPerPage).map(key => {
       var message = messages[key];
 
       return {
@@ -113,6 +138,25 @@ var STATE = (function(){
     });
   };
   
+  ROOT.getUserList = function(){
+    if (!FILE){
+      return [];
+    }
+
+    return FILE.meta.users;
+  };
+
+  // ----------
+  // Filtering
+  // ----------
+
+  ROOT.setMessagesByUser = function(key){
+    currentPage = 1;
+    messagesByUser = key;
+    triggerChannelsRefreshed();
+    triggerMessagesRefreshed();
+  };
+
   // ----------
   // Pagination
   // ----------
@@ -144,7 +188,7 @@ var STATE = (function(){
   };
 
   ROOT.getPageCount = function(){
-    return !MSGS ? 0 : (!messagesPerPage ? 1 : Math.ceil(MSGS.length/messagesPerPage));
+    return !MSGS ? 0 : (!messagesPerPage ? 1 : Math.ceil(ROOT.getFilteredMessageList().length/messagesPerPage));
   };
   
   // --------