From 9d85a61c6bc95310328c6ebdac5ebbc370196765 Mon Sep 17 00:00:00 2001 From: howard Date: Wed, 14 Apr 2021 11:51:38 -0700 Subject: [PATCH] working --- src/Sketch.js | 27 ++++++++++++++++----- src/drawArc.js | 4 ++-- src/drawDimension.js | 2 +- src/drawEvents.js | 56 +++++++++++++++++++++++++++----------------- src/drawLine.js | 19 --------------- 5 files changed, 59 insertions(+), 49 deletions(-) diff --git a/src/Sketch.js b/src/Sketch.js index 6d2e89c..7ba052c 100644 --- a/src/Sketch.js +++ b/src/Sketch.js @@ -213,20 +213,23 @@ class Sketch { if (this.mode == 'line') { drawClear.call(this) } - this.canvas.addEventListener('pointerdown', this.drawOnClick1) this.mode = "line" + this.canvas.addEventListener('pointerdown', this.drawOnClick1, {once:true}) break; case 'a': - this.canvas.addEventListener('pointerdown', this.drawOnClick1) this.mode = "arc" + this.canvas.addEventListener('pointerdown', this.drawOnClick1, {once:true}) break; case 'd': - this.drawDimension() + if (this.mode != '') { + drawClear.call(this) + } this.mode = "" + this.drawDimension() break; case 'p': - this.canvas.addEventListener('pointerdown', this.drawOnClick1) this.mode = "point" + this.canvas.addEventListener('pointerdown', this.drawOnClick1, {once:true}) break; case 'Delete': this.deleteSelected() @@ -234,19 +237,31 @@ class Sketch { case 'Backspace': this.deleteSelected() break; - case ' ': + case 'c': + if (this.mode != '') { + drawClear.call(this) + } setCoincident.call(this) this.mode = "" break; case 'v': + if (this.mode != '') { + drawClear.call(this) + } setOrdinate.call(this, 0) this.mode = "" break; case 'h': + if (this.mode != '') { + drawClear.call(this) + } setOrdinate.call(this, 1) this.mode = "" break; case 't': + if (this.mode != '') { + drawClear.call(this) + } setTangent.call(this) this.mode = "" break; @@ -287,7 +302,7 @@ class Sketch { } delete(obj) { - + if (!obj) return if (obj.userData.type == 'dimension') { this.deleteConstraints(obj.name) return diff --git a/src/drawArc.js b/src/drawArc.js index d2dc6fc..6c4c954 100644 --- a/src/drawArc.js +++ b/src/drawArc.js @@ -58,7 +58,7 @@ const _p2 = new Vector2() const _l12 = new Vector2() -export function arcOnClick2(p1, p2) { +export function drawArc3(p1, p2) { _p1.set( p1.geometry.attributes.position.array[0], p1.geometry.attributes.position.array[1] @@ -73,7 +73,7 @@ export function arcOnClick2(p1, p2) { } let r_cross_s, centerScalar, ccw, points -export function drawArc3(mouseLoc, toPush) { +export function drawArc4(mouseLoc, toPush) { const [p1, p2, p3, arc] = toPush _vec2.set(mouseLoc.x - _p1.x, mouseLoc.y - _p1.y) diff --git a/src/drawDimension.js b/src/drawDimension.js index f98722b..5d357f0 100644 --- a/src/drawDimension.js +++ b/src/drawDimension.js @@ -2,7 +2,7 @@ import * as THREE from '../node_modules/three/src/Three'; import { color } from './shared' const lineMaterial = new THREE.LineBasicMaterial({ - linewidth: 2, + linewidth: 1, color: color.dimension, }) diff --git a/src/drawEvents.js b/src/drawEvents.js index 924c369..ed36264 100644 --- a/src/drawEvents.js +++ b/src/drawEvents.js @@ -1,18 +1,38 @@ -import { drawArc, drawArc2, arcOnClick2, drawArc3 } from './drawArc' +import { drawArc, drawArc2, drawArc3, drawArc4 } from './drawArc' import { drawLine, drawLine2 } from './drawLine' import { ptObj } from './shared' export function drawOnClick1(e) { if (e.buttons !== 1) return - this.canvas.removeEventListener('pointerdown', this.drawOnClick1) + + // this.canvas.removeEventListener('pointerdown', this.drawOnClick1) + this.canvas.addEventListener('pointermove', this.drawPreClick2) - this.canvas.addEventListener('pointerdown', this.drawOnClick2) + this.canvas.addEventListener('pointerdown', this.drawOnClick2, { once: true }) const mouseLoc = this.getLocation(e).toArray(); + // this.mode allow alow following modes to create new obj3ds if (this.mode == "line") { - this.toPush = drawLine.call(this, mouseLoc) + this.toPush = drawLine(mouseLoc) + + if (this.subsequent) { + const p1 = this.toPush[0] + + this.constraints.set(++this.c_id, //??? why incremennt before not after + [ + 'points_coincident', -1, + [this.obj3d.children[this.obj3d.children.length - 2].name, p1.name, -1, -1] + ] + ) + + p1.userData.constraints.push(this.c_id) + this.obj3d.children[this.obj3d.children.length - 2].userData.constraints.push(this.c_id) + + } + + } else if (this.mode == "arc") { this.toPush = drawArc(mouseLoc) } else if (this.mode == 'point') { @@ -50,11 +70,11 @@ export function drawPreClick2(e) { export function drawOnClick2(e) { if (e.buttons !== 1) return; this.canvas.removeEventListener('pointermove', this.drawPreClick2); - this.canvas.removeEventListener('pointerdown', this.drawOnClick2); this.updatePointsBuffer(this.updatePoint) this.updateOtherBuffers() + // a this.mode == "" will prevent event chain from persisisting if (this.mode == "line") { this.subsequent = true this.drawOnClick1(e) @@ -63,10 +83,10 @@ export function drawOnClick2(e) { this.drawOnClick1(e) } else if (this.mode == "arc") { - arcOnClick2(this.toPush[0], this.toPush[1]) + drawArc3(this.toPush[0], this.toPush[1]) this.canvas.addEventListener('pointermove', this.drawPreClick3) - this.canvas.addEventListener('pointerdown', this.drawOnClick3) + this.canvas.addEventListener('pointerdown', this.drawOnClick3, { once: true }) } } @@ -75,14 +95,14 @@ export function drawOnClick2(e) { let ccw; export function drawPreClick3(e) { const mouseLoc = this.getLocation(e); - ccw = drawArc3(mouseLoc, this.toPush) + ccw = drawArc4(mouseLoc, this.toPush) sc.render() } export function drawOnClick3(e) { if (e.buttons !== 1) return; this.canvas.removeEventListener('pointermove', this.drawPreClick3); - this.canvas.removeEventListener('pointerdown', this.drawOnClick3); + if (!ccw) { let temp const ent = this.linkedObjs.get(this.l_id - 1) @@ -95,7 +115,10 @@ export function drawOnClick3(e) { this.linksBuf[i + 1] = this.linksBuf[i + 2] this.linksBuf[i + 2] = temp } - this.canvas.addEventListener('pointerdown', this.drawOnClick1) + + + this.updatePoint = this.obj3d.children.length + this.canvas.addEventListener('pointerdown', this.drawOnClick1, { once: true }) } @@ -103,17 +126,7 @@ export function drawOnClick3(e) { export function drawClear() { if (this.mode == "") return - if (this.mode == "line") { - this.canvas.removeEventListener('pointerdown', this.drawOnClick1) - this.canvas.removeEventListener('pointermove', this.drawPreClick2); - this.canvas.removeEventListener('pointerdown', this.drawOnClick2); - - this.delete(this.obj3d.children[this.updatePoint]) - - this.obj3d.dispatchEvent({ type: 'change' }) - this.subsequent = false - this.toPush = [] - } if (this.mode == "arc") { + if (['line', 'arc'].includes(this.mode)) { this.canvas.removeEventListener('pointerdown', this.drawOnClick1) this.canvas.removeEventListener('pointermove', this.drawPreClick2); this.canvas.removeEventListener('pointerdown', this.drawOnClick2); @@ -126,6 +139,7 @@ export function drawClear() { this.subsequent = false this.toPush = [] } + } diff --git a/src/drawLine.js b/src/drawLine.js index 4f1f16d..c021b85 100644 --- a/src/drawLine.js +++ b/src/drawLine.js @@ -1,4 +1,3 @@ -import * as THREE from '../node_modules/three/src/Three'; import {ptObj, lineObj} from './shared' export function drawLine(mouseLoc) { @@ -21,24 +20,6 @@ export function drawLine(mouseLoc) { line.geometry.attributes.position.set(mouseLoc) p1.geometry.attributes.position.set(mouseLoc) - if (this.subsequent) { - - this.constraints.set(++this.c_id, //??? why incremennt before not after - [ - 'points_coincident', -1, - [this.obj3d.children[this.obj3d.children.length - 2].name, p1.name, -1, -1] - ] - ) - - p1.userData.constraints.push(this.c_id) - this.obj3d.children[this.obj3d.children.length - 2].userData.constraints.push(this.c_id) - - - - } - - - return [p1, p2, line]; }