From 40a692ed6a15adf258fb6076a7ccdc4a02228279 Mon Sep 17 00:00:00 2001 From: howard Date: Mon, 5 Apr 2021 01:05:53 -0700 Subject: [PATCH] non idea restore dim --- src/Scene.js | 1 + src/app.jsx | 8 +-- src/sketcher/Sketch.js | 24 ++++++-- src/sketcher/drawDimension.js | 106 ++++++++++++++++++++++++++++------ src/utils/mouseEvents.js | 24 ++++---- todo.txt | 11 ++++ 6 files changed, 138 insertions(+), 36 deletions(-) create mode 100644 todo.txt diff --git a/src/Scene.js b/src/Scene.js index 4a9bb48..f3155ea 100644 --- a/src/Scene.js +++ b/src/Scene.js @@ -194,6 +194,7 @@ function render() { for (idx = 1; idx < dims.length; idx += 2) { ele = dims[idx] + // if (!ele.label) continue; pos = _vec3.set( ...ele.geometry.attributes.position.array diff --git a/src/app.jsx b/src/app.jsx index 5bb53b0..24de728 100644 --- a/src/app.jsx +++ b/src/app.jsx @@ -60,10 +60,10 @@ const App = () => { [Icon.Arc, () => sc.extrude(treeEntries.byNid[activeSketchNid]), 'Arc'], ] - return
+ return
{ btnz.map(([Icon, fcn, txt], idx) => ( -
{txt}
@@ -102,7 +102,7 @@ const TreeEntry = ({ entId }) => { const vis = obj3d.visible - return
+ return
{ activeSketchNid && treeEntries[activeSketchNid].deactivate() @@ -146,7 +146,7 @@ const TreeEntry = ({ entId }) => { onPointerLeave={() => { const obj = entry if (entId[0] == 'm' && !sc.selected.includes(obj)) { - obj.material.color.set(color.m) + obj.material.color.set(color.mesh) sc.render() } }} diff --git a/src/sketcher/Sketch.js b/src/sketcher/Sketch.js index ee510f8..70dd07c 100644 --- a/src/sketcher/Sketch.js +++ b/src/sketcher/Sketch.js @@ -9,7 +9,7 @@ import { get3PtArc } from './drawArc' import { _vec2, _vec3, raycaster, awaitPts } from '../utils/shared' import { replacer, reviver } from '../utils/mapJSONReplacer' import { AxesHelper } from '../utils/axes' -import { drawDimension, _onMoveDimension, updateDimLines } from './drawDimension'; +import { drawDimension, _onMoveDimension, setDimLines } from './drawDimension'; @@ -110,9 +110,10 @@ class Sketch { this.drawOnClick1 = drawOnClick1.bind(this); this.drawPreClick2 = drawPreClick2.bind(this); this.drawOnClick2 = drawOnClick2.bind(this); + this.drawDimension = drawDimension.bind(this) this._onMoveDimension = _onMoveDimension.bind(this) - this.updateDimLines = updateDimLines.bind(this) + this.setDimLines = setDimLines.bind(this) this.awaitPts = awaitPts.bind(this); @@ -131,8 +132,9 @@ class Sketch { this.canvas.addEventListener('pointerdown', this.onPick) this.canvas.addEventListener('pointermove', this.onHover) this.store.dispatch({ type: 'set-active-sketch', sketch: this.obj3d.name }) - + this.setDimLines() + window.sketcher = this } @@ -141,6 +143,7 @@ class Sketch { this.canvas.removeEventListener('pointerdown', this.onPick) this.canvas.removeEventListener('pointermove', this.onHover) this.store.dispatch({ type: 'exit-sketch' }) + this.labelContainer.innerHTML = "" } @@ -174,6 +177,7 @@ class Sketch { case 'Escape': drawClear.bind(this)() this.mode = "" + document.activeElement.blur() break; case 'l': if (this.mode == 'line') { @@ -328,6 +332,18 @@ class Sketch { } } + + updateBoundingSpheres() { + for (let x = 3; x < this.obj3d.children.length; x++) { + const obj = this.obj3d.children[x] + obj.geometry.computeBoundingSphere() + } + + for (let x = 0; x < this.obj3d.children[1].children.length; x++) { + const obj = this.obj3d.children[1].children[x] + obj.geometry.computeBoundingSphere() + } + } getLocation(e) { raycaster.setFromCamera( _vec2.set( @@ -411,7 +427,7 @@ class Sketch { } - this.updateDimLines() + this.setDimLines() this.obj3d.dispatchEvent({ type: 'change' }) } diff --git a/src/sketcher/drawDimension.js b/src/sketcher/drawDimension.js index 239a97d..599d586 100644 --- a/src/sketcher/drawDimension.js +++ b/src/sketcher/drawDimension.js @@ -34,17 +34,23 @@ export async function drawDimension() { line.userData.nids = pts.map(e => e.name) - const groupLines = this.obj3d.children[1] - groupLines.add(line) - groupLines.add(point) + + let dist = 0 + for (let i = 0; i < 3; i++) { + dist += (pts[0].geometry.attributes.position.array[i] - pts[1].geometry.attributes.position.array[i]) ** 2 + } + dist = Math.sqrt(dist) + + this.obj3d.children[1].add(line).add(point) const onMove = this._onMoveDimension(point, line) point.label = document.createElement('div'); - point.label.textContent = '10000'; + point.label.textContent = dist.toFixed(3); + point.label.contentEditable = true; this.labelContainer.append(point.label) @@ -67,7 +73,7 @@ export async function drawDimension() { if (add) { this.constraints.set(++this.c_id, //??? [ - 'pt_pt_distance', 10, + 'pt_pt_distance', dist, [pts[0].name, pts[1].name, -1, -1] ] ) @@ -81,16 +87,41 @@ export async function drawDimension() { point.name = this.c_id point.userData.type = 'dimension' + const updateDim = (c_id) => (ev_focus) => { + const value = ev_focus.target.textContent + console.log(value) + document.addEventListener('keydown', (e) => { + if (e.key == 'Enter') { + e.preventDefault() + const ent = this.constraints.get(c_id) + ent[1] = parseFloat(ev_focus.target.textContent) + this.constraints.set(c_id, ent) + this.updateOtherBuffers() + this.solve() + sc.render() + ev_focus.target.blur() + this.updateBoundingSpheres() + } else if (e.key == 'Escape') { + ev_focus.target.textContent = value + getSelection().empty() + ev_focus.target.blur() + } + }) + } + + point.label.addEventListener('focus', updateDim(this.c_id)) + + - } else { - groupLines.splice(groupLines.length - 2).forEach( + this.obj3d.children[1].children.splice(this.obj3d.children[1].length - 2, 2).forEach( e => { e.geometry.dispose() e.material.dispose() } ) + this.labelContainer.removeChild(this.labelContainer.lastChild); sc.render() } @@ -100,7 +131,7 @@ export async function drawDimension() { const p1 = new THREE.Vector2() const p2 = new THREE.Vector2() const p3 = new THREE.Vector2() -let dir, hyp, proj, perp, p1e, p2e, nids, _p1, _p2, _p3; +let dir, hyp, proj, perp, p1e, p2e, nids, _p1, _p2; export function _onMoveDimension(point, line) { @@ -131,19 +162,58 @@ export function _onMoveDimension(point, line) { } -export function updateDimLines() { +export function setDimLines() { + const updateDim = (c_id) => (ev_focus) => { + const value = ev_focus.target.textContent + console.log(value) + document.addEventListener('keydown', (e) => { + if (e.key == 'Enter') { + e.preventDefault() + const ent = this.constraints.get(c_id) + ent[1] = parseFloat(ev_focus.target.textContent) + this.constraints.set(c_id, ent) + this.updateOtherBuffers() + this.solve() + sc.render() + ev_focus.target.blur() + this.updateBoundingSpheres() + } else if (e.key == 'Escape') { + ev_focus.target.textContent = value + getSelection().empty() + ev_focus.target.blur() + } + }) + } + + const restoreLabels = this.labelContainer.childElementCount == 0; + + const dims = this.obj3d.children[1].children + + let point, dist; + for (let i = 0; i < dims.length; i += 2) { - const groupLines = this.obj3d.children[1].children + if (restoreLabels) { + point = dims[i + 1] // point node is at i+1 + dist = this.constraints.get(point.name)[1] + point.label = document.createElement('div'); + point.label.textContent = dist.toFixed(3); + point.label.contentEditable = true; + this.labelContainer.append(point.label) - for (let i = 0; i < groupLines.length; i += 2) { - nids = groupLines[i].userData.nids + + point.label.addEventListener('focus', updateDim(this.c_id)) + + } + + + nids = dims[i].userData.nids _p1 = this.obj3d.children[sketcher.objIdx.get(nids[0])].geometry.attributes.position.array _p2 = this.obj3d.children[sketcher.objIdx.get(nids[1])].geometry.attributes.position.array - _p3 = groupLines[i + 1].geometry.attributes.position.array - const offset = groupLines[i + 1].userData.offset + + const offset = dims[i + 1].userData.offset p1.set(_p1[0], _p1[1]) p2.set(_p2[0], _p2[1]) @@ -151,8 +221,8 @@ export function updateDimLines() { update( - groupLines[i].geometry.attributes.position, - groupLines[i + 1].geometry.attributes.position + dims[i].geometry.attributes.position, + dims[i + 1].geometry.attributes.position ) } @@ -183,4 +253,6 @@ function update(linegeom, pointgeom) { pointgeom.array.set(p3.toArray()) pointgeom.needsUpdate = true; -} \ No newline at end of file +} + + diff --git a/src/utils/mouseEvents.js b/src/utils/mouseEvents.js index 4d2d7f1..0f55b1b 100644 --- a/src/utils/mouseEvents.js +++ b/src/utils/mouseEvents.js @@ -101,9 +101,8 @@ export function onPick(e) { this.canvas.addEventListener('pointermove', this.onDragDim); this.canvas.addEventListener('pointerup', this.onRelease) } - + draggedLabel = this.obj3d.children[1].children[idx].label - console.log(draggedLabel) draggedLabel.style.zIndex = -1; break; case 'point': @@ -153,16 +152,19 @@ export function onRelease() { this.canvas.removeEventListener('pointermove', this.onDragDim) this.canvas.removeEventListener('pointerup', this.onRelease) - for (let x = 3; x < this.obj3d.children.length; x++) { - const obj = this.obj3d.children[x] - obj.geometry.computeBoundingSphere() - } + // for (let x = 3; x < this.obj3d.children.length; x++) { + // const obj = this.obj3d.children[x] + // obj.geometry.computeBoundingSphere() + // } - for (let x = 0; x < this.obj3d.children[1].children.length; x++) { - const obj = this.obj3d.children[1].children[x] - obj.geometry.computeBoundingSphere() - } + // for (let x = 0; x < this.obj3d.children[1].children.length; x++) { + // const obj = this.obj3d.children[1].children[x] + // obj.geometry.computeBoundingSphere() + // } - draggedLabel.style.zIndex = 0; + this.updateBoundingSpheres() + if (draggedLabel) { + draggedLabel.style.zIndex = 0; + } } diff --git a/todo.txt b/todo.txt new file mode 100644 index 0000000..40e3db9 --- /dev/null +++ b/todo.txt @@ -0,0 +1,11 @@ +fix css on design tree (a lot of work) \ +clear dim on exit exit sketch / rehydrate when back or after loading +boolean flesh out refresh / replace mesh +dimension to origin +fix extrusion loop find +reattaching sketch +file save +stl export + +angle +other constraints / sprite \ No newline at end of file