Move renderer data to src.state.js, refactor src.savefile.js, and update execution file to use the state obj

src/renderer/scr.exec.js

@@ -1,8 +1,6 @@
 document.addEventListener("DOMContentLoaded", () => {
   DISCORD.setup();
   
-  var CURRENTFILE;
-  
   var btnUploadFile = DOM.id("upload-file");
   var inputUploadedFile = DOM.id("uploaded-file");
   
@@ -26,7 +24,7 @@ document.addEventListener("DOMContentLoaded", () => {
         }
         
         if (SAVEFILE.isValid(obj)){
-          CURRENTFILE = new SAVEFILE(obj);
+          STATE.uploadFile(new SAVEFILE(obj));
           reset();
         }
         else{
@@ -44,13 +42,9 @@ document.addEventListener("DOMContentLoaded", () => {
     var eleChannels = DOM.id("channels");
     var eleMessages = DOM.id("messages");
     
-    eleChannels.innerHTML = "";
+    eleChannels.innerHTML = STATE.getChannelList().map(channel => DISCORD.getChannelHTML(channel)).join("");
     eleMessages.innerHTML = "";
     
-    CURRENTFILE.getChannelList().forEach(channel => {
-      eleChannels.innerHTML += DISCORD.getChannelHTML(channel);
-    });
-    
     Array.prototype.forEach.call(eleChannels.children, ele => {
       ele.addEventListener("click", e => {
         var currentChannel = DOM.cls("active", eleChannels)[0];
@@ -62,14 +56,8 @@ document.addEventListener("DOMContentLoaded", () => {
         
         ele.classList.add("active");
         
-        var html = [];
+        STATE.selectChannel(ele.getAttribute("data-channel"));
-        var messages = CURRENTFILE.getChannelMessageObject(ele.getAttribute("data-channel"));
+        eleMessages.innerHTML = STATE.getMessageList(0).map(message => DISCORD.getMessageHTML(message)).join("");
-        
-        for(var key of Object.keys(messages).sort()){
-          html.push(DISCORD.getMessageHTML(CURRENTFILE.getMessage(messages[key])));
-        }
-        
-        eleMessages.innerHTML = html.join("");
       });
     });
   };

src/renderer/scr.savefile.js

@@ -19,27 +19,18 @@ SAVEFILE.prototype.getServer = function(index){
   };
 };
 
-SAVEFILE.prototype.getChannelList = function(){
+SAVEFILE.prototype.getChannels = function(){
-  return Object.keys(this.meta.channels).map(key => ({
+  return this.meta.channels || {};
-    id: key,
-    name: this.meta.channels[key].name,
-    server: this.getServer(this.meta.channels[key].server),
-    msgcount: Object.keys(this.data[key]).length || 0
-  }));
 };
 
 SAVEFILE.prototype.getUser = function(index){
   return this.meta.users[this.meta.userindex[index]] || { name: "<unknown>" };
 };
 
-SAVEFILE.prototype.getChannelMessageObject = function(channel){
+SAVEFILE.prototype.getMessageCount = function(channel){
-  return this.data[channel] || [];
+  return Object.keys(this.data[channel]).length || 0;
 };
 
-SAVEFILE.prototype.getMessage = function(message){
+SAVEFILE.prototype.getMessages = function(channel){
-  return {
+  return this.data[channel] || [];
-    user: this.getUser(message.u),
-    timestamp: message.t,
-    contents: message.m
-  };
 };

src/renderer/src.state.js

@@ -0,0 +1,47 @@
+var STATE = (function(){
+  var FILE;
+  var MSGS;
+  
+  var selectedChannel;
+  
+  return {
+    uploadFile: function(file){
+      FILE = file;
+      MSGS = null;
+    },
+    
+    getChannelList: function(){
+      var channels = FILE.getChannels();
+      
+      return Object.keys(channels).map(key => ({
+        id: key,
+        name: channels[key].name,
+        server: FILE.getServer(channels[key].server),
+        msgcount: FILE.getMessageCount(key)
+      }));
+    },
+    
+    selectChannel: function(channel){
+      selectedChannel = channel;
+      MSGS = Object.keys(FILE.getMessages(channel)).sort();
+    },
+    
+    getMessageList: function(startIndex, count){
+      if (!MSGS){
+        return [];
+      }
+      
+      var messages = FILE.getMessages(selectedChannel);
+      
+      return MSGS.slice(startIndex, !count ? undefined : startIndex+count).map(key => {
+        var message = messages[key];
+        
+        return {
+          user: FILE.getUser(message.u),
+          timestamp: message.t,
+          contents: message.m
+        };
+      });
+    }
+  };
+})();