radex
/
jspaint
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Align patterns for polygon tool

main
Isaiah Odhner 2018-06-17 16:00:05 -04:00
parent 1bdffc5376
commit f12b36c671
2 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
TODO.md
View File

@ -181,7 +181,6 @@ might be a pointer events spec interpretation issue, and it could easily be that
* Polygon
* Align patterns (black & white mode) with global coordinates (I did a premature optimization) (...but there's also `setTransform` so maybe I could use that)
* Remove `show_shape_styles_warning` (for Polygon specifically, or implement shape styles for the rest of the tools)
* Issue with extra undoables
* Close and finalize the polygon when switching to a different tool

19
src/image-manipulation.js
View File

@ -760,11 +760,16 @@ function cut_polygon(points, x_min, y_min, x_max, y_max, from_canvas){
draw_polygon_or_line_strip(ctx, points, stroke, fill, true);
};
function replace_colors_with_swatch(ctx, swatch){
function replace_colors_with_swatch(ctx, swatch, x_offset_from_global_canvas, y_offset_from_global_canvas){
// mainly for patterns support (for black & white mode)
ctx.globalCompositeOperation = "source-in";
ctx.fillStyle = swatch;
ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
ctx.beginPath();
ctx.rect(0, 0, ctx.canvas.width, ctx.canvas.height);
ctx.save();
ctx.translate(x_offset_from_global_canvas, y_offset_from_global_canvas);
ctx.fill();
ctx.restore();
}
function draw_polygon_or_line_strip(ctx, points, stroke, fill, close_path){
@ -810,7 +815,7 @@ function cut_polygon(points, x_min, y_min, x_max, y_max, from_canvas){
polygon_canvas_2d.height = polygon_webgl_canvas.height;
polygon_ctx_2d.drawImage(polygon_webgl_canvas, 0, 0);
replace_colors_with_swatch(polygon_ctx_2d, fill_color);
replace_colors_with_swatch(polygon_ctx_2d, fill_color, x_min, y_min);
ctx.drawImage(polygon_canvas_2d, x_min, y_min);
}
if(stroke){
@ -833,8 +838,10 @@ function cut_polygon(points, x_min, y_min, x_max, y_max, from_canvas){
)
}
replace_colors_with_swatch(polygon_ctx_2d, stroke_color);
ctx.drawImage(polygon_canvas_2d, x_min - polygon_stroke_margin, y_min - polygon_stroke_margin);
var x = x_min - polygon_stroke_margin;
var y = y_min - polygon_stroke_margin;
replace_colors_with_swatch(polygon_ctx_2d, stroke_color, x, y);
ctx.drawImage(polygon_canvas_2d, x, y);
}else{
var numVertices = initArrayBuffer(coords);
gl.clear(gl.COLOR_BUFFER_BIT);
@ -844,7 +851,7 @@ function cut_polygon(points, x_min, y_min, x_max, y_max, from_canvas){
polygon_canvas_2d.height = polygon_webgl_canvas.height;
polygon_ctx_2d.drawImage(polygon_webgl_canvas, 0, 0);
replace_colors_with_swatch(polygon_ctx_2d, stroke_color);
replace_colors_with_swatch(polygon_ctx_2d, stroke_color, x_min, y_min);
ctx.drawImage(polygon_canvas_2d, x_min, y_min);
}
}