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

Fixed FilmPreview bugs. Simplified piskel.js, removed refernce to drawingController from tools

Browse Source
This commit is contained in:
juliandescottes
2012-09-10 23:26:12 +02:00
parent e1af86b647
commit 99e9cf8856
14 changed files with 166 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
js/drawingtools/BaseTool.js
View File

@@ -8,11 +8,11 @@
ns.BaseTool = function() {};
ns.BaseTool.prototype.applyToolAt = function(col, row, frame) {};
ns.BaseTool.prototype.applyToolAt = function(col, row, color, frame, overlay) {};
ns.BaseTool.prototype.moveToolAt = function(col, row, frame) {};
ns.BaseTool.prototype.moveToolAt = function(col, row, color, frame, overlay) {};
ns.BaseTool.prototype.releaseToolAt = function(col, row, frame) {};
ns.BaseTool.prototype.releaseToolAt = function(col, row, color, frame, overlay) {};
/**
* Bresenham line algorihtm: Get an array of pixels from

4
js/drawingtools/Eraser.js
View File

@@ -16,7 +16,7 @@
/**
* @override
*/
ns.Eraser.prototype.applyToolAt = function(col, row, color, drawer) {
this.superclass.applyToolAt.call(this, col, row, Constants.TRANSPARENT_COLOR, drawer);
ns.Eraser.prototype.applyToolAt = function(col, row, color, frame, overlay) {
this.superclass.applyToolAt.call(this, col, row, Constants.TRANSPARENT_COLOR, frame, overlay);
};
})();

12
js/drawingtools/Move.js
View File

