mirror
/
piskel
mirror of https://github.com/piskelapp/piskel.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Added JSCS linter to enforce style conventions

This commit is contained in:
juliandescottes 2015-04-14 18:02:33 +02:00
parent 007e4d4e11
commit b480acc6a0
150 changed files with 847 additions and 848 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
Gruntfile.js
View File

@ -73,7 +73,6 @@ module.exports = function(grunt) {
},
jshint: {
options: {
indent:2,
undef : true,
latedef : true,
browser : true,
@ -209,22 +208,28 @@ module.exports = function(grunt) {
linux64: true
},
src: ['./dest/**/*', "./package.json", "!./dest/desktop/"]
},
leadingIndent : {
options: {
indentation : "spaces"
},
css : ['src/css/**/*.css']
},
jscs : {
options : {
"preset": "google",
"maximumLineLength": 120,
"requireCamelCaseOrUpperCaseIdentifiers": "ignoreProperties",
"validateQuoteMarks": { "mark": "'", "escape": true },
"disallowMultipleVarDecl": "exceptUndefined",
"disallowSpacesInAnonymousFunctionExpression": null
},
js : [ 'src/js/**/*.js' , '!src/js/lib/**/*.js' ]
}
});
grunt.config.set('leadingIndent.indentation', 'spaces');
grunt.config.set('leadingIndent.jsFiles', {
src: [
'src/js/**/*.js',
'!src/js/lib/**/*.js'
]
});
grunt.config.set('leadingIndent.cssFiles', {
src: ['src/css/**/*.css']
});
// Validate
grunt.registerTask('lint', ['leadingIndent:jsFiles', 'leadingIndent:cssFiles', 'jshint']);
grunt.registerTask('lint', ['jscs:js', 'leadingIndent:css', 'jshint']);
// karma/unit-tests task
grunt.registerTask('unit-test', ['karma']);

1
package.json
View File

@ -24,6 +24,7 @@
"grunt-contrib-watch": "0.6.1",
"grunt-express": "1.4.1",
"grunt-ghost": "1.1.0",
"grunt-jscs": "^1.6.0",
"grunt-karma": "^0.10.1",
"grunt-leading-indent": "^0.2.0",
"grunt-node-webkit-builder": "^1.0.2",

4
src/css/settings-export.css
View File

@ -23,6 +23,10 @@
float: left;
}
.png-export-preview .light-picker-background {
max-width:240px;
}
.gif-upload-status {
width: 180px;
margin-left: 5px;

3
src/css/transformations.css
View File

@ -1,3 +1,4 @@
.transformations-container .tool-icon {
float:left;
}
}

3
src/js/Constants.js
View File

@ -35,7 +35,6 @@ var Constants = {
*/
TOOL_TARGET_HIGHLIGHT_COLOR: 'rgba(255, 255, 255, 0.2)',
ZOOMED_OUT_BACKGROUND_COLOR : '#A0A0A0',
LEFT_BUTTON : 0,
@ -53,4 +52,4 @@ var Constants = {
APPENGINE_SAVE_URL : 'save',
IMAGE_SERVICE_UPLOAD_URL : 'http://piskel-imgstore-b.appspot.com/__/upload',
IMAGE_SERVICE_GET_URL : 'http://piskel-imgstore-b.appspot.com/img/'
};
};

58
src/js/Events.js
View File

@ -1,13 +1,13 @@
// TODO(grosbouddha): put under pskl namespace.
var Events = {
TOOL_SELECTED : "TOOL_SELECTED",
SELECT_TOOL : "SELECT_TOOL",
TOOL_SELECTED : 'TOOL_SELECTED',
SELECT_TOOL : 'SELECT_TOOL',
TOOL_RELEASED : "TOOL_RELEASED",
TOOL_PRESSED : "TOOL_PRESSED",
SELECT_PRIMARY_COLOR: "SELECT_PRIMARY_COLOR",
SELECT_SECONDARY_COLOR: "SELECT_SECONDARY_COLOR",
TOOL_RELEASED : 'TOOL_RELEASED',
TOOL_PRESSED : 'TOOL_PRESSED',
SELECT_PRIMARY_COLOR: 'SELECT_PRIMARY_COLOR',
SELECT_SECONDARY_COLOR: 'SELECT_SECONDARY_COLOR',
PRIMARY_COLOR_SELECTED : 'PRIMARY_COLOR_SELECTED',
SECONDARY_COLOR_SELECTED : 'SECONDARY_COLOR_SELECTED',
@ -26,43 +26,43 @@ var Events = {
* 1st argument: Name of the settings
* 2nd argument: New value
*/
USER_SETTINGS_CHANGED: "USER_SETTINGS_CHANGED",
USER_SETTINGS_CHANGED: 'USER_SETTINGS_CHANGED',
CLOSE_SETTINGS_DRAWER : "CLOSE_SETTINGS_DRAWER",
CLOSE_SETTINGS_DRAWER : 'CLOSE_SETTINGS_DRAWER',
/**
* The framesheet was reseted and is now probably drastically different.
* Number of frames, content of frames, color used for the palette may have changed.
*/
PISKEL_RESET: "PISKEL_RESET",
PISKEL_SAVE_STATE: "PISKEL_SAVE_STATE",
PISKEL_RESET: 'PISKEL_RESET',
PISKEL_SAVE_STATE: 'PISKEL_SAVE_STATE',
HISTORY_STATE_SAVED: "HISTORY_STATE_SAVED",
HISTORY_STATE_LOADED: "HISTORY_STATE_LOADED",
HISTORY_STATE_SAVED: 'HISTORY_STATE_SAVED',
HISTORY_STATE_LOADED: 'HISTORY_STATE_LOADED',
PISKEL_SAVED: "PISKEL_SAVED",
PISKEL_SAVED: 'PISKEL_SAVED',
FRAME_SIZE_CHANGED : "FRAME_SIZE_CHANGED",
FRAME_SIZE_CHANGED : 'FRAME_SIZE_CHANGED',
SELECTION_CREATED: "SELECTION_CREATED",
SELECTION_MOVE_REQUEST: "SELECTION_MOVE_REQUEST",
SELECTION_DISMISSED: "SELECTION_DISMISSED",
SELECTION_CREATED: 'SELECTION_CREATED',
SELECTION_MOVE_REQUEST: 'SELECTION_MOVE_REQUEST',
SELECTION_DISMISSED: 'SELECTION_DISMISSED',
SHOW_NOTIFICATION: "SHOW_NOTIFICATION",
HIDE_NOTIFICATION: "HIDE_NOTIFICATION",
SHOW_NOTIFICATION: 'SHOW_NOTIFICATION',
HIDE_NOTIFICATION: 'HIDE_NOTIFICATION',
SHOW_PROGRESS: "SHOW_PROGRESS",
UPDATE_PROGRESS: "UPDATE_PROGRESS",
HIDE_PROGRESS: "HIDE_PROGRESS",
SHOW_PROGRESS: 'SHOW_PROGRESS',
UPDATE_PROGRESS: 'UPDATE_PROGRESS',
HIDE_PROGRESS: 'HIDE_PROGRESS',
ZOOM_CHANGED : "ZOOM_CHANGED",
ZOOM_CHANGED : 'ZOOM_CHANGED',
CURRENT_COLORS_UPDATED : "CURRENT_COLORS_UPDATED",
CURRENT_COLORS_UPDATED : 'CURRENT_COLORS_UPDATED',
MOUSE_EVENT : "MOUSE_EVENT",
MOUSE_EVENT : 'MOUSE_EVENT',
// Tests
TEST_RECORD_END : "TEST_RECORD_END",
TEST_CASE_END : "TEST_CASE_END",
TEST_SUITE_END : "TEST_SUITE_END"
};
TEST_RECORD_END : 'TEST_RECORD_END',
TEST_CASE_END : 'TEST_CASE_END',
TEST_SUITE_END : 'TEST_SUITE_END'
};

35
src/js/app.js
View File

@ -3,7 +3,7 @@
* @require Events
*/
(function () {
var ns = $.namespace("pskl");
var ns = $.namespace('pskl');
/**
* Main application controller
*/
@ -22,7 +22,7 @@
var descriptor = new pskl.model.piskel.Descriptor('New Piskel', '');
var piskel = new pskl.model.Piskel(size.width, size.height, descriptor);
var layer = new pskl.model.Layer("Layer 1");
var layer = new pskl.model.Layer('Layer 1');
var frame = new pskl.model.Frame(size.width, size.height);
layer.addFrame(frame);
@ -44,22 +44,35 @@
this.currentColorsService = new pskl.service.CurrentColorsService(this.piskelController);
this.currentColorsService.init();
this.palettesListController = new pskl.controller.PalettesListController(this.paletteController, this.currentColorsService);
this.palettesListController = new pskl.controller.PalettesListController(
this.paletteController,
this.currentColorsService);
this.palettesListController.init();
this.cursorCoordinatesController = new pskl.controller.CursorCoordinatesController(this.piskelController);
this.cursorCoordinatesController.init();
this.drawingController = new pskl.controller.DrawingController(this.piskelController, this.paletteController, $('#drawing-canvas-container'));
this.drawingController = new pskl.controller.DrawingController(
this.piskelController,
this.paletteController,
$('#drawing-canvas-container'));
this.drawingController.init();
this.previewController = new pskl.controller.preview.PreviewController(this.piskelController, $('#animated-preview-canvas-container'));
this.previewController = new pskl.controller.preview.PreviewController(
this.piskelController,
$('#animated-preview-canvas-container'));
this.previewController.init();
this.minimapController = new pskl.controller.MinimapController(this.piskelController, this.previewController, this.drawingController, $('.minimap-container'));
this.minimapController = new pskl.controller.MinimapController(
this.piskelController,
this.previewController,
this.drawingController,
$('.minimap-container'));
this.minimapController.init();
this.framesListController = new pskl.controller.FramesListController(this.piskelController, $('#preview-list'));
this.framesListController = new pskl.controller.FramesListController(
this.piskelController,
$('#preview-list'));
this.framesListController.init();
this.layersListController = new pskl.controller.LayersListController(this.piskelController);
@ -113,7 +126,9 @@
this.beforeUnloadService = new pskl.service.BeforeUnloadService(this.piskelController);
this.beforeUnloadService.init();
this.fileDropperService = new pskl.service.FileDropperService(this.piskelController, $('#drawing-canvas-container').get(0));
this.fileDropperService = new pskl.service.FileDropperService(
this.piskelController,
document.querySelector('#drawing-canvas-container'));
this.fileDropperService.init();
if (this.isAppEngineVersion) {
@ -173,13 +188,13 @@
var canvasRenderer = new pskl.rendering.CanvasRenderer(firstFrame, 1);
canvasRenderer.drawTransparentAs('rgba(0,0,0,0)');
var firstFrameCanvas = canvasRenderer.render();
return firstFrameCanvas.toDataURL("image/png");
return firstFrameCanvas.toDataURL('image/png');
},
getFramesheetAsPng : function () {
var renderer = new pskl.rendering.PiskelRenderer(this.piskelController);
var framesheetCanvas = renderer.renderAsCanvas();
return framesheetCanvas.toDataURL("image/png");
return framesheetCanvas.toDataURL('image/png');
}
};
})();

3
src/js/controller/CanvasBackgroundController.js
View File

@ -10,7 +10,6 @@
this.updateBackgroundClass_(pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));
};
ns.CanvasBackgroundController.prototype.onUserSettingsChange_ = function (evt, settingName, settingValue) {
if (settingName == pskl.UserSettings.CANVAS_BACKGROUND) {
this.updateBackgroundClass_(settingValue);
@ -25,4 +24,4 @@
this.body.classList.add(newClass);
this.body.dataset.currentBackgroundClass = newClass;
};
})();
})();

17
src/js/controller/CursorCoordinatesController.js
View File

@ -4,8 +4,10 @@
ns.CursorCoordinatesController = function (piskelController) {
this.piskelController = piskelController;
this.origin = null;
this.coordinates = {x:-1,y:-1};
this.coordinates = {
x : -1,
y : -1
};
};
ns.CursorCoordinatesController.prototype.init = function () {
@ -31,9 +33,9 @@
if (currentFrame.containsPixel(x, y)) {
html += x + ':' + y;
if (this.origin) {
var dX = Math.abs(x-this.origin.x) + 1;
var dY = Math.abs(y-this.origin.y) + 1;
html += ' (' + dX + 'x' + dY +')';
var dX = Math.abs(x - this.origin.x) + 1;
var dY = Math.abs(y - this.origin.y) + 1;
html += ' (' + dX + 'x' + dY + ')';
}
}
@ -43,7 +45,7 @@
ns.CursorCoordinatesController.prototype.getFrameSizeHTML_ = function () {
var w = this.piskelController.getWidth();
var h = this.piskelController.getHeight();
return '['+w+'x'+h+'] ';
return '[' + w + 'x' + h + '] ';
};
ns.CursorCoordinatesController.prototype.onCursorMoved_ = function (event, x, y) {
@ -60,5 +62,4 @@
this.origin = null;
this.redraw();
};
})();
})();

58
src/js/controller/DrawingController.js
View File

