zcy
/
three.cad
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

back to vanilla

master
howard 2021-04-15 01:36:54 -07:00
parent 79ccc4f83c
commit dd81d67d8f
10 changed files with 233 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
icon/svgr_raw/flip.svg Normal file
View File

@ -0,0 +1,67 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="16"
height="16"
viewBox="0 0 16 16.000001"
version="1.1"
id="svg2112"
inkscape:version="1.0.2 (1.0.2+r75+1)"
sodipodi:docname="flip.svg">
<defs
id="defs2106" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="20.597402"
inkscape:cx="4.1301095"
inkscape:cy="12.987071"
inkscape:document-units="px"
inkscape:current-layer="layer1"
inkscape:document-rotation="0"
showgrid="false"
inkscape:window-width="1514"
inkscape:window-height="1199"
inkscape:window-x="358"
inkscape:window-y="204"
inkscape:window-maximized="0"
units="px"
inkscape:snap-object-midpoints="true"
inkscape:snap-text-baseline="true"
inkscape:snap-center="true" />
<metadata
id="metadata2109">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<path
id="path839-5"
style="fill:#000000;fill-opacity:1;stroke:none;stroke-width:2.58196px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 14.869141 0.1015625 L 4.96875 4.3457031 L 7.0976562 6.4726562 L 0.14648438 13.466797 L 1.5644531 14.875 L 8.5117188 7.8867188 L 10.626953 10.001953 L 14.869141 0.1015625 z " />
<path
id="path839-5-5"
style="fill:#000000;fill-opacity:0.7;stroke:none;stroke-width:1.19317px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 15.281473,8.3873278 11.282494,12.386307 10.321846,11.425658 8.3622506,15.999111 12.935704,14.039516 11.975055,13.078868 15.974034,9.0798883 Z" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

2
src/Scene.js
View File

@ -347,7 +347,7 @@ async function addSketch() {
}
window.sc = new Scene(store)
sc.loadState()
// sc.loadState()
// sc.camera.layers.enable(1)
// rc.layers.set(1)

6
src/extrude.js
View File

