diff --git a/js/Palette.js b/js/Palette.js index e0ff02a8..7f1ffb6c 100644 --- a/js/Palette.js +++ b/js/Palette.js @@ -36,7 +36,7 @@ pskl.Palette = (function() { * @private */ var addColorToPalette_ = function (color) { - if (paletteColors.indexOf(color) == -1) { + if (paletteColors.indexOf(color) == -1 && color != Constants.TRANSPARENT_COLOR) { var colorEl = document.createElement("li"); colorEl.className = "palette-color"; colorEl.setAttribute("data-color", color); @@ -53,10 +53,10 @@ pskl.Palette = (function() { var onPaletteColorClick_ = function (event) { var selectedColor = $(event.target).data("color"); if (event.which == 1) { // left button - updateColorPicker(selectedColor, $('#color-picker')[0]); + updateColorPicker(selectedColor, $('#color-picker')); $.publish(Events.COLOR_SELECTED, [selectedColor, true]); } else if (event.which == 3) { // right button - updateColorPicker(selectedColor, $('#secondary-color-picker')[0]); + updateColorPicker(selectedColor, $('#secondary-color-picker')); $.publish(Events.COLOR_SELECTED, [selectedColor, false]); } }; @@ -72,10 +72,10 @@ pskl.Palette = (function() { // The colorpicker can't be set to a transparent state. // We set its background to white and insert the // string "TRANSPARENT" to mimic this state: - colorPicker.color.fromString("#fff"); + colorPicker[0].color.fromString("#fff"); colorPicker.val(Constants.TRANSPARENT_COLOR); } else { - colorPicker.color.fromString(color); + colorPicker[0].color.fromString(color); } } diff --git a/js/model/Frame.js b/js/model/Frame.js index d78d7fc5..72fcdd04 100644 --- a/js/model/Frame.js +++ b/js/model/Frame.js @@ -1,85 +1,84 @@ -(function () { - var ns = $.namespace("pskl.model"); - - ns.Frame = function (pixels) { - this.pixels = pixels; - this.previousStates = [this._clonePixels()]; - this.stateIndex = 0; - }; - - ns.Frame.createEmpty = function (width, height) { - var pixels = []; //new Array(width); - for (var columnIndex=0; columnIndex < width; columnIndex++) { - var columnArray = []; - for(var heightIndex = 0; heightIndex < height; heightIndex++) { - columnArray.push(Constants.TRANSPARENT_COLOR); - } - pixels[columnIndex] = columnArray; - } - return new ns.Frame(pixels); - }; - - ns.Frame.createEmptyFromFrame = function (frame) { - return ns.Frame.createEmpty(frame.getWidth(), frame.getHeight()); - }; - - ns.Frame.prototype.clone = function () { - return new ns.Frame(this._clonePixels()); - }; - - ns.Frame.prototype._clonePixels = function () { - var pixels = []; - for (var col = 0 ; col < this.getWidth() ; col++) { - pixels[col] = this.pixels[col].slice(0 , this.getHeight()); - } - return pixels; - }; - - ns.Frame.prototype.serialize = function () { - return JSON.stringify(this.pixels); - }; - - ns.Frame.prototype.setPixel = function (col, row, color) { - this.pixels[col][row] = color; - }; - - ns.Frame.prototype.getPixel = function (col, row) { - return this.pixels[col][row]; - }; - - ns.Frame.prototype.getWidth = function () { - return this.pixels.length; - }; - - ns.Frame.prototype.getHeight = function () { - return this.pixels[0].length; - }; - - ns.Frame.prototype.containsPixel = function (col, row) { - return col >= 0 && row >= 0 && col < this.pixels.length && row < this.pixels[0].length; - }; - - ns.Frame.prototype.saveState = function () { - // remove all states past current state - this.previousStates.length = this.stateIndex + 1; - // push new state - this.previousStates.push(this._clonePixels()); - // set the stateIndex to latest saved state - this.stateIndex = this.previousStates.length - 1; - }; - - ns.Frame.prototype.loadPreviousState = function () { - if (this.stateIndex > 0) { - this.stateIndex--; - this.pixels = this.previousStates[this.stateIndex]; - } - }; - - ns.Frame.prototype.loadNextState = function () { - if (this.stateIndex < this.previousStates.length - 1) { - this.stateIndex++; - this.pixels = this.previousStates[this.stateIndex]; - } - }; - +(function () { + var ns = $.namespace("pskl.model"); + + ns.Frame = function (pixels) { + this.pixels = pixels; + this.previousStates = [this._clonePixels()]; + this.stateIndex = 0; + }; + + ns.Frame.createEmpty = function (width, height) { + var pixels = []; //new Array(width); + for (var columnIndex=0; columnIndex < width; columnIndex++) { + var columnArray = []; + for(var heightIndex = 0; heightIndex < height; heightIndex++) { + columnArray.push(Constants.TRANSPARENT_COLOR); + } + pixels[columnIndex] = columnArray; + } + return new ns.Frame(pixels); + }; + + ns.Frame.createEmptyFromFrame = function (frame) { + return ns.Frame.createEmpty(frame.getWidth(), frame.getHeight()); + }; + + ns.Frame.prototype.clone = function () { + return new ns.Frame(this._clonePixels()); + }; + + ns.Frame.prototype._clonePixels = function () { + var pixels = []; + for (var col = 0 ; col < this.getWidth() ; col++) { + pixels[col] = this.pixels[col].slice(0 , this.getHeight()); + } + return pixels; + }; + + ns.Frame.prototype.serialize = function () { + return JSON.stringify(this.pixels); + }; + + ns.Frame.prototype.setPixel = function (col, row, color) { + this.pixels[col][row] = color; + }; + + ns.Frame.prototype.getPixel = function (col, row) { + return this.pixels[col][row]; + }; + + ns.Frame.prototype.getWidth = function () { + return this.pixels.length; + }; + + ns.Frame.prototype.getHeight = function () { + return this.pixels[0].length; + }; + + ns.Frame.prototype.containsPixel = function (col, row) { + return col >= 0 && row >= 0 && col < this.pixels.length && row < this.pixels[0].length; + }; + + ns.Frame.prototype.saveState = function () { + // remove all states past current state + this.previousStates.length = this.stateIndex + 1; + // push new state + this.previousStates.push(this._clonePixels()); + // set the stateIndex to latest saved state + this.stateIndex = this.previousStates.length - 1; + }; + + ns.Frame.prototype.loadPreviousState = function () { + if (this.stateIndex > 0) { + this.stateIndex--; + this.pixels = this.previousStates[this.stateIndex]; + } + }; + + ns.Frame.prototype.loadNextState = function () { + if (this.stateIndex < this.previousStates.length - 1) { + this.stateIndex++; + this.pixels = this.previousStates[this.stateIndex]; + } + }; })(); \ No newline at end of file