@ -1,6 +1,6 @@
(function () {
var ns = $.namespace("pskl.controller");
var ns = $.namespace('pskl.controller');
ns.DrawingController = function (piskelController, paletteController, container) {
/**
@ -22,19 +22,19 @@
*/
this.container = container;
var renderingOptions = {
"zoom": this.calculateZoom_(),
"supportGridRendering" : true,
"height" : this.getContainerHeight_(),
"width" : this.getContainerWidth_(),
"xOffset" : 0,
"yOffset" : 0
var cfg = {
'zoom': this.calculateZoom_(),
'supportGridRendering' : true,
'height' : this.getContainerHeight_(),
'width' : this.getContainerWidth_(),
'xOffset' : 0,
'yOffset' : 0
};
this.overlayRenderer = new pskl.rendering.frame.CachedFrameRenderer(this.container, renderingOptions, ["canvas-overlay"]);
this.renderer = new pskl.rendering.frame.CachedFrameRenderer(this.container, renderingOptions, ["drawing-canvas"]);
this.onionSkinRenderer = pskl.rendering.OnionSkinRenderer.createInContainer(this.container, renderingOptions, piskelController);
this.layersRenderer = new pskl.rendering.layer.LayersRenderer(this.container, renderingOptions, piskelController);
this.overlayRenderer = new pskl.rendering.frame.CachedFrameRenderer(this.container, cfg, ['canvas-overlay']);
this.renderer = new pskl.rendering.frame.CachedFrameRenderer(this.container, cfg, ['drawing-canvas']);
this.onionSkinRenderer = pskl.rendering.OnionSkinRenderer.createInContainer(this.container, cfg, piskelController);
this.layersRenderer = new pskl.rendering.layer.LayersRenderer(this.container, cfg, piskelController);
this.compositeRenderer = new pskl.rendering.CompositeRenderer();
this.compositeRenderer
@ -117,7 +117,7 @@
* @private
*/
ns.DrawingController.prototype.onUserSettingsChange_ = function (evt, settingsName, settingsValue) {
if(settingsName == pskl.UserSettings.SHOW_GRID) {
if (settingsName == pskl.UserSettings.SHOW_GRID) {
console.warn('DrawingController:onUserSettingsChange_ not implemented !');
} else if (settingsName == pskl.UserSettings.ONION_SKIN || settingsName == pskl.UserSettings.LAYER_PREVIEW) {
this.onionSkinRenderer.clear();
@ -173,7 +173,7 @@
var currentTime = new Date().getTime();
// Throttling of the mousemove event:
if ((currentTime - this.previousMousemoveTime) > Constants.MOUSEMOVE_THROTTLING ) {
if ((currentTime - this.previousMousemoveTime) > Constants.MOUSEMOVE_THROTTLING) {
this.moveTool_(this._clientX, this._clientY, event);
this.previousMousemoveTime = currentTime;
}
@ -191,7 +191,7 @@
var currentFrame = this.piskelController.getCurrentFrame();
if (this.isClicked) {
if(this.currentMouseButton_ == Constants.MIDDLE_BUTTON) {
if (this.currentMouseButton_ == Constants.MIDDLE_BUTTON) {
this.dragHandler.updateDrag(x, y);
} else {
$.publish(Events.MOUSE_EVENT, [event, this]);
@ -230,7 +230,7 @@
} else if (pskl.utils.UserAgent.isFirefox) {
delta = -40 * event.deltaY;
}
var modifier = Math.abs(delta/120);
var modifier = Math.abs(delta / 120);
if (delta > 0) {
this.increaseZoom_(modifier);
} else if (delta < 0) {
@ -254,7 +254,7 @@
ns.DrawingController.prototype.onMouseup_ = function (event) {
var frame = this.piskelController.getCurrentFrame();
var coords = this.getSpriteCoordinates(event.clientX, event.clientY);
if(this.isClicked) {
if (this.isClicked) {
$.publish(Events.MOUSE_EVENT, [event, this]);
// A mouse button was clicked on the drawing canvas before this mouseup event,
// the user was probably drawing on the canvas.
@ -313,9 +313,9 @@
// on a mouse move event
// This always matches a LEFT mouse button which is __really__ not helpful
if(this.currentMouseButton_ == Constants.RIGHT_BUTTON) {
if (this.currentMouseButton_ == Constants.RIGHT_BUTTON) {
return this.paletteController.getSecondaryColor();
} else if(this.currentMouseButton_ == Constants.LEFT_BUTTON) {
} else if (this.currentMouseButton_ == Constants.LEFT_BUTTON) {
return this.paletteController.getPrimaryColor();
} else {
return Constants.DEFAULT_PEN_COLOR;
@ -357,10 +357,10 @@
* @private
*/
ns.DrawingController.prototype.calculateZoom_ = function() {
var frameHeight = this.piskelController.getCurrentFrame().getHeight(),
frameWidth = this.piskelController.getCurrentFrame().getWidth();
var frameHeight = this.piskelController.getCurrentFrame().getHeight();
var frameWidth = this.piskelController.getCurrentFrame().getWidth();
return Math.min(this.getAvailableWidth_()/frameWidth, this.getAvailableHeight_()/frameHeight);
return Math.min(this.getAvailableWidth_() / frameWidth, this.getAvailableHeight_() / frameHeight);
};
ns.DrawingController.prototype.getAvailableHeight_ = function () {
@ -368,11 +368,13 @@
};
ns.DrawingController.prototype.getAvailableWidth_ = function () {
var leftSectionWidth = $('.left-column').outerWidth(true),
rightSectionWidth = $('.right-column').outerWidth(true),
toolsContainerWidth = $('#tool-section').outerWidth(true),
settingsContainerWidth = $('#application-action-section').outerWidth(true),
availableWidth = $('#main-wrapper').width() - leftSectionWidth - rightSectionWidth - toolsContainerWidth - settingsContainerWidth;
var leftSectionWidth = $('.left-column').outerWidth(true);
var rightSectionWidth = $('.right-column').outerWidth(true);
var toolsContainerWidth = $('#tool-section').outerWidth(true);
var settingsContainerWidth = $('#application-action-section').outerWidth(true);
var usedWidth = leftSectionWidth + rightSectionWidth + toolsContainerWidth + settingsContainerWidth;
var availableWidth = $('#main-wrapper').width() - usedWidth;
var comfortMargin = 10;
return availableWidth - comfortMargin;
@ -423,4 +425,4 @@
$.publish(Events.ZOOM_CHANGED);
};
})();
})();

79
src/js/controller/FramesListController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller");
var ns = $.namespace('pskl.controller');
var ACTION = {
SELECT : 'select',
@ -9,7 +9,6 @@
};
ns.FramesListController = function (piskelController, container) {
this.piskelController = piskelController;
this.container = container;
this.refreshZoom_();
@ -54,8 +53,9 @@
var scrollTop = scroller.scrollTop();
var scrollerContentHeight = $('#preview-list').height();
var treshold = $('.top-overflow').height();
var overflowTop = false,
overflowBottom = false;
var overflowTop = false;
var overflowBottom = false;
if (scrollerHeight < scrollerContentHeight) {
if (scrollTop > treshold) {
overflowTop = true;
@ -93,57 +93,54 @@
};
ns.FramesListController.prototype.createPreviews_ = function () {
this.container.html("");
this.container.html('');
// Manually remove tooltips since mouseout events were shortcut by the DOM refresh:
$(".tooltip").remove();
$('.tooltip').remove();
var frameCount = this.piskelController.getFrameCount();
for (var i = 0, l = frameCount; i < l ; i++) {
for (var i = 0 ; i < frameCount ; i++) {
this.container.append(this.createPreviewTile_(i));
}
// Append 'new empty frame' button
var newFrameButton = document.createElement("div");
newFrameButton.id = "add-frame-action";
newFrameButton.className = "add-frame-action";
var newFrameButton = document.createElement('div');
newFrameButton.id = 'add-frame-action';
newFrameButton.className = 'add-frame-action';
newFrameButton.setAttribute('data-tile-action', ACTION.NEW_FRAME);
newFrameButton.innerHTML = "<p class='label'>Add new frame</p>";
newFrameButton.innerHTML = '<p class="label">Add new frame</p>';
this.container.append(newFrameButton);
var needDragndropBehavior = (frameCount > 1);
if(needDragndropBehavior) {
if (needDragndropBehavior) {
this.initDragndropBehavior_();
}
this.updateScrollerOverflows();
};
/**
* @private
*/
ns.FramesListController.prototype.initDragndropBehavior_ = function () {
$("#preview-list").sortable({
placeholder: "preview-tile-drop-proxy",
$('#preview-list').sortable({
placeholder: 'preview-tile-drop-proxy',
update: $.proxy(this.onUpdate_, this),
items: ".preview-tile"
items: '.preview-tile'
});
$("#preview-list").disableSelection();
$('#preview-list').disableSelection();
};
/**
* @private
*/
ns.FramesListController.prototype.onUpdate_ = function( event, ui ) {
var originFrameId = parseInt(ui.item.data("tile-number"), 10);
ns.FramesListController.prototype.onUpdate_ = function (event, ui) {
var originFrameId = parseInt(ui.item.data('tile-number'), 10);
var targetInsertionId = $('.preview-tile').index(ui.item);
this.piskelController.moveFrame(originFrameId, targetInsertionId);
this.piskelController.setCurrentFrameIndex(targetInsertionId);
};
/**
* @private
* TODO(vincz): clean this giant rendering function & remove listeners.
@ -151,16 +148,16 @@
ns.FramesListController.prototype.createPreviewTile_ = function(tileNumber) {
var currentFrame = this.piskelController.getCurrentLayer().getFrameAt(tileNumber);
var previewTileRoot = document.createElement("li");
previewTileRoot.setAttribute("data-tile-number", tileNumber);
var previewTileRoot = document.createElement('li');
previewTileRoot.setAttribute('data-tile-number', tileNumber);
previewTileRoot.setAttribute('data-tile-action', ACTION.SELECT);
previewTileRoot.classList.add("preview-tile");
previewTileRoot.classList.add('preview-tile');
if (this.piskelController.getCurrentFrame() == currentFrame) {
previewTileRoot.classList.add("selected");
previewTileRoot.classList.add('selected');
}
var canvasContainer = document.createElement("div");
canvasContainer.classList.add("canvas-container", pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));
var canvasContainer = document.createElement('div');
canvasContainer.classList.add('canvas-container', pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));
var height = this.zoom * this.piskelController.getCurrentFrame().getHeight();
var horizontalMargin = (Constants.PREVIEW_FILM_SIZE - height) / 2;
@ -171,42 +168,40 @@
canvasContainer.style.marginLeft = verticalMargin + 'px';
canvasContainer.style.marginRight = verticalMargin + 'px';
var canvasBackground = document.createElement("div");
canvasBackground.className = "canvas-background";
var canvasBackground = document.createElement('div');
canvasBackground.className = 'canvas-background';
canvasContainer.appendChild(canvasBackground);
var cloneFrameButton = document.createElement("button");
var cloneFrameButton = document.createElement('button');
cloneFrameButton.setAttribute('rel', 'tooltip');
cloneFrameButton.setAttribute('data-placement', 'right');
cloneFrameButton.setAttribute('data-tile-number', tileNumber);
cloneFrameButton.setAttribute('data-tile-action', ACTION.CLONE);
cloneFrameButton.setAttribute('title', 'Duplicate this frame');
cloneFrameButton.className = "tile-overlay duplicate-frame-action";
cloneFrameButton.className = 'tile-overlay duplicate-frame-action';
previewTileRoot.appendChild(cloneFrameButton);
canvasContainer.appendChild(this.getCanvasForFrame(currentFrame));
previewTileRoot.appendChild(canvasContainer);
if(tileNumber > 0 || this.piskelController.getFrameCount() > 1) {
if (tileNumber > 0 || this.piskelController.getFrameCount() > 1) {
// Add 'remove frame' button.
var deleteButton = document.createElement("button");
var deleteButton = document.createElement('button');
deleteButton.setAttribute('rel', 'tooltip');
deleteButton.setAttribute('data-placement', 'right');
deleteButton.setAttribute('title', 'Delete this frame');
deleteButton.setAttribute('data-tile-number', tileNumber);
deleteButton.setAttribute('data-tile-action', ACTION.DELETE);
deleteButton.className = "tile-overlay delete-frame-action";
deleteButton.className = 'tile-overlay delete-frame-action';
previewTileRoot.appendChild(deleteButton);
// Add 'dragndrop handle'.
var dndHandle = document.createElement("div");
dndHandle.className = "tile-overlay dnd-action";
var dndHandle = document.createElement('div');
dndHandle.className = 'tile-overlay dnd-action';
previewTileRoot.appendChild(dndHandle);
}
var tileCount = document.createElement("div");
tileCount.className = "tile-overlay tile-count";
var tileCount = document.createElement('div');
tileCount.className = 'tile-overlay tile-count';
tileCount.innerHTML = tileNumber + 1;
previewTileRoot.appendChild(tileCount);
@ -239,6 +234,6 @@
var frame = this.piskelController.getCurrentFrame();
var frameSize = Math.max(frame.getHeight(), frame.getWidth());
return Constants.PREVIEW_FILM_SIZE/frameSize;
return Constants.PREVIEW_FILM_SIZE / frameSize;
};
})();
})();

6
src/js/controller/LayersListController.js
View File

@ -47,7 +47,7 @@
};
ns.LayersListController.prototype.toggleButtonDisabledState_ = function (buttonAction, isDisabled) {
var button = document.querySelector('.layers-button[data-action="'+buttonAction+'"]');
var button = document.querySelector('.layers-button[data-action="' + buttonAction + '"]');
if (isDisabled) {
button.setAttribute('disabled', 'disabled');
} else {
@ -94,7 +94,7 @@
ns.LayersListController.prototype.renameCurrentLayer_ = function () {
var layer = this.piskelController.getCurrentLayer();
var name = window.prompt("Please enter the layer name", layer.getName());
var name = window.prompt('Please enter the layer name', layer.getName());
if (name) {
var index = this.piskelController.getCurrentLayerIndex();
this.piskelController.renameLayerAt(index, name);
@ -129,4 +129,4 @@
var currentValue = pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW);
pskl.UserSettings.set(pskl.UserSettings.LAYER_PREVIEW, !currentValue);
};
})();
})();

10
src/js/controller/MinimapController.js
View File

@ -49,11 +49,11 @@
// the preview is centered in a square container
// if the sprite is not a square, a margin is needed on the appropriate coordinate
// before adding the offset coming from the drawing area
var leftMargin = (containerWidth - Math.max(minimapSize.width, previewSize.width))/2;
var leftMargin = (containerWidth - Math.max(minimapSize.width, previewSize.width)) / 2;
var leftOffset = offset.x * this.previewController.getZoom();
var left = leftMargin + leftOffset;
var topMargin = (containerHeight - Math.max(minimapSize.height, previewSize.height))/2;
var topMargin = (containerHeight - Math.max(minimapSize.height, previewSize.height)) / 2;
var topOffset = offset.y * this.previewController.getZoom();
var top = topMargin + topOffset;
@ -123,8 +123,8 @@
var height = frameHeight / this.getVerticalRatio_();
return {
x : frameCoords.x - (width/2),
y : frameCoords.y - (height/2)
x : frameCoords.x - (width / 2),
y : frameCoords.y - (height / 2)
};
};
@ -145,4 +145,4 @@
return frameTotalWidth / frameDisplayWidth;
};
})();
})();

10
src/js/controller/NotificationController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller");
var ns = $.namespace('pskl.controller');
ns.NotificationController = function () {};
@ -18,10 +18,10 @@
this.removeMessage_();
var message = document.createElement('div');
message.id = "user-message";
message.className = "user-message";
message.id = 'user-message';
message.className = 'user-message';
message.innerHTML = messageInfo.content;
message.innerHTML = message.innerHTML + "<div title='Close message' class='close'>x</div>";
message.innerHTML = message.innerHTML + '<div title="Close message" class="close">x</div>';
document.body.appendChild(message);
message.querySelector('.close').addEventListener('click', this.removeMessage_.bind(this));
@ -38,7 +38,7 @@
* @private
*/
ns.NotificationController.prototype.removeMessage_ = function (evt) {
var message = $("#user-message");
var message = $('#user-message');
if (message.length) {
message.remove();
}

13
src/js/controller/PaletteController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller");
var ns = $.namespace('pskl.controller');
ns.PaletteController = function () {
this.primaryColor = Constants.DEFAULT_PEN_COLOR;
@ -50,7 +50,7 @@
*/
ns.PaletteController.prototype.onPickerChange_ = function(evt, isPrimary) {
var inputPicker = $(evt.target);
if(evt.data.isPrimary) {
if (evt.data.isPrimary) {
this.setPrimaryColor(inputPicker.val());
} else {
this.setSecondaryColor(inputPicker.val());
@ -62,7 +62,7 @@
*/
ns.PaletteController.prototype.onColorSelected_ = function(args, evt, color) {
var inputPicker = $(evt.target);
if(args.isPrimary) {
if (args.isPrimary) {
this.setPrimaryColor(color);
} else {
this.setSecondaryColor(color);
@ -114,10 +114,10 @@
// 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.spectrum("set", Constants.TRANSPARENT_COLOR);
colorPicker.spectrum('set', Constants.TRANSPARENT_COLOR);
colorPicker.val(Constants.TRANSPARENT_COLOR);
} else {
colorPicker.spectrum("set", color);
colorPicker.spectrum('set', color);
}
this.setTitleOnPicker_(color, colorPicker);
};
@ -127,6 +127,3 @@
colorPicker.next(spectrumInputSelector).attr('title', title);
};
})();

6
src/js/controller/PalettesListController.js
View File

@ -10,7 +10,6 @@
// I apologize to my future self for this one.
var NO_SCROLL_MAX_COLORS = 20;
ns.PalettesListController = function (paletteController, usedColorService) {
this.usedColorService = usedColorService;
this.paletteService = pskl.app.paletteService;
@ -39,7 +38,6 @@
$.subscribe(Events.SECONDARY_COLOR_SELECTED, this.highlightSelectedColors.bind(this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
pskl.app.shortcutService.addShortcuts(['>', 'shift+>'], this.selectNextColor_.bind(this));
pskl.app.shortcutService.addShortcut('<', this.selectPreviousColor_.bind(this));
@ -193,7 +191,7 @@
};
ns.PalettesListController.prototype.getColorContainer_ = function (color) {
return this.colorListContainer_.querySelector('.palettes-list-color[data-color="'+color+'"]');
return this.colorListContainer_.querySelector('.palettes-list-color[data-color="' + color + '"]');
};
ns.PalettesListController.prototype.removeClass_ = function (cssClass) {
@ -207,4 +205,4 @@
this.fillPaletteList();
this.updateFromUserSettings();
};
})();
})();

2
src/js/controller/ProgressBarController.js
View File

@ -58,4 +58,4 @@
this.progressBarStatus = null;
}
};
})();
})();

22
src/js/controller/ToolController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller");
var ns = $.namespace('pskl.controller');
ns.ToolController = function () {
var toDescriptor = function (id, shortcut, instance) {
@ -36,7 +36,7 @@
// Set SimplePen as default selected tool:
this.selectTool_(this.tools[0]);
// Activate listener on tool panel:
$("#tool-section").mousedown($.proxy(this.onToolIconClicked_, this));
$('#tool-section').mousedown($.proxy(this.onToolIconClicked_, this));
$.subscribe(Events.SELECT_TOOL, this.onSelectToolEvent_.bind(this));
};
@ -45,14 +45,14 @@
* @private
*/
ns.ToolController.prototype.activateToolOnStage_ = function(tool) {
var stage = $("body");
var previousSelectedToolClass = stage.data("selected-tool-class");
if(previousSelectedToolClass) {
var stage = $('body');
var previousSelectedToolClass = stage.data('selected-tool-class');
if (previousSelectedToolClass) {
stage.removeClass(previousSelectedToolClass);
stage.removeClass(pskl.tools.drawing.Move.TOOL_ID);
}
stage.addClass(tool.instance.toolId);
stage.data("selected-tool-class", tool.instance.toolId);
stage.data('selected-tool-class', tool.instance.toolId);
};
ns.ToolController.prototype.onSelectToolEvent_ = function(event, toolId) {
@ -83,9 +83,9 @@
*/
ns.ToolController.prototype.onToolIconClicked_ = function(evt) {
var target = $(evt.target);
var clickedTool = target.closest(".tool-icon");
var clickedTool = target.closest('.tool-icon');
if(clickedTool.length) {
if (clickedTool.length) {
var toolId = clickedTool.data().toolId;
var tool = this.getToolById_(toolId);
if (tool) {
@ -114,7 +114,7 @@
*/
ns.ToolController.prototype.createToolsDom_ = function() {
var html = '';
for(var i = 0 ; i < this.tools.length ; i++) {
for (var i = 0 ; i < this.tools.length ; i++) {
var tool = this.tools[i];
html += this.toolIconRenderer.render(tool.instance, tool.shortcut);
}
@ -122,8 +122,8 @@
};
ns.ToolController.prototype.addKeyboardShortcuts_ = function () {
for(var i = 0 ; i < this.tools.length ; i++) {
for (var i = 0 ; i < this.tools.length ; i++) {
pskl.app.shortcutService.addShortcut(this.tools[i].shortcut, this.onKeyboardShortcut_.bind(this));
}
};
})();
})();

3
src/js/controller/TransformationsController.js
View File

@ -23,7 +23,6 @@
this.createToolsDom_();
};
ns.TransformationsController.prototype.onTransformationClick = function (evt) {
var toolId = evt.target.dataset.toolId;
this.tools.forEach(function (tool) {
@ -39,4 +38,4 @@
}.bind(this), '');
this.toolsContainer.innerHTML = html;
};
})();
})();

4
src/js/controller/dialogs/AbstractDialogController.js
View File

@ -3,7 +3,6 @@
ns.AbstractDialogController = function () {};
ns.AbstractDialogController.prototype.init = function () {
this.closeButton = document.querySelector('.dialog-close');
this.closeButton.addEventListener('click', this.closeDialog.bind(this));
@ -22,5 +21,4 @@
dialogTitle.innerText = title;
}
};
})();
})();

8
src/js/controller/dialogs/BrowseLocalController.js
View File

@ -9,7 +9,7 @@
ns.BrowseLocalController.prototype.init = function () {
this.superclass.init.call(this);
this.localStorageItemTemplate_ = pskl.utils.Template.get("local-storage-item-template");
this.localStorageItemTemplate_ = pskl.utils.Template.get('local-storage-item-template');
this.service_ = pskl.app.localStorageService;
this.piskelList = $('.local-piskel-list');
@ -37,7 +37,7 @@
};
ns.BrowseLocalController.prototype.fillLocalPiskelsList_ = function () {
var html = "";
var html = '';
var keys = this.service_.getKeys();
keys.sort(function (k1, k2) {
@ -47,11 +47,11 @@
});
keys.forEach((function (key) {
var date = pskl.utils.DateUtils.format(key.date, "{{Y}}/{{M}}/{{D}} {{H}}:{{m}}");
var date = pskl.utils.DateUtils.format(key.date, '{{Y}}/{{M}}/{{D}} {{H}}:{{m}}');
html += pskl.utils.Template.replace(this.localStorageItemTemplate_, {name : key.name, date : date});
}).bind(this));
var tableBody_ = this.piskelList.get(0).tBodies[0];
tableBody_.innerHTML = html;
};
})();
})();

10
src/js/controller/dialogs/CreatePaletteController.js
View File

@ -101,7 +101,7 @@
pskl.utils.BlobUtils.stringToBlob(paletteAsString, function(blob) {
pskl.utils.FileUtils.downloadAsFile(blob, this.palette.name + '.gpl');
}.bind(this), "application/json");
}.bind(this), 'application/json');
};
ns.CreatePaletteController.prototype.onImportFileButtonClick_ = function () {
@ -116,12 +116,14 @@
};
ns.CreatePaletteController.prototype.displayErrorMessage_ = function (message) {
message = "Could not import palette : " + message;
$.publish(Events.SHOW_NOTIFICATION, [{"content": message}]);
message = 'Could not import palette : ' + message;
$.publish(Events.SHOW_NOTIFICATION, [{
'content' : message
}]);
window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 2000);
};
ns.CreatePaletteController.prototype.onNameInputChange_ = function (evt) {
this.palette.name = pskl.utils.escapeHtml(this.nameInput.value);
};
})();
})();

