fix colour handling issue when importing game data

readme.md

@@ -40,7 +40,6 @@ if (src.match(/^(file|https)?:\/\/|^\/\//)) {
 
 ## bugs
 
-* certain colours cause palette to fail- I think rgb values below 16 result in a single 0-f value instead of being zero-padded
 * output seems to be offset by 1 tile? check whether iteration is from 0-15 or from 1-16
 
 ## to do

script.js

@@ -46,8 +46,18 @@ $(document).ready(function() {
         }, 0);
     }
 
+    function zeroPad(input, desiredLength) {
+        while (input.length < desiredLength) {
+            input = "0" + input;
+        }
+
+        return input;
+    }
+
     function colourToHex(colour) {
-        return '#' + Number(colour.red).toString(16) + Number(colour.green).toString(16) + Number(colour.blue).toString(16);
+        return '#' + zeroPad(Number(colour.red  ).toString(16), 2) 
+                   + zeroPad(Number(colour.green).toString(16), 2) 
+                   + zeroPad(Number(colour.blue ).toString(16), 2);
     }
 
     function hexToColour(hex) {
@@ -246,6 +256,11 @@ $(document).ready(function() {
             imageData = document.getElementById("room-output").getContext('2d').getImageData(0, 0, 128, 128);
             rawData   = imageData.data;
 
+            /* this seems to go 0-15 initially and then 0-16? ??
+            _.each(room, function(row, tileY) {
+                console.log(tileY);
+            });
+            */
             _.each(room, function(row, tileY) {
                 _.each(row, function(tileName, tileX) {
                     if (_.get(bitsyData, 'tiles.' + tileName + '.bitmap')) {