Added back tool resizing

This commit is contained in:
unsettledgames 2021-11-08 23:12:51 +01:00
parent ea45fa4842
commit 3c62a1f0fd
6 changed files with 69 additions and 68 deletions

View File

@ -11,8 +11,6 @@ class Tool {
cursorType = {};
cursor = undefined;
cursorHTMLElement = undefined;
currSize = 1;
prevSize = 1;
// Useful coordinates
startMousePos = {};

View File

@ -34,20 +34,22 @@ const ToolManager = (() => {
let mousePos = Input.getCursorPosition(mouseEvent);
if (!Input.isDragging()) {
switch(mouseEvent.which) {
case 1:
if (!Input.isDragging()) {
currTool.onStart(mousePos, mouseEvent.target);
}
break;
case 2:
panTool.onStart(mousePos, mouseEvent.target);
break;
case 3:
currTool.onRightStart(mousePos, mouseEvent.target);
break;
default:
break;
}
}
}
function onMouseMove(mouseEvent) {
if (!Startup.documentCreated())
@ -57,7 +59,20 @@ const ToolManager = (() => {
currTool.onHover(mousePos, mouseEvent.target);
if (Input.isDragging()) {
switch (mouseEvent.which) {
case 1:
currTool.onDrag(mousePos, mouseEvent.target);
break;
case 2:
panTool.onDrag(mousePos, mouseEvent.target);
break;
case 3:
currTool.onRightDrag(mousePos, mouseEvent.target);
break;
default:
console.log("wtf");
break;
}
}
}
@ -66,20 +81,22 @@ const ToolManager = (() => {
return;
let mousePos = Input.getCursorPosition(mouseEvent);
if (Input.isDragging()) {
switch(mouseEvent.which) {
case 1:
if (Input.isDragging()) {
currTool.onEnd(mousePos);
}
break;
case 2:
panTool.onEnd(mousePos);
break;
case 3:
currTool.onRightEnd(mousePos, mouseEvent.target);
break;
default:
break;
}
}
}
function currentTool() {
return currTool;

View File

@ -1,28 +0,0 @@
// ellipse
Events.on('click','ellipse-button', function(e){
// If the user clicks twice on the button, they change the draw mode
if (currentTool.name == 'ellipse') {
if (ellipseDrawMode == 'empty') {
ellipseDrawMode = 'fill';
setEllipseToolSvg();
}
else {
ellipseDrawMode = 'empty';
setEllipseToolSvg();
}
}
else {
tool.ellipse.switchTo();
}
}, false);
// ellipse bigger
Events.on('click',"ellipse-bigger-button", function(){
tool.ellipse.brushSize++;
}, false);
// ellipse smaller
Events.on('click',"ellipse-smaller-button", function(e){
if(tool.ellipse.brushSize > 1)
tool.ellipse.brushSize--;
}, false);

View File

@ -12,7 +12,7 @@
//=include ColorModule.js
//=include _drawLine.js
//=include _tools.js
//=include Tool.js
//=include tools/ResizableTool.js
//=include tools/SelectionTool.js
@ -53,7 +53,6 @@
//=include SplashPage.js
/**buttons**/
//=include _toolButtons.js
//=include FileManager.js
//=include TopMenuModule.js
//=include _ellipse.js

View File

@ -1,5 +1,32 @@
class ResizableTool extends Tool {
startResizePos = undefined;
currSize = 1;
prevSize = 1;
constructor(name, options, switchFunc) {
super(name, options, switchFunc);
}
onRightStart(mousePos, mouseEvent) {
this.startResizePos = mousePos;
}
onRightDrag(mousePos, mouseEvent) {
//get new brush size based on x distance from original clicking location
let distanceFromClick = mousePos[0]/zoom - this.startResizePos[0]/zoom;
let brushSizeChange = Math.round(distanceFromClick/10);
let newBrushSize = this.currSize + brushSizeChange;
//set the brush to the new size as long as its bigger than 1 and less than 128
this.currSize = Math.min(Math.max(1,newBrushSize), 128);
//fix offset so the cursor stays centered
this.updateCursor();
this.onHover(this.startResizePos, mouseEvent);
}
onRightEnd(mousePos, mouseEvent) {
}
}

View File

@ -1,12 +0,0 @@
new Tool('resizeline', {
cursor: 'default',
});
new Tool('ellipse', {
cursor: 'none',
brushPreview: true,
});
new Tool('moveselection', {
cursor: 'crosshair',
});