2
src/js/controller/dialogs/DialogsController.js
View File

@ -92,4 +92,4 @@
return this.currentDialog_ !== null;
};
})();
})();

13
src/js/controller/dialogs/ImportImageController.js
View File

@ -47,7 +47,8 @@
if (isNaN(value)) {
value = 0;
}
var height = this.importedImage_.height, width = this.importedImage_.width;
var height = this.importedImage_.height;
var width = this.importedImage_.width;
if (from === 'width') {
this.resizeHeight.val(Math.round(value * height / width));
} else {
@ -58,8 +59,8 @@
ns.ImportImageController.prototype.onImageLoaded_ = function (image) {
this.importedImage_ = image;
var w = this.importedImage_.width,
h = this.importedImage_.height;
var w = this.importedImage_.width;
var h = this.importedImage_.height;
// FIXME : We remove the onload callback here because JsGif will insert
// the image again and we want to avoid retriggering the image onload
@ -92,7 +93,7 @@
} else {
parts = [path];
}
return parts[parts.length-1];
return parts[parts.length - 1];
};
ns.ImportImageController.prototype.importImageToPiskel_ = function () {
@ -104,7 +105,7 @@
});
gifLoader.load({
success : function(){
success : function () {
var images = gifLoader.getFrames().map(function (frame) {
return pskl.utils.CanvasUtils.createFromImageData(frame.data);
});
@ -142,4 +143,4 @@
pskl.app.piskelController.setPiskel(piskel);
pskl.app.previewController.setFPS(Constants.DEFAULT.FPS);
};
})();
})();

2
src/js/controller/drawing/DragHandler.js
View File

@ -81,4 +81,4 @@
this.origin.x = x;
this.origin.y = y;
};
})();
})();

16
src/js/controller/piskel/PiskelController.js
View File

@ -78,7 +78,6 @@
return layer.getFrameAt(this.currentFrameIndex);
};
ns.PiskelController.prototype.getCurrentLayerIndex = function () {
return this.currentLayerIndex;
};
@ -125,7 +124,8 @@
};
ns.PiskelController.prototype.createEmptyFrame_ = function () {
var w = this.piskel.getWidth(), h = this.piskel.getHeight();
var w = this.piskel.getWidth();
var h = this.piskel.getHeight();
return new pskl.model.Frame(w, h);
};
@ -147,7 +147,7 @@
this.getLayers().forEach(function (l) {
l.duplicateFrameAt(index);
});
this.setCurrentFrameIndex(index+1);
this.setCurrentFrameIndex(index + 1);
};
ns.PiskelController.prototype.moveFrame = function (fromIndex, toIndex) {
@ -207,21 +207,21 @@
ns.PiskelController.prototype.mergeDownLayerAt = function (index) {
var layer = this.getLayerByIndex(index);
var downLayer = this.getLayerByIndex(index-1);
var downLayer = this.getLayerByIndex(index - 1);
if (layer && downLayer) {
var mergedLayer = pskl.utils.LayerUtils.mergeLayers(layer, downLayer);
this.removeLayerAt(index);
this.piskel.addLayerAt(mergedLayer, index);
this.removeLayerAt(index-1);
this.removeLayerAt(index - 1);
this.selectLayer(mergedLayer);
}
};
ns.PiskelController.prototype.generateLayerName_ = function () {
var name = "Layer " + this.layerIdCounter;
var name = 'Layer ' + this.layerIdCounter;
while (this.hasLayerForName_(name)) {
this.layerIdCounter++;
name = "Layer " + this.layerIdCounter;
name = 'Layer ' + this.layerIdCounter;
}
return name;
};
@ -277,4 +277,4 @@
ns.PiskelController.prototype.serialize = function (expanded) {
return pskl.utils.Serializer.serializePiskel(this.piskel, expanded);
};
})();
})();

2
src/js/controller/piskel/PublicPiskelController.js
View File

@ -97,4 +97,4 @@
ns.PublicPiskelController.prototype.replay = function (frame, replayData) {
replayData.fn.apply(this.piskelController, replayData.args);
};
})();
})();

3
src/js/controller/preview/PopupPreviewController.js
View File

