Fixed palette loading bug

js/ColorModule.js

@@ -10,7 +10,6 @@ const ColorModule = (() => {
     const colorsMenu = document.getElementById("colors-menu");
      
     // Binding events to callbacks
-    console.info("Initialized Color Module..");
     document.getElementById('jscolor-hex-input').addEventListener('change',colorChanged, false);
     document.getElementById('jscolor-hex-input').addEventListener('input', colorChanged, false);
     document.getElementById('add-color-button').addEventListener('click', addColorButtonEvent, false);
@@ -345,13 +344,11 @@ const ColorModule = (() => {
     /** Creates the colour palette when starting up the editor from _newPixel.js
      * 
      * @param {*} paletteColors The colours of the palette
-     * @param {*} deletePreviousPalette Tells if the app should delete the previous palette or not 
-     *                                  (used when opening a file, for example)
      */
     function createColorPalette(paletteColors) {
         //remove current palette
-        while (colors.length > 0)
+        while (colorsMenu.childCount > 0)
-            colors[0].parentElement.remove();
+            colorsMenu.children[0].parentElement.remove();
 
         var lightestColor = new Color("hex", '#000000');
         var darkestColor = new Color("hex", '#ffffff');

js/FileManager.js

@@ -123,6 +123,8 @@ const FileManager = (() => {
             }
             else alert('Only .LPE project files, PNG and GIF files are allowed at this time.');
         }
+
+        browseHolder.value = null;
     }
 
     function openFile() {
@@ -194,9 +196,9 @@ const FileManager = (() => {
     }
 
     function loadPalette() {
-        if (this.files && this.files[0]) {
+        if (browsePaletteHolder.files && browsePaletteHolder.files[0]) {
             //make sure file is allowed filetype
-            var fileContentType = this.files[0].type;
+            var fileContentType = browsePaletteHolder.files[0].type;
             if (fileContentType == 'image/png' || fileContentType == 'image/gif') {
 
                 //load file
@@ -232,14 +234,16 @@ const FileManager = (() => {
                         palettes['Loaded palette'].colors = colorPalette;
                         Util.setText('palette-button', 'Loaded palette');
                         Util.setText('palette-button-splash', 'Loaded palette');
-                        toggle('palette-menu-splash');
+                        Util.toggle('palette-menu-splash');
                     };
                     img.src = e.target.result;
                 };
-                fileReader.readAsDataURL(this.files[0]);
+                fileReader.readAsDataURL(browsePaletteHolder.files[0]);
             }
             else alert('Only PNG and GIF files are supported at this time.');
         }
+
+        browsePaletteHolder.value = null;
     }
 
     return {

js/Startup.js

@@ -15,8 +15,6 @@ const Startup = (() => {
             splashPostfix = '';
         }
     
-        console.log("New pixel");
-    
         var width = Util.getValue('size-width' + splashPostfix);
         var height = Util.getValue('size-height' + splashPostfix);
         var selectedPalette = Util.getText('palette-button' + splashPostfix);
@@ -153,12 +151,17 @@ const Startup = (() => {
 
         // If the user selected a palette and isn't opening a file, I load the selected palette
         if (selectedPalette != 'Choose a palette...') {
-            //if this palette isnt the one specified in the url, then reset the url
+            if (selectedPalette === 'Loaded palette') {
-            if (!palettes[selectedPalette].specified)
+                ColorModule.createColorPalette(palettes['Loaded palette'].colors);
-            history.pushState(null, null, '/pixel-editor');
+            }
+            else {
+                //if this palette isnt the one specified in the url, then reset the url
+                if (!palettes[selectedPalette].specified)
+                history.pushState(null, null, '/pixel-editor');
                 
-            //fill the palette with specified colours
+                //fill the palette with specified colours
-            ColorModule.createColorPalette(palettes[selectedPalette].colors);
+                ColorModule.createColorPalette(palettes[selectedPalette].colors);
+            }
         }
         // Otherwise, I just generate 2 semirandom colours
         else {

js/_editorMode.js

@@ -1,4 +1,5 @@
 // REFACTOR: move everything in EditorState?
+let pixelEditorMode = "Basic";
 
 let modes = {
     'Basic' : {

js/_palettes.js

@@ -66,8 +66,6 @@ palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"",
     const loadPaletteButtonSplash = document.getElementById('load-palette-button-splash');
 
 	splashPalettes.refresh = function () {
-		splashPalettes.innerHTML = '';
-		palettesMenu.innerHTML = '';
 
 		Object.keys(palettes).forEach((paletteName,) => {
 
@@ -110,7 +108,6 @@ palettes["Gameboy Color"] = {"name":"Nintendo Gameboy (Black Zero)","author":"",
 
 	splashPalettes.refresh();
 
-
     const loadPaletteButtonEvent = () => {
         document.getElementById('load-palette-browse-holder').click();
     }