mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Fix Travis: convert tabs to spaces

Browse Source
This commit is contained in:
Vince 2013-06-17 23:22:30 +02:00
parent 5913b19641
commit 73aae69425
1 changed files with 139 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

266
js/rendering/FrameRenderer.js
View File

@ -1,161 +1,161 @@
(function () { (function () {
var ns = $.namespace("pskl.rendering"); var ns = $.namespace("pskl.rendering");
ns.FrameRenderer = function (container, renderingOptions, className) { ns.FrameRenderer = function (container, renderingOptions, className) {
this.defaultRenderingOptions = { this.defaultRenderingOptions = {
'supportGridRendering' : false 'supportGridRendering' : false
}; };
renderingOptions = $.extend(true, {}, this.defaultRenderingOptions, renderingOptions); renderingOptions = $.extend(true, {}, this.defaultRenderingOptions, renderingOptions);
if(container === undefined) { if(container === undefined) {
throw 'Bad FrameRenderer initialization. <container> undefined.'; throw 'Bad FrameRenderer initialization. <container> undefined.';
} }
if(isNaN(renderingOptions.dpi)) { if(isNaN(renderingOptions.dpi)) {
throw 'Bad FrameRenderer initialization. <dpi> not well defined.'; throw 'Bad FrameRenderer initialization. <dpi> not well defined.';
} }
this.container = container; this.container = container;
this.dpi = renderingOptions.dpi; this.dpi = renderingOptions.dpi;
this.className = className; this.className = className;
this.canvas = null; this.canvas = null;
this.supportGridRendering = renderingOptions.supportGridRendering; this.supportGridRendering = renderingOptions.supportGridRendering;
this.enableGrid(pskl.UserSettings.get(pskl.UserSettings.SHOW_GRID)); this.enableGrid(pskl.UserSettings.get(pskl.UserSettings.SHOW_GRID));
// Flag to know if the config was altered // Flag to know if the config was altered
this.canvasConfigDirty = true; this.canvasConfigDirty = true;
this.updateBackgroundClass_(pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND)); this.updateBackgroundClass_(pskl.UserSettings.get(pskl.UserSettings.CANVAS_BACKGROUND));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this)); $.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
}; };
ns.FrameRenderer.prototype.init = function (frame) { ns.FrameRenderer.prototype.init = function (frame) {
this.render(frame); this.render(frame);
this.lastRenderedFrame = frame; this.lastRenderedFrame = frame;
}; };
ns.FrameRenderer.prototype.updateDPI = function (newDPI) { ns.FrameRenderer.prototype.updateDPI = function (newDPI) {
this.dpi = newDPI; this.dpi = newDPI;
this.canvasConfigDirty = true; this.canvasConfigDirty = true;
}; };
/** /**
* @private * @private
*/ */
ns.FrameRenderer.prototype.onUserSettingsChange_ = function (evt, settingName, settingValue) { ns.FrameRenderer.prototype.onUserSettingsChange_ = function (evt, settingName, settingValue) {
if(settingName == pskl.UserSettings.SHOW_GRID) { if(settingName == pskl.UserSettings.SHOW_GRID) {
this.enableGrid(settingValue); this.enableGrid(settingValue);
} }
else if (settingName == pskl.UserSettings.CANVAS_BACKGROUND) { else if (settingName == pskl.UserSettings.CANVAS_BACKGROUND) {
this.updateBackgroundClass_(settingValue); this.updateBackgroundClass_(settingValue);
} }
}; };
/** /**
* @private * @private
*/ */
ns.FrameRenderer.prototype.updateBackgroundClass_ = function (newClass) { ns.FrameRenderer.prototype.updateBackgroundClass_ = function (newClass) {
var currentClass = this.container.data('current-background-class'); var currentClass = this.container.data('current-background-class');
if (currentClass) { if (currentClass) {
this.container.removeClass(currentClass); this.container.removeClass(currentClass);
} }
this.container.addClass(newClass); this.container.addClass(newClass);
this.container.data('current-background-class', newClass); this.container.data('current-background-class', newClass);
}; };
ns.FrameRenderer.prototype.enableGrid = function (flag) { ns.FrameRenderer.prototype.enableGrid = function (flag) {
this.gridStrokeWidth = (flag && this.supportGridRendering) ? Constants.GRID_STROKE_WIDTH : 0; this.gridStrokeWidth = (flag && this.supportGridRendering) ? Constants.GRID_STROKE_WIDTH : 0;
this.canvasConfigDirty = true; this.canvasConfigDirty = true;
}; };
ns.FrameRenderer.prototype.render = function (frame) { ns.FrameRenderer.prototype.render = function (frame) {
this.clear(frame); this.clear(frame);
var context = this.getCanvas_(frame).getContext('2d'); var context = this.getCanvas_(frame).getContext('2d');
for(var col = 0, width = frame.getWidth(); col < width; col++) { for(var col = 0, width = frame.getWidth(); col < width; col++) {
for(var row = 0, height = frame.getHeight(); row < height; row++) { for(var row = 0, height = frame.getHeight(); row < height; row++) {
var color = frame.getPixel(col, row); var color = frame.getPixel(col, row);
this.renderPixel_(color, col, row, context); this.renderPixel_(color, col, row, context);
} }
} }
this.lastRenderedFrame = frame; this.lastRenderedFrame = frame;
}; };
ns.FrameRenderer.prototype.renderPixel_ = function (color, col, row, context) { ns.FrameRenderer.prototype.renderPixel_ = function (color, col, row, context) {
if(color != Constants.TRANSPARENT_COLOR) { if(color != Constants.TRANSPARENT_COLOR) {
context.fillStyle = color; context.fillStyle = color;
context.fillRect(this.getFramePos_(col), this.getFramePos_(row), this.dpi, this.dpi); context.fillRect(this.getFramePos_(col), this.getFramePos_(row), this.dpi, this.dpi);
} }
}; };
ns.FrameRenderer.prototype.clear = function (frame) { ns.FrameRenderer.prototype.clear = function (frame) {
var canvas = this.getCanvas_(frame); var canvas = this.getCanvas_(frame);
canvas.getContext("2d").clearRect(0, 0, canvas.width, canvas.height); canvas.getContext("2d").clearRect(0, 0, canvas.width, canvas.height);
}; };
/** /**
* Transform a screen pixel-based coordinate (relative to the top-left corner of the rendered * Transform a screen pixel-based coordinate (relative to the top-left corner of the rendered
* frame) into a sprite coordinate in column and row. * frame) into a sprite coordinate in column and row.
* @public * @public
*/ */
ns.FrameRenderer.prototype.convertPixelCoordinatesIntoSpriteCoordinate = function(coords) { ns.FrameRenderer.prototype.convertPixelCoordinatesIntoSpriteCoordinate = function(coords) {
var cellSize = this.dpi + this.gridStrokeWidth; var cellSize = this.dpi + this.gridStrokeWidth;
return { return {
"col" : (coords.x - coords.x % cellSize) / cellSize, "col" : (coords.x - coords.x % cellSize) / cellSize,
"row" : (coords.y - coords.y % cellSize) / cellSize "row" : (coords.y - coords.y % cellSize) / cellSize
}; };
}; };
/** /**
* @private * @private
*/ */
ns.FrameRenderer.prototype.getFramePos_ = function(index) { ns.FrameRenderer.prototype.getFramePos_ = function(index) {
return index * this.dpi + ((index - 1) * this.gridStrokeWidth); return index * this.dpi + ((index - 1) * this.gridStrokeWidth);
}; };
/** /**
* @private * @private
*/ */
ns.FrameRenderer.prototype.drawGrid_ = function(canvas, width, height, col, row) { ns.FrameRenderer.prototype.drawGrid_ = function(canvas, width, height, col, row) {
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
ctx.lineWidth = Constants.GRID_STROKE_WIDTH; ctx.lineWidth = Constants.GRID_STROKE_WIDTH;
ctx.strokeStyle = Constants.GRID_STROKE_COLOR; ctx.strokeStyle = Constants.GRID_STROKE_COLOR;
for(var c=1; c < col; c++) { for(var c=1; c < col; c++) {
ctx.moveTo(this.getFramePos_(c), 0); ctx.moveTo(this.getFramePos_(c), 0);
ctx.lineTo(this.getFramePos_(c), height); ctx.lineTo(this.getFramePos_(c), height);
ctx.stroke(); ctx.stroke();
} }
for(var r=1; r < row; r++) { for(var r=1; r < row; r++) {
ctx.moveTo(0, this.getFramePos_(r)); ctx.moveTo(0, this.getFramePos_(r));
ctx.lineTo(width, this.getFramePos_(r)); ctx.lineTo(width, this.getFramePos_(r));
ctx.stroke(); ctx.stroke();
} }
}; };
/** /**
* @private * @private
*/ */
ns.FrameRenderer.prototype.getCanvas_ = function (frame) { ns.FrameRenderer.prototype.getCanvas_ = function (frame) {
if(this.canvasConfigDirty) { if(this.canvasConfigDirty) {
$(this.canvas).remove(); $(this.canvas).remove();
var col = frame.getWidth(), var col = frame.getWidth(),
row = frame.getHeight(); row = frame.getHeight();
var pixelWidth = col * this.dpi + this.gridStrokeWidth * (col - 1); var pixelWidth = col * this.dpi + this.gridStrokeWidth * (col - 1);
var pixelHeight = row * this.dpi + this.gridStrokeWidth * (row - 1); var pixelHeight = row * this.dpi + this.gridStrokeWidth * (row - 1);
var canvas = pskl.CanvasUtils.createCanvas(pixelWidth, pixelHeight, ["canvas", this.className]); var canvas = pskl.CanvasUtils.createCanvas(pixelWidth, pixelHeight, ["canvas", this.className]);
this.container.append(canvas); this.container.append(canvas);
if(this.gridStrokeWidth > 0) { if(this.gridStrokeWidth > 0) {
this.drawGrid_(canvas, pixelWidth, pixelHeight, col, row); this.drawGrid_(canvas, pixelWidth, pixelHeight, col, row);
} }
this.canvas = canvas; this.canvas = canvas;
this.canvasConfigDirty = false; this.canvasConfigDirty = false;
} }
return this.canvas; return this.canvas;
}; };
})(); })();