@ -36,7 +36,6 @@
this.renderFlag = true;
};
ns.PopupPreviewController.prototype.render = function (frame) {
if (this.isOpen() && this.renderer) {
this.renderer.render(frame);
@ -83,4 +82,4 @@
this.popup.close();
}
};
})();
})();

8
src/js/controller/preview/PreviewController.js
View File

@ -142,7 +142,7 @@
if (this.fps === 0) {
return this.piskelController.getCurrentFrameIndex();
} else {
var index = Math.floor(this.elapsedTime / (1000/this.fps));
var index = Math.floor(this.elapsedTime / (1000 / this.fps));
if (!this.piskelController.hasFrameAt(index)) {
this.elapsedTime = 0;
index = 0;
@ -156,8 +156,8 @@
*/
ns.PreviewController.prototype.calculateZoom_ = function () {
var frame = this.piskelController.getCurrentFrame();
var hZoom = PREVIEW_SIZE / frame.getHeight(),
wZoom = PREVIEW_SIZE / frame.getWidth();
var hZoom = PREVIEW_SIZE / frame.getHeight();
var wZoom = PREVIEW_SIZE / frame.getWidth();
return Math.min(hZoom, wZoom);
};
@ -206,4 +206,4 @@
var currentValue = pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN);
pskl.UserSettings.set(pskl.UserSettings.ONION_SKIN, !currentValue);
};
})();
})();

4
src/js/controller/settings/AbstractSettingController.js
View File

@ -6,7 +6,6 @@
pskl.utils.Event.addEventListener(el, type, callback, this);
};
ns.AbstractSettingController.prototype.destroy = function () {
pskl.utils.Event.removeAllEventListeners(this);
this.nullifyDomReferences_();
@ -22,5 +21,4 @@
}
}
};
})();
})();

7
src/js/controller/settings/ApplicationSettingsController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller.settings");
var ns = $.namespace('pskl.controller.settings');
ns.ApplicationSettingsController = function () {};
@ -19,7 +19,7 @@
// Grid display and size
var gridWidth = pskl.UserSettings.get(pskl.UserSettings.GRID_WIDTH);
var gridSelect = document.querySelector('.grid-width-select');
var selectedOption = gridSelect.querySelector('option[value="'+gridWidth+'"]');
var selectedOption = gridSelect.querySelector('option[value="' + gridWidth + '"]');
if (selectedOption) {
selectedOption.setAttribute('selected', 'selected');
}
@ -80,5 +80,4 @@
evt.preventDefault();
$.publish(Events.CLOSE_SETTINGS_DRAWER);
};
})();
})();

5
src/js/controller/settings/ImportController.js
View File

@ -76,7 +76,7 @@
};
ns.ImportController.prototype.openPiskelFile_ = function (file) {
if (this.isPiskel_(file)){
if (this.isPiskel_(file)) {
pskl.utils.PiskelFileUtils.loadFromFile(file, function (piskel, descriptor, fps) {
piskel.setDescriptor(descriptor);
pskl.app.piskelController.setPiskel(piskel);
@ -117,5 +117,4 @@
$.publish(Events.CLOSE_SETTINGS_DRAWER);
}
};
})();
})();

14
src/js/controller/settings/SaveController.js
View File

@ -30,7 +30,7 @@
}
if (pskl.utils.Environment.detectNodeWebkit()) {
// hide "save in browser"
// hide 'save in browser'
var saveInBrowserSection = document.querySelector('#save-in-browser');
saveInBrowserSection.style.display = 'none';
}
@ -76,8 +76,8 @@
ns.SaveController.prototype.getLocalFilename_ = function () {
var piskelName = this.getName();
var timestamp = pskl.utils.DateUtils.format(this.timestamp, "{{Y}}{{M}}{{D}}-{{H}}{{m}}{{s}}");
return piskelName + "-" + timestamp + ".piskel";
var timestamp = pskl.utils.DateUtils.format(this.timestamp, '{{Y}}{{M}}{{D}}-{{H}}{{m}}{{s}}');
return piskelName + '-' + timestamp + '.piskel';
};
ns.SaveController.prototype.onSaveFormSubmit_ = function (evt) {
@ -153,7 +153,7 @@
pskl.utils.FileUtils.downloadAsFile(blob, this.getLocalFilename_());
this.onSaveSuccess_();
this.afterSaving_();
}.bind(this), "application/piskel+json");
}.bind(this), 'application/piskel+json');
};
ns.SaveController.prototype.saveFileDesktop_ = function () {
@ -191,12 +191,12 @@
ns.SaveController.prototype.onSaveSuccess_ = function () {
$.publish(Events.CLOSE_SETTINGS_DRAWER);
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Successfully saved !"}]);
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Successfully saved !'}]);
$.publish(Events.PISKEL_SAVED);
};
ns.SaveController.prototype.onSaveError_ = function (status) {
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Saving failed ("+status+")"}]);
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Saving failed (' + status + ')'}]);
};
ns.SaveController.prototype.afterOnlineSaving_ = function () {
@ -212,4 +212,4 @@
window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 5000);
};
})();
})();

7
src/js/controller/settings/SettingsController.js
View File

@ -78,7 +78,7 @@
}
this.drawerContainer.innerHTML = pskl.utils.Template.get(settings[setting].template);
this.currentSetting = setting;
this.currentController = new settings[setting].controller(this.piskelController);
this.currentController.init();
@ -86,7 +86,7 @@
this.settingsContainer.addClass(EXP_DRAWER_CLS);
$('.' + SEL_SETTING_CLS).removeClass(SEL_SETTING_CLS);
$('[data-setting='+setting+']').addClass(SEL_SETTING_CLS);
$('[data-setting=' + setting + ']').addClass(SEL_SETTING_CLS);
this.isExpanded = true;
};
@ -100,5 +100,4 @@
document.activeElement.blur();
};
})();
})();

62
src/js/controller/settings/exportimage/GifExportController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller.settings.exportimage");
var ns = $.namespace('pskl.controller.settings.exportimage');
var URL_MAX_LENGTH = 30;
var MAX_GIF_COLORS = 256;
@ -26,17 +26,17 @@
}
ns.GifExportController.prototype.init = function () {
this.optionTemplate_ = pskl.utils.Template.get("gif-export-option-template");
this.optionTemplate_ = pskl.utils.Template.get('gif-export-option-template');
this.uploadStatusContainerEl = document.querySelector(".gif-upload-status");
this.uploadStatusContainerEl = document.querySelector('.gif-upload-status');
this.previewContainerEl = document.querySelector(".gif-export-preview");
this.selectResolutionEl = document.querySelector(".gif-export-select-resolution");
this.previewContainerEl = document.querySelector('.gif-export-preview');
this.selectResolutionEl = document.querySelector('.gif-export-select-resolution');
this.uploadButton = document.querySelector(".gif-upload-button");
this.uploadButton = document.querySelector('.gif-upload-button');
this.addEventListener(this.uploadButton, 'click', this.onUploadButtonClick_);
this.downloadButton = document.querySelector(".gif-download-button");
this.downloadButton = document.querySelector('.gif-download-button');
this.addEventListener(this.downloadButton, 'click', this.onDownloadButtonClick_);
this.createOptionElements_();
@ -44,50 +44,52 @@
ns.GifExportController.prototype.onUploadButtonClick_ = function (evt) {
evt.preventDefault();
var zoom = this.getSelectedZoom_(),
fps = this.piskelController.getFPS();
var zoom = this.getSelectedZoom_();
var fps = this.piskelController.getFPS();
this.renderAsImageDataAnimatedGIF(zoom, fps, this.uploadImageData_.bind(this));
};
ns.GifExportController.prototype.onDownloadButtonClick_ = function (evt) {
var zoom = this.getSelectedZoom_(),
fps = this.piskelController.getFPS();
var zoom = this.getSelectedZoom_();
var fps = this.piskelController.getFPS();
this.renderAsImageDataAnimatedGIF(zoom, fps, this.downloadImageData_.bind(this));
};
ns.GifExportController.prototype.downloadImageData_ = function (imageData) {
var fileName = this.piskelController.getPiskel().getDescriptor().name + '.gif';
pskl.utils.BlobUtils.dataToBlob(imageData, "image/gif", function(blob) {
pskl.utils.BlobUtils.dataToBlob(imageData, 'image/gif', function(blob) {
pskl.utils.FileUtils.downloadAsFile(blob, fileName);
});
};
ns.GifExportController.prototype.uploadImageData_ = function (imageData) {
this.updatePreview_(imageData);
this.previewContainerEl.classList.add("preview-upload-ongoing");
this.previewContainerEl.classList.add('preview-upload-ongoing');
pskl.app.imageUploadService.upload(imageData, this.onImageUploadCompleted_.bind(this), this.onImageUploadFailed_.bind(this));
pskl.app.imageUploadService.upload(imageData,
this.onImageUploadCompleted_.bind(this),
this.onImageUploadFailed_.bind(this));
};
ns.GifExportController.prototype.onImageUploadCompleted_ = function (imageUrl) {
this.updatePreview_(imageUrl);
this.updateStatus_(imageUrl);
this.previewContainerEl.classList.remove("preview-upload-ongoing");
this.previewContainerEl.classList.remove('preview-upload-ongoing');
};
ns.GifExportController.prototype.onImageUploadFailed_ = function (event, xhr) {
if (xhr.status === 500) {
$.publish(Events.SHOW_NOTIFICATION, [{
"content": "Upload failed : " + xhr.responseText,
"hideDelay" : 5000
'content': 'Upload failed : ' + xhr.responseText,
'hideDelay' : 5000
}]);
}
};
ns.GifExportController.prototype.updatePreview_ = function (src) {
this.previewContainerEl.innerHTML = "<div><img style='max-width:32px;' src='"+src+"'/></div>";
this.previewContainerEl.innerHTML = '<div><img style="max-width:32px;"src="' + src + '"/></div>';
};
ns.GifExportController.prototype.getSelectedZoom_ = function () {
@ -104,15 +106,17 @@
ns.GifExportController.prototype.createOptionForResolution_ = function (resolution) {
var zoom = resolution.zoom;
var label = zoom*this.piskelController.getWidth() + "x" + zoom*this.piskelController.getHeight();
var value = zoom;
var label = zoom * this.piskelController.getWidth() + 'x' + zoom * this.piskelController.getHeight();
var isSelected = zoom === DEFAULT_EXPORT_ZOOM;
var selected = isSelected ? 'selected' : '';
var optionHTML = pskl.utils.Template.replace(this.optionTemplate_, {value : value, label : label, selected : selected});
var optionEl = pskl.utils.Template.createFromHTML(optionHTML);
var optionHTML = pskl.utils.Template.replace(this.optionTemplate_, {
'value' : zoom,
'label' : label,
'selected' : selected
});
return optionEl;
return pskl.utils.Template.createFromHTML(optionHTML);
};
ns.GifExportController.prototype.renderAsImageDataAnimatedGIF = function(zoom, fps, cb) {
@ -130,7 +134,7 @@
transparent : parseInt(transparentColor.substring(1), 16)
});
for (var i = 0; i < this.piskelController.getFrameCount(); i++) {
for (var i = 0 ; i < this.piskelController.getFrameCount() ; i++) {
var frame = this.piskelController.getFrameAt(i);
var canvasRenderer = new pskl.rendering.CanvasRenderer(frame, zoom);
canvasRenderer.drawTransparentAs(transparentColor);
@ -140,9 +144,9 @@
});
}
$.publish(Events.SHOW_PROGRESS, [{"name": 'Building animated GIF ...'}]);
$.publish(Events.SHOW_PROGRESS, [{'name': 'Building animated GIF ...'}]);
gif.on('progress', function(percentage) {
$.publish(Events.UPDATE_PROGRESS, [{"progress": (percentage*100).toFixed(1)}]);
$.publish(Events.UPDATE_PROGRESS, [{'progress': (percentage * 100).toFixed(1)}]);
}.bind(this));
gif.on('finished', function(blob) {
@ -167,7 +171,7 @@
// FIXME : JD : HORRIBLE COPY/PASTA (JD later : where???)
ns.GifExportController.prototype.updateStatus_ = function (imageUrl, error) {
if (imageUrl) {
var linkTpl = "<a class='image-link' href='{{link}}' target='_blank'>{{shortLink}}</a>";
var linkTpl = '<a class="image-link" href="{{link}}" target="_blank">{{shortLink}}</a>';
var linkHtml = pskl.utils.Template.replace(linkTpl, {
link : imageUrl,
shortLink : this.shorten_(imageUrl, URL_MAX_LENGTH, '...')
@ -180,11 +184,11 @@
ns.GifExportController.prototype.shorten_ = function (url, maxLength, suffix) {
if (url.length > maxLength) {
var index = Math.round((maxLength-suffix.length) / 2);
var index = Math.round((maxLength - suffix.length) / 2);
var part1 = url.substring(0, index);
var part2 = url.substring(url.length - index, url.length);
url = part1 + suffix + part2;
}
return url;
};
})();
})();

4
src/js/controller/settings/exportimage/ImageExportController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller.settings.exportimage");
var ns = $.namespace('pskl.controller.settings.exportimage');
ns.ImageExportController = function (piskelController) {
this.piskelController = piskelController;
@ -11,4 +11,4 @@
this.pngExportController.init();
this.gifExportController.init();
};
})();
})();