@ -1,6 +1,7 @@
import * as THREE from '../node_modules/three/src/Three';
import { color} from './shared'
export function extrude(sketch) {
export function extrude(sketch, depth) {
console.log(sketch,'here')
let constraints = sketch.constraints;
let linkedObjs = sketch.linkedObjs;
@ -67,7 +68,7 @@ export function extrude(sketch) {
findPair(children[4]) //??? need fixing
const shape = new THREE.Shape(v2s);
const extrudeSettings = { depth: 8, bevelEnabled: false };
const extrudeSettings = { depth, bevelEnabled: false };
const geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings);
@ -100,6 +101,7 @@ export function extrude(sketch) {
sketch.deactivate()
}
// this.clearSelection()
this.render()
}

2
src/mouseEvents.js
View File

@ -114,8 +114,8 @@ export function onHover(e) {
let draggedLabel;
export function onPick(e) {
console.log(e)
if (this.mode || e.buttons != 1) return
// if (this.mode || e.buttons != 1 || e.ctrlKey || e.metaKey) return
if (this.hovered.length) {
let obj = this.hovered[this.hovered.length - 1]

6
src/react/app.css
View File

@ -36,6 +36,12 @@ body {
width: var(--sideNavW);
}
.dialog {
position: absolute;
top: var(--topNavH);
left: var(--sideNavW);
}
#labels > div {
position: absolute;

30
src/react/app.jsx
View File

@ -1,27 +1,43 @@
import ReactDOM from 'react-dom'
import React from 'react'
import React, { useState } from 'react'
import { createStore, applyMiddleware} from 'redux'
import { Provider } from 'react-redux'
import { reducer, preloadedState } from './reducer'
import { reducer } from './reducer'
import logger from 'redux-logger'
import { Tree } from './tree'
import { NavBar } from './navBar'
import { ToolTip} from './toolTip'
import { Dialog } from './dialog'
import './app.css'
const store = createStore(reducer, preloadedState, applyMiddleware(logger))
const preloadedState = {
treeEntries: {
byId: {},
allIds: [],
tree: {},
order: {},
visible: {},
activeSketchId: ""
},
}
const App = ({ store }) => (
<Provider store={store}>
<NavBar />
// const store = createStore(reducer, preloadedState, applyMiddleware(logger))
const store = createStore(reducer, {}, applyMiddleware(logger))
const App = ({ store }) => {
const [dialog, setDialog] = useState()
return <Provider store={store}>
<NavBar setDialog={setDialog}/>
<Tree />
<Dialog dd={dialog}/>
<ToolTip/>
</Provider>
);
};
document.addEventListener('DOMContentLoaded', () => {
ReactDOM.render(<App store={store} />, document.getElementById('react'));

52
src/react/dialog.jsx Normal file
View File

@ -0,0 +1,52 @@
import React, { useEffect, useReducer, useRef, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux'
import { MdDone, MdClose } from 'react-icons/md'
import { GiVerticalFlip } from 'react-icons/gi'
import * as Icon from "./icons";
export const Dialog = ({ dd }) => {
if (!dd) return null
const dispatch = useDispatch()
const treeEntriesById = useSelector(state => state.treeEntries.byId)
const activeSketchId = useSelector(state => state.treeEntries.activeSketchId)
const ref = useRef()
useEffect(() => {
ref.current.focus()
}, [])
const extrude = () => {
if (sc.activeSketch) {
sc.extrude(sc.activeSketch, ref.current.value)
} else if (sc.selected.length === 1 && sc.selected[0].userData.type == 'sketch') {
sc.extrude(treeEntriesById[sc.selected[0].name], ref.current.value)
} else {
console.log('invalid selection')
}
}
const [_, forceUpdate] = useReducer(x => x + 1, 0);
return <div className='dialog w-40 h-10 flex items-center bg-gray-700'>
<input className='w-1/2' type="number" {...useNumField(1)} step="0.1" ref={ref} />
<MdDone
onClick={extrude}
className="btn w-auto h-full p-2" />
<MdClose className="btn w-auto h-full p-2" />
<Icon.Flip className="btn w-auto h-full p-2" />
</div>
}
export const useNumField = (initValue = 0) => {
const [value, setValue] = useState(initValue);
const onChange = e => setValue(e.target.value);
return { value, onChange };
}

20
src/react/icons.jsx
View File

@ -250,6 +250,24 @@ function Extrude_master(props) {
);
}
function Flip(props) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="1em"
height="1em"
viewBox="0 0 16 16"
{...props}
>
<path d="M14.87.102L4.968 4.346l2.129 2.127-6.952 6.994 1.418 1.408 6.948-6.988 2.115 2.115 4.242-9.9z" />
<path
d="M15.281 8.387l-3.999 4-.96-.961-1.96 4.573 4.574-1.96-.96-.96 3.998-4z"
fillOpacity={0.7}
/>
</svg>
);
}
function Horizontal(props) {
return (
<svg
@ -584,4 +602,4 @@ function Vertical(props) {
</svg>
);
}
export { Arc, Coincident, Dimension, Extrude, Extrude_master, Horizontal, Intersect, Intersect_thin, Line, Stl, Subtract, Tangent, Union, Union_thin, Vertical };
export { Arc, Coincident, Dimension, Extrude, Extrude_master, Flip, Horizontal, Intersect, Intersect_thin, Line, Stl, Subtract, Tangent, Union, Union_thin, Vertical };

22
src/react/navBar.jsx
View File

@ -10,7 +10,7 @@ import { MdDone, MdSave, MdFolder } from 'react-icons/md'
import * as Icon from "./icons";
export const NavBar = () => {
export const NavBar = ({setDialog}) => {
const dispatch = useDispatch()
const treeEntriesById = useSelector(state => state.treeEntries.byId)
const activeSketchId = useSelector(state => state.treeEntries.activeSketchId)
@ -25,13 +25,19 @@ export const NavBar = () => {
forceUpdate()
}
const extrude = () => {
// sc.extrude(treeEntriesById[activeSketchId])
sc.extrude(sc.activeSketch)
setDialog('dd')
// if (sc.activeSketch) {
// sc.extrude(sc.activeSketch)
// } else if (sc.selected.length === 1 && sc.selected[0].userData.type == 'sketch') {
// sc.extrude(treeEntriesById[sc.selected[0].name])
// } else {
// console.log('invalid selection')
// }
}
const addSketch = () => {
sc.addSketch()
console.log(!!sc.activeSketch,'state')
console.log(!!sc.activeSketch, 'state')
forceUpdate()
}
@ -46,9 +52,9 @@ export const NavBar = () => {
}
}, [activeSketchId])
useEffect(() => {
console.log(treeEntriesById)
}, [treeEntriesById])
// useEffect(() => {
// console.log(treeEntriesById)
// }, [treeEntriesById])
const btnz = [
@ -87,7 +93,7 @@ export const NavBar = () => {
return <div className='topNav flex justify-center items-center bg-gray-700'>
{
activeSketchId?
activeSketchId ?
btnz.map(([Icon, fcn, txt, shortcut], idx) => (
<Icon className="btn w-auto h-full p-3.5" tooltip={txt}
onClick={fcn} key={idx}

110
src/react/reducer.js
View File

@ -2,100 +2,78 @@
import { DepTree } from './depTree.mjs'
import update from 'immutability-helper'
import { combineReducers } from 'redux';
export const preloadedState = {
treeEntries: {
byId: {},
allIds: [],
tree: {},
order: {},
visible: {},
activeSketchId: ""
},
const defaultState = {
byId: {},
allIds: [],
tree: {},
order: {},
visible: {},
activeSketchId: ""
}
export function reducer(state = {}, action) {
export function treeEntries(state = defaultState, action) {
switch (action.type) {
case 'rx-sketch':
return update(state, {
treeEntries: {
byId: { [action.obj.obj3d.name]: { $set: action.obj } },
allIds: { $push: [action.obj.obj3d.name] },
tree: { [action.obj.obj3d.name]: { $set: {} } },
order: { [action.obj.obj3d.name]: { $set: state.treeEntries.allIds.length } },
visible: { [action.obj.obj3d.name]: { $set: true } },
},
byId: { [action.obj.obj3d.name]: { $set: action.obj } },
allIds: { $push: [action.obj.obj3d.name] },
tree: { [action.obj.obj3d.name]: { $set: {} } },
order: { [action.obj.obj3d.name]: { $set: state.allIds.length } },
visible: { [action.obj.obj3d.name]: { $set: true } },
})
case 'set-entry-visibility': {
return update(state, {
treeEntries: {
visible: { $merge: action.obj },
},
visible: { $merge: action.obj },
})
}
case 'set-active-sketch':
return update(state, {
treeEntries: {
visible: { [action.activeSketchId]: { $set: true } },
activeSketchId: { $set: action.activeSketchId },
},
visible: { [action.activeSketchId]: { $set: true } },
activeSketchId: { $set: action.activeSketchId },
})
case 'exit-sketch':
return update(state, {
treeEntries: {
activeSketchId: { $set: "" },
visible: { [state.treeEntries.activeSketchId]: { $set: false } },
},
activeSketchId: { $set: "" },
visible: { [state.activeSketchId]: { $set: false } },
})
case 'rx-extrusion':
return update(state, {
treeEntries: {
byId: {
[action.mesh.name]: { $set: action.mesh }
},
allIds: { $push: [action.mesh.name] },
tree: {
[action.sketchId]: { [action.mesh.name]: { $set: true } },
[action.mesh.name]: { $set: {} }
},
order: { [action.mesh.name]: { $set: state.treeEntries.allIds.length } },
visible: {
[action.mesh.name]: { $set: true }
}
byId: {
[action.mesh.name]: { $set: action.mesh }
},
allIds: { $push: [action.mesh.name] },
tree: {
[action.sketchId]: { [action.mesh.name]: { $set: true } },
[action.mesh.name]: { $set: {} }
},
order: { [action.mesh.name]: { $set: state.allIds.length } },
visible: {
[action.mesh.name]: { $set: true }
}
})
case 'rx-boolean':
return update(state, {
treeEntries: {
byId: {
[action.mesh.name]: { $set: action.mesh }
},
allIds: { $push: [action.mesh.name] },
tree: {
[action.deps[0]]: { [action.mesh.name]: { $set: true } },
[action.deps[1]]: { [action.mesh.name]: { $set: true } },
[action.mesh.name]: { $set: {} }
},
order: { [action.mesh.name]: { $set: state.treeEntries.allIds.length } }
}
byId: {
[action.mesh.name]: { $set: action.mesh }
},
allIds: { $push: [action.mesh.name] },
tree: {
[action.deps[0]]: { [action.mesh.name]: { $set: true } },
[action.deps[1]]: { [action.mesh.name]: { $set: true } },
[action.mesh.name]: { $set: {} }
},
order: { [action.mesh.name]: { $set: state.allIds.length } }
})
case 'delete-node':
const depTree = new DepTree(state.treeEntries)
const depTree = new DepTree(state)
const obj = depTree.deleteNode(action.id)
return update(state, {
treeEntries: { $merge: obj }
})
return update(state, { $merge: obj })
case 'restore-state':
return action.state
@ -106,3 +84,7 @@ export function reducer(state = {}, action) {
export const reducer = combineReducers({
treeEntries
})