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

Add grid checkbox

Browse Source
This commit is contained in:
Vince
2012-09-08 23:43:16 +02:00
parent 6b9904935f
commit df945e10dd
6 changed files with 63 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
js/rendering/FrameRenderer.js
View File

@ -5,8 +5,7 @@
ns.FrameRenderer = function (container, renderingOptions, className) {
this.defaultRenderingOptions = {
"gridStrokeWidth" : 0,
"gridStrokeColor" : "lightgray"
"hasGrid" : false
};
renderingOptions = $.extend(true, {}, this.defaultRenderingOptions, renderingOptions);
@ -22,16 +21,22 @@
this.dpi = renderingOptions.dpi;
this.className = className;
this.canvas = null;
console.log(renderingOptions)
this.gridStrokeWidth = renderingOptions.gridStrokeWidth;
this.gridStrokeColor = renderingOptions.gridStrokeColor;
this.hasGrid = renderingOptions.hasGrid;
this.gridStrokeWidth = 0;
this.lastRenderedFrame = null;
// Flag to know if the config was altered
this.canvasConfigDirty = true;
if(this.hasGrid) {
$.subscribe(Events.GRID_DISPLAY_STATE_CHANGED, $.proxy(this.showGrid, this));
}
};
ns.FrameRenderer.prototype.init = function (frame) {
this.render(frame);
this.lastRenderedFrame = frame;
};
ns.FrameRenderer.prototype.updateDPI = function (newDPI) {
@ -39,12 +44,27 @@
this.canvasConfigDirty = true;
};
ns.FrameRenderer.prototype.showGrid = function (evt, show) {
this.gridStrokeWidth = 0;
if(show) {
this.gridStrokeWidth = Constants.GRID_STROKE_WIDTH;
}
this.canvasConfigDirty = true;
if(this.lastRenderedFrame) {
this.render(this.lastRenderedFrame);
}
};
ns.FrameRenderer.prototype.render = function (frame) {
for(var col = 0, width = frame.getWidth(); col < width; col++) {
for(var row = 0, height = frame.getHeight(); row < height; row++) {
this.drawPixel(col, row, frame, this.getCanvas_(frame, col, row), this.dpi);
}
}
this.lastRenderedFrame = frame;
};
ns.FrameRenderer.prototype.drawPixel = function (col, row, frame) {
@ -61,6 +81,7 @@
context.fillStyle = color;
context.fillRect(this.getFrameY_(col), this.getFrameY_(row), this.dpi, this.dpi);
}
this.lastRenderedFrame = frame;
};
ns.FrameRenderer.prototype.clear = function (col, row, frame) {
@ -100,8 +121,8 @@
*/
ns.FrameRenderer.prototype.drawGrid_ = function(canvas, width, height, col, row) {
var ctx = canvas.getContext("2d");
ctx.lineWidth = this.gridStrokeWidth;
ctx.strokeStyle = this.gridStrokeColor;
ctx.lineWidth = Constants.GRID_STROKE_WIDTH;
ctx.strokeStyle = Constants.GRID_STROKE_COLOR;
for(var c=1; c < col; c++) {
ctx.moveTo(this.getFrameX_(c), 0);
ctx.lineTo(this.getFrameX_(c), height);
@ -121,6 +142,7 @@
ns.FrameRenderer.prototype.getCanvas_ = function (frame) {
if(this.canvasConfigDirty) {
$(this.canvas).remove();
var col = frame.getWidth(),
row = frame.getHeight();