21
src/js/controller/settings/exportimage/PngExportController.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.controller.settings.exportimage");
var ns = $.namespace('pskl.controller.settings.exportimage');
var URL_MAX_LENGTH = 60;
@ -14,13 +14,13 @@
this.pngFilePrefixInput = document.getElementById('zip-prefix-name');
this.pngFilePrefixInput.value = 'sprite_';
var downloadButton = document.querySelector(".png-download-button");
var downloadButton = document.querySelector('.png-download-button');
this.addEventListener(downloadButton, 'click', this.onPngDownloadButtonClick_);
var zipButton = document.querySelector(".zip-generate-button");
var zipButton = document.querySelector('.zip-generate-button');
this.addEventListener(zipButton, 'click', this.onZipButtonClick_);
this.updatePreview_(this.getFramesheetAsCanvas().toDataURL("image/png"));
this.updatePreview_(this.getFramesheetAsCanvas().toDataURL('image/png'));
};
ns.PngExportController.prototype.onPngDownloadButtonClick_ = function (evt) {
@ -37,13 +37,16 @@
var frame = this.piskelController.getFrameAt(i);
var canvas = this.getFrameAsCanvas_(frame);
var basename = this.pngFilePrefixInput.value;
var filename = basename + (i+1) + ".png";
var filename = basename + (i + 1) + '.png';
zip.file(filename, pskl.utils.CanvasUtils.getBase64FromCanvas(canvas) + '\n', {base64: true});
}
var fileName = this.getPiskelName_() + '.zip';
var blob = zip.generate({type:"blob"});
var blob = zip.generate({
type : 'blob'
});
pskl.utils.FileUtils.downloadAsFile(blob, fileName);
};
@ -65,12 +68,12 @@
ns.PngExportController.prototype.onImageUploadCompleted_ = function (imageUrl) {
this.updatePreview_(imageUrl);
this.updateStatus_(imageUrl);
this.previewContainerEl.classList.remove("preview-upload-ongoing");
this.previewContainerEl.classList.remove('preview-upload-ongoing');
};
ns.PngExportController.prototype.updateStatus_ = function (imageUrl, error) {
if (imageUrl) {
var linkTpl = "<a class='image-link' href='{{link}}' target='_blank'>{{shortLink}}</a>";
var linkTpl = '<a class="image-link" href="{{link}}" target="_blank">{{shortLink}}</a>';
var linkHtml = pskl.utils.Template.replace(linkTpl, {
link : imageUrl,
shortLink : this.shorten_(imageUrl, URL_MAX_LENGTH, '...')
@ -82,7 +85,7 @@
};
ns.PngExportController.prototype.updatePreview_ = function (src) {
this.previewContainerEl.innerHTML = "<img class='light-picker-background' style='max-width:240px;' src='"+src+"'/>";
this.previewContainerEl.innerHTML = '<img class="light-picker-background" src="' + src + '"/>';
};
ns.PngExportController.prototype.shorten_ = function (url, maxLength, suffix) {

8
src/js/controller/settings/resize/AnchorWidget.js
View File

@ -35,12 +35,12 @@
ns.AnchorWidget.prototype.setOrigin = function (origin) {
this.origin = origin;
var previous = document.querySelector('.'+OPTION_CLASSNAME+'.selected');
var previous = document.querySelector('.' + OPTION_CLASSNAME + '.selected');
if (previous) {
previous.classList.remove('selected');
}
var selected = document.querySelector('.'+OPTION_CLASSNAME+'[data-origin="' + origin + '"]');
var selected = document.querySelector('.' + OPTION_CLASSNAME + '[data-origin="' + origin + '"]');
if (selected) {
selected.classList.add('selected');
this.refreshNeighbors_(selected);
@ -64,7 +64,7 @@
};
ns.AnchorWidget.prototype.refreshNeighbors_ = function (selected) {
var options = document.querySelectorAll('.'+OPTION_CLASSNAME);
var options = document.querySelectorAll('.' + OPTION_CLASSNAME);
for (var i = 0 ; i < options.length ; i++) {
options[i].removeAttribute('data-neighbor');
}
@ -84,4 +84,4 @@
el.setAttribute('data-neighbor', neighborhood);
}
};
})();
})();

2
src/js/controller/settings/resize/DefaultSizeController.js
View File

@ -44,4 +44,4 @@
}
return value;
};
})();
})();

17
src/js/controller/settings/resize/ResizeController.js
View File

@ -53,11 +53,10 @@
// propagate savepath to new Piskel
piskel.savePath = pskl.app.piskelController.getSavePath();
pskl.app.piskelController.setPiskel(piskel, true);
$.publish(Events.CLOSE_SETTINGS_DRAWER);
};
ns.ResizeController.prototype.resizeLayer_ = function (layer) {
var resizedFrames = layer.getFrames().map(this.resizeFrame_.bind(this));
return pskl.model.Layer.fromFrames(layer.getName(), resizedFrames);
@ -98,13 +97,13 @@
value = 0;
}
var height = this.piskelController.getHeight(),
width = this.piskelController.getWidth();
var height = this.piskelController.getHeight();
var width = this.piskelController.getWidth();
if (sizeInput === this.widthInput) {
this.heightInput.value = Math.round(value * height/width);
this.heightInput.value = Math.round(value * height / width);
} else if (sizeInput === this.heightInput) {
this.widthInput.value = Math.round(value * width/height);
this.widthInput.value = Math.round(value * width / height);
}
};
@ -144,7 +143,7 @@
} else if (origin.indexOf('RIGHT') != -1) {
return x - (width - resizedWidth);
} else {
return x - Math.round((width - resizedWidth)/2);
return x - Math.round((width - resizedWidth) / 2);
}
};
@ -155,7 +154,7 @@
} else if (origin.indexOf('BOTTOM') != -1) {
return y - (height - resizedHeight);
} else {
return y - Math.round((height - resizedHeight)/2);
return y - Math.round((height - resizedHeight) / 2);
}
};
})();
})();

10
src/js/devtools/DrawingTestPlayer.js
View File

@ -33,7 +33,7 @@
ns.DrawingTestPlayer.prototype.createPiskel_ = function (width, height) {
var descriptor = new pskl.model.piskel.Descriptor('TestPiskel', '');
var piskel = new pskl.model.Piskel(width, height, descriptor);
var layer = new pskl.model.Layer("Layer 1");
var layer = new pskl.model.Layer('Layer 1');
var frame = new pskl.model.Frame(width, height);
layer.addFrame(frame);
@ -88,8 +88,8 @@
this.playInstrumentedEvent_(recordEvent);
}
if (this.events[index+1]) {
this.playEvent_(index+1);
if (this.events[index + 1]) {
this.playEvent_(index + 1);
} else {
this.onTestEnd_();
}
@ -102,7 +102,7 @@
event.clientX = screenCoordinates.x;
event.clientY = screenCoordinates.y;
if (pskl.utils.UserAgent.isMac && event.ctrlKey) {
event.metaKey = true;
event.metaKey = true;
}
if (event.type == 'mousedown') {
@ -148,4 +148,4 @@
this.callbacks.push(callback);
};
})();
})();

4
src/js/devtools/DrawingTestRecorder.js
View File

@ -105,11 +105,11 @@
ns.DrawingTestRecorder.prototype.recordMouseEvent_ = function (mouseEvent) {
var coords = pskl.app.drawingController.getSpriteCoordinates(mouseEvent.clientX, mouseEvent.clientY);
var recordEvent = new ns.MouseEvent(mouseEvent, coords);
var lastEvent = this.events[this.events.length-1];
var lastEvent = this.events[this.events.length - 1];
if (!recordEvent.equals(lastEvent)) {
this.events.push(recordEvent);
}
};
})();
})();

5
src/js/devtools/DrawingTestRunner.js
View File

@ -18,8 +18,7 @@
var testResult = document.createElement('div');
testResult.id = 'drawing-test-result';
testResult.setAttribute('data-test-name', this.testName);
testResult.innerHTML = success ? 'OK' : ('KO:'+png);
testResult.innerHTML = success ? 'OK' : ('KO:' + png);
document.body.appendChild(testResult);
};
})();
})();

4
src/js/devtools/DrawingTestSuiteController.js
View File

@ -60,7 +60,7 @@
ns.DrawingTestSuiteController.prototype.onTestSuiteEnd_ = function (evt, status) {
console.log('on test suite end');
var elapsed = Date.now() - this.startTime_;
elapsed = (elapsed/1000).toFixed(4);
elapsed = (elapsed / 1000).toFixed(4);
var testSuiteStatus = document.createElement('li');
testSuiteStatus.innerHTML = pskl.utils.Template.replace(
@ -74,4 +74,4 @@
// keep only the part after the last '/'
return path.replace(/^.*\/([^\/]+.json$)/, '$1');
};
})();
})();

2
src/js/devtools/DrawingTestSuiteRunner.js
View File

@ -60,4 +60,4 @@
this.status = success ? ns.DrawingTestSuiteRunner.STATUS.SUCCESS : ns.DrawingTestSuiteRunner.STATUS.ERROR;
$.publish(Events.TEST_SUITE_END, [this.status]);
};
})();
})();

3
src/js/devtools/MouseEvent.js
View File

@ -22,5 +22,4 @@
return false;
}
};
})();
})();

14
src/js/devtools/TestRecordController.js
View File

@ -27,7 +27,7 @@
var stopInput = document.createElement('button');
stopInput.innerHTML = 'Stop record';
stopInput.addEventListener('click', this.onStopInputClick_.bind(this));
stopInput.setAttribute('disabled','disabled');
stopInput.setAttribute('disabled', 'disabled');
this.container = container;
this.fileInput = this.container.appendChild(fileInput);
@ -43,9 +43,9 @@
ns.TestRecordController.prototype.onFileInputChange_ = function () {
var files = this.fileInput.files;
if (files.length == 1) {
var file =files[0];
var file = files[0];
pskl.utils.FileUtils.readFile(file, function (content) {
var testRecord = JSON.parse(window.atob(content.replace(/data\:.*?\;base64\,/,'')));
var testRecord = JSON.parse(window.atob(content.replace(/data\:.*?\;base64\,/, '')));
var testPlayer = new ns.DrawingTestPlayer(testRecord);
testPlayer.start();
}.bind(this));
@ -54,7 +54,7 @@
ns.TestRecordController.prototype.onStartInputClick_ = function () {
this.testRecorder.startRecord();
this.startInput.setAttribute('disabled','disabled');
this.startInput.setAttribute('disabled', 'disabled');
this.stopInput.removeAttribute('disabled');
};
@ -63,14 +63,14 @@
pskl.utils.BlobUtils.stringToBlob(testRecord, function(blob) {
pskl.utils.FileUtils.downloadAsFile(blob, 'record_piskel.json');
}.bind(this), "application/json");
}.bind(this), 'application/json');
this.startInput.removeAttribute('disabled');
this.stopInput.setAttribute('disabled','disabled');
this.stopInput.setAttribute('disabled', 'disabled');
};
ns.TestRecordController.prototype.onTestRecordEnd_ = function (evt, success) {
window.alert('Test finished : ', success);
};
})();
})();

2
src/js/devtools/init.js
View File

@ -31,4 +31,4 @@
}
};
})();
})();

13
src/js/model/Frame.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.model");
var ns = $.namespace('pskl.model');
var __idCounter = 0;
ns.Frame = function (width, height) {
if (width && height) {
@ -16,7 +16,8 @@
ns.Frame.fromPixelGrid = function (pixels) {
if (pixels.length && pixels[0].length) {
var w = pixels.length, h = pixels[0].length;
var w = pixels.length;
var h = pixels[0].length;
var frame = new pskl.model.Frame(w, h);
frame.setPixels(pixels);
return frame;
@ -26,10 +27,10 @@
};
ns.Frame.createEmptyPixelGrid_ = function (width, height) {
var pixels = []; //new Array(width);
for (var columnIndex=0; columnIndex < width; columnIndex++) {
var pixels = [];
for (var columnIndex = 0 ; columnIndex < width ; columnIndex++) {
var columnArray = [];
for(var heightIndex = 0; heightIndex < height; heightIndex++) {
for (var heightIndex = 0 ; heightIndex < height ; heightIndex++) {
columnArray.push(Constants.TRANSPARENT_COLOR);
}
pixels[columnIndex] = columnArray;
@ -126,4 +127,4 @@
ns.Frame.prototype.isSameSize = function (otherFrame) {
return this.getHeight() == otherFrame.getHeight() && this.getWidth() == otherFrame.getWidth();
};
})();
})();

2
src/js/model/Layer.js
View File

@ -100,4 +100,4 @@
return frame.getHash();
}).join('-');
};
})();
})();

2
src/js/model/Palette.js
View File

@ -43,4 +43,4 @@
ns.Palette.prototype.move = function (oldIndex, newIndex) {
this.colors.splice(newIndex, 0, this.colors.splice(oldIndex, 1)[0]);
};
})();
})();

14
src/js/model/Piskel.js
View File

@ -25,7 +25,7 @@
this.savePath = null;
} else {
throw 'Missing arguments in Piskel constructor : ' + Array.prototype.join.call(arguments, ",");
throw 'Missing arguments in Piskel constructor : ' + Array.prototype.join.call(arguments, ',');
}
};
@ -83,17 +83,17 @@
ns.Piskel.prototype.moveLayerUp = function (layer) {
var index = this.layers.indexOf(layer);
if (index > -1 && index < this.layers.length-1) {
this.layers[index] = this.layers[index+1];
this.layers[index+1] = layer;
if (index > -1 && index < this.layers.length - 1) {
this.layers[index] = this.layers[index + 1];
this.layers[index + 1] = layer;
}
};
ns.Piskel.prototype.moveLayerDown = function (layer) {
var index = this.layers.indexOf(layer);
if (index > 0) {
this.layers[index] = this.layers[index-1];
this.layers[index-1] = layer;
this.layers[index] = this.layers[index - 1];
this.layers[index - 1] = layer;
}
};
@ -123,4 +123,4 @@
}).join('-');
};
})();
})();

9
src/js/model/frame/CachedFrameProcessor.js
View File

