h3n3/cadhub
1
0
Fork 0
Code Issues 35 Pull Requests Packages Projects Releases Wiki Activity

Initial editor tabs implementation with CAD package guides #519

Merged
franknoirot merged 12 commits from editor-tabs into main 2021-09-20 09:55:30 +02:00
Conversation 25 Commits 12 Files Changed 20 +83 -70
6 changed files with 83 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 634304dfce - Show all commits

9
app/web/src/components/CadPackage/CadPackage.tsx
View File

@@ -49,14 +49,15 @@ const CadPackage = ({
<button
onClick={onClick}
className={
`grid grid-flow-col-dense items-center gap-2 text-gray-100 bg-opacity-30 hover:bg-opacity-80 ${cadPackageConfig.buttonClasses} ` +
className
`grid grid-flow-col-dense items-center gap-2 text-gray-100 bg-opacity-30 ${
onClick && ' hover:bg-opacity-80 '
} ${cadPackageConfig?.buttonClasses} ` + className
}
>
<div
className={`${cadPackageConfig.dotClasses} ${dotClass} rounded-full`}
className={`${cadPackageConfig?.dotClasses} ${dotClass} rounded-full`}
/>
{cadPackageConfig.label}
{cadPackageConfig?.label}
</button>
)
}

1
app/web/src/components/ProjectsOfUserCell/ProjectsOfUserCell.tsx
View File

