raphael/whiteboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix rect rendering sent to remote + Add circle tool

Browse Source
This commit is contained in:
matbgn 2022-06-25 06:34:04 +02:00
parent 508889409b
commit 4c64032c1b
1 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/js/whiteboard.js
View File

@ -327,7 +327,12 @@ const whiteboard = {
); );
_this.sendFunction({ _this.sendFunction({
t: _this.tool, t: _this.tool,
d: [_this.startCoords.x, _this.startCoords.y, currentPos.x, currentPos.y], d: [
_this.startCoords.x - _this.viewCoords.x,
_this.startCoords.y - _this.viewCoords.y,
currentPos.x - _this.viewCoords.x,
currentPos.y - _this.viewCoords.y
],
c: _this.drawcolor, c: _this.drawcolor,
th: _this.thickness, th: _this.thickness,
}); });
@ -343,7 +348,7 @@ const whiteboard = {
); );
_this.sendFunction({ _this.sendFunction({
t: _this.tool, t: _this.tool,
d: [_this.startCoords.x, _this.startCoords.y, r], d: [_this.startCoords.x - _this.viewCoords.x, _this.startCoords.y - _this.viewCoords.y, r],
c: _this.drawcolor, c: _this.drawcolor,
th: _this.thickness, th: _this.thickness,
}); });
@ -787,10 +792,12 @@ const whiteboard = {
_this.ctx.stroke(); _this.ctx.stroke();
_this.ctx.closePath(); _this.ctx.closePath();
}, },
drawCircle: function (fromX, fromY, radius, color, thickness) { drawCircle: function (fromX, fromY, radius, color, thickness, remote) {
var _this = this; var _this = this;
let xOffset = remote ? _this.viewCoords.x : 0;
let yOffset = remote ? _this.viewCoords.y : 0;
_this.ctx.beginPath(); _this.ctx.beginPath();
_this.ctx.arc(fromX, fromY, radius, 0, 2 * Math.PI, false); _this.ctx.arc(fromX + xOffset, fromY + yOffset, radius, 0, 2 * Math.PI, false);
_this.ctx.lineWidth = thickness; _this.ctx.lineWidth = thickness;
_this.ctx.strokeStyle = color; _this.ctx.strokeStyle = color;
_this.ctx.stroke(); _this.ctx.stroke();
@ -1259,7 +1266,7 @@ const whiteboard = {
} else if (tool === "rect") { } else if (tool === "rect") {
_this.drawRec(data[0], data[1], data[2], data[3], color, thickness, true); _this.drawRec(data[0], data[1], data[2], data[3], color, thickness, true);
} else if (tool === "circle") { } else if (tool === "circle") {
_this.drawCircle(data[0], data[1], data[2], color, thickness); _this.drawCircle(data[0], data[1], data[2], color, thickness, true);
} else if (tool === "eraser") { } else if (tool === "eraser") {
_this.drawEraserLine(data[0], data[1], data[2], data[3], thickness); _this.drawEraserLine(data[0], data[1], data[2], data[3], thickness);
} else if (tool === "eraseRec") { } else if (tool === "eraseRec") {