@ -1,8 +1,8 @@
(function () {
var ns = $.namespace('pskl.model.frame');
var DEFAULT_CLEAR_INTERVAL = 10 * 60 *1000;
// 10 * 60 * 1000 = 10 minutes
var DEFAULT_CLEAR_INTERVAL = 10 * 60 * 1000;
var DEFAULT_FRAME_PROCESSOR = function (frame) {
return pskl.utils.FrameUtils.toImage(frame);
@ -46,7 +46,8 @@
/**
* Retrieve the processed frame from the cache, in the (optional) namespace
* If the first level cache is empty, attempt to clone it from 2nd level cache. If second level cache is empty process the frame.
* If the first level cache is empty, attempt to clone it from 2nd level cache.
* If second level cache is empty process the frame.
* @param {pskl.model.Frame} frame
* @param {String} namespace
* @return {Object} the processed frame
@ -77,4 +78,4 @@
}
return processedFrame;
};
})();
})();

2
src/js/model/piskel/Descriptor.js
View File

@ -6,4 +6,4 @@
this.description = description;
this.isPublic = isPublic;
};
})();
})();

2
src/js/rendering/AbstractRenderer.js
View File

@ -19,4 +19,4 @@
ns.AbstractRenderer.prototype.setDisplaySize = Constants.ABSTRACT_FUNCTION;
ns.AbstractRenderer.prototype.getDisplaySize = Constants.ABSTRACT_FUNCTION;
})();
})();

14
src/js/rendering/CanvasRenderer.js
View File

@ -1,6 +1,6 @@
(function () {
var ns = $.namespace("pskl.rendering");
var ns = $.namespace('pskl.rendering');
ns.CanvasRenderer = function (frame, zoom) {
this.frame = frame;
this.zoom = zoom;
@ -20,11 +20,11 @@
var canvas = this.createCanvas_();
var context = canvas.getContext('2d');
for(var x = 0, width = this.frame.getWidth(); x < width; x++) {
for(var y = 0, height = this.frame.getHeight(); y < height; y++) {
for (var x = 0, width = this.frame.getWidth(); x < width; x++) {
for (var y = 0, height = this.frame.getHeight(); y < height; y++) {
var color = this.frame.getPixel(x, y);
var w = 1;
while (color === this.frame.getPixel(x, y+w)) {
while (color === this.frame.getPixel(x, y + w)) {
w++;
}
this.renderLine_(color, x, y, w, context);
@ -42,7 +42,7 @@
};
ns.CanvasRenderer.prototype.renderPixel_ = function (color, x, y, context) {
if(color == Constants.TRANSPARENT_COLOR) {
if (color == Constants.TRANSPARENT_COLOR) {
color = this.transparentColor_;
}
context.fillStyle = color;
@ -50,7 +50,7 @@
};
ns.CanvasRenderer.prototype.renderLine_ = function (color, x, y, width, context) {
if(color == Constants.TRANSPARENT_COLOR) {
if (color == Constants.TRANSPARENT_COLOR) {
color = this.transparentColor_;
}
context.fillStyle = color;
@ -63,4 +63,4 @@
var height = this.frame.getHeight() * zoom;
return pskl.utils.CanvasUtils.createCanvas(width, height);
};
})();
})();

2
src/js/rendering/CompositeRenderer.js
View File

@ -65,4 +65,4 @@
throw 'Renderer manager is empty';
}
};
})();
})();

6
src/js/rendering/DrawingLoop.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.rendering");
var ns = $.namespace('pskl.rendering');
ns.DrawingLoop = function () {
this.requestAnimationFrame = this.getRequestAnimationFrameShim_();
@ -54,8 +54,8 @@
window.mozRequestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function (callback) { window.setTimeout(callback, 1000/60); };
function (callback) { window.setTimeout(callback, 1000 / 60); };
return requestAnimationFrame;
};
})();
})();

5
src/js/rendering/FramesheetRenderer.js
View File

@ -25,7 +25,7 @@
ns.FramesheetRenderer.prototype.drawFrameInCanvas_ = function (frame, canvas, offsetWidth, offsetHeight) {
var context = canvas.getContext('2d');
frame.forEachPixel(function (color, x, y) {
if(color != Constants.TRANSPARENT_COLOR) {
if (color != Constants.TRANSPARENT_COLOR) {
context.fillStyle = color;
context.fillRect(x + offsetWidth, y + offsetHeight, 1, 1);
}
@ -39,5 +39,4 @@
var height = sampleFrame.getHeight();
return pskl.utils.CanvasUtils.createCanvas(width, height);
};
})();
})();

4
src/js/rendering/OnionSkinRenderer.js
View File

@ -34,7 +34,7 @@
ns.OnionSkinRenderer.prototype.getOnionFrames_ = function () {
var frames = [];
var currentFrameIndex = this.piskelController.getCurrentFrameIndex();
var layer = this.piskelController.getCurrentLayer();
@ -87,4 +87,4 @@
ns.OnionSkinRenderer.prototype.flush = function () {
this.hash = '';
};
})();
})();

4
src/js/rendering/PiskelRenderer.js
View File

@ -1,6 +1,6 @@
(function () {
var ns = $.namespace("pskl.rendering");
var ns = $.namespace('pskl.rendering');
ns.PiskelRenderer = function (piskelController) {
var frames = [];
@ -11,4 +11,4 @@
};
pskl.utils.inherit(ns.PiskelRenderer, ns.FramesheetRenderer);
})();
})();

46
src/js/rendering/frame/FrameRenderer.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.rendering.frame");
var ns = $.namespace('pskl.rendering.frame');
/**
* FrameRenderer will display a given frame inside a canvas element.
@ -15,11 +15,11 @@
renderingOptions = $.extend(true, {}, this.defaultRenderingOptions, renderingOptions);
if(container === undefined) {
if (container === undefined) {
throw 'Bad FrameRenderer initialization. <container> undefined.';
}
if(isNaN(renderingOptions.zoom)) {
if (isNaN(renderingOptions.zoom)) {
throw 'Bad FrameRenderer initialization. <zoom> not well defined.';
}
@ -77,14 +77,14 @@
ns.FrameRenderer.prototype.setZoom = function (zoom) {
if (zoom > Constants.MINIMUM_ZOOM) {
// back up center coordinates
var centerX = this.offset.x + (this.displayWidth/(2*this.zoom));
var centerY = this.offset.y + (this.displayHeight/(2*this.zoom));
var centerX = this.offset.x + (this.displayWidth / (2 * this.zoom));
var centerY = this.offset.y + (this.displayHeight / (2 * this.zoom));
this.zoom = zoom;
// recenter
this.setOffset(
centerX - (this.displayWidth/(2*this.zoom)),
centerY - (this.displayHeight/(2*this.zoom))
centerX - (this.displayWidth / (2 * this.zoom)),
centerY - (this.displayHeight / (2 * this.zoom))
);
}
};
@ -120,9 +120,9 @@
ns.FrameRenderer.prototype.setOffset = function (x, y) {
var width = pskl.app.piskelController.getWidth();
var height = pskl.app.piskelController.getHeight();
var maxX = width - (this.displayWidth/this.zoom);
var maxX = width - (this.displayWidth / this.zoom);
x = pskl.utils.Math.minmax(x, 0, maxX);
var maxY = height - (this.displayHeight/this.zoom);
var maxY = height - (this.displayHeight / this.zoom);
y = pskl.utils.Math.minmax(y, 0, maxY);
this.offset.x = x;
@ -206,8 +206,8 @@
y = y + containerOffset.top;
return {
x : x + (cellSize/2),
y : y + (cellSize/2)
x : x + (cellSize / 2),
y : y + (cellSize / 2)
};
};
@ -220,11 +220,11 @@
}
var context = this.canvas.getContext('2d');
for(var x = 0, width = frame.getWidth(); x < width; x++) {
for(var y = 0, height = frame.getHeight(); y < height; y++) {
for (var x = 0, width = frame.getWidth() ; x < width ; x++) {
for (var y = 0, height = frame.getHeight() ; y < height ; y++) {
var color = frame.getPixel(x, y);
var w = 1;
while (color === frame.getPixel(x, y+w)) {
while (color === frame.getPixel(x, y + w)) {
w++;
}
this.renderLine_(color, x, y, w, context);
@ -237,17 +237,19 @@
var displayContext = this.displayCanvas.getContext('2d');
displayContext.save();
if (this.canvas.width*this.zoom < this.displayCanvas.width || this.canvas.height*this.zoom < this.displayCanvas.height) {
var smallerHeight = this.canvas.height * this.zoom < this.displayCanvas.height;
var smallerWidth = this.canvas.width * this.zoom < this.displayCanvas.width;
if (smallerHeight || smallerWidth) {
displayContext.fillStyle = Constants.ZOOMED_OUT_BACKGROUND_COLOR;
displayContext.fillRect(0,0,this.displayCanvas.width - 1, this.displayCanvas.height - 1);
displayContext.fillRect(0, 0, this.displayCanvas.width - 1, this.displayCanvas.height - 1);
}
displayContext.translate(
this.margin.x-this.offset.x*this.zoom,
this.margin.y-this.offset.y*this.zoom
this.margin.x - this.offset.x * this.zoom,
this.margin.y - this.offset.y * this.zoom
);
displayContext.clearRect(0, 0, this.canvas.width*this.zoom, this.canvas.height*this.zoom);
displayContext.clearRect(0, 0, this.canvas.width * this.zoom, this.canvas.height * this.zoom);
var isIE10 = pskl.utils.UserAgent.isIE && pskl.utils.UserAgent.version === 10;
@ -264,16 +266,16 @@
};
ns.FrameRenderer.prototype.renderPixel_ = function (color, x, y, context) {
if(color != Constants.TRANSPARENT_COLOR) {
if (color != Constants.TRANSPARENT_COLOR) {
context.fillStyle = color;
context.fillRect(x, y, 1, 1);
}
};
ns.FrameRenderer.prototype.renderLine_ = function (color, x, y, width, context) {
if(color != Constants.TRANSPARENT_COLOR) {
if (color != Constants.TRANSPARENT_COLOR) {
context.fillStyle = color;
context.fillRect(x, y, 1, width);
}
};
})();
})();

2
src/js/rendering/frame/TiledFrameRenderer.js
View File

@ -38,4 +38,4 @@
ns.TiledFrameRenderer.prototype.getZoom = function () {
return this.zoom;
};
})();
})();

11
src/js/rendering/layer/LayersRenderer.js
View File

@ -7,8 +7,11 @@
this.piskelController = piskelController;
// Do not use CachedFrameRenderers here, since the caching will be performed in the render method of LayersRenderer
this.belowRenderer = new pskl.rendering.frame.FrameRenderer(container, renderingOptions, ["layers-canvas", "layers-below-canvas"]);
this.aboveRenderer = new pskl.rendering.frame.FrameRenderer(container, renderingOptions, ["layers-canvas", "layers-above-canvas"]);
this.belowRenderer = new pskl.rendering.frame.FrameRenderer(container, renderingOptions,
['layers-canvas', 'layers-below-canvas']);
this.aboveRenderer = new pskl.rendering.frame.FrameRenderer(container, renderingOptions,
['layers-canvas', 'layers-above-canvas']);
this.add(this.belowRenderer);
this.add(this.aboveRenderer);
@ -30,7 +33,6 @@
var downLayers = layers.slice(0, currentLayerIndex);
var upLayers = layers.slice(currentLayerIndex + 1, layers.length);
var serializedRendering = [
this.getZoom(),
this.getGridWidth(),
@ -41,8 +43,7 @@
this.getHashForLayersAt_(currentFrameIndex, downLayers),
this.getHashForLayersAt_(currentFrameIndex, upLayers),
layers.length
].join("-");
].join('-');
if (this.serializedRendering != serializedRendering) {
this.serializedRendering = serializedRendering;

11
src/js/selection/BaseSelection.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.selection");
var ns = $.namespace('pskl.selection');
ns.BaseSelection = function () {
this.reset();
@ -11,14 +11,15 @@
};
ns.BaseSelection.prototype.move = function (colDiff, rowDiff) {
var movedPixel, movedPixels = [];
var movedPixels = [];
for(var i=0, l=this.pixels.length; i<l; i++) {
movedPixel = this.pixels[i];
for (var i = 0, l = this.pixels.length; i < l; i++) {
var movedPixel = this.pixels[i];
movedPixel.col += colDiff;
movedPixel.row += rowDiff;
movedPixels.push(movedPixel);
}
this.pixels = movedPixels;
};
@ -28,4 +29,4 @@
});
this.hasPastedContent = true;
};
})();
})();

4
src/js/selection/RectangularSelection.js
View File

@ -1,9 +1,9 @@
(function () {
var ns = $.namespace("pskl.selection");
var ns = $.namespace('pskl.selection');
ns.RectangularSelection = function (x0, y0, x1, y1) {
this.pixels = pskl.PixelUtils.getRectanglePixels(x0, y0, x1, y1);
};
pskl.utils.inherit(ns.RectangularSelection, ns.BaseSelection);
})();
})();

24
src/js/selection/SelectionManager.js
View File

@ -1,5 +1,5 @@
(function () {
var ns = $.namespace("pskl.selection");
var ns = $.namespace('pskl.selection');
var SELECTION_REPLAY = {
PASTE : 'REPLAY_PASTE',
@ -31,7 +31,7 @@
* @private
*/
ns.SelectionManager.prototype.cleanSelection_ = function() {
if(this.currentSelection) {
if (this.currentSelection) {
this.currentSelection.reset();
this.currentSelection = null;
}
@ -42,7 +42,7 @@
*/
ns.SelectionManager.prototype.onToolSelected_ = function(evt, tool) {
var isSelectionTool = tool instanceof pskl.tools.drawing.BaseSelect;
if(!isSelectionTool) {
if (!isSelectionTool) {
this.cleanSelection_();
}
};
@ -65,7 +65,7 @@
ns.SelectionManager.prototype.erase = function () {
var pixels = this.currentSelection.pixels;
var currentFrame = this.piskelController.getCurrentFrame();
for(var i=0, l=pixels.length; i<l; i++) {
for (var i = 0, l = pixels.length ; i < l ; i++) {
currentFrame.setPixel(pixels[i].col, pixels[i].row, Constants.TRANSPARENT_COLOR);
}
@ -80,7 +80,7 @@
};
ns.SelectionManager.prototype.cut = function() {
if(this.currentSelection) {
if (this.currentSelection) {
// Put cut target into the selection:
this.currentSelection.fillSelectionFromFrame(this.piskelController.getCurrentFrame());
this.erase();
@ -88,7 +88,7 @@
};
ns.SelectionManager.prototype.paste = function() {
if(this.currentSelection && this.currentSelection.hasPastedContent) {
if (this.currentSelection && this.currentSelection.hasPastedContent) {
var pixels = this.currentSelection.pixels;
var opaquePixels = pixels.filter(function (p) {
return p.color !== Constants.TRANSPARENT_COLOR;
@ -101,7 +101,7 @@
var currentFrame = this.piskelController.getCurrentFrame();
pixels.forEach(function (pixel) {
currentFrame.setPixel(pixel.col,pixel.row,pixel.color);
currentFrame.setPixel(pixel.col, pixel.row, pixel.color);
});
$.publish(Events.PISKEL_SAVE_STATE, {
@ -123,7 +123,7 @@
};
ns.SelectionManager.prototype.copy = function() {
if(this.currentSelection && this.piskelController.getCurrentFrame()) {
if (this.currentSelection && this.piskelController.getCurrentFrame()) {
this.currentSelection.fillSelectionFromFrame(this.piskelController.getCurrentFrame());
}
};
@ -132,10 +132,10 @@
* @private
*/
ns.SelectionManager.prototype.onSelectionCreated_ = function(evt, selection) {
if(selection) {
if (selection) {
this.currentSelection = selection;
} else {
console.error("No selection provided to SelectionManager");
console.error('No selection provided to SelectionManager');
}
};
@ -143,10 +143,10 @@
* @private
*/
ns.SelectionManager.prototype.onSelectionMoved_ = function(evt, colDiff, rowDiff) {
if(this.currentSelection) {
if (this.currentSelection) {
this.currentSelection.move(colDiff, rowDiff);
} else {
console.error("Bad state: No currentSelection set when trying to move it in SelectionManager");
console.error('Bad state: No currentSelection set when trying to move it in SelectionManager');
}
};
})();

4
src/js/selection/ShapeSelection.js
View File

@ -1,9 +1,9 @@
(function () {
var ns = $.namespace("pskl.selection");
var ns = $.namespace('pskl.selection');
ns.ShapeSelection = function (pixels) {
this.pixels = pixels;
};
pskl.utils.inherit(ns.ShapeSelection, ns.BaseSelection);
})();
})();

2
src/js/service/AppEngineStorageService.js
View File

@ -37,4 +37,4 @@
pskl.utils.Xhr.post(Constants.APPENGINE_SAVE_URL, data, success, error);
};
})();
})();

8
src/js/service/BackupService.js
View File

@ -62,14 +62,10 @@
ns.BackupService.prototype.savePiskel_ = function (type, piskel, info) {
try {
window.localStorage.setItem('bkp.' + type +'.piskel', piskel);
window.localStorage.setItem('bkp.' + type +'.info', info);
window.localStorage.setItem('bkp.' + type + '.piskel', piskel);
window.localStorage.setItem('bkp.' + type + '.info', info);
} catch (e) {
console.error('Could not save piskel backup in localStorage.', e);
}
};
})();

7
src/js/service/BeforeUnloadService.js
View File

@ -5,19 +5,18 @@
this.piskelController = piskelController;
};
ns.BeforeUnloadService.prototype.init = function () {
window.addEventListener("beforeunload", this.onBeforeUnload.bind(this));
window.addEventListener('beforeunload', this.onBeforeUnload.bind(this));
};
ns.BeforeUnloadService.prototype.onBeforeUnload = function (evt) {
pskl.app.backupService.backup();
if (pskl.app.savedStatusService.isDirty()) {
var confirmationMessage = "Your Piskel seems to have unsaved changes";
var confirmationMessage = 'Your Piskel seems to have unsaved changes';
(evt || window.event).returnValue = confirmationMessage;
return confirmationMessage;
}
};
})();
})();

2
src/js/service/CurrentColorsService.js
View File

@ -102,4 +102,4 @@
}
}
};
})();
})();