@@ -8,6 +8,7 @@ export const QUERY = gql`
id
title
mainImage
cadPackage
franknoirot commented 2021-09-19 17:10:51 +02:00 (Migrated from github.com)
Review
Copy Link

@Irev-Dev I didn't catch that we didn't have the cadPackage badges showing on the UserProfile before!

@Irev-Dev I didn't catch that we didn't have the cadPackage badges showing on the UserProfile before!
franknoirot commented 2021-09-19 17:27:22 +02:00 (Migrated from github.com)
Review
Copy Link

It wasn't related to onClick because I made that optional, but rather the reworking to make it a config with dotClasses and buttonClasses based on the current CAD Package which was undefined in UserProfile because of this missing query field.

It wasn't related to `onClick` because I made that optional, but rather the reworking to make it a config with `dotClasses` and `buttonClasses` based on the current CAD Package which was undefined in `UserProfile` because of this missing query field.
Irev-Dev commented 2021-09-19 21:14:53 +02:00 (Migrated from github.com)
Review
Copy Link

Ah nice.

Ah nice.
createdAt
updatedAt
user {

8
app/web/src/globals.d.ts vendored
View File

@@ -1,7 +1,7 @@
// While the raw-loader Webpack plugin actually makes these imports work, this
// eliminates noisy TypeScript errors by registering these file endings as types.
// Learned this method of registering modules from https://stackoverflow.com/a/57444766
declare module "*.md";
declare module "*.scad";
declare module "*.py";
declare module "*.jscad.js";
declare module '*.md'
declare module '*.scad'
declare module '*.py'
declare module '*.jscad.js'

22
app/web/src/helpers/cadPackages/index.ts
View File

@@ -2,11 +2,33 @@ import { DefaultKernelExport } from './common'
import type { CadPackageType } from 'src/components/CadPackage/CadPackage'
import openscad from './openScad/openScadController'
import openScadGuide from 'src/helpers/cadPackages/openScad/userGuide.md'
import openScadInitialCode from 'src/helpers/cadPackages/openScad/initialCode.scad'
import cadquery from './cadQueryController'
import cadQueryGuide from 'src/helpers/cadPackages/cadQuery/userGuide.md'
import cadQueryInitialCode from 'src/helpers/cadPackages/cadQuery/initialCode.py'
import jscad from './jsCad/jsCadController'
import jsCadGuide from 'src/helpers/cadPackages/jsCad/userGuide.md'
import jsCadInitialCode from 'src/helpers/cadPackages/jsCad/initialCode.jscad.js'
export const cadPackages: { [key in CadPackageType]: DefaultKernelExport } = {
openscad,
cadquery,
jscad,
}
export const initGuideMap: { [key in CadPackageType]: string } = {
openscad: openScadGuide,
cadquery: cadQueryGuide,
jscad: jsCadGuide,
INIT: '',
}
export const initCodeMap: { [key in CadPackageType]: string } = {
openscad: openScadInitialCode,
cadquery: cadQueryInitialCode,
jscad: jsCadInitialCode,
INIT: '',
}

50
app/web/src/helpers/cadPackages/jsCad/initialCode.jscad.js
View File

@@ -7,27 +7,37 @@ const { degToRad } = jscad.utils // because jscad uses radians for rotations
// https://openjscad.xyz/docs/module-modeling_booleans.html
const { subtract } = jscad.booleans
function main({//@jscad-params
// Box example
width=40, // Width
length=20, // Length
height=10, // Height
hole=3,// Hole for cables diameter (0=no hole)
wall=1, // wall {min:0.5, step:0.5}
flip=0, // print orientation {type: 'choice', values: [0, 90, 180]}
}){
let wallOffset = wall * 2
let model = subtract(
cuboid({size:[width, length, height]}),
translate([0,0,wall], cuboid({size:[width-wallOffset, length-wallOffset, height+wall]})),
function main({
//@jscad-params
// Box example
width = 40, // Width
length = 20, // Length
height = 10, // Height
hole = 3, // Hole for cables diameter (0=no hole)
wall = 1, // wall {min:0.5, step:0.5}
flip = 0, // print orientation {type: 'choice', values: [0, 90, 180]}
}) {
let wallOffset = wall * 2
let model = subtract(
cuboid({ size: [width, length, height] }),
translate(
[0, 0, wall],
cuboid({ size: [width - wallOffset, length - wallOffset, height + wall] })
)
if(hole){
model = subtract( model,
translate([width/2-wall/2], rotate([0, degToRad(90), 0 ], cylinder({radius:hole/2, height:wall})))
)
if (hole) {
model = subtract(
model,
translate(
[width / 2 - wall / 2],
rotate(
[0, degToRad(90), 0],
cylinder({ radius: hole / 2, height: wall })
)
}
return rotate([degToRad(flip), 0, degToRad(90)], model)
)
)
}
return rotate([degToRad(flip), 0, degToRad(90)], model)
}
module.exports = {main}
module.exports = { main }

63
app/web/src/helpers/hooks/useIdeState.ts
View File

@@ -1,18 +1,12 @@
import { useReducer } from 'react'
import { cadPackages } from 'src/helpers/cadPackages'
import { cadPackages, initCodeMap, initGuideMap } from 'src/helpers/cadPackages'
import type { RootState } from '@react-three/fiber'
import type {
RawCustomizerParams,
franknoirot commented 2021-09-19 06:42:33 +02:00 (Migrated from github.com)
Review
Copy Link

These work but cause TS errors in VS Code. Unsure how to fix but will investigate, I have a hunch that .d.ts files might help this?

These work but cause TS errors in VS Code. Unsure how to fix but will investigate, I have a hunch that `.d.ts` files might help this?
franknoirot commented 2021-09-19 07:06:29 +02:00 (Migrated from github.com)
Review
Copy Link

Got it fixed with globals.d.ts file

Got it fixed with `globals.d.ts` file
ArtifactTypes,
} from 'src/helpers/cadPackages/common'
import { CadhubParams } from 'src/components/Customizer/customizerConverter'
import openScadGuide from 'src/helpers/cadPackages/openScad/userGuide.md'
import openScadInitialCode from 'src/helpers/cadPackages/openScad/initialCode.scad'
import cadQueryGuide from 'src/helpers/cadPackages/cadQuery/userGuide.md'
import cadQueryInitialCode from 'src/helpers/cadPackages/cadQuery/initialCode.py'
import jsCadGuide from 'src/helpers/cadPackages/jsCad/userGuide.md'
import jsCadInitialCode from 'src/helpers/cadPackages/jsCad/initialCode.jscad.js'
import { CadPackageType } from 'src/components/CadPackage/CadPackage'
function withThunk(dispatch, getState) {
return (actionOrThunk) =>
@@ -20,21 +14,6 @@ function withThunk(dispatch, getState) {
? actionOrThunk(dispatch, getState)
: dispatch(actionOrThunk)
}
import { CadPackageType } from 'src/components/CadPackage/CadPackage'
const initGuideMap: { [key in CadPackageType]: string } = {
openscad: openScadGuide,
cadquery: cadQueryGuide,
jscad: jsCadGuide,
INIT: '',
}
const initCodeMap: { [key in CadPackageType]: string } = {
openscad: openScadInitialCode,
cadquery: cadQueryInitialCode,
jscad: jsCadInitialCode,
INIT: '',
}
const codeStorageKey = 'Last-editor-code'
export const makeCodeStoreKey = (ideType) => `${codeStorageKey}-${ideType}`
@@ -251,25 +230,25 @@ const reducer = (state: State, { type, payload }): State => {
],
currentModel: payload === 0 ? 0 : payload - 1,
}
franknoirot commented 2021-09-19 05:39:25 +02:00 (Migrated from github.com)
Review
Copy Link

These are not used anywhere yet, so I haven't gotten to test them out.

These are not used anywhere yet, so I haven't gotten to test them out.
Irev-Dev commented 2021-09-19 09:31:22 +02:00 (Migrated from github.com)
Review
Copy Link

Could we maybe comment these out then?
I think that a good compromise between "we're going to use them very soon so lets leave them" and "Lets not add dead code to the project".

Could we maybe comment these out then? I think that a good compromise between "we're going to use them very soon so lets leave them" and "Lets not add dead code to the project".
franknoirot commented 2021-09-19 16:21:46 +02:00 (Migrated from github.com)
Review
Copy Link

Of course, good call.

Of course, good call.
case 'updateEditorModel': {
const newModels = [...state.models]
newModels[state.currentModel].content = payload
return {
...state,
models: newModels,
}
}
case 'reorderEditorModels': {
const newModels = [
...state.models.slice(0, state.currentModel),
...state.models.slice(state.currentModel + 1),
].splice(payload, 0, state.models[state.currentModel])
return {
...state,
models: newModels,
currentModel: payload,
}
}
// case 'updateEditorModel': {
// const newModels = [...state.models]
// newModels[state.currentModel].content = payload
// return {
// ...state,
// models: newModels,
// }
// }
// case 'reorderEditorModels': {
// const newModels = [
// ...state.models.slice(0, state.currentModel),
// ...state.models.slice(state.currentModel + 1),
// ].splice(payload, 0, state.models[state.currentModel])
// return {
// ...state,
// models: newModels,
// currentModel: payload,
// }
// }
default:
return state
}