mirror of
https://github.com/scratchfoundation/scratch-paint.git
synced 2025-01-10 14:42:13 -05:00
Add size, remove alias from other canvases
This commit is contained in:
parent
ba51fe59a0
commit
80b4557741
3 changed files with 20 additions and 8 deletions
|
@ -36,6 +36,9 @@ class LoupeComponent extends React.Component {
|
|||
tmpCanvas.width = LOUPE_RADIUS * 2;
|
||||
tmpCanvas.height = LOUPE_RADIUS * 2;
|
||||
const tmpCtx = tmpCanvas.getContext('2d');
|
||||
tmpCtx.webkitImageSmoothingEnabled = false;
|
||||
tmpCtx.mozImageSmoothingEnabled = false;
|
||||
tmpCtx.imageSmoothingEnabled = false;
|
||||
const imageData = tmpCtx.createImageData(
|
||||
LOUPE_RADIUS * 2, LOUPE_RADIUS * 2
|
||||
);
|
||||
|
|
|
@ -21,11 +21,12 @@ class BrushTool extends paper.Tool {
|
|||
this.colorState = null;
|
||||
this.active = false;
|
||||
this.lastPoint = null;
|
||||
this.size = 5;
|
||||
}
|
||||
setColor (color) {
|
||||
this.color = color;
|
||||
}
|
||||
bresenhamLine (point1, point2, color, callback){
|
||||
bresenhamLine (point1, point2, callback){
|
||||
// Fast Math.floor
|
||||
let x1 = ~~point1.x;
|
||||
let x2 = ~~point2.x;
|
||||
|
@ -38,7 +39,7 @@ class BrushTool extends paper.Tool {
|
|||
const sy = (y1 < y2) ? 1 : -1;
|
||||
let err = dx - dy;
|
||||
|
||||
callback(x1, y1, color);
|
||||
callback(x1, y1);
|
||||
while (x1 !== x2 || y1 !== y2) {
|
||||
let e2 = err*2;
|
||||
if (e2 >-dy) {
|
||||
|
@ -47,17 +48,21 @@ class BrushTool extends paper.Tool {
|
|||
if (e2 < dx) {
|
||||
err += dx; y1 += sy;
|
||||
}
|
||||
callback(x1, y1, color);
|
||||
callback(x1, y1);
|
||||
}
|
||||
}
|
||||
// Draw a brush mark at the given point
|
||||
draw (x, y, color) {
|
||||
getRaster().setPixel(new paper.Point(x, y), color);
|
||||
draw (centerX, centerY) {
|
||||
for (let x = centerX - this.size; x <= centerX + this.size; x++) {
|
||||
for (let y = centerY - this.size; y <= centerY + this.size; y++) {
|
||||
getRaster().setPixel(new paper.Point(x, y), this.color);
|
||||
}
|
||||
}
|
||||
}
|
||||
handleMouseDown (event) {
|
||||
if (event.event.button > 0) return; // only first mouse button
|
||||
this.active = true;
|
||||
this.draw(event.point, event.point, this.color);
|
||||
this.draw(event.point, event.point);
|
||||
this.lastPoint = event.point;
|
||||
}
|
||||
handleMouseDrag (event) {
|
||||
|
@ -67,12 +72,12 @@ class BrushTool extends paper.Tool {
|
|||
this.boundingBoxTool.onMouseDrag(event);
|
||||
return;
|
||||
}
|
||||
this.bresenhamLine(this.lastPoint, event.point, this.color, this.draw);
|
||||
this.bresenhamLine(this.lastPoint, event.point, this.draw.bind(this));
|
||||
this.lastPoint = event.point;
|
||||
}
|
||||
handleMouseUp (event) {
|
||||
if (event.event.button > 0 || !this.active) return; // only first mouse button
|
||||
this.bresenhamLine(this.lastPoint, event.point, this.color, this.draw);
|
||||
this.bresenhamLine(this.lastPoint, event.point, this.draw.bind(this));
|
||||
this.lastPoint = null;
|
||||
this.active = false;
|
||||
}
|
||||
|
|
|
@ -32,6 +32,10 @@ class EyeDropperTool extends paper.Tool {
|
|||
this.bufferCanvas = document.createElement('canvas');
|
||||
this.bufferCanvas.width = canvas.width;
|
||||
this.bufferCanvas.height = canvas.height;
|
||||
const context = this.bufferCanvas.getContext('2d')
|
||||
context.webkitImageSmoothingEnabled = false;
|
||||
context.mozImageSmoothingEnabled = false;
|
||||
context.imageSmoothingEnabled = false;
|
||||
this.bufferImage = new Image();
|
||||
this.bufferImage.onload = () => {
|
||||
this.bufferCanvas.getContext('2d').drawImage(this.bufferImage, 0, 0);
|
||||
|
|
Loading…
Reference in a new issue