11
src/js/service/DesktopStorageService.js
View File

@ -6,7 +6,7 @@
this.hideNotificationTimeoutID = 0;
};
ns.DesktopStorageService.prototype.init = function (){
ns.DesktopStorageService.prototype.init = function () {
// activate keyboard shortcuts if this is the desktop version
if (pskl.utils.Environment.detectNodeWebkit()) {
pskl.app.shortcutService.addShortcut('ctrl+o', this.openPiskel.bind(this));
@ -33,9 +33,9 @@
};
ns.DesktopStorageService.prototype.openPiskel = function () {
pskl.utils.FileUtilsDesktop.chooseFileDialog(function(filename){
pskl.utils.FileUtilsDesktop.chooseFileDialog(function (filename) {
var savePath = filename;
pskl.utils.FileUtilsDesktop.readFile(savePath, function(content){
pskl.utils.FileUtilsDesktop.readFile(savePath, function (content) {
pskl.utils.PiskelFileUtils.decodePiskelFile(content, function (piskel, descriptor, fps) {
piskel.setDescriptor(descriptor);
// store save path so we can re-save without opening the save dialog
@ -60,12 +60,11 @@
ns.DesktopStorageService.prototype.onSaveSuccess_ = function () {
var savePath = this.piskelController.getSavePath();
$.publish(Events.CLOSE_SETTINGS_DRAWER);
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Successfully saved: " + savePath}]);
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Successfully saved: ' + savePath}]);
$.publish(Events.PISKEL_SAVED);
// clear the old time out, if any.
window.clearTimeout(this.hideNotificationTimeoutID);
this.hideNotificationTimeoutID =
window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 3000);
this.hideNotificationTimeoutID = window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 3000);
};
})();

8
src/js/service/FileDropperService.js
View File

@ -73,7 +73,7 @@
var dropCoordinates = this.adjustDropPosition_(this.dropPosition_, droppedFrame);
currentFrame.forEachPixel(function (color, x, y) {
var fColor = droppedFrame.getPixel(x-dropCoordinates.x, y-dropCoordinates.y);
var fColor = droppedFrame.getPixel(x - dropCoordinates.x, y - dropCoordinates.y);
if (fColor && fColor != Constants.TRANSPARENT_COLOR) {
currentFrame.setPixel(x, y, fColor);
}
@ -88,8 +88,8 @@
ns.FileDropperService.prototype.adjustDropPosition_ = function (position, droppedFrame) {
var framePosition = pskl.app.drawingController.getSpriteCoordinates(position.x, position.y);
var xCoord = framePosition.x - Math.floor(droppedFrame.width/2);
var yCoord = framePosition.y - Math.floor(droppedFrame.height/2);
var xCoord = framePosition.x - Math.floor(droppedFrame.width / 2);
var yCoord = framePosition.y - Math.floor(droppedFrame.height / 2);
xCoord = Math.max(0, xCoord);
yCoord = Math.max(0, yCoord);
@ -109,4 +109,4 @@
};
};
})();
})();

4
src/js/service/GithubStorageService.js
View File

@ -8,6 +8,6 @@
ns.GithubStorageService.prototype.init = function () {};
ns.GithubStorageService.prototype.store = function (callbacks) {
throw "Github save is no longer available. Use local save instead";
throw 'Github save is no longer available. Use local save instead';
};
})();
})();

10
src/js/service/HistoryService.js
View File

@ -93,7 +93,7 @@
this.deserializer.deserialize(serializedPiskel, onPiskelLoadedCb);
}
} catch (error) {
console.error("[CRITICAL ERROR] : Unable to load a history state.");
console.error('[CRITICAL ERROR] : Unable to load a history state.');
this.logError_(error);
this.stateQueue = [];
this.currentIndex = -1;
@ -101,7 +101,7 @@
};
ns.HistoryService.prototype.logError_ = function (error) {
if (typeof error === "string") {
if (typeof error === 'string') {
console.error(error);
} else {
console.error(error.message);
@ -116,7 +116,7 @@
// If the snapshot is stringified, parse it and backup the result for faster access next time
// FIXME : Memory consumption might go crazy if we keep unpacking big piskels indefinitely
// ==> should ensure I remove some of them :)
if (typeof piskelSnapshot === "string") {
if (typeof piskelSnapshot === 'string') {
piskelSnapshot = JSON.parse(piskelSnapshot);
state.piskel = piskelSnapshot;
}
@ -138,7 +138,7 @@
}
// Should only do this when going backwards
var lastState = this.stateQueue[index+1];
var lastState = this.stateQueue[index + 1];
if (lastState) {
this.setupState(lastState);
}
@ -168,4 +168,4 @@
action.scope.replay(frame, action.replay);
};
})();
})();

5
src/js/service/ImageUploadService.js
View File

