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

Adding support for transparent color

Browse Source
This commit is contained in:
Vince
2012-09-02 01:41:49 +02:00
parent 700c6ab144
commit 4622cf67a7
5 changed files with 65 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/Constants.js
View File

@@ -1,3 +1,3 @@
var Constants = {
TRANSPARENT_COLOR : "tc"
TRANSPARENT_COLOR : "TRANSPARENT"
};

12
js/drawingtools/Stroke.js
View File

@@ -53,7 +53,17 @@
0, 0, this.canvasOverlay.width, this.canvasOverlay.height);
// Drawing current stroke:
for(var i = 0; i< strokePoints.length; i++) {
for(var i = 0; i< strokePoints.length; i++) {
if(color == Constants.TRANSPARENT_COLOR) {
// When mousemoving the stroke tool, we draw in the canvas overlay above the drawing canvas.
// If the stroke color is transparent, we won't be
// able to see it during the movement.
// We set it to a semi-opaque white during the tool mousemove allowing to see colors below the stroke.
// When the stroke tool will be released, It will draw a transparent stroke,
// eg deleting the equivalent of a stroke.
color = "rgba(255, 255, 255, 0.6)";
}
this.drawPixelInCanvas(strokePoints[i].col, strokePoints[i].row, this.canvasOverlay, color, dpi);
}
};

18
js/piskel.js
View File

@@ -467,9 +467,21 @@ $.namespace("pskl");
onPaletteClick : function (event) {
var color = $(event.target).data("color");
if (null !== color) {
//debugger;
var colorPicker = $('#color-picker');
var colorPicker = $('#color-picker');
if (color == "TRANSPARENT") {
// We can set the current palette color to transparent.
// You can then combine this transparent color with an advanced
// tool for customized deletions.
// Eg: bucket + transparent: Delete a colored area
// Stroke + transparent: hollow out the equivalent of a stroke
penColor = Constants.TRANSPARENT_COLOR;
// 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[0].color.fromString("#fff");
colorPicker.val("TRANSPARENT");
} else if (null !== color) {
colorPicker[0].color.fromString(color);
penColor = color;
}