-
Notifications
You must be signed in to change notification settings - Fork 27
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Import behave flow + flow side by side model viewer #159
Closed
Closed
Changes from 3 commits
Commits
Show all changes
8 commits
Select commit
Hold shift + click to select a range
2f263f7
Added behave-flow to repo.
oveddan aa3a78a
flow example should use "npm run start" like all other projects.
bhouston f6e36a8
remove accidental remnants
oveddan 2961049
move three into its own package and use it in three-viewer
bhouston a88a16c
Merge branch 'behave-flow' of github.com:oveddan/behave-graph into be…
bhouston 83b4cb5
Merge remote-tracking branch 'origin/main' into behave-flow
bhouston 65d5ca5
update lint + prettier
bhouston fa6debd
forgotten file with .js extensions.
bhouston File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -5,3 +5,4 @@ package-lock.json | |
| node-spec.json | ||
| *.blend1 | ||
| node-spec.csv | ||
| yarn.lock | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| # Logs | ||
| logs | ||
| *.log | ||
| npm-debug.log* | ||
| yarn-debug.log* | ||
| yarn-error.log* | ||
| pnpm-debug.log* | ||
| lerna-debug.log* | ||
|
|
||
| node_modules | ||
| dist | ||
| dist-ssr | ||
| *.local | ||
|
|
||
| # Editor directories and files | ||
| .vscode/* | ||
| !.vscode/extensions.json | ||
| .idea | ||
| .DS_Store | ||
| *.suo | ||
| *.ntvs* | ||
| *.njsproj | ||
| *.sln | ||
| *.sw? |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| # Behave-Graph Flow Editor | ||
|
|
||
| This example contains a real-time flow-editor for behave-graph originally created by @beeglebug in a separate repository [behave-flow](https://github.com/beeglebug/behave-flow) by @beeglebug. It has been imported into this monorepo to enable both the editor code and core framework code to be developed against/update in tandem. | ||
|
|
||
| It is built in react and typescript, with the front-end hosted in a a serverless vite app. | ||
|
|
||
| To Build: | ||
|
|
||
| npm run build | ||
|
|
||
| To Run: | ||
|
|
||
| npm run dev |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <link rel="icon" type="image/svg+xml" href="/vite.svg" /> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| <title>Behave Graph Flow Editor</title> | ||
| </head> | ||
| <body> | ||
| <div id="root"></div> | ||
| <script type="module" src="/src/main.tsx"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,47 @@ | ||
| { | ||
| "name": "@behave-graph/examples-flow", | ||
| "private": true, | ||
| "version": "0.0.1", | ||
| "type": "module", | ||
| "scripts": { | ||
| "start": "vite", | ||
| "build": "vite build", | ||
| "preview": "vite preview" | ||
| }, | ||
| "dependencies": { | ||
| "@behave-graph/core": "*", | ||
| "@fortawesome/fontawesome-svg-core": "^6.2.0", | ||
| "@fortawesome/free-solid-svg-icons": "^6.2.0", | ||
| "@fortawesome/react-fontawesome": "^0.2.0", | ||
| "@headlessui/react": "^1.7.4", | ||
| "@heroicons/react": "^2.0.13", | ||
| "@react-three/drei": "^9.42.2", | ||
| "@react-three/fiber": "^8.9.1", | ||
| "clsx": "^1.2.1", | ||
| "react": "^18.2.0", | ||
| "react-dom": "^18.2.0", | ||
| "react-dropzone": "^14.2.3", | ||
| "react-icons": "^4.6.0", | ||
| "react-router-dom": "^6.4.3", | ||
| "react-split-pane": "^0.1.92", | ||
| "reactflow": "^11.2.0", | ||
| "three": "^0.146.0", | ||
| "uuid": "^9.0.0" | ||
| }, | ||
| "devDependencies": { | ||
| "@types/react": "^18.0.22", | ||
| "@types/react-dom": "^18.0.7", | ||
| "@types/three": "^0.146.0", | ||
| "@types/uuid": "^8.3.4", | ||
| "@typescript-eslint/parser": "^5.42.0", | ||
| "@vitejs/plugin-react": "^2.2.0", | ||
| "autoprefixer": "^10.4.13", | ||
| "eslint": "^8.26.0", | ||
| "eslint-config-prettier": "^8.5.0", | ||
| "eslint-config-react-app": "^7.0.1", | ||
| "postcss": "^8.4.18", | ||
| "tailwindcss": "^3.2.2", | ||
| "typescript": "^4.6.4", | ||
| "vite": "^3.2.0" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| module.exports = { | ||
| plugins: { | ||
| tailwindcss: {}, | ||
| autoprefixer: {}, | ||
| }, | ||
| } |
130 changes: 130 additions & 0 deletions
130
examples/flow/public/examples/graphs/ClickButtonToAnimate.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,130 @@ | ||
| { | ||
| "nodes": [ | ||
| { | ||
| "id": "d71ccb9c-0fea-4ce9-bf92-a31485e9b5a6", | ||
| "type": "scene/set/color", | ||
| "metadata": { | ||
| "positionX": "184.79620709295074", | ||
| "positionY": "18.913444261875217" | ||
| }, | ||
| "parameters": { | ||
| "jsonPath": { | ||
| "value": "materials/2/color" | ||
| }, | ||
| "value": { | ||
| "link": { | ||
| "nodeId": "5394babc-dcc0-4735-9daf-465c73a66e80", | ||
| "socket": "result" | ||
| } | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "5394babc-dcc0-4735-9daf-465c73a66e80", | ||
| "type": "math/toColor/rgb", | ||
| "metadata": { | ||
| "positionX": "-145.20682021207682", | ||
| "positionY": "90.16020188760152" | ||
| }, | ||
| "parameters": { | ||
| "g": { | ||
| "value": ".9" | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "267d676e-79d4-49e5-9be8-c7dd8b157f00", | ||
| "type": "math/toColor/rgb", | ||
| "metadata": { | ||
| "positionX": "-140.0557507122972", | ||
| "positionY": "344.03584956239894" | ||
| }, | ||
| "parameters": { | ||
| "r": { | ||
| "value": ".9" | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "98da1b8b-b49e-489d-80ff-24ce601ac0c0", | ||
| "type": "scene/set/color", | ||
| "metadata": { | ||
| "positionX": "181.70354627203167", | ||
| "positionY": "272.5116315772409" | ||
| }, | ||
| "parameters": { | ||
| "jsonPath": { | ||
| "value": "materials/2/color" | ||
| }, | ||
| "value": { | ||
| "link": { | ||
| "nodeId": "267d676e-79d4-49e5-9be8-c7dd8b157f00", | ||
| "socket": "result" | ||
| } | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "d326d57f-198b-41e8-9d2b-182130f1398f", | ||
| "type": "flow/flipFlop", | ||
| "metadata": { | ||
| "positionX": "-51.98681837156558", | ||
| "positionY": "-342.24335289662594" | ||
| }, | ||
| "flows": { | ||
| "on": { | ||
| "nodeId": "d71ccb9c-0fea-4ce9-bf92-a31485e9b5a6", | ||
| "socket": "flow" | ||
| }, | ||
| "off": { | ||
| "nodeId": "98da1b8b-b49e-489d-80ff-24ce601ac0c0", | ||
| "socket": "flow" | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "85179702-7634-4cf5-95ca-5908224cd4f0", | ||
| "type": "scene/nodeClick", | ||
| "metadata": { | ||
| "positionX": "-517.3783747475436", | ||
| "positionY": "-184.38358132733035" | ||
| }, | ||
| "parameters": { | ||
| "jsonPath": { | ||
| "value": "nodes/2" | ||
| } | ||
| }, | ||
| "flows": { | ||
| "secondFlow": { | ||
| "nodeId": "fcb81837-650c-42fb-a708-236f2ee64abc", | ||
| "socket": "flow" | ||
| }, | ||
| "flow": { | ||
| "nodeId": "d326d57f-198b-41e8-9d2b-182130f1398f", | ||
| "socket": "flow" | ||
| } | ||
| } | ||
| }, | ||
| { | ||
| "id": "fcb81837-650c-42fb-a708-236f2ee64abc", | ||
| "type": "scene/set/boolean", | ||
| "metadata": { | ||
| "positionX": "174.3147945277493", | ||
| "positionY": "-187.0779606350799" | ||
| }, | ||
| "parameters": { | ||
| "jsonPath": { | ||
| "value": "animations/0/playing" | ||
| }, | ||
| "value": { | ||
| "link": { | ||
| "nodeId": "d326d57f-198b-41e8-9d2b-182130f1398f", | ||
| "socket": "isOn" | ||
| } | ||
| } | ||
| } | ||
| } | ||
| ], | ||
| "variables": [], | ||
| "customEvents": [] | ||
| } |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@bhouston this is kind of a difficult rule to follow, it means you need to add the file extension whenever you import in typescript.
Is it ok to get rid of this rule? Makes the code easier to write/read when you can just do:
wheras before you would need to do:
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I did this because it allows for many loaders to load JavaScript files in the browser without bundling. This explains the reasoning: https://stackoverflow.com/questions/70461497/why-do-i-need-to-add-the-js-extension-when-importing-files-in-typescript-but-no?utm_source=feedburner&utm_medium=email
That said, I can just always use a bundler.
On that topic, right now if there are errors in the code, say when I run exec-graph, I do not see any source maps. It makes it a bit harder to track down the errors to the original line in the typescript file.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
When would you want to load js files in the browser? I think we could just use the chrome debugger and it loads the typescript files via its sourcemaps?
Yes seeing source maps would be ideal when running
exec-graph. A nice way to do this is to just usets-node- then you get all errors showing up in the original source code location. And you get rid of the need for the step to build the files before. I originally wanted to setup running the exec-graph scripts using ts-node, but it will not work when you want to import.jsfiles:TypeStrong/ts-node#783