@ -1,10 +1,11 @@
(function () {
var ns = $.namespace("pskl.service");
var ns = $.namespace('pskl.service');
ns.ImageUploadService = function () {};
ns.ImageUploadService.prototype.init = function () {};
/**
* Upload a base64 image data to distant service. If successful, will call provided callback with the image URL as first argument;
* Upload a base64 image data to distant service.
* If successful, will call provided callback with the image URL as first argument;
* @param {String} imageData base64 image data (such as the return value of canvas.toDataUrl())
* @param {Function} success success callback. 1st argument will be the uploaded image URL
* @param {Function} error error callback

8
src/js/service/LocalStorageService.js
View File

@ -1,9 +1,9 @@
(function () {
var ns = $.namespace("pskl.service");
var ns = $.namespace('pskl.service');
ns.LocalStorageService = function (piskelController) {
if(piskelController === undefined) {
throw "Bad LocalStorageService initialization: <undefined piskelController>";
if (piskelController === undefined) {
throw 'Bad LocalStorageService initialization: <undefined piskelController>';
}
this.piskelController = piskelController;
};
@ -80,4 +80,4 @@
return JSON.parse(keysString) || [];
};
})();
})();

2
src/js/service/SavedStatusService.js
View File

@ -54,4 +54,4 @@
var piskel = this.piskelController.getPiskel();
return piskel.isDirty_;
};
})();
})();

3
src/js/service/color/ColorSorter.js
View File

@ -5,7 +5,6 @@
var LOW_LUM = 0.1;
var HI_LUM = 0.9;
var HUE_STEP = 36;
var HUE_BAGS = 10;
var HUE_BOUNDS = [];
@ -102,4 +101,4 @@
return 0;
};
})();
})();

70
src/js/service/keyboard/CheatsheetService.js
View File

@ -51,7 +51,6 @@
this.isDisplayed = true;
};
ns.CheatsheetService.prototype.hideCheatsheet_ = function () {
pskl.app.shortcutService.removeShortcut('ESC');
this.cheatsheetEl.style.display = 'none';
@ -64,43 +63,13 @@
this.initMarkupForSelection_();
};
ns.CheatsheetService.prototype.toDescriptor_ = function (shortcut, description, icon) {
if (pskl.utils.UserAgent.isMac) {
shortcut = shortcut.replace('ctrl', 'cmd');
}
return {
'shortcut' : shortcut,
'description' : description,
'icon' : icon
};
};
ns.CheatsheetService.prototype.getDomFromDescriptor_ = function (descriptor) {
var shortcutTemplate = pskl.utils.Template.get('cheatsheet-shortcut-template');
var markup = pskl.utils.Template.replace(shortcutTemplate, {
shortcutIcon : descriptor.icon,
shortcutDescription : descriptor.description,
shortcutKey : descriptor.shortcut
});
return pskl.utils.Template.createFromHTML(markup);
};
ns.CheatsheetService.prototype.initMarkupAbstract_ = function (descriptors, containerSelector) {
var container = $(containerSelector, this.cheatsheetEl).get(0);
for (var i = 0 ; i < descriptors.length ; i++) {
var descriptor = descriptors[i];
var shortcutEl = this.getDomFromDescriptor_(descriptor);
container.appendChild(shortcutEl);
}
};
ns.CheatsheetService.prototype.initMarkupForTools_ = function () {
var descriptors = pskl.app.toolController.tools.map(function (tool) {
return this.toDescriptor_(tool.shortcut, tool.instance.getHelpText(), 'tool-icon ' + tool.instance.toolId);
}.bind(this));
this.initMarkupAbstract_(descriptors, '.cheatsheet-tool-shortcuts');
var container = this.cheatsheetEl.querySelector('.cheatsheet-tool-shortcuts');
this.initMarkupForDescriptors_(descriptors, container);
};
ns.CheatsheetService.prototype.initMarkupForMisc_ = function () {
@ -122,7 +91,8 @@
this.toDescriptor_('alt + L', 'Toggle Layer Preview')
];
this.initMarkupAbstract_(descriptors, '.cheatsheet-misc-shortcuts');
var container = this.cheatsheetEl.querySelector('.cheatsheet-misc-shortcuts');
this.initMarkupForDescriptors_(descriptors, container);
};
ns.CheatsheetService.prototype.initMarkupForSelection_ = function () {
@ -133,7 +103,37 @@
this.toDescriptor_('del', 'Delete selection')
];
this.initMarkupAbstract_(descriptors, '.cheatsheet-selection-shortcuts');
var container = this.cheatsheetEl.querySelector('.cheatsheet-selection-shortcuts');
this.initMarkupForDescriptors_(descriptors, container);
};
ns.CheatsheetService.prototype.toDescriptor_ = function (shortcut, description, icon) {
if (pskl.utils.UserAgent.isMac) {
shortcut = shortcut.replace('ctrl', 'cmd');
}
return {
'shortcut' : shortcut,
'description' : description,
'icon' : icon
};
};
ns.CheatsheetService.prototype.initMarkupForDescriptors_ = function (descriptors, container) {
descriptors.forEach(function (descriptor) {
var shortcut = this.getDomFromDescriptor_(descriptor);
container.appendChild(shortcut);
}.bind(this));
};
ns.CheatsheetService.prototype.getDomFromDescriptor_ = function (descriptor) {
var shortcutTemplate = pskl.utils.Template.get('cheatsheet-shortcut-template');
var markup = pskl.utils.Template.replace(shortcutTemplate, {
shortcutIcon : descriptor.icon,
shortcutDescription : descriptor.description,
shortcutKey : descriptor.shortcut
});
return pskl.utils.Template.createFromHTML(markup);
};
})();

26
src/js/service/keyboard/KeycodeTranslator.js
View File

@ -1,24 +1,24 @@
(function () {
var specialKeys = {
191 : "?",
8 : "back",
27 : "esc",
38 : "up",
40 : "down",
46 : "del",
189 : "-",
187 : "+",
188 : "<",
190 : ">"
191 : '?',
8 : 'back',
27 : 'esc',
38 : 'up',
40 : 'down',
46 : 'del',
189 : '-',
187 : '+',
188 : '<',
190 : '>'
};
var ns = $.namespace('pskl.service.keyboard');
ns.KeycodeTranslator= {
ns.KeycodeTranslator = {
toChar : function (keycode) {
if (keycode >= 48 && keycode <= 57) {
// key is 0-9
return (keycode - 48) + "";
return (keycode - 48) + '';
} else if (keycode >= 65 && keycode <= 90) {
// key is a-z, use base 36 to get the string representation
return (keycode - 65 + 10).toString(36);
@ -27,4 +27,4 @@
}
}
};
})();
})();

17
src/js/service/keyboard/ShortcutService.js
View File

@ -22,8 +22,8 @@
ns.ShortcutService.prototype.addShortcut = function (rawKey, callback) {
var parsedKey = this.parseKey_(rawKey.toLowerCase());
var key = parsedKey.key,
meta = parsedKey.meta;
var key = parsedKey.key;
var meta = parsedKey.meta;
this.shortcuts_[key] = this.shortcuts_[key] || {};
@ -43,9 +43,8 @@
ns.ShortcutService.prototype.removeShortcut = function (rawKey) {
var parsedKey = this.parseKey_(rawKey.toLowerCase());
var key = parsedKey.key,
meta = parsedKey.meta;
var key = parsedKey.key;
var meta = parsedKey.meta;
this.shortcuts_[key] = this.shortcuts_[key] || {};
@ -60,7 +59,7 @@
});
var parts = key.split(/\+(?!$)/);
key = parts[parts.length-1];
key = parts[parts.length - 1];
return {meta : meta, key : key};
};
@ -89,7 +88,7 @@
var charkey = pskl.service.keyboard.KeycodeTranslator.toChar(keycode);
var keyShortcuts = this.shortcuts_[charkey];
if(keyShortcuts) {
if (keyShortcuts) {
var meta = this.getMetaKey_({
alt : this.isAltKeyPressed_(evt),
shift : this.isShiftKeyPressed_(evt),
@ -97,7 +96,7 @@
});
var cb = keyShortcuts[meta];
if(cb) {
if (cb) {
var bubble = cb(charkey);
if (bubble !== true) {
evt.preventDefault();
@ -123,4 +122,4 @@
ns.ShortcutService.prototype.isAltKeyPressed_ = function (evt) {
return evt.altKey;
};
})();
})();

2
src/js/service/palette/CurrentColorsPalette.js
View File

@ -9,4 +9,4 @@
ns.CurrentColorsPalette.prototype.getColors = function () {
return pskl.app.currentColorsService.getCurrentColors();
};
})();
})();

2
src/js/service/palette/PaletteGplWriter.js
View File

@ -33,7 +33,7 @@
ns.PaletteGplWriter.prototype.padString = function (str, size) {
str = str.toString();
var pad = (new Array(1+size-str.length)).join(' ');
var pad = (new Array(1 + size - str.length)).join(' ');
return pad + str;
};

4
src/js/service/palette/PaletteImportService.js
View File

@ -45,7 +45,7 @@
ns.PaletteImportService.prototype.getExtension_ = function (file) {
var parts = file.name.split('.');
var extension = parts[parts.length-1];
var extension = parts[parts.length - 1];
return extension.toLowerCase();
};
})();
})();

4
src/js/service/palette/PaletteService.js
View File

@ -33,7 +33,7 @@
this.savePalettes_(palettes);
$.publish(Events.SHOW_NOTIFICATION, [{"content": "Palette " + palette.name + " successfully saved !"}]);
$.publish(Events.SHOW_NOTIFICATION, [{'content': 'Palette ' + palette.name + ' successfully saved !'}]);
window.setTimeout($.publish.bind($, Events.HIDE_NOTIFICATION), 2000);
};
@ -69,4 +69,4 @@
return match;
};
})();
})();

2
src/js/service/palette/reader/AbstractPaletteFileReader.js
View File

@ -32,4 +32,4 @@
this.onError();
}
};
})();
})();

2
src/js/service/palette/reader/PaletteGplReader.js
View File

@ -20,4 +20,4 @@
return color.toRgbString();
};
})();
})();

6
src/js/service/palette/reader/PaletteImageReader.js
View File

@ -19,7 +19,7 @@
this.onWorkerStep_.bind(this),
this.onWorkerError_.bind(this));
$.publish(Events.SHOW_PROGRESS, [{"name": 'Processing image colors ...'}]);
$.publish(Events.SHOW_PROGRESS, [{'name': 'Processing image colors ...'}]);
imageProcessor.process();
};
@ -44,11 +44,11 @@
ns.PaletteImageReader.prototype.onWorkerStep_ = function (event) {
var progress = event.data.progress;
$.publish(Events.UPDATE_PROGRESS, [{"progress": progress}]);
$.publish(Events.UPDATE_PROGRESS, [{'progress': progress}]);
};
ns.PaletteImageReader.prototype.onWorkerError_ = function (event) {
$.publish(Events.HIDE_PROGRESS);
this.onError('Unable to process the image : ' + event.data.message);
};
})();
})();

2
src/js/service/palette/reader/PalettePalReader.js
View File

@ -14,4 +14,4 @@
var color = 'rgb(' + matches[1] + ',' + matches[2] + ',' + matches[3] + ')';
return color;
};
})();
})();

4
src/js/service/palette/reader/PaletteTxtReader.js
View File

@ -11,7 +11,7 @@
ns.PaletteTxtReader.prototype.extractColorFromLine = function (line) {
var matches = line.match(RE_COLOR_LINE);
var color = "#" + matches[1] + matches[2] + matches[3];
var color = '#' + matches[1] + matches[2] + matches[3];
return color;
};
})();
})();

6
src/js/snippets.js
View File

@ -5,10 +5,10 @@
var h = frame.getHeight();
clone.forEachPixel(function (color, x, y) {
if (horizontal) {
x = w-x-1;
x = w - x - 1;
}
if (vertical) {
y = h-y-1;
y = h - y - 1;
}
frame.pixels[x][y] = color;
});
@ -40,4 +40,4 @@
type : pskl.service.HistoryService.SNAPSHOT
});
};
})();
})();

5
src/js/tools/IconMarkupRenderer.js
View File

@ -5,7 +5,7 @@
ns.IconMarkupRenderer.prototype.render = function (tool, shortcut, tooltipPosition) {
tooltipPosition = tooltipPosition || 'right';
shortcut = shortcut ? '(' + shortcut + ')' : '';
shortcut = shortcut ? '(' + shortcut + ')' : '';
var tpl = pskl.utils.Template.get('drawingTool-item-template');
return pskl.utils.Template.replace(tpl, {
cssclass : ['tool-icon', tool.toolId].join(' '),
@ -25,7 +25,6 @@
});
};
ns.IconMarkupRenderer.prototype.formatToolDescriptors_ = function(descriptors) {
descriptors = descriptors || [];
return descriptors.reduce(function (p, descriptor) {
@ -46,4 +45,4 @@
}
return pskl.utils.Template.replace(tpl, descriptor);
};
})();
})();

6
src/js/tools/Tool.js
View File

@ -2,8 +2,8 @@
var ns = $.namespace('pskl.tools');
ns.Tool = function () {
this.toolId = "tool";
this.helpText = "Abstract tool";
this.toolId = 'tool';
this.helpText = 'Abstract tool';
this.tooltipDescriptors = [];
};
@ -14,4 +14,4 @@
ns.Tool.prototype.getId = function() {
return this.toolId;
};
})();
})();

20
src/js/tools/drawing/BaseTool.js
View File

@ -4,11 +4,11 @@
* @require pskl.utils
*/
(function() {
var ns = $.namespace("pskl.tools.drawing");
var ns = $.namespace('pskl.tools.drawing');
ns.BaseTool = function() {
pskl.tool.Tool.call(this);
this.toolId = "tool-base";
this.toolId = 'tool-base';
};
pskl.utils.inherit(ns.BaseTool, pskl.tools.Tool);
@ -77,22 +77,22 @@
y1 = pskl.utils.normalize(y1, 0);
var pixels = [];
var dx = Math.abs(x1-x0);
var dy = Math.abs(y1-y0);
var dx = Math.abs(x1 - x0);
var dy = Math.abs(y1 - y0);
var sx = (x0 < x1) ? 1 : -1;
var sy = (y0 < y1) ? 1 : -1;
var err = dx-dy;
while(true){
var err = dx - dy;
while (true) {
// Do what you need to for this
pixels.push({"col": x0, "row": y0});
pixels.push({'col': x0, 'row': y0});
if ((x0==x1) && (y0==y1)) {
if ((x0 == x1) && (y0 == y1)) {
break;
}
var e2 = 2*err;
if (e2>-dy){
var e2 = 2 * err;
if (e2 > -dy) {
err -= dy;
x0 += sx;
}

27
src/js/tools/drawing/Circle.js
View File

@ -4,21 +4,20 @@
* @require pskl.utils
*/
(function() {
var ns = $.namespace("pskl.tools.drawing");
var ns = $.namespace('pskl.tools.drawing');
ns.Circle = function() {
ns.ShapeTool.call(this);
this.toolId = "tool-circle";
this.helpText = "Circle tool";
this.toolId = 'tool-circle';
this.helpText = 'Circle tool';
};
pskl.utils.inherit(ns.Circle, ns.ShapeTool);
ns.Circle.prototype.draw_ = function (col, row, color, targetFrame) {
var circlePoints = this.getCirclePixels_(this.startCol, this.startRow, col, row);
for(var i = 0; i< circlePoints.length; i++) {
for (var i = 0 ; i < circlePoints.length ; i++) {
// Change model:
targetFrame.setPixel(circlePoints[i].col, circlePoints[i].row, color);
}
@ -26,27 +25,29 @@
ns.Circle.prototype.getCirclePixels_ = function (x0, y0, x1, y1) {
var coords = pskl.PixelUtils.getOrderedRectangleCoordinates(x0, y0, x1, y1);
var xC = (coords.x0 + coords.x1)/2;
var yC = (coords.y0 + coords.y1)/2;
var xC = (coords.x0 + coords.x1) / 2;
var yC = (coords.y0 + coords.y1) / 2;
var rX = coords.x1 - xC;
var rY = coords.y1 - yC;
var pixels = [];
var x, y, angle;
for (x = coords.x0 ; x < coords.x1 ; x++) {
angle = Math.acos((x - xC)/rX);
angle = Math.acos((x - xC) / rX);
y = Math.round(rY * Math.sin(angle) + yC);
pixels.push({"col": x, "row": y});
pixels.push({"col": 2*xC - x, "row": 2*yC - y});
pixels.push({'col': x, 'row': y});
pixels.push({'col': 2 * xC - x, 'row': 2 * yC - y});
}
for (y = coords.y0 ; y < coords.y1 ; y++) {
angle = Math.asin((y - yC)/rY);
angle = Math.asin((y - yC) / rY);
x = Math.round(rX * Math.cos(angle) + xC);
pixels.push({"col": x, "row": y});
pixels.push({"col": 2*xC - x, "row": 2*yC - y});
pixels.push({'col': x, 'row': y});
pixels.push({'col': 2 * xC - x, 'row': 2 * yC - y});
}
return pixels;
};
})();

7
src/js/tools/drawing/ColorPicker.js
View File

@ -4,16 +4,15 @@
* @require pskl.utils
*/
(function() {
var ns = $.namespace("pskl.tools.drawing");
var ns = $.namespace('pskl.tools.drawing');
ns.ColorPicker = function() {
this.toolId = "tool-colorpicker";
this.helpText = "Color picker";
this.toolId = 'tool-colorpicker';
this.helpText = 'Color picker';
};
pskl.utils.inherit(ns.ColorPicker, ns.BaseTool);
/**
* @override
*/

8
src/js/tools/drawing/ColorSwap.js
View File

@ -3,12 +3,12 @@
*
*/
(function() {
var ns = $.namespace("pskl.tools.drawing");
var ns = $.namespace('pskl.tools.drawing');
ns.ColorSwap = function() {
this.toolId = "tool-colorswap";
this.toolId = 'tool-colorswap';
this.helpText = "Paint all pixels of the same color";
this.helpText = 'Paint all pixels of the same color';
this.tooltipDescriptors = [
{key : 'ctrl', description : 'Apply to all layers'},
@ -37,7 +37,7 @@
};
ns.ColorSwap.prototype.swapColors = function(oldColor, newColor, allLayers, allFrames) {
var swapPixelColor = function (pixelColor,x,y,frame) {
var swapPixelColor = function (pixelColor, x, y, frame) {
if (pixelColor == oldColor) {
frame.pixels[x][y] = newColor;
}

8
src/js/tools/drawing/Eraser.js
View File

@ -5,12 +5,12 @@
* @require pskl.utils
*/
(function() {
var ns = $.namespace("pskl.tools.drawing");
var ns = $.namespace('pskl.tools.drawing');
ns.Eraser = function() {
this.superclass.constructor.call(this);
this.toolId = "tool-eraser";
this.helpText = "Eraser tool";
this.toolId = 'tool-eraser';
this.helpText = 'Eraser tool';
};
pskl.utils.inherit(ns.Eraser, ns.SimplePen);
@ -27,4 +27,4 @@
ns.Eraser.prototype.releaseToolAt = function(col, row, color, frame, overlay, event) {
this.superclass.releaseToolAt.call(this, col, row, Constants.TRANSPARENT_COLOR, frame, overlay, event);
};
})();
})();

Some files were not shown because too many files have changed in this diff Show More