@@ -19,16 +19,16 @@
/**
* @override
*/
ns.Move.prototype.applyToolAt = function(col, row, color, drawer) {
ns.Move.prototype.applyToolAt = function(col, row, color, frame, overlay) {
this.startCol = col;
this.startRow = row;
this.frameClone = drawer.frame.clone();
this.frameClone = frame.clone();
};
ns.Move.prototype.moveToolAt = function(col, row, color, drawer) {
ns.Move.prototype.moveToolAt = function(col, row, color, frame, overlay) {
var colDiff = col - this.startCol, rowDiff = row - this.startRow;
if (colDiff != 0 || rowDiff != 0) {
this.shiftFrame(colDiff, rowDiff, drawer.frame, this.frameClone);
this.shiftFrame(colDiff, rowDiff, frame, this.frameClone);
}
};
@@ -49,7 +49,7 @@
/**
* @override
*/
ns.Move.prototype.releaseToolAt = function(col, row, color, drawer) {
this.moveToolAt(col, row, color, drawer);
ns.Move.prototype.releaseToolAt = function(col, row, color, frame, overlay) {
this.moveToolAt(col, row, color, frame, overlay);
};
})();

7
js/drawingtools/PaintBucket.js
View File

@@ -15,12 +15,11 @@
/**
* @override
*/
ns.PaintBucket.prototype.applyToolAt = function(col, row, color, drawer) {
ns.PaintBucket.prototype.applyToolAt = function(col, row, color, frame, overlay) {
// Change model:
var targetColor = drawer.frame.getPixel(col, row);
//this.recursiveFloodFill_(frame, col, row, targetColor, color);
this.queueLinearFloodFill_(drawer.frame, col, row, targetColor, color);
var targetColor = frame.getPixel(col, row);
this.queueLinearFloodFill_(frame, col, row, targetColor, color);
};
/**

19
js/drawingtools/Rectangle.js
View File

@@ -19,17 +19,16 @@
/**
* @override
*/
ns.Rectangle.prototype.applyToolAt = function(col, row, color, drawer) {
ns.Rectangle.prototype.applyToolAt = function(col, row, color, frame, overlay) {
this.startCol = col;
this.startRow = row;
// Drawing the first point of the rectangle in the fake overlay canvas:
drawer.overlayFrame.setPixel(col, row, color);
overlay.setPixel(col, row, color);
};
ns.Rectangle.prototype.moveToolAt = function(col, row, color, drawer) {
// Clean overlay canvas:
drawer.clearOverlay();
ns.Rectangle.prototype.moveToolAt = function(col, row, color, frame, overlay) {
overlay.clear();
// When the user moussemove (before releasing), we dynamically compute the
// pixel to draw the line and draw this line in the overlay :
@@ -41,21 +40,21 @@
if(color == Constants.TRANSPARENT_COLOR) {
color = Constants.SELECTION_TRANSPARENT_COLOR;
}
drawer.overlayFrame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
overlay.setPixel(strokePoints[i].col, strokePoints[i].row, color);
}
};
/**
* @override
*/
ns.Rectangle.prototype.releaseToolAt = function(col, row, color, drawer) {
drawer.clearOverlay();
ns.Rectangle.prototype.releaseToolAt = function(col, row, color, frame, overlay) {
overlay.clear();
// If the stroke tool is released outside of the canvas, we cancel the stroke:
if(drawer.frame.containsPixel(col, row)) {
if(frame.containsPixel(col, row)) {
var strokePoints = this.getRectanglePixels_(this.startCol, col, this.startRow, row);
for(var i = 0; i< strokePoints.length; i++) {
// Change model:
drawer.frame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
frame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
}
// The user released the tool to draw a line. We will compute the pixel coordinate, impact
// the model and draw them in the drawing canvas (not the fake overlay anymore)

14
js/drawingtools/SimplePen.js
View File

@@ -18,27 +18,27 @@
/**
* @override
*/
ns.SimplePen.prototype.applyToolAt = function(col, row, color, drawer) {
if (drawer.frame.containsPixel(col, row)) {
ns.SimplePen.prototype.applyToolAt = function(col, row, color, frame, overlay) {
if (frame.containsPixel(col, row)) {
this.previousCol = col;
this.previousRow = row;
drawer.frame.setPixel(col, row, color);
frame.setPixel(col, row, color);
}
};
ns.SimplePen.prototype.moveToolAt = function(col, row, color, drawer) {
ns.SimplePen.prototype.moveToolAt = function(col, row, color, frame, overlay) {
if((Math.abs(col - this.previousCol) > 1) || (Math.abs(row - this.previousRow) > 1)) {
// The pen movement is too fast for the mousemove frequency, there is a gap between the
// current point and the previously drawn one.
// We fill the gap by calculating missing dots (simple linear interpolation) and draw them.
var interpolatedPixels = this.getLinePixels_(col, this.previousCol, row, this.previousRow);
for(var i=0, l=interpolatedPixels.length; i<l; i++) {
this.applyToolAt(interpolatedPixels[i].col, interpolatedPixels[i].row, color, drawer);
var coords = interpolatedPixels[i];
this.applyToolAt(coords.col, coords.row, color, frame, overlay);
}
}
else {
this.applyToolAt(col, row, color, drawer);
this.applyToolAt(col, row, color, frame, overlay);
}
this.previousCol = col;

22
js/drawingtools/Stroke.js
View File

@@ -12,8 +12,6 @@
// Stroke's first point coordinates (set in applyToolAt)
this.startCol = null;
this.startRow = null;
this.canvasOverlay = null;
};
pskl.utils.inherit(ns.Stroke, ns.BaseTool);
@@ -21,7 +19,7 @@
/**
* @override
*/
ns.Stroke.prototype.applyToolAt = function(col, row, color, drawer) {
ns.Stroke.prototype.applyToolAt = function(col, row, color, frame, overlay) {
this.startCol = col;
this.startRow = row;
@@ -34,11 +32,11 @@
// The fake canvas where we will draw the preview of the stroke:
// Drawing the first point of the stroke in the fake overlay canvas:
drawer.overlayFrame.setPixel(col, row, color);
overlay.setPixel(col, row, color);
};
ns.Stroke.prototype.moveToolAt = function(col, row, color, drawer) {
drawer.clearOverlay();
ns.Stroke.prototype.moveToolAt = function(col, row, color, frame, overlay) {
overlay.clear();
// When the user moussemove (before releasing), we dynamically compute the
// pixel to draw the line and draw this line in the overlay canvas:
@@ -56,28 +54,26 @@
// eg deleting the equivalent of a stroke.
color = Constants.SELECTION_TRANSPARENT_COLOR;
}
drawer.overlayFrame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
overlay.setPixel(strokePoints[i].col, strokePoints[i].row, color);
}
};
/**
* @override
*/
ns.Stroke.prototype.releaseToolAt = function(col, row, color, drawer) {
ns.Stroke.prototype.releaseToolAt = function(col, row, color, frame, overlay) {
// If the stroke tool is released outside of the canvas, we cancel the stroke:
// TODO: Mutualize this check in common method
if(drawer.frame.containsPixel(col, row)) {
if(frame.containsPixel(col, row)) {
// The user released the tool to draw a line. We will compute the pixel coordinate, impact
// the model and draw them in the drawing canvas (not the fake overlay anymore)
var strokePoints = this.getLinePixels_(this.startCol, col, this.startRow, row);
for(var i = 0; i< strokePoints.length; i++) {
// Change model:
drawer.frame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
frame.setPixel(strokePoints[i].col, strokePoints[i].row, color);
}
// Draw in canvas:
// TODO: Remove that when we have the centralized redraw loop
}
// For now, we are done with the stroke tool and don't need an overlay anymore:
drawer.clearOverlay();
overlay.clear();
};
})();