Fix code style errors

src/js/controller/preview/PreviewController.js

@@ -244,7 +244,8 @@
   };
 
   ns.PreviewController.prototype.shouldRender_ = function () {
-    return (this.renderFlag || this.popupPreviewController.renderFlag) && (Date.now() - this.lastRenderTime > RENDER_MINIMUM_DELAY);
+    return (this.renderFlag || this.popupPreviewController.renderFlag) &&
+            (Date.now() - this.lastRenderTime > RENDER_MINIMUM_DELAY);
   };
 
   ns.PreviewController.prototype.toggleOnionSkin_ = function () {

src/js/model/Frame.js

@@ -16,12 +16,16 @@
 
   ns.Frame.fromPixelGrid = function (pixels, width, height) {
     if (pixels.length) {
+      var w;
+      var h;
+      var buffer;
+
       if (pixels[0].length) {
-        var w = pixels.length;
+        w = pixels.length;
-        var h = pixels[0].length;
+        h = pixels[0].length;
-        var buffer = [];
+        buffer = [];
         for (var y = 0; y < h; y++) {
-          for (var x = 0; x < w; x++ ) {
+          for (var x = 0; x < w; x++) {
             if (typeof pixels[x][y] == 'string') {
               buffer[y * w + x] = pskl.utils.colorToInt(pixels[x][y]);
             } else {
@@ -30,8 +34,8 @@
           }
         }
       } else if (width && height) {
-        var w = width;
+        w = width;
-        var h = height;
+        h = height;
         buffer = pixels;
       } else {
         throw 'Bad arguments in pskl.model.frame.fromPixelGrid, missing width and height';
@@ -48,7 +52,7 @@
   var _emptyPixelGridCache = {};
   ns.Frame.createEmptyPixelGrid_ = function (width, height) {
     var pixels;
-    var key = width+"-"+height;
+    var key = width + '-' + height;
     if (_emptyPixelGridCache[key]) {
       pixels = _emptyPixelGridCache[key];
     } else {

src/js/model/frame/AsyncCachedFrameProcessor.js

@@ -32,23 +32,12 @@
       processedFrame = cache[key1];
     } else if (frame instanceof pskl.model.frame.RenderedFrame) {
       // Cannot use 2nd level cache with rendered frames
-      var callbackFirstLvlCacheOnly = this.onProcessorComplete_.bind(this, deferred, cache, key1/*, key1*/);
+      var callbackFirstLvlCacheOnly = this.onProcessorComplete_.bind(this, deferred, cache, key1);
       this.frameProcessor(frame, callbackFirstLvlCacheOnly);
     } else {
-      // TODO: Remove? or offload to worker
+      var callback = this.onProcessorComplete_.bind(this, deferred, cache, key1);
-      /*
-      var framePixels = new Float64Array(frame.pixels.buffer).toString();
-      var key2 = pskl.utils.hashCode(framePixels);
-      if (cache[key2]) {
-        processedFrame = this.outputCloner(cache[key2], frame);
-      } else {
-      */
-      var callback = this.onProcessorComplete_.bind(this, deferred, cache, key1/*, key1*/);
       this.frameProcessor(frame, callback);
       cache[key1] = processedFrame;
-      /*
-      }
-      */
     }
 
     if (processedFrame) {
@@ -58,9 +47,8 @@
     return deferred.promise;
   };
 
-  ns.AsyncCachedFrameProcessor.prototype.onProcessorComplete_ = function (deferred, cache, key1/*, key2*/, result) {
+  ns.AsyncCachedFrameProcessor.prototype.onProcessorComplete_ = function (deferred, cache, key1, result) {
     cache[key1] = result;
-    //cache[key2] = result;
     deferred.resolve(result);
   };
 })();

src/js/model/frame/CachedFrameProcessor.js

@@ -71,22 +71,8 @@
       processedFrame = this.frameProcessor(frame);
       cache[cacheKey] = processedFrame;
     } else {
-      // TODO: Remove?
-      /*
-      // Float64Array.toString() is about 2.4x times faster compared to Uint32Array.toString()
-      var framePixels = new Float64Array(frame.pixels.buffer).toString();
-      var frameAsString = pskl.utils.hashCode(framePixels);
-      if (cache[frameAsString]) {
-        this.cacheHitLvl2_++;
-        processedFrame = this.outputCloner(cache[frameAsString], frame);
-      } else {
-      */
       processedFrame = this.frameProcessor(frame);
       cache[cacheKey] = processedFrame;
-      /*
-        cache[frameAsString] = processedFrame;
-      }
-      */
     }
 
     return processedFrame;

src/js/service/CurrentColorsService.js

@@ -96,6 +96,13 @@
 
     var colors = {};
     var framesToBatch = [];
+
+    var removeColorsIfNotInCurrent = function(hash, color) {
+      if (!frameCache[hash][color]) {
+        delete colors[color];
+      }
+    };
+
     for (var i = 0, length = frames.length; i < length; ++i) {
       var frame = frames[i];
       var hash = frame.getHash();
@@ -107,14 +114,10 @@
         var hashVersion = parseInt(hashParts.pop());
 
         if (hashVersion > 0) {
-          var lastColors = frameCache[hashParts.join('-')+'-'+(hashVersion - 1)];
+          var lastColors = frameCache[hashParts.join('-') + '-' + (hashVersion - 1)];
 
           if (lastColors) {
-            Object.keys(lastColors).forEach(function(color) {
+            Object.keys(lastColors).forEach(removeColorsIfNotInCurrent.bind(this, hash));
-              if (!frameCache[hash][color]) {
-                delete colors[color];
-              }
-            });
           }
         }
       } else {
@@ -140,7 +143,7 @@
       this.setCurrentColors(hexColors);
     }.bind(this, colors);
 
-    if (framesToBatch.length == 0) {
+    if (framesToBatch.length === 0) {
       batchAllThen([colors]);
     } else {
       batchAll(framesToBatch, job).then(batchAllThen);

src/js/utils/FileUtils.js

@@ -16,7 +16,7 @@
 
     readFileAsArrayBuffer : function (file, callback) {
       var reader = new FileReader();
-      reader.addEventListener("loadend", function() {
+      reader.addEventListener('loadend', function() {
         callback(reader.result);
       });
       reader.readAsArrayBuffer(file);

src/js/utils/FrameUtils.js

@@ -53,7 +53,7 @@
         var transparentColorInt = pskl.utils.colorToInt(transparentColor);
         if (transparentColorInt != constantTransparentColorInt) {
           pixels = frame.getPixels();
-          for (var i = 0; i < pixels.length; i++) {
+          for (var i = 0, length = pixels.length; i < length; i++) {
             if (pixels[i] == constantTransparentColorInt) {
               pixels[i] = transparentColorInt;
             }
@@ -61,7 +61,7 @@
         }
 
         // Imagedata from cache
-        var imageDataKey = w+"-"+h;
+        var imageDataKey = w + '-' + h;
         var imageData;
         if (!imageDataPool[imageDataKey]) {
           imageData = imageDataPool[imageDataKey] = context.createImageData(w, h);
@@ -75,7 +75,7 @@
         imgDataData.set(data);
 
         // Offcanvas from cache
-        var offCanvasKey = w+"-"+h;
+        var offCanvasKey = w + '-' + h;
         var offCanvas;
         if (!offCanvasPool[offCanvasKey]) {
           offCanvas = offCanvasPool[offCanvasKey] = pskl.utils.CanvasUtils.createCanvas(w, h);

src/js/utils/core.js

@@ -91,13 +91,17 @@ if (!Function.prototype.bind) {
   };
 
   ns.hashCode = function(str) {
-    var hash = 0, i, chr, len;
+    var hash = 0;
-    if (str.length === 0) return hash;
+    if (str.length === 0) {
-    for (i = 0, len = str.length; i < len; i++) {
+      return hash;
-        chr   = str.charCodeAt(i);
-        hash  = hash * 31 + chr;
-        hash |= 0; // Convert to 32bit integer
     }
+
+    for (var i = 0, len = str.length, chr; i < len; i++) {
+      chr = str.charCodeAt(i);
+      hash = hash * 31 + chr;
+      hash |= 0; // Convert to 32bit integer
+    }
+
     return hash;
   };
 
@@ -120,6 +124,7 @@ if (!Function.prototype.bind) {
   };
 
   var colorCache = {};
+  var colorCacheReverse = {};
   ns.colorToInt = function (color) {
     if (typeof color === 'number') {
       return color;
@@ -130,26 +135,30 @@ if (!Function.prototype.bind) {
     }
 
     var intValue = 0;
+    var r;
+    var g;
+    var b;
+    var a;
 
     // Hexadecimal
     if ((color.length == 9 || color.length == 7 || color.length == 3) && color[0] == '#') {
-        var hex = parseInt(color.substr(1), 16);
+      var hex = parseInt(color.substr(1), 16);
-        if (color.length == 9) {
+      if (color.length == 9) {
-          r = hex >> 24 & 0xff;
+        r = hex >> 24 & 0xff;
-          g = hex >> 16 & 0xff;
+        g = hex >> 16 & 0xff;
-          b = hex >> 8 & 0xff;
+        b = hex >> 8 & 0xff;
-          a = hex & 0xff;
+        a = hex & 0xff;
-        } else if (color.length == 7) {
+      } else if (color.length == 7) {
-          r = hex >> 16 & 0xff;
+        r = hex >> 16 & 0xff;
-          g = hex >> 8 & 0xff;
+        g = hex >> 8 & 0xff;
-          b = hex & 0xff;
+        b = hex & 0xff;
-          a = 255;
+        a = 255;
-        } else {
+      } else {
-          r = hex >> 8 & 0xf * 16;
+        r = hex >> 8 & 0xf * 16;
-          g = hex >> 4 & 0xf * 16;
+        g = hex >> 4 & 0xf * 16;
-          b = hex & 0xf * 16;
+        b = hex & 0xf * 16;
-          a = 255;
+        a = 255;
-        }
+      }
     } else if (color.length > 5 && color.substr(0, 5) == 'rgba(') { // RGBA
       var rgba = color.substr(5).slice(0, -1).split(',');
       r = parseInt(rgba[0]);
@@ -161,9 +170,10 @@ if (!Function.prototype.bind) {
       r = parseInt(rgb[0]);
       g = parseInt(rgb[1]);
       b = parseInt(rgb[2]);
+      a = 255;
     } else { // NO HOPE
       // Determine color by using the browser itself
-      d = document.createElement("div");
+      var d = document.createElement('div');
       d.style.color = color;
       document.body.appendChild(d);
 
@@ -181,10 +191,9 @@ if (!Function.prototype.bind) {
     return intValue;
   };
 
-  var colorCacheReverse = {};
   ns.intToColor = function(intValue) {
-    if (typeof colorCache[color] !== 'undefined') {
+    if (typeof intValue === 'string') {
-      return colorCache[color];
+      return intValue;
     }
 
     if (typeof colorCacheReverse[intValue] !== 'undefined') {
@@ -195,7 +204,7 @@ if (!Function.prototype.bind) {
     var g = intValue >> 8 & 0xff;
     var b = intValue >> 16 & 0xff;
     var a = (intValue >> 24 >>> 0 & 0xff) / 255;
-    var color = 'rgba('+r+','+g+','+b+','+a+')';
+    var color = 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
 
     colorCache[color] = intValue;
     colorCacheReverse[intValue] = color;

src/js/utils/serialization/Deserializer.js

@@ -15,7 +15,7 @@
 
       // Backward compatibility for JSON (modelVersion < 3)
       if (String.fromCharCode(uint8[0]) == '{') {
-        var data = "";
+        data = '';
         for (var i = 0; i < uint8.length; i++) {
           data += String.fromCharCode(uint8[i]);
         }
@@ -43,6 +43,8 @@
   };
 
   ns.Deserializer.prototype.deserialize = function (name) {
+    var i;
+    var j;
     var buffer = this.data_;
     var arr8 = new Uint8Array(buffer);
     var arr16 = new Uint16Array(buffer);
@@ -69,21 +71,22 @@
     /********/
     // Descriptor name
     var descriptorName = '';
-    for (var i = 0; i < descriptorNameLength; i++) {
+    for (i = 0; i < descriptorNameLength; i++) {
       descriptorName += String.fromCharCode(arr16[7 + i]);
     }
 
     // Descriptor description
     var descriptorDescription = '';
-    for (var i = 0; i < descriptorDescriptionLength; i++) {
+    for (i = 0; i < descriptorDescriptionLength; i++) {
       descriptorDescription = String.fromCharCode(arr16[7 + descriptorNameLength + i]);
     }
 
     // Layers
     var layerStartIndex = 7 + descriptorNameLength + descriptorDescriptionLength;
     var layers = [];
-    for (var i = 0; i < layerCount; i++) {
+    var layer;
-      var layer = {};
+    for (i = 0; i < layerCount; i++) {
+      layer = {};
       var frames = [];
 
       // Meta
@@ -96,13 +99,13 @@
 
       // Name
       var layerName = '';
-      for (var j = 0; j < layerNameLength; j++) {
+      for (j = 0; j < layerNameLength; j++) {
         layerName += String.fromCharCode(arr16[layerStartIndex + 5 + j]);
       }
 
       // Data URI
       var dataUri = '';
-      for (var j = 0; j < dataUriLength; j++) {
+      for (j = 0; j < dataUriLength; j++) {
         dataUri += String.fromCharCode(arr8[(layerStartIndex + 5 + layerNameLength) * 2 + j]);
       }
       dataUri = 'data:image/png;base64,' + btoa(dataUri);
@@ -119,26 +122,29 @@
     var descriptor = new pskl.model.piskel.Descriptor(descriptorName, descriptorDescription);
     var piskel = new pskl.model.Piskel(width, height, descriptor);
     var loadedLayers = 0;
-    for (var i = 0; i < layerCount; i++) {
+
-      var layer = layers[i];
+    var loadLayerImage = function(layer, cb) {
+      var image = new Image();
+      image.onload = function() {
+        var frames = pskl.utils.LayerUtils.createFramesFromSpritesheet(this, layer.frameCount);
+        frames.forEach(layer.model.addFrame.bind(layer.model));
+
+        loadedLayers++;
+        if (loadedLayers == layerCount) {
+          cb(piskel, {fps: fps});
+        }
+      };
+      image.src = layer.dataUri;
+    };
+
+    for (i = 0; i < layerCount; i++) {
+      layer = layers[i];
       var nlayer = new pskl.model.Layer(layer.name);
       layer.model = nlayer;
       nlayer.setOpacity(layer.opacity);
       piskel.addLayer(nlayer);
 
-      var image = new Image();
+      loadLayerImage.bind(this, layer, this.callback_)();
-      (function(layer, cb) {
-        image.onload = function() {
-          var frames = pskl.utils.LayerUtils.createFramesFromSpritesheet(this, layer.frameCount);
-          frames.forEach(layer.model.addFrame.bind(layer.model));
-
-          loadedLayers++;
-          if (loadedLayers == layerCount) {
-            cb(piskel, {fps: fps});
-          }
-        };
-      })(layer, this.callback_);
-      image.src = layer.dataUri;
     }
   };
 })();

src/js/utils/serialization/Serializer.js

@@ -31,7 +31,6 @@
    * [layer data index start + 4..layer name length-1] = layer name
    * [layer name length..base 64 png data url length-1] = base 64 png data url
    *
-   * 
    */
 
   ns.Serializer = {
@@ -70,7 +69,7 @@
         bytes += 3 * 2;
         bytes += layers[i].name.length * 2;
         bytes += framesData[i].length;
-        if (bytes%2 == 1) {
+        if (bytes % 2 == 1) {
           bytes++;
         }
       }
@@ -79,12 +78,18 @@
     },
 
     serializePiskel : function (piskel, expanded) {
+      var i;
+      var j;
+      var layers;
+      var dataUri;
+      var dataUriLength;
+
       // Render frames
       var framesData = [];
-      for (var i = 0, layers = piskel.getLayers(); i < layers.length; i++) {
+      for (i = 0, layers = piskel.getLayers(); i < layers.length; i++) {
         var renderer = new pskl.rendering.FramesheetRenderer(layers[i].getFrames());
-        var dataUri = atob(renderer.renderAsCanvas().toDataURL().split(',')[1]);
+        dataUri = atob(renderer.renderAsCanvas().toDataURL().split(',')[1]);
-        var dataUriLength = dataUri.length;
+        dataUriLength = dataUri.length;
         framesData.push({uri: dataUri, length: dataUriLength});
       }
 
@@ -122,18 +127,18 @@
       /* DATA */
       /********/
       // Descriptor name
-      for (var i = 0; i < descriptorNameLength; i++) {
+      for (i = 0; i < descriptorNameLength; i++) {
         arr16[7 + i] = descriptorName.charCodeAt(i);
       }
 
       // Descriptor description
-      for (var i = 0; i < descriptorDescriptionLength; i++) {
+      for (i = 0; i < descriptorDescriptionLength; i++) {
         arr16[7 + descriptorNameLength + i] = descriptorDescription.charCodeAt(i);
       }
 
       // Layers
       var layerStartIndex = 7 + descriptorNameLength + descriptorDescriptionLength;
-      for (var i = 0, layers = piskel.getLayers(); i < layers.length; i++) {
+      for (i = 0, layers = piskel.getLayers(); i < layers.length; i++) {
         var layer = layers[i];
         var frames = layer.getFrames();
 
@@ -142,8 +147,8 @@
         var opacity = layer.getOpacity();
         var frameCount = frames.length;
 
-        var dataUri = framesData[i].uri
+        dataUri = framesData[i].uri;
-        var dataUriLength = framesData[i].length
+        dataUriLength = framesData[i].length;
 
         // Meta
         arr16[layerStartIndex] = layerNameLength;
@@ -153,20 +158,19 @@
         arr16[layerStartIndex + 4] = ((dataUriLength & 0x0000ffff)) >>> 0;       // Lower 16
 
         // Name
-        for (var j = 0; j < layerNameLength; j++) {
+        for (j = 0; j < layerNameLength; j++) {
           arr16[layerStartIndex + 5 + j] = layerName.charCodeAt(j);
         }
 
         // Data URI
-        for (var j = 0; j < dataUriLength; j++) {
+        for (j = 0; j < dataUriLength; j++) {
           arr8[(layerStartIndex + 5 + layerNameLength) * 2 + j] = dataUri.charCodeAt(j);
         }
 
         layerStartIndex += Math.ceil(5 + layerNameLength + (dataUriLength / 2));
       }
 
-
       return buffer;
     }
-  }
+  };
 })();

src/js/utils/serialization/backward/Deserializer_v0.js

@@ -14,6 +14,6 @@
     var descriptor = new pskl.model.piskel.Descriptor('Deserialized piskel', '');
     var layer = pskl.model.Layer.fromFrames('Layer 1', frames);
 
-    this.callback_(pskl.model.Piskel.fromLayers([layer], descriptor), { fps: Constants.DEFAULTS.FPS});
+    this.callback_(pskl.model.Piskel.fromLayers([layer], descriptor), {fps: Constants.DEFAULTS.FPS});
   };
 })();

src/js/utils/serialization/backward/Deserializer_v1.js

@@ -16,7 +16,7 @@
       piskel.addLayer(layer);
     }.bind(this));
 
-    this.callback_(piskel, { fps: Constants.DEFAULTS.FPS});
+    this.callback_(piskel, {fps: Constants.DEFAULTS.FPS});
   };
 
   ns.Deserializer_v1.prototype.deserializeLayer = function (layerString) {

src/js/utils/serialization/backward/Deserializer_v2.js

@@ -13,7 +13,7 @@
     var data = this.data_;
     var piskelData = data.piskel;
     name = piskelData.name || 'Deserialized piskel';
-    description = piskelData.description || '';
+    var description = piskelData.description || '';
 
     var descriptor = new pskl.model.piskel.Descriptor(name, description);
     this.piskel_ = new pskl.model.Piskel(piskelData.width, piskelData.height, descriptor);

src/js/worker/framecolors/FrameColors.js

@@ -13,7 +13,10 @@
   };
 
   ns.FrameColors.prototype.process = function () {
-    this.worker.postMessage([pskl.utils.colorToInt(Constants.TRANSPARENT_COLOR), Constants.MAX_PALETTE_COLORS, this.pixels]);
+    this.worker.postMessage([
+      pskl.utils.colorToInt(Constants.TRANSPARENT_COLOR),
+      Constants.MAX_PALETTE_COLORS, this.pixels
+    ]);
   };
 
   ns.FrameColors.prototype.onWorkerMessage = function (event) {

src/js/worker/framecolors/FrameColorsWorker.js

@@ -52,7 +52,7 @@
       for (var i = 0, length = frame.length; i < length && colors < this.MAX_PALETTE_COLORS; i++) {
         var color = frame[i];
         if (color !== transparentColorInt) {
-         if (!frameColors[color]) {
+          if (!frameColors[color]) {
             frameColors[color] = true;
             colors++;
           }