From 56a570eacdae4334174fdba82f9c5015097ada02 Mon Sep 17 00:00:00 2001 From: c2coder Date: Sun, 11 Aug 2024 01:59:41 +0200 Subject: [PATCH 01/22] Remove CMAKE for testing purposes --- public/CNAME | 1 - 1 file changed, 1 deletion(-) delete mode 100644 public/CNAME diff --git a/public/CNAME b/public/CNAME deleted file mode 100644 index 371922f..0000000 --- a/public/CNAME +++ /dev/null @@ -1 +0,0 @@ -jacly.robotikabrno.cz \ No newline at end of file From 9bd4c94d152f7e37f83823c23015ab1cb7dd2a26 Mon Sep 17 00:00:00 2001 From: c2coder Date: Sun, 11 Aug 2024 02:12:20 +0200 Subject: [PATCH 02/22] Design modification + a lot of fixes --- README.md | 2 +- index.html | 7 +- package-lock.json | 456 +++--- package.json | 1 + public/favicon.ico | Bin 0 -> 6091 bytes src/App.tsx | 35 +- src/blockly-config.js | 1349 +++++++++-------- src/components/buttons/Button.tsx | 4 +- src/components/buttons/ConnectionBtn.tsx | 4 +- src/components/labels/Label.tsx | 24 + src/components/topLevel/BlockyEditorFixer.tsx | 27 + src/components/topLevel/CodeResult.tsx | 509 ++++++- src/components/topLevel/ConnectionBar.tsx | 2 +- src/components/topLevel/Header.tsx | 5 +- src/components/topLevel/Monitor.tsx | 76 +- src/customBlocks/customBlocks.ts | 262 +++- src/index.css | 57 +- src/main.jsx | 2 +- 18 files changed, 1939 insertions(+), 883 deletions(-) create mode 100644 public/favicon.ico create mode 100644 src/components/labels/Label.tsx create mode 100644 src/components/topLevel/BlockyEditorFixer.tsx diff --git a/README.md b/README.md index dba17c2..4cbeb9d 100644 --- a/README.md +++ b/README.md @@ -14,6 +14,6 @@ npm install ``` 3. Run ``` -npm dev +npm run dev ``` 4. Open page in browser diff --git a/index.html b/index.html index 6756355..a1a3a40 100644 --- a/index.html +++ b/index.html @@ -2,12 +2,13 @@ - + + - Vite + React + JacLy - RoboticsBrno -
+
diff --git a/package-lock.json b/package-lock.json index d00ad0d..134fc53 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "jacly", "version": "0.0.0", "dependencies": { + "@blockly/field-colour": "^4.0.0", "@types/w3c-web-serial": "^1.0.3", "blockly": "^10.0.0", "classnames": "^2.3.2", @@ -73,12 +74,14 @@ } }, "node_modules/@babel/code-frame": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.22.5.tgz", - "integrity": "sha512-Xmwn266vad+6DAqEB2A6V/CcZVp62BbwVmcOJc2RPuwih1kw02TjQvWVWlcKGbBPd+8/0V5DEkOcizRGYsspYQ==", + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.7.tgz", + "integrity": "sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/highlight": "^7.22.5" + "@babel/highlight": "^7.24.7", + "picocolors": "^1.0.0" }, "engines": { "node": ">=6.9.0" @@ -124,14 +127,15 @@ } }, "node_modules/@babel/generator": { - "version": "7.22.7", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.22.7.tgz", - "integrity": "sha512-p+jPjMG+SI8yvIaxGgeW24u7q9+5+TGpZh8/CuB7RhBKd7RCy8FayNEFNNKrNK/eUcY/4ExQqLmyrvBXKsIcwQ==", + "version": "7.25.0", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.25.0.tgz", + "integrity": "sha512-3LEEcj3PVW8pW2R1SR1M89g/qrYk/m/mB/tLqn7dn4sbBUQyTqnlod+II2U4dqiGtUmkcnAmkMDralTFZttRiw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/types": "^7.22.5", - "@jridgewell/gen-mapping": "^0.3.2", - "@jridgewell/trace-mapping": "^0.3.17", + "@babel/types": "^7.25.0", + "@jridgewell/gen-mapping": "^0.3.5", + "@jridgewell/trace-mapping": "^0.3.25", "jsesc": "^2.5.1" }, "engines": { @@ -166,31 +170,6 @@ "node": ">=6.9.0" } }, - "node_modules/@babel/helper-function-name": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.22.5.tgz", - "integrity": "sha512-wtHSq6jMRE3uF2otvfuD3DIvVhOsSNshQl0Qrd7qC9oQJzHvOL4qQXlQn2916+CXGywIjpGuIkoyZRRxHPiNQQ==", - "dev": true, - "dependencies": { - "@babel/template": "^7.22.5", - "@babel/types": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/helper-hoist-variables": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz", - "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==", - "dev": true, - "dependencies": { - "@babel/types": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/helper-module-imports": { "version": "7.22.5", "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.5.tgz", @@ -256,19 +235,21 @@ } }, "node_modules/@babel/helper-string-parser": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz", - "integrity": "sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==", + "version": "7.24.8", + "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.8.tgz", + "integrity": "sha512-pO9KhhRcuUyGnJWwyEgnRJTSIZHiT+vMD0kPeD+so0l7mxkMT19g3pjY9GTnHySck/hDzq+dtW/4VgnMkippsQ==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-validator-identifier": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.5.tgz", - "integrity": "sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ==", + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.24.7.tgz", + "integrity": "sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } @@ -297,24 +278,30 @@ } }, "node_modules/@babel/highlight": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.22.5.tgz", - "integrity": "sha512-BSKlD1hgnedS5XRnGOljZawtag7H1yPfQp0tdNJCHoH6AZ+Pcm9VvkrK59/Yy593Ypg0zMxH2BxD1VPYUQ7UIw==", + "version": "7.24.7", + "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.7.tgz", + "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-validator-identifier": "^7.22.5", - "chalk": "^2.0.0", - "js-tokens": "^4.0.0" + "@babel/helper-validator-identifier": "^7.24.7", + "chalk": "^2.4.2", + "js-tokens": "^4.0.0", + "picocolors": "^1.0.0" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/parser": { - "version": "7.22.7", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.22.7.tgz", - "integrity": "sha512-7NF8pOkHP5o2vpmGgNGcfAeCvOYhGLyA3Z4eBQkT1RJlWu47n63bCs93QfJ2hIAFCil7L5P2IWhs1oToVgrL0Q==", + "version": "7.25.3", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.25.3.tgz", + "integrity": "sha512-iLTJKDbJ4hMvFPgQwwsVoxtHyWpKKPBrxkANrSYewDPaPpT5py5yeVkgPIJ7XYXhndxJpaA3PyALSXQ7u8e/Dw==", "dev": true, + "license": "MIT", + "dependencies": { + "@babel/types": "^7.25.2" + }, "bin": { "parser": "bin/babel-parser.js" }, @@ -364,34 +351,33 @@ } }, "node_modules/@babel/template": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.5.tgz", - "integrity": "sha512-X7yV7eiwAxdj9k94NEylvbVHLiVG1nvzCV2EAowhxLTwODV1jl9UzZ48leOC0sH7OnuHrIkllaBgneUykIcZaw==", + "version": "7.25.0", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.0.tgz", + "integrity": "sha512-aOOgh1/5XzKvg1jvVz7AVrx2piJ2XBi227DHmbY6y+bM9H2FlN+IfecYu4Xl0cNiiVejlsCri89LUsbj8vJD9Q==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/code-frame": "^7.22.5", - "@babel/parser": "^7.22.5", - "@babel/types": "^7.22.5" + "@babel/code-frame": "^7.24.7", + "@babel/parser": "^7.25.0", + "@babel/types": "^7.25.0" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/traverse": { - "version": "7.22.8", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.22.8.tgz", - "integrity": "sha512-y6LPR+wpM2I3qJrsheCTwhIinzkETbplIgPBbwvqPKc+uljeA5gP+3nP8irdYt1mjQaDnlIcG+dw8OjAco4GXw==", - "dev": true, - "dependencies": { - "@babel/code-frame": "^7.22.5", - "@babel/generator": "^7.22.7", - "@babel/helper-environment-visitor": "^7.22.5", - "@babel/helper-function-name": "^7.22.5", - "@babel/helper-hoist-variables": "^7.22.5", - "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/parser": "^7.22.7", - "@babel/types": "^7.22.5", - "debug": "^4.1.0", + "version": "7.25.3", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.25.3.tgz", + "integrity": "sha512-HefgyP1x754oGCsKmV5reSmtV7IXj/kpaE1XYY+D9G5PvKKoFfSbiS4M77MdjuwlZKDIKFCffq9rPU+H/s3ZdQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/code-frame": "^7.24.7", + "@babel/generator": "^7.25.0", + "@babel/parser": "^7.25.3", + "@babel/template": "^7.25.0", + "@babel/types": "^7.25.2", + "debug": "^4.3.1", "globals": "^11.1.0" }, "engines": { @@ -399,19 +385,32 @@ } }, "node_modules/@babel/types": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.22.5.tgz", - "integrity": "sha512-zo3MIHGOkPOfoRXitsgHLjEXmlDaD/5KU1Uzuc9GNiZPhSqVxVRtxuPaSBZDsYZ9qV88AjtMtWW7ww98loJ9KA==", + "version": "7.25.2", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.25.2.tgz", + "integrity": "sha512-YTnYtra7W9e6/oAZEHj0bJehPRUlLH9/fbpT5LfB0NhQXyALCRkRs3zH9v07IYhkgpqX6Z78FnuccZr/l4Fs4Q==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-string-parser": "^7.22.5", - "@babel/helper-validator-identifier": "^7.22.5", + "@babel/helper-string-parser": "^7.24.8", + "@babel/helper-validator-identifier": "^7.24.7", "to-fast-properties": "^2.0.0" }, "engines": { "node": ">=6.9.0" } }, + "node_modules/@blockly/field-colour": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@blockly/field-colour/-/field-colour-4.0.0.tgz", + "integrity": "sha512-DigQJ2Yqf/VN4xr7AI7N3gnGabl3dZULRI2CPCgOiasKF3qqsLoyYCKKz3rLpd8Rzl08wkxMqaY/WqYxOAMzpQ==", + "license": "Apache-2.0", + "engines": { + "node": ">=8.0.0" + }, + "peerDependencies": { + "blockly": "^10.4.3" + } + }, "node_modules/@colors/colors": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", @@ -887,14 +886,15 @@ "dev": true }, "node_modules/@jridgewell/gen-mapping": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", - "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==", + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz", + "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==", "dev": true, + "license": "MIT", "dependencies": { - "@jridgewell/set-array": "^1.0.1", + "@jridgewell/set-array": "^1.2.1", "@jridgewell/sourcemap-codec": "^1.4.10", - "@jridgewell/trace-mapping": "^0.3.9" + "@jridgewell/trace-mapping": "^0.3.24" }, "engines": { "node": ">=6.0.0" @@ -910,10 +910,11 @@ } }, "node_modules/@jridgewell/set-array": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz", - "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==", + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", + "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.0.0" } @@ -925,21 +926,16 @@ "dev": true }, "node_modules/@jridgewell/trace-mapping": { - "version": "0.3.18", - "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz", - "integrity": "sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==", + "version": "0.3.25", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz", + "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==", "dev": true, + "license": "MIT", "dependencies": { - "@jridgewell/resolve-uri": "3.1.0", - "@jridgewell/sourcemap-codec": "1.4.14" + "@jridgewell/resolve-uri": "^3.1.0", + "@jridgewell/sourcemap-codec": "^1.4.14" } }, - "node_modules/@jridgewell/trace-mapping/node_modules/@jridgewell/sourcemap-codec": { - "version": "1.4.14", - "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz", - "integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==", - "dev": true - }, "node_modules/@nicolo-ribaudo/semver-v6": { "version": "6.3.3", "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/semver-v6/-/semver-v6-6.3.3.tgz", @@ -1411,6 +1407,7 @@ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", "dev": true, + "license": "MIT", "dependencies": { "color-convert": "^1.9.0" }, @@ -1531,22 +1528,23 @@ } }, "node_modules/asn1.js": { - "version": "5.4.1", - "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz", - "integrity": "sha512-+I//4cYPccV8LdmBLiX8CYvf9Sp3vQsrqu2QNXRcrbiWvcx/UdlFiqUJJzxRQxgsZmvhXhn4cSKeSmoFjVdupA==", + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz", + "integrity": "sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw==", "dev": true, + "license": "MIT", "dependencies": { "bn.js": "^4.0.0", "inherits": "^2.0.1", - "minimalistic-assert": "^1.0.0", - "safer-buffer": "^2.1.0" + "minimalistic-assert": "^1.0.0" } }, "node_modules/asn1.js/node_modules/bn.js": { "version": "4.12.0", "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz", "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==", - "dev": true + "dev": true, + "license": "MIT" }, "node_modules/assert": { "version": "2.0.0", @@ -1650,9 +1648,10 @@ } }, "node_modules/blockly": { - "version": "10.0.0", - "resolved": "https://registry.npmjs.org/blockly/-/blockly-10.0.0.tgz", - "integrity": "sha512-4A+dn2wkY0y44seSCPDYh2UJ4e1ATgfb/qWPS5fQ3+N7nmy+MW21HG/rf7bPWxUsoyfx/Afu75b/DYPWpg6qnQ==", + "version": "10.4.3", + "resolved": "https://registry.npmjs.org/blockly/-/blockly-10.4.3.tgz", + "integrity": "sha512-+opfBmQnSiv7vTiY/TkDEBOslxUyfj8luS3S+qs1NnQKjInC+Waf2l9cNsMh9J8BMkmiCIT+Ed/3mmjIaL9wug==", + "license": "Apache-2.0", "dependencies": { "jsdom": "22.1.0" } @@ -1674,12 +1673,13 @@ } }, "node_modules/braces": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", - "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dev": true, + "license": "MIT", "dependencies": { - "fill-range": "^7.0.1" + "fill-range": "^7.1.1" }, "engines": { "node": ">=8" @@ -1765,22 +1765,81 @@ } }, "node_modules/browserify-sign": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.2.1.tgz", - "integrity": "sha512-/vrA5fguVAKKAVTNJjgSm1tRQDHUU6DbwO9IROu/0WAzC8PKhucDSh18J0RMvVeHAn5puMd+QHC2erPRNf8lmg==", + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.2.3.tgz", + "integrity": "sha512-JWCZW6SKhfhjJxO8Tyiiy+XYB7cqd2S5/+WeYHsKdNKFlCBhKbblba1A/HN/90YwtxKc8tCErjffZl++UNmGiw==", "dev": true, + "license": "ISC", "dependencies": { - "bn.js": "^5.1.1", - "browserify-rsa": "^4.0.1", + "bn.js": "^5.2.1", + "browserify-rsa": "^4.1.0", "create-hash": "^1.2.0", "create-hmac": "^1.1.7", - "elliptic": "^6.5.3", + "elliptic": "^6.5.5", + "hash-base": "~3.0", "inherits": "^2.0.4", - "parse-asn1": "^5.1.5", - "readable-stream": "^3.6.0", - "safe-buffer": "^5.2.0" + "parse-asn1": "^5.1.7", + "readable-stream": "^2.3.8", + "safe-buffer": "^5.2.1" + }, + "engines": { + "node": ">= 0.12" } }, + "node_modules/browserify-sign/node_modules/hash-base": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.4.tgz", + "integrity": "sha512-EeeoJKjTyt868liAlVmcv2ZsUfGHlE3Q+BICOXcZiwN3osr5Q/zFGYmTJpoIzuaSTAwndFy+GqhEwlU4L3j4Ow==", + "dev": true, + "license": "MIT", + "dependencies": { + "inherits": "^2.0.1", + "safe-buffer": "^5.0.1" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/browserify-sign/node_modules/readable-stream": { + "version": "2.3.8", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz", + "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==", + "dev": true, + "license": "MIT", + "dependencies": { + "core-util-is": "~1.0.0", + "inherits": "~2.0.3", + "isarray": "~1.0.0", + "process-nextick-args": "~2.0.0", + "safe-buffer": "~5.1.1", + "string_decoder": "~1.1.1", + "util-deprecate": "~1.0.1" + } + }, + "node_modules/browserify-sign/node_modules/readable-stream/node_modules/safe-buffer": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", + "dev": true, + "license": "MIT" + }, + "node_modules/browserify-sign/node_modules/string_decoder": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", + "dev": true, + "license": "MIT", + "dependencies": { + "safe-buffer": "~5.1.0" + } + }, + "node_modules/browserify-sign/node_modules/string_decoder/node_modules/safe-buffer": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", + "dev": true, + "license": "MIT" + }, "node_modules/browserify-zlib": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.2.0.tgz", @@ -1889,6 +1948,7 @@ "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", "dev": true, + "license": "MIT", "dependencies": { "ansi-styles": "^3.2.1", "escape-string-regexp": "^1.0.5", @@ -2083,6 +2143,13 @@ "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==", "dev": true }, + "node_modules/core-util-is": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz", + "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==", + "dev": true, + "license": "MIT" + }, "node_modules/crc": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/crc/-/crc-4.3.2.tgz", @@ -2358,10 +2425,11 @@ "dev": true }, "node_modules/elliptic": { - "version": "6.5.4", - "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz", - "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==", + "version": "6.5.6", + "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.6.tgz", + "integrity": "sha512-mpzdtpeCLuS3BmE3pO3Cpp5bbjlOPY2Q0PgoF+Od1XZrHLYI28Xe3ossCmYCQt11FQKEYd9+PF8jymTvtWJSHQ==", "dev": true, + "license": "MIT", "dependencies": { "bn.js": "^4.11.9", "brorand": "^1.1.0", @@ -2544,6 +2612,7 @@ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", "dev": true, + "license": "MIT", "engines": { "node": ">=0.8.0" } @@ -2954,10 +3023,11 @@ } }, "node_modules/fill-range": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", - "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dev": true, + "license": "MIT", "dependencies": { "to-regex-range": "^5.0.1" }, @@ -3265,6 +3335,7 @@ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==", "dev": true, + "license": "MIT", "engines": { "node": ">=4" } @@ -3749,6 +3820,7 @@ "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", "dev": true, + "license": "MIT", "engines": { "node": ">=0.12.0" } @@ -3881,6 +3953,13 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/isarray": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==", + "dev": true, + "license": "MIT" + }, "node_modules/isexe": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", @@ -4111,24 +4190,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/lodash.debounce": { - "version": "4.0.8", - "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", - "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==", - "dev": true - }, "node_modules/lodash.merge": { "version": "4.6.2", "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz", "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==", "dev": true }, - "node_modules/lodash.pick": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz", - "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==", - "dev": true - }, "node_modules/logform": { "version": "2.5.1", "resolved": "https://registry.npmjs.org/logform/-/logform-2.5.1.tgz", @@ -4287,9 +4354,9 @@ } }, "node_modules/nanoid": { - "version": "3.3.6", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", - "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==", + "version": "3.3.7", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz", + "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==", "dev": true, "funding": [ { @@ -4297,6 +4364,7 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -4665,16 +4733,35 @@ } }, "node_modules/parse-asn1": { - "version": "5.1.6", - "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.6.tgz", - "integrity": "sha512-RnZRo1EPU6JBnra2vGHj0yhp6ebyjBZpmUCLHWiFhxlzvBCCpAuZ7elsBp1PVAbQN0/04VD/19rfzlBSwLstMw==", + "version": "5.1.7", + "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.7.tgz", + "integrity": "sha512-CTM5kuWR3sx9IFamcl5ErfPl6ea/N8IYwiJ+vpeB2g+1iknv7zBl5uPwbMbRVznRVbrNY6lGuDoE5b30grmbqg==", "dev": true, + "license": "ISC", "dependencies": { - "asn1.js": "^5.2.0", - "browserify-aes": "^1.0.0", - "evp_bytestokey": "^1.0.0", - "pbkdf2": "^3.0.3", - "safe-buffer": "^5.1.1" + "asn1.js": "^4.10.1", + "browserify-aes": "^1.2.0", + "evp_bytestokey": "^1.0.3", + "hash-base": "~3.0", + "pbkdf2": "^3.1.2", + "safe-buffer": "^5.2.1" + }, + "engines": { + "node": ">= 0.10" + } + }, + "node_modules/parse-asn1/node_modules/hash-base": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.4.tgz", + "integrity": "sha512-EeeoJKjTyt868liAlVmcv2ZsUfGHlE3Q+BICOXcZiwN3osr5Q/zFGYmTJpoIzuaSTAwndFy+GqhEwlU4L3j4Ow==", + "dev": true, + "license": "MIT", + "dependencies": { + "inherits": "^2.0.1", + "safe-buffer": "^5.0.1" + }, + "engines": { + "node": ">=4" } }, "node_modules/parse-entities": { @@ -4761,10 +4848,11 @@ } }, "node_modules/picocolors": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", - "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", - "dev": true + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz", + "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==", + "dev": true, + "license": "ISC" }, "node_modules/picomatch": { "version": "2.3.1", @@ -4809,9 +4897,9 @@ } }, "node_modules/postcss": { - "version": "8.4.25", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.25.tgz", - "integrity": "sha512-7taJ/8t2av0Z+sQEvNzCkpDynl0tX3uJMCODi6nT3PfASC7dYCWV9aQ+uiCf+KBD4SEFcu+GvJdGdwzQ6OSjCw==", + "version": "8.4.40", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.40.tgz", + "integrity": "sha512-YF2kKIUzAofPMpfH6hOi2cGnv/HrUlfucspc7pDyvv7kGdqXrfj8SCl/t8owkEgKEuu8ZcRjSOxFxVLqwChZ2Q==", "dev": true, "funding": [ { @@ -4827,10 +4915,11 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "dependencies": { - "nanoid": "^3.3.6", - "picocolors": "^1.0.0", - "source-map-js": "^1.0.2" + "nanoid": "^3.3.7", + "picocolors": "^1.0.1", + "source-map-js": "^1.2.0" }, "engines": { "node": "^10 || ^12 || >=14" @@ -4982,6 +5071,13 @@ "node": ">= 0.6.0" } }, + "node_modules/process-nextick-args": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz", + "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==", + "dev": true, + "license": "MIT" + }, "node_modules/prop-types": { "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", @@ -5314,10 +5410,11 @@ } }, "node_modules/rollup": { - "version": "3.26.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.26.2.tgz", - "integrity": "sha512-6umBIGVz93er97pMgQO08LuH3m6PUb3jlDUUGFsNJB6VgTCUaDFpupf5JfU30529m/UKOgmiX+uY6Sx8cOYpLA==", + "version": "3.29.4", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz", + "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==", "dev": true, + "license": "MIT", "bin": { "rollup": "dist/bin/rollup" }, @@ -5423,10 +5520,11 @@ } }, "node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true, + "license": "ISC", "bin": { "semver": "bin/semver.js" } @@ -5521,10 +5619,11 @@ } }, "node_modules/source-map-js": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", - "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz", + "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==", "dev": true, + "license": "BSD-3-Clause", "engines": { "node": ">=0.10.0" } @@ -5723,6 +5822,7 @@ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", "dev": true, + "license": "MIT", "dependencies": { "has-flag": "^3.0.0" }, @@ -5871,6 +5971,7 @@ "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", "dev": true, + "license": "MIT", "dependencies": { "is-number": "^7.0.0" }, @@ -6078,14 +6179,15 @@ "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==" }, "node_modules/vite": { - "version": "4.4.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.2.tgz", - "integrity": "sha512-zUcsJN+UvdSyHhYa277UHhiJ3iq4hUBwHavOpsNUGsTgjBeoBlK8eDt+iT09pBq0h9/knhG/SPrZiM7cGmg7NA==", + "version": "4.5.3", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz", + "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==", "dev": true, + "license": "MIT", "dependencies": { "esbuild": "^0.18.10", - "postcss": "^8.4.24", - "rollup": "^3.25.2" + "postcss": "^8.4.27", + "rollup": "^3.27.1" }, "bin": { "vite": "bin/vite.js" @@ -6133,10 +6235,11 @@ } }, "node_modules/vite-plugin-checker": { - "version": "0.6.1", - "resolved": "https://registry.npmjs.org/vite-plugin-checker/-/vite-plugin-checker-0.6.1.tgz", - "integrity": "sha512-4fAiu3W/IwRJuJkkUZlWbLunSzsvijDf0eDN6g/MGh6BUK4SMclOTGbLJCPvdAcMOQvVmm8JyJeYLYd4//8CkA==", + "version": "0.6.4", + "resolved": "https://registry.npmjs.org/vite-plugin-checker/-/vite-plugin-checker-0.6.4.tgz", + "integrity": "sha512-2zKHH5oxr+ye43nReRbC2fny1nyARwhxdm0uNYp/ERy4YvU9iZpNOsueoi/luXw5gnpqRSvjcEPxXbS153O2wA==", "dev": true, + "license": "MIT", "dependencies": { "@babel/code-frame": "^7.12.13", "ansi-escapes": "^4.3.0", @@ -6145,8 +6248,6 @@ "commander": "^8.0.0", "fast-glob": "^3.2.7", "fs-extra": "^11.1.0", - "lodash.debounce": "^4.0.8", - "lodash.pick": "^4.4.0", "npm-run-path": "^4.0.1", "semver": "^7.5.0", "strip-ansi": "^6.0.0", @@ -6568,9 +6669,10 @@ "dev": true }, "node_modules/ws": { - "version": "8.13.0", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz", - "integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==", + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.0.tgz", + "integrity": "sha512-8VbfWfHLbbwu3+N6OKsOMpBdT4kXPDDB9cJk2bJ6mh9ucxdlnNvH1e+roYkKmN9Nxw2yjz7VzeO9oOz2zJ04Pw==", + "license": "MIT", "engines": { "node": ">=10.0.0" }, diff --git a/package.json b/package.json index 68136e8..165dfb4 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "preview": "vite preview" }, "dependencies": { + "@blockly/field-colour": "^4.0.0", "@types/w3c-web-serial": "^1.0.3", "blockly": "^10.0.0", "classnames": "^2.3.2", diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..847208d981332c80614a895eb138ce00bfe69c12 GIT binary patch literal 6091 zcmV;+7c}UJP)N&8_^eHj4^6dOnl}AMK%FJHUR}uFaiRKxPS)2 zW}XWwn7JgRnZ8r+oZCGMLeKQQ zT~+tq>QmqM|31E9x~J;a`Q6&iIpuOu;a(VHSArUV9t1rNdR5c34?wevii(zl)`GUi zwFi_L*UmCOUjnE%jSB#b z1>^bwq}dpNiWCN|f%Xgm)urC0k}L#Q;XECTXE7+~U;rx82>^XEw6!CGPd!hiECg48 zp2P(#C|_X+63GW}%p^F{8-j~K_kbbH1%rsBAq0u!hG#Mko=r`%lJo%KI?&7UElvWU ze0_%_C#VWpj(Q;6jOPIH#U&ZLF=fHC8w1aS)TnsxB<5gX=-GN@^O6zeei3t zMC(EL6?Dey&?$LjnAW?CK!5bZEp4()YhdUGop6c_(RSKM?jdqPs0t5#J{g{^RT$r@ zr85kHAXEZ9Wpgi6(z)6Peb$n!mp=^Gz{CBL49t-#iZ8m!Pl^)^?c#wjWL(bHR_M!H z$fC`IPzCq7$&i#%2>P`*S+|LE1$cOy$$->U+}-?Avh?I&Xax`LEE$gS+Kw^lWbx(0 zFa#b{l#C^P;xC}jTa)FV4?<-aM#qzZr01Cho^TTdr7&DZTdJh^)@-G8hvE8oE+aAu z5<)Q@Y~tc{h2chc2nWazNI%n(v~&5u-34g)A?kcm0$~oR%hCmgI&|_(NR z{saTbfHq*vi>fgEH#G1Fbu!7IRw}oqfCl}Zav_mY&|+nFpP(VXg$C`VP9<^JlC9)) z7%rhK7$lBRyyj#WDnSEgP)Cw@1{;B0{l$?$#4i@1P9$+pd*e8VK)hy(awL%iD%&xx z<51D+P+>oH8cDEr*#6?lxaaB~>MWA1$UD2Q8|G3+kz~rYG1^!$>L8Lui3@JA8w}N; zVmZ_~B#X4oHhG`$NFDQeQm2qCUQdj+%evup84b?gwu6Ptzjz1Ox$*w0)l`r zcwqOqtkI!~6^?rZ1OZ`CCxpji<1i$1Ax%IK5Vl@m0}zi{b?`z!5D+F5#`Uf!7%JmF zF9AV7I0y(FB|a7fL@z6k<_QP_!lVkg2NT7U1!O7<#4UB0|H)n~_{J#R)gU}?KFggt zU3aYr40w@w8a8!25ZQO$&2nBG%tB+{(c6|gZ3YXC9mjG84rSS`?^PKH93>|62BN>! z&RZgY@OJLX^1fKYv_PQzzh79$@;7Z}IfGwfSvS{m3=rbHk-U^>@VMYcE zeee-;-_}SuAmWF0)p)vS98d`ed|T#yxs1Vmv88__a*}CT3z>Fe0@IF+WZLnMn096^ zE6U9{ryd3SGnl_;AA17<(Bfzp&CV{Zdo+(}-Ze}+HI->c-v*6k+Uc20^L+=;A;0u( z>htTPNLKaQDgnW7EdfAuv4eXrFCcu6_Fz$uC;q)rF#0)6`=Kq1uD=#^&4snCIn$1P z07jJ?`y7CTQ>(0-YT6D692FufSC<+>@JFWY>&v1W|CqRan{H-W#xnr_fl}|{@3%5f z<2#fA0+b83e09n|Sat3o0*IVJL-py8ZYVk1nYR6|#71%qylhW1zwoqHBGsFI87`nh&{8&>NTnWfuqC|W=DrBaNeZ?5a9)jV&4OE zZ(5r0k^({^{`*S)(mr?eEiH2_Qi0%mVS8 zonmIq0^#k@8Ro>X>5aCxJ2zv|wYdh&)&2T+xRM+q|qlPVCthq{&Qm_@fWKwsK{^lxKkbWs9u5b{VB-;(ZY_2sLTL??hAV3Lwm≉xU>F$>Ar2>I|M5kl4j zws3@yC6z`9(D90Z7-&}@OsyeCjFei({LNb|TSLf_LTiZPX;ba;rb{bT0wVDAb8_FF z@W!@kmr05g+GQ#O#Gpi@!=semGn?AkdcyI#J5oGs|r%f-YrW zCV)^@ANYIrRuKrCHZ{7?`eC_>KzQ4CD)Dv|I$iqvht_zz0)z#-cZ=WUJD6!Y&e{P$ zJb$4?0$vq?(BmQIFBCgEU_8XF4J?d@ctZH|5A^$ARpKEoq|Y34{=h3@F6#9Ps~hG! zvOHpL*$QFpi>zIzOvGHG#K=Df;&GLM&<*dA?j)gf)_Ws0ws&w>d z%8A+>00cWHBL^H|zoj}5de)7BrCB$)oIAi<*-lwE@X)OA=rMj%!PBQ%_C5D0lXas4 zAX=4OP%ljfAc{u{ob#u8KxNmwOr8c!SY-VM4!6E;XP%}lRLaX#5fIOo1>$(R08#uV z#n^>&GWR7Z49GFN{U|eYA7EmfID4oiO;4xOeEm&53^Y9VGd%%W=&iR|;MwPyyFp{;Xa8=~j^zw}nT6i}P(Q2; zfAT2{!oPEd4QJkV?Ul~{ZD^+nfOsJ7fuQ>#2#DB1qKfVEFA)#~goO+1>bA_VK|l}? z76H)?ftX7`5D)}}4n%L{kVq1=i+~`JO0}PWAdyOSfPk>W{x>88j(R+%0+vWzwL86lz<6p2Ihx8f{@gGN zFI>!Wh74obZSQC9+V#%KG?;x?8y0wB5L_j^Q2$*^pBH2#PctC4DG3Ay$72Eji~!4d z`Tv;ziC!$b)xCNkQ2y3!)_?#zEx6-?QEW*^yw$rs77Ch^V@aKZqsHjjJiLGIsOM!0 zzB!uZPMe`e5861zeJa}MQsvDbS+|}AUma0ly7uBbon_ytkV?S5r|}&uZ^c*A>x}@H z7q{*0^01!ZxiI5^DnP77APSv35}eTk;yumoOg>w-fZRppX6Jw~O`Hm)e82_Y5qkGM zsp|~A?gnzq>KPIRCxQ@s{SD@>S=X>(6=oiiH|2mBZQiH880T&0^!}a} ztyu2tIgVU^fOFpr1Y(b4Dh+QR%!h>YTC)a)cP&dXriuR&<_eKJeWo0DnSV_&pVXjj zdoKB*Bm?mt0`aXADvK9`csq1S-LEFgExxY1_n6LIfZL^nIa;Cr-(5F-)^MD%PHpDk7cDe$$t zJm&ym!M%6}f%pvq(b!fMgY7#1U;7C&B9XrN;RTDN2jApx`CeRmKAkJ3-tf}E^@+`Z z$SzK0`8zvRjQ5&BCJ@1qZ%GFt{O@_+p&u+PPL)DRQ5`(53Sx_m9clP17VTps1p^QH($;u2X|Q5 z0EqTwFJ0_w=~QXb6lqh8L?Z;cGZ*aoF)fwIVNezjc<5^N)CtNBWr474r%Au#8T|gG z0g+%0k-vG1vT0x{Qlg6}WlWih6orO3xyfz`2ir z5a--y?E}!u#n5XyRCd6va<<@B!R%o8Ks}AjC)@;5K+8|_d-D6 ziFJ{*)RfzISd(Wo!KLj4ggx@~UAwbBCWX8S2 zQekvLAmBeo$*Krmnr;aYXU-B3Ndqy{lKRN>hK15HArSbVQm6!%WsxD4J$NyED%$sSyCU*9e2qBV!o@Q0@J2X zh5N`r{vNws-a$a{&AO5Dd69(7fKYl?2n7667vT$PNG@j8gHDu&hJdiv$Lzd?^-udm z1CbB5eq}O1RDoai3k?E#aj9g=s$`}(4~PV=0m6U)W5%#pOh8~h@!4+Xd!)O3 zARtSkRsDqP7lAgI2R44W5g>54>7=kTh>l&X1LDwOX+U7cZ*J)vF>x~be%(}49uVUv zSk_ONS61L*+-#T80v~#dMu-$#5Fodyi0f!0->hZs`i+za0=IkxPM2C41_D0xC-|@? zWDU`?x6&g7`s0YqAzQF>7jxg*KxrTZt|2nd2?jD!;KQq(m}V6tXjiu zv28~nBHw-|YIGRtGF#xoU4@)Oz;>gmBLrUMB`w;JQywTg0)bgr1TChoO$CU`@FfRD zTrs8M2!VN-WZzzjZVsvefm_rfQq#b?c#K6{OX0gbyesHw-byJT@TOBs;(@_)*vQSMP8cCD@r0!((@AW>a*vb9 z8T^t`KwzR{%ktsE3Ajo?MAm#GVljOuHz454u0r2&uIq>uU#SBGOqXO_)s^sB!a`mZ zAl!8uGA+#g!ur)N-UUX9H@FVyVE2AvEl@+1@RRJPr&`^7i4rNA(-|)^7 z9vuFf5z~L7WdjjjxS033 z!zV7$1^vjm`sIL|g9r~!qay^#S|Ggb+Owi)lxO|JV5>LE0HPB7vG2HU8x9<5`3OO> z7Kq5|HRAKN3WTBw&n$nKZ`ISVDUA?m3Pj*<+|$k+!vkfP%mM^XMZ9p)#kq9@u3b z(gXAf2sK9t%sYjyJDlsg!gOe;04Un>zFVSTe+G;ccM=eajSzwUPm6#d3vBQ@mz@gi zI{lry(;DnP@J?A%cWSP$QgqMg=(1ahr@-9BJpcw4+Nt{cCzJh~ zbb)BR$y52bbl0kMuHdzPl+`;_R8ITGJ^ZFhsl`juRq{gcY-EZEu~Tuvx3jExl8Q3d<< z>$l990fT@r0ECHKNHO9K&lj{nK=jR__qv=?pt2W1rI(8CFwC(Od}EZMsg#wWo+^(J z=&gz)f))(Qxai~sm(vQ~{R@@fA*J(R=OTZ@e^_wDNakr#em0L(vT&yz5HrfTg%n0- z-$UK>vx>rlnKEw;o#b+A0Vu9V&qL`k#xN~HKyb(peKej0M~?v)^C8UNqbJk6J~DO# z3FZ8K`m>y2!&&H^ar(IgZf;<1SuHngMV*#mW_p*C3pAj%=o^VhX`$_4OP9G+DA17R z(4Y`?D#@e{fDKi3sZ`?b9TDnWl8IoSKe|*b@f%JHsgp?t&KhdCR4&lK9=MN8olUAh zXTVnKxYD6OLm!~&6RCn}Qgv546=?9EF;xh4KIvyV1h!Glm5v1(-kNt3Ws;-yqjI}R zCZMRpI~yR$ky-_|aD|JC4n0QyAZaD^)EiFLpBRct zcx|evcnXrO6o9^dkgPsAFxtZd^ODghtDm5cYm%iKg95`*carfaw_cbHeful2aC1=n z0v_NPnnEd|9O%z}WYv7YxCb8SNir(OYBTiVO=QV@q4*s<*m-1Jj#317ksKe? z9pu?x>!Gh|k;Te^;&ND9d`xQ#TM9F9KV_Rdt7!&C1L%NtWQ6uOWP_K~OxxvHO;a#1 zIoe?|N=p~bP014N1;wSHmy0-GE>9{~d*PXPrRkBq!MH5${^28o6{f>@rU0r;7Uvu= zu7o-5n>1o@9}#-dHmbuU=;}7w51|9I7uRZu|Kv$8aq#qa;lKH)+^#7k_TEDpAI#oUZ#=?AXj5@HJnz&0dYc-H5}!Z zK)r{7TH>Xc)RR<1POln)ddIIL#+@s-RX#+R+zYfAuQG!=b;Eq9G!3F+2T*>C4u_zJ zKm+m0STNKDptYEU3v>#UZ@}1d;}_20O-x_I_ss#l1K<5L=zfe#rZ+#|^8Y=Z@cxtq RE1LiS002ovPDHLkV1hB^J}CeI literal 0 HcmV?d00001 diff --git a/src/App.tsx b/src/App.tsx index 0e70437..56e65c0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,37 +1,40 @@ -import './index.css'; +import "./index.css"; import DeviceProvider from "./context/JaculusContext"; import GenerateCodeProvider from "./context/GenerateCodeContext"; import ConnectionBar from "./components/topLevel/ConnectionBar"; import Header from "./components/topLevel/Header"; import BlocklyEditor from "./components/topLevel/BlocklyEditor"; +import BlocklyEditorFixer from "./components/topLevel/BlockyEditorFixer"; import Monitor from "./components/topLevel/Monitor"; -import "./customBlocks/customBlocks" +import "./customBlocks/customBlocks"; import CodeResult from "./components/topLevel/CodeResult"; + function App() { return ( - + -
-
- -
-
- +
+
+ +
+
+ +
-
-
- +
+
+
-
- +
+
- ) + ); } -export default App +export default App; diff --git a/src/blockly-config.js b/src/blockly-config.js index 82dffb3..2962615 100644 --- a/src/blockly-config.js +++ b/src/blockly-config.js @@ -1,626 +1,725 @@ +import { type } from "os"; + export const INITIAL_TOOLBOX_JSON = { - kind: "categoryToolbox", - contents: [ - { - kind: "category", - name: "Logic", - colour: 210, - contents: [ - { - kind: "block", - type: "controls_if", - }, - { - kind: "block", - blockxml: - 'EQ', - }, - { - kind: "block", - blockxml: - 'AND', - }, - { - kind: "block", - type: "logic_negate", - }, - { - kind: "block", - blockxml: - 'TRUE', - }, - { - kind: "block", - type: "logic_null", - }, - { - kind: "block", - type: "logic_ternary", - }, - ], - }, - { - kind: "category", - name: "Loops", - colour: 120, - contents: [ - { - kind: "block", - blockxml: - '\n' + - ' \n' + - ' \n' + - ' 10\n' + - " \n" + - " \n" + - " ", - }, - { - kind: "block", - blockxml: - ' \n' + - ' WHILE\n' + - " ", - }, - { - kind: "block", - blockxml: - ' \n' + - ' i\n' + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 10\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' j\n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' BREAK\n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 1000\n' + - " \n" + - " \n" + - " \n", - } - ], - }, - { - kind: "category", - name: "Math", - colour: 230, - contents: [ - { - kind: "block", - blockxml: - ' \n' + - ' ROUND\n' + - ' \n' + - ' \n' + - ' 3.1\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' 0\n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' ROOT\n' + - ' \n' + - ' \n' + - ' 9\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' SIN\n' + - ' \n' + - ' \n' + - ' 45\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' PI\n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' EVEN\n' + - ' \n' + - ' \n' + - ' 0\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' ADD\n' + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' SUM\n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 64\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 10\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 50\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 100\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 1\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 100\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - type: "math_random_float", - }, - ], - }, - { - kind: "category", - name: "Text", - colour: 160, - contents: [ - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' FROM_START\n' + - ' \n' + - ' \n' + - ' text\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' item\n' + - ' \n' + - ' \n' + - ' \n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' \n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' FIRST\n' + - ' \n' + - ' \n' + - ' text\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' FROM_START\n' + - ' FROM_START\n' + - ' \n' + - ' \n' + - ' text\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' UPPERCASE\n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' BOTH\n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - // { - // kind: "block", - // blockxml: - // ' \n' + - // ' \n' + - // ' \n' + - // ' abc\n' + - // " \n" + - // " \n" + - // " \n", - // }, - { - kind: "block", - blockxml: - ' \n' + - ' log\n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' TEXT\n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, - ], - }, - { - kind: "category", - name: "Lists", - colour: 259, - contents: [ - { - kind: "block", - blockxml: - ' \n' + - ' FIRST\n' + - ' \n' + - ' \n' + - ' list\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 5\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - type: "lists_length", - }, - { - kind: "block", - type: "lists_isEmpty", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' GET\n' + - ' FROM_START\n' + - ' \n' + - ' \n' + - ' list\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' SET\n' + - ' FROM_START\n' + - ' \n' + - ' \n' + - ' list\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' FROM_START\n' + - ' FROM_START\n' + - ' \n' + - ' \n' + - ' list\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' SPLIT\n' + - ' \n' + - ' \n' + - ' ,\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' NUMERIC\n' + - ' 1\n' + - " \n", - }, - ], - }, - { - kind: "category", - name: "Colour", - colour: 19, - contents: [ - { - kind: "block", - blockxml: - ' \n' + - ' #ff0000\n' + - " \n", - }, - { - kind: "block", - type: "colour_random", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' 100\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 50\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 0\n' + - " \n" + - " \n" + - " \n", - }, - { - kind: "block", - blockxml: - ' \n' + - ' \n' + - ' \n' + - ' #ff0000\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' #3333ff\n' + - " \n" + - " \n" + - ' \n' + - ' \n' + - ' 0.5\n' + - " \n" + - " \n" + - " \n", - }, - ], - }, - { kind: "sep" }, - { - kind: "category", - name: "Custom Button", - colour: 19, - contents: [ - { - kind: "button", - text: "A button", - callbackKey: "myFirstButtonPressed", - }, - ], - }, - { - kind: "category", - name: "Variables", - custom: "VARIABLE", - colour: 330, - }, - { - kind: "category", - name: "Functions", - custom: "PROCEDURE", - colour: 290, - }, - ], - }; + kind: "categoryToolbox", + contents: [ + { + kind: "category", + name: "Logic", + colour: 210, + contents: [ + { + kind: "block", + type: "controls_if", + }, + { + kind: "block", + blockxml: + 'EQ', + }, + { + kind: "block", + blockxml: + 'AND', + }, + { + kind: "block", + type: "logic_negate", + }, + { + kind: "block", + blockxml: + 'TRUE', + }, + { + kind: "block", + type: "logic_null", + }, + { + kind: "block", + type: "logic_ternary", + }, + ], + }, + { // LOOPS + kind: "category", + name: "Loops", + colour: 120, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 10\n' + + " \n" + + " \n" + + " ", + }, + { + kind: "block", + blockxml: + ' \n' + + ' WHILE\n' + + " ", + }, + { + kind: "block", + blockxml: + ' \n' + + ' i\n' + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 10\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' j\n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' BREAK\n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 1000\n' + + " \n" + + " \n" + + " \n", + }, + ], + }, + { // MATH + kind: "category", + name: "Math", + colour: 230, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' ROUND\n' + + ' \n' + + ' \n' + + ' 3.1\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' 0\n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' ROOT\n' + + ' \n' + + ' \n' + + ' 9\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' SIN\n' + + ' \n' + + ' \n' + + ' 45\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' PI\n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' EVEN\n' + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' ADD\n' + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' SUM\n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 64\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 10\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 50\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 100\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 1\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 100\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + type: "math_random_float", + }, + ], + }, + { // TEXT + kind: "category", + name: "Text", + colour: 160, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' FROM_START\n' + + ' \n' + + ' \n' + + ' text\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' item\n' + + ' \n' + + ' \n' + + ' \n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' \n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' FIRST\n' + + ' \n' + + ' \n' + + ' text\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' FROM_START\n' + + ' FROM_START\n' + + ' \n' + + ' \n' + + ' text\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' UPPERCASE\n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' BOTH\n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + // { + // kind: "block", + // blockxml: + // ' \n' + + // ' \n' + + // ' \n' + + // ' abc\n' + + // " \n" + + // " \n" + + // " \n", + // }, + { + kind: "block", + blockxml: + ' \n' + + ' log\n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' TEXT\n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, + ], + }, + { // LISTS + kind: "category", + name: "Lists", + colour: 259, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' FIRST\n' + + ' \n' + + ' \n' + + ' list\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 5\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + type: "lists_length", + }, + { + kind: "block", + type: "lists_isEmpty", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' GET\n' + + ' FROM_START\n' + + ' \n' + + ' \n' + + ' list\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' SET\n' + + ' FROM_START\n' + + ' \n' + + ' \n' + + ' list\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' FROM_START\n' + + ' FROM_START\n' + + ' \n' + + ' \n' + + ' list\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' SPLIT\n' + + ' \n' + + ' \n' + + ' ,\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' NUMERIC\n' + + ' 1\n' + + " \n", + }, + ], + }, + { // COLOUR + kind: "category", + name: "Colour", + colour: 19, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' #ff0000\n' + + " \n", + }, + { + kind: "block", + type: "colour_random", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 100\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 50\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' #ff0000\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' #3333ff\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0.5\n' + + " \n" + + " \n" + + " \n", + }, + ], + }, + { // BASIC + kind: "category", + name: "Basic", + + colour: 128, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' 100\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' main\n' + + " \n" + + " \n" + + " \n", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' main\n' + + " \n" + + " \n" + + " \n", + }, + ], + }, + { // SMARTLED + kind: "category", + name: "Smartled", + colour: 259, + contents: [ + { + kind: "block", + blockxml: + ' \n' + + " \n", + }, + { + kind: "block", + type: "create_strip", + }, + { + kind: "block", + type: "strip_clear", + }, + { + kind: "block", + type: "strip_show", + }, + { + kind: "block", + type: "set_rgb", + }, + { + kind: "block", + type: "set_hsv", + }, + { + kind: "block", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' ledStrip\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' #fe8800\n' + + " \n" + + " \n" + + " \n", + }, + + + ], + }, + { kind: "sep" }, + { // CUSTOM BUTTON + kind: "category", + name: "Custom Button", + colour: 19, + contents: [ + { + kind: "button", + text: "A button", + callbackKey: "myFirstButtonPressed", + }, + ], + }, + { // VARIABLES + kind: "category", + name: "Variables", + custom: "VARIABLE", + colour: 330, + }, + { // FUNCTIONS + kind: "category", + name: "Functions", + custom: "PROCEDURE", + colour: 290, + }, + ], +}; diff --git a/src/components/buttons/Button.tsx b/src/components/buttons/Button.tsx index ba8325a..4a67d4c 100644 --- a/src/components/buttons/Button.tsx +++ b/src/components/buttons/Button.tsx @@ -19,8 +19,8 @@ const Button: FC = ({text, classNames, onClick, active = true}) => return } diff --git a/src/components/buttons/ConnectionBtn.tsx b/src/components/buttons/ConnectionBtn.tsx index c50ad58..28a5e41 100644 --- a/src/components/buttons/ConnectionBtn.tsx +++ b/src/components/buttons/ConnectionBtn.tsx @@ -25,14 +25,14 @@ const ConnectionBtn: FC = ({}) => { let whenDisconnected = () => { return <> - Not connected + Not connected
-
-
-                    {text}
-                
+ +
+
{text}
); -} +}; export default Monitor; \ No newline at end of file diff --git a/src/customBlocks/customBlocks.ts b/src/customBlocks/customBlocks.ts index 840f3fc..e8a451c 100644 --- a/src/customBlocks/customBlocks.ts +++ b/src/customBlocks/customBlocks.ts @@ -1,7 +1,9 @@ -import Blockly, {BlockSvg} from "blockly"; +import Blockly, { BlockSvg, FieldColour, FieldTextInput } from "blockly"; // import 'blockly/javascript'; import { javascriptGenerator } from "blockly/javascript"; -import {CodeGenerator} from "blockly/core/generator"; +import { CodeGenerator } from "blockly/core/generator"; +import {registerFieldColour} from '@blockly/field-colour'; + // Blockly.Blocks['console_log'] = { // init: function() { @@ -17,16 +19,16 @@ import {CodeGenerator} from "blockly/core/generator"; // }; // // javascriptGenerator.forBlock['console_log'] = function(block: BlockSvg, generator: CodeGenerator) { -// var code = 'console.log(' + generator.valueToCode(block, 'MESSAGE', javascriptGenerator.ORDER_ATOMIC) + ');\n'; +// var code = 'console.log(' + generator.valueToCode(block, 'MESSAGE', 0) + ');\n'; // return code; // }; Blockly.Blocks['console'] = { - init: function() { + init: function () { this.appendValueInput("TEXT") .setCheck(null) - .appendField("Console.") - .appendField(new Blockly.FieldDropdown([["log","log"], ["error","error"], ["info","info"], ["debug","debug"]]), "TYPE"); + .appendField("console.") + .appendField(new Blockly.FieldDropdown([["log", "log"], ["error", "error"], ["info", "info"], ["debug", "debug"]]), "TYPE"); this.setPreviousStatement(true, null); this.setNextStatement(true, null); this.setColour(160); @@ -35,17 +37,17 @@ Blockly.Blocks['console'] = { } }; -javascriptGenerator.forBlock['console'] = function(block: BlockSvg, generator: CodeGenerator) { +javascriptGenerator.forBlock['console'] = function (block: BlockSvg, generator: CodeGenerator) { var dropdown_type = block.getFieldValue('TYPE'); - var value_text = generator.valueToCode(block, 'TEXT', javascriptGenerator.ORDER_ATOMIC); + var value_text = generator.valueToCode(block, 'TEXT', 0); var code = `console.${dropdown_type}(${value_text});\n`; return code; }; - +// ========== INTERVAL ========== Blockly.Blocks['set_interval'] = { - init: function() { + init: function () { this.appendValueInput("INTERVAL") .setCheck(null) .appendField("setInterval"); @@ -60,7 +62,243 @@ Blockly.Blocks['set_interval'] = { } } -javascriptGenerator.forBlock['set_interval'] = function(block: BlockSvg, generator: CodeGenerator) { - var code = 'setInterval(function(){\n' + generator.statementToCode(block, 'CODE') + '}, ' + generator.valueToCode(block, 'INTERVAL', javascriptGenerator.ORDER_ATOMIC) + ');\n'; +javascriptGenerator.forBlock['set_interval'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'setInterval(function(){\n' + generator.statementToCode(block, 'CODE') + '}, ' + generator.valueToCode(block, 'INTERVAL', 0) + ');\n'; + return code; +} + +// ========== BASIC ========== + +Blockly.Blocks['sleep'] = { + init: function () { + this.appendValueInput("TIME") + .setCheck(null) + .appendField("await.sleep(ms) ms =") + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(128); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['sleep'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'await.sleep(' + generator.valueToCode(block, 'ID', 0) + ')\n' + + return code; +} + +Blockly.Blocks['async_func'] = { + init: function () { + this.appendValueInput("NAME") + .setCheck(null) + .appendField("async function") + this.appendStatementInput("CODE") + .setCheck(null) + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(120); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['async_func'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'async function ' + generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '(){\n' + generator.statementToCode(block, 'CODE') + '};\n'; + return code; +} + + +Blockly.Blocks['call_func'] = { + init: function () { + this.appendValueInput("NAME") + .setCheck(null) + .appendField("call function") + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(120); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['call_func'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '();\n'; + return code; +} + + + +// ========== SMARTLEDS ========== + +Blockly.Blocks['smartled_init'] = { + init: function () { + this.appendDummyInput('NAME') + .appendField('Load smartled'); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setTooltip(''); + this.setHelpUrl(''); + this.setColour(259); + } +} + +javascriptGenerator.forBlock['smartled_init'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = '\nimport { SmartLed, LED_WS2812, LED_WS2812B, LED_WS2812B_2020, LED_SK6812, LED_WS2813 } from "smartled";\nfunction HEXtoRgb(hex) {\n var result = hex.replace("#", "").match(/.{1,2}/g);\n return {r:parseInt(result[0], 16), g:parseInt(result[1], 16), b:parseInt(result[2], 16)}\n}\nfunction HSVtoRgb(h, s, v) {\n var r, g, b, i, f, p, q, t;if (arguments.length === 1) {s = h.s, v = h.v, h = h.h;}i = Math.floor(h * 6);f = h * 6 - i;p = v * (1 - s);q = v * (1 - f * s);t = v * (1 - (1 - f) * s);switch (i % 6) {case 0: r = v, g = t, b = p; break;case 1: r = q, g = v, b = p; break;case 2: r = p, g = v, b = t; break;case 3: r = p, g = q, b = v; break;case 4: r = t, g = p, b = v; break;case 5: r = v, g = p, b = q; break;}\n return {r: Math.round(r * 255),g: Math.round(g * 255),b: Math.round(b * 255)};\n}\n'; + return code; +} + + +Blockly.Blocks['create_strip'] = { + init: function () { + this.appendDummyInput('abcd') + .appendField('create strip') + this.appendDummyInput('abcd') + .appendField(' name:') + .appendField(new Blockly.FieldTextInput("ledStrip"), 'name') + .appendField(' pin:') + .appendField(new Blockly.FieldNumber(0), 'pin') + .appendField(' count:') + .appendField(new Blockly.FieldNumber(0), 'count') + .appendField(' type:') + .appendField(new Blockly.FieldDropdown([ + ['LED_WS2812', 'LED_WS2812'], + ['LED_WS2812B', 'LED_WS2812B'], + ['LED_WS2812B_2020', 'LED_WS2812B_2020'], + ['LED_SK6812', 'LED_SK6812'], + ['LED_WS2813', 'LED_WS2813'] + ]), 'type'); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setTooltip(''); + this.setHelpUrl(''); + this.setColour(259); + } +} + +javascriptGenerator.forBlock['create_strip'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = "\nlet " + block.getFieldValue('name') + ' = new SmartLed(' + block.getFieldValue('pin') + ', ' + block.getFieldValue('count') + ', ' + block.getFieldValue('type') + ');\n\n'; + return code; +} + + + +registerFieldColour(); +Blockly.Blocks['set_hex'] = { + init: function() { + this.appendDummyInput('abc') + .appendField('set hex'); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setTooltip(''); + this.setHelpUrl(''); + this.setColour(259); + } +} + +javascriptGenerator.forBlock['set_hex'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.set(' + generator.valueToCode(block, 'INDEX', 0) + ', HEXtoRgb(' + generator.valueToCode(block, 'COLOR', 0) + '));\n'; + return code; +} + +Blockly.Blocks['set_hsv'] = { + init: function () { + this.appendValueInput("ID") + .setCheck(null) + .appendField("set hsv") + .appendField(" id =") + this.appendValueInput("INDEX") + .setCheck(null) + .appendField(" index ="); + this.appendValueInput("H") + .setCheck(null) + .appendField(" H ="); + this.appendValueInput("S") + .setCheck(null) + .appendField(" S ="); + this.appendValueInput("V") + .setCheck(null) + .appendField(" V ="); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(259); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['set_hsv'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.set(' + generator.valueToCode(block, 'INDEX', 0) + ', HSVtoRgb(' + generator.valueToCode(block, 'H', 0) + '/360, ' + generator.valueToCode(block, 'S', 0) + '/256, ' + generator.valueToCode(block, 'V', 0) + '/256));\n'; + return code; +} + + +Blockly.Blocks['set_rgb'] = { + init: function () { + this.appendValueInput("ID") + .setCheck(null) + .appendField("set rgb") + .appendField(" id =") + this.appendValueInput("INDEX") + .setCheck(null) + .appendField(" index ="); + this.appendValueInput("R") + .setCheck(null) + .appendField(" R ="); + this.appendValueInput("G") + .setCheck(null) + .appendField(" G ="); + this.appendValueInput("B") + .setCheck(null) + .appendField(" B ="); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(259); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['set_rgb'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.set(' + generator.valueToCode(block, 'INDEX', 0) + ', {r:' + generator.valueToCode(block, 'R', 0) + ', g:' + generator.valueToCode(block, 'G', 0) + ', b:' + generator.valueToCode(block, 'B', 0) + '});\n'; + return code; +} + + +Blockly.Blocks['strip_clear'] = { + init: function () { + this.appendValueInput("ID") + .setCheck(null) + .appendField("clear") + .appendField(" id =") + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(259); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['strip_clear'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.clear();\n' + return code; +} + +Blockly.Blocks['strip_show'] = { + init: function () { + this.appendValueInput("ID") + .setCheck(null) + .appendField("show") + .appendField(" id =") + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(259); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['strip_show'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.show();\n' return code; } \ No newline at end of file diff --git a/src/index.css b/src/index.css index d0d4d5a..af90289 100644 --- a/src/index.css +++ b/src/index.css @@ -2,13 +2,28 @@ @tailwind components; @tailwind utilities; + +@layer utilities { + /* Hide scrollbar for Chrome, Safari and Opera */ + *::-webkit-scrollbar { + display: none; + } + /* Hide scrollbar for IE, Edge and Firefox */ + * { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} +} + + :root { font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; line-height: 1.5; font-weight: 400; - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); + color-scheme: light; + /*color: rgba(255, 255, 255, 0.87);*/ + color: rgba(60, 60, 60, 0.87); background-color: #242424; font-synthesis: none; @@ -17,7 +32,6 @@ -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; } - a { font-weight: 500; color: #646cff; @@ -29,20 +43,30 @@ a:hover { body { margin: 0; + padding: 0; display: flex; place-items: center; min-width: 320px; min-height: 100vh; - height: 100%; + width: 100dvw; + height: 100dvh; } h1 { font-size: 3.2em; line-height: 1.1; } - +.label { + border-radius: 4px; + border: 1px solid transparent; + padding: 0.6em 1.2em; + font-size: 1em; + font-weight: 500; + font-family: inherit; + transition: border-color 0.25s; +} button { - border-radius: 8px; + border-radius: 4px; border: 1px solid transparent; padding: 0.6em 1.2em; font-size: 1em; @@ -53,22 +77,19 @@ button { transition: border-color 0.25s; } button:hover { - border-color: #646cff; + border-color: rgb(39,100,216); } button:focus, button:focus-visible { outline: 4px auto -webkit-focus-ring-color; } -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } +.code-result { + max-height: 100%; } +.code-result pre { + max-height: 50vh; /* or any specific height you need */ + overflow-y: auto; /* allows vertical scrolling within the pre element */ + overflow-x: auto; /* allows horizontal scrolling if lines are too long */ + white-space: pre-wrap; /* ensures long lines wrap; use 'pre' to disable wrapping */ +} \ No newline at end of file diff --git a/src/main.jsx b/src/main.jsx index 634da64..9c11600 100644 --- a/src/main.jsx +++ b/src/main.jsx @@ -5,7 +5,7 @@ import './index.css' function NotSupported() { return
- Your browser doesn't support web serial. You cannot use this application. + Your browser doesn't support web serial. You cannot use this application. Use Chrome or other Chromium based browsers.
} From 881af7f1443ab9aa9c755d0c62f307809efffdf4 Mon Sep 17 00:00:00 2001 From: c2coder Date: Sun, 11 Aug 2024 16:17:13 +0200 Subject: [PATCH 03/22] Testing - update base for correct github pages builds --- vite.config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/vite.config.js b/vite.config.js index de7c9d0..b38a2ab 100644 --- a/vite.config.js +++ b/vite.config.js @@ -5,6 +5,7 @@ import { nodePolyfills } from 'vite-plugin-node-polyfills' // https://vitejs.dev/config/ export default defineConfig({ + base: '/JacLy/', // Just for testing purposes plugins: [ react(), checker({ From 890d5b28112138e7dc96de3074975c2fece1c4ab Mon Sep 17 00:00:00 2001 From: c2coder Date: Sun, 11 Aug 2024 17:31:45 +0200 Subject: [PATCH 04/22] Add raw code block --- src/blockly-config.js | 5 +++++ src/customBlocks/customBlocks.ts | 17 +++++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/src/blockly-config.js b/src/blockly-config.js index 2962615..dc1862b 100644 --- a/src/blockly-config.js +++ b/src/blockly-config.js @@ -2,6 +2,7 @@ import { type } from "os"; export const INITIAL_TOOLBOX_JSON = { kind: "categoryToolbox", + name: "Jacly Toolbox", contents: [ { kind: "category", @@ -638,6 +639,10 @@ export const INITIAL_TOOLBOX_JSON = { " \n" + " \n", }, + { + kind: "block", + type: "raw_code", + }, ], }, { // SMARTLED diff --git a/src/customBlocks/customBlocks.ts b/src/customBlocks/customBlocks.ts index e8a451c..2b92b6e 100644 --- a/src/customBlocks/customBlocks.ts +++ b/src/customBlocks/customBlocks.ts @@ -128,6 +128,23 @@ javascriptGenerator.forBlock['call_func'] = function (block: BlockSvg, generator } +Blockly.Blocks['raw_code'] = { + init: function() { + this.appendDummyInput('abc') + .appendField('code') + .appendField(new Blockly.FieldTextInput('default'), 'code'); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setTooltip(''); + this.setHelpUrl(''); + this.setColour("#888"); + } +} + +javascriptGenerator.forBlock['raw_code'] = function (block: BlockSvg, generator: CodeGenerator) { + return block.getFieldValue('code') + '\n'; +} + // ========== SMARTLEDS ========== From 39219c6c673abd11676924fc0c898e3cc27c6ece Mon Sep 17 00:00:00 2001 From: c2coder Date: Mon, 12 Aug 2024 01:47:35 +0200 Subject: [PATCH 05/22] WIP - add some new blocks / refactor --- src/blockly-config.js | 76 ++++++---- src/customBlocks/customBlocks.ts | 236 +++++++++++++++++-------------- 2 files changed, 172 insertions(+), 140 deletions(-) diff --git a/src/blockly-config.js b/src/blockly-config.js index dc1862b..fcab64b 100644 --- a/src/blockly-config.js +++ b/src/blockly-config.js @@ -4,7 +4,7 @@ export const INITIAL_TOOLBOX_JSON = { kind: "categoryToolbox", name: "Jacly Toolbox", contents: [ - { + { // LOGIC kind: "category", name: "Logic", colour: 210, @@ -387,29 +387,6 @@ export const INITIAL_TOOLBOX_JSON = { " \n" + " \n", }, - // { - // kind: "block", - // blockxml: - // ' \n' + - // ' \n' + - // ' \n' + - // ' abc\n' + - // " \n" + - // " \n" + - // " \n", - // }, - { - kind: "block", - blockxml: - ' \n' + - ' log\n' + - ' \n' + - ' \n' + - ' abc\n' + - " \n" + - " \n" + - " \n", - }, { kind: "block", blockxml: @@ -606,7 +583,7 @@ export const INITIAL_TOOLBOX_JSON = { colour: 128, contents: [ - { + { // sleep kind: "block", blockxml: ' \n' + @@ -617,6 +594,18 @@ export const INITIAL_TOOLBOX_JSON = { " \n" + " \n", }, + { // console + kind: "block", + blockxml: + ' \n' + + ' log\n' + + ' \n' + + ' \n' + + ' abc\n' + + " \n" + + " \n" + + " \n", + }, { kind: "block", blockxml: @@ -674,23 +663,50 @@ export const INITIAL_TOOLBOX_JSON = { }, { kind: "block", - type: "set_hsv", + blockxml: + ' \n' + + ' \n' + + ' \n' + + ' ledStrip\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + ' \n' + + ' \n' + + ' 0\n' + + " \n" + + " \n" + + " \n", }, { kind: "block", blockxml: ' \n' + - ' \n' + + ' \n' + ' \n' + ' ledStrip\n' + " \n" + " \n" + - ' \n' + + ' \n' + ' \n' + - ' 0\n' + + ' 0\n' + " \n" + " \n" + - ' \n' + + ' \n' + ' \n' + ' #fe8800\n' + " \n" + diff --git a/src/customBlocks/customBlocks.ts b/src/customBlocks/customBlocks.ts index 2b92b6e..b19d708 100644 --- a/src/customBlocks/customBlocks.ts +++ b/src/customBlocks/customBlocks.ts @@ -2,49 +2,10 @@ import Blockly, { BlockSvg, FieldColour, FieldTextInput } from "blockly"; // import 'blockly/javascript'; import { javascriptGenerator } from "blockly/javascript"; import { CodeGenerator } from "blockly/core/generator"; -import {registerFieldColour} from '@blockly/field-colour'; - - -// Blockly.Blocks['console_log'] = { -// init: function() { -// this.appendValueInput("MESSAGE") -// .setCheck(null) -// .appendField("Console.log"); -// this.setPreviousStatement(true, null); -// this.setNextStatement(true, null); -// this.setColour(160); -// this.setTooltip("dd"); -// this.setHelpUrl(""); -// } -// }; -// -// javascriptGenerator.forBlock['console_log'] = function(block: BlockSvg, generator: CodeGenerator) { -// var code = 'console.log(' + generator.valueToCode(block, 'MESSAGE', 0) + ');\n'; -// return code; -// }; +import { registerFieldColour } from '@blockly/field-colour'; -Blockly.Blocks['console'] = { - init: function () { - this.appendValueInput("TEXT") - .setCheck(null) - .appendField("console.") - .appendField(new Blockly.FieldDropdown([["log", "log"], ["error", "error"], ["info", "info"], ["debug", "debug"]]), "TYPE"); - this.setPreviousStatement(true, null); - this.setNextStatement(true, null); - this.setColour(160); - this.setTooltip("Console...."); - this.setHelpUrl("https://developer.mozilla.org/en-US/docs/Web/API/console"); - } -}; - -javascriptGenerator.forBlock['console'] = function (block: BlockSvg, generator: CodeGenerator) { - var dropdown_type = block.getFieldValue('TYPE'); - var value_text = generator.valueToCode(block, 'TEXT', 0); - var code = `console.${dropdown_type}(${value_text});\n`; - return code; -}; - -// ========== INTERVAL ========== +// ========== Logic ========== +// ========== Loops ========== Blockly.Blocks['set_interval'] = { init: function () { @@ -67,7 +28,15 @@ javascriptGenerator.forBlock['set_interval'] = function (block: BlockSvg, genera return code; } -// ========== BASIC ========== +// ========== Math ========== + +// ========== Text ========== + +// ========== Lists ========== + +// ========== Colour ========== + +// ========== Basic ========== Blockly.Blocks['sleep'] = { init: function () { @@ -83,74 +52,58 @@ Blockly.Blocks['sleep'] = { } javascriptGenerator.forBlock['sleep'] = function (block: BlockSvg, generator: CodeGenerator) { - var code = 'await.sleep(' + generator.valueToCode(block, 'ID', 0) + ')\n' - + var code = 'await sleep(' + generator.valueToCode(block, 'ID', 0) + ')\n' return code; } -Blockly.Blocks['async_func'] = { - init: function () { - this.appendValueInput("NAME") - .setCheck(null) - .appendField("async function") - this.appendStatementInput("CODE") - .setCheck(null) - this.setPreviousStatement(true, null); - this.setNextStatement(true, null); - this.setColour(120); - this.setTooltip("dd"); - this.setHelpUrl(""); - } -} +// ---- // -javascriptGenerator.forBlock['async_func'] = function (block: BlockSvg, generator: CodeGenerator) { - var code = 'async function ' + generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '(){\n' + generator.statementToCode(block, 'CODE') + '};\n'; - return code; -} - - -Blockly.Blocks['call_func'] = { +Blockly.Blocks['console'] = { init: function () { - this.appendValueInput("NAME") + this.appendValueInput("text") .setCheck(null) - .appendField("call function") + .appendField("console") + .appendField(new Blockly.FieldDropdown([["log", "log"], ["error", "error"], ["info", "info"], ["debug", "debug"]]), "type"); this.setPreviousStatement(true, null); this.setNextStatement(true, null); - this.setColour(120); - this.setTooltip("dd"); + this.setColour(128); + this.setTooltip(""); this.setHelpUrl(""); } -} +}; -javascriptGenerator.forBlock['call_func'] = function (block: BlockSvg, generator: CodeGenerator) { - var code = generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '();\n'; +javascriptGenerator.forBlock['console'] = function (block: BlockSvg, generator: CodeGenerator) { + var dropdown_type = block.getFieldValue('type'); + //var value_text = block.getFieldValue('text'); + var value_text = generator.valueToCode(block, "text", 0); + var code = `console.${dropdown_type}(${value_text});\n`; return code; -} +}; +// ---- // Blockly.Blocks['raw_code'] = { - init: function() { - this.appendDummyInput('abc') - .appendField('code') - .appendField(new Blockly.FieldTextInput('default'), 'code'); + init: function () { + this.appendDummyInput('abcd') + .appendField('code') + .appendField(new Blockly.FieldTextInput(), 'code'); this.setPreviousStatement(true, null); this.setNextStatement(true, null); this.setTooltip(''); this.setHelpUrl(''); this.setColour("#888"); - } -} + } +} javascriptGenerator.forBlock['raw_code'] = function (block: BlockSvg, generator: CodeGenerator) { return block.getFieldValue('code') + '\n'; } - -// ========== SMARTLEDS ========== +// ========== Smartled ========== Blockly.Blocks['smartled_init'] = { init: function () { - this.appendDummyInput('NAME') + this.appendDummyInput('abcd') .appendField('Load smartled'); this.setPreviousStatement(true, null); this.setNextStatement(true, null); @@ -161,10 +114,14 @@ Blockly.Blocks['smartled_init'] = { } javascriptGenerator.forBlock['smartled_init'] = function (block: BlockSvg, generator: CodeGenerator) { - var code = '\nimport { SmartLed, LED_WS2812, LED_WS2812B, LED_WS2812B_2020, LED_SK6812, LED_WS2813 } from "smartled";\nfunction HEXtoRgb(hex) {\n var result = hex.replace("#", "").match(/.{1,2}/g);\n return {r:parseInt(result[0], 16), g:parseInt(result[1], 16), b:parseInt(result[2], 16)}\n}\nfunction HSVtoRgb(h, s, v) {\n var r, g, b, i, f, p, q, t;if (arguments.length === 1) {s = h.s, v = h.v, h = h.h;}i = Math.floor(h * 6);f = h * 6 - i;p = v * (1 - s);q = v * (1 - f * s);t = v * (1 - (1 - f) * s);switch (i % 6) {case 0: r = v, g = t, b = p; break;case 1: r = q, g = v, b = p; break;case 2: r = p, g = v, b = t; break;case 3: r = p, g = q, b = v; break;case 4: r = t, g = p, b = v; break;case 5: r = v, g = p, b = q; break;}\n return {r: Math.round(r * 255),g: Math.round(g * 255),b: Math.round(b * 255)};\n}\n'; + var code = 'import { SmartLed, LED_WS2812, LED_WS2812B, LED_WS2812B_2020, LED_SK6812, LED_WS2813 } from "smartled";\n' + +'const HSVtoRgb = (c) => ( i = Math.floor(c.h * 6), f = c.h * 6 - i, p = c.v * (1 - c.s), q = c.v * (1 - f * c.s), t = c.v * (1 - (1 - f) * c.s), \n' + +' {r: Math.round([c.v, q, p, p, t, c.v][i % 6] * 255), g: Math.round([t, c.v, c.v, q, p, p][i % 6] * 255), b: Math.round([p, p, t, c.v, c.v, q][i % 6] * 255)});\n' + +'const HEXtoRgb = hex => ((result = hex.replace("#", "").match(/.{1,2}/g)), {r: parseInt(result[0], 16), g: parseInt(result[1], 16), b: parseInt(result[2], 16)});\n' return code; } +// ---- // Blockly.Blocks['create_strip'] = { init: function () { @@ -198,19 +155,24 @@ javascriptGenerator.forBlock['create_strip'] = function (block: BlockSvg, genera return code; } +// ---- // - -registerFieldColour(); Blockly.Blocks['set_hex'] = { - init: function() { - this.appendDummyInput('abc') - .appendField('set hex'); + init: function () { + this.appendDummyInput('abcd') + .appendField('set hex'); + this.appendValueInput('NAME') + .appendField(' name'); + this.appendValueInput('COLOR') + .appendField(' color'); + this.appendValueInput('INDEX') + .appendField(' index') this.setPreviousStatement(true, null); this.setNextStatement(true, null); this.setTooltip(''); this.setHelpUrl(''); this.setColour(259); - } + } } javascriptGenerator.forBlock['set_hex'] = function (block: BlockSvg, generator: CodeGenerator) { @@ -218,37 +180,40 @@ javascriptGenerator.forBlock['set_hex'] = function (block: BlockSvg, generator: return code; } +// ---- // + Blockly.Blocks['set_hsv'] = { init: function () { - this.appendValueInput("ID") - .setCheck(null) - .appendField("set hsv") - .appendField(" id =") - this.appendValueInput("INDEX") - .setCheck(null) - .appendField(" index ="); - this.appendValueInput("H") - .setCheck(null) - .appendField(" H ="); - this.appendValueInput("S") - .setCheck(null) - .appendField(" S ="); - this.appendValueInput("V") - .setCheck(null) - .appendField(" V ="); + this.appendDummyInput('abcd') + .appendField('set hsv'); + this.appendValueInput('NAME') + .appendField(' name'); + this.appendValueInput('INDEX') + .appendField(' index'); + this.appendValueInput('HUE') + .appendField(' H (0-360):') + this.appendValueInput('SATURATION') + .appendField(' S (0-256):') + this.appendValueInput('VALUE') + .appendField(' V (0-256):') this.setPreviousStatement(true, null); this.setNextStatement(true, null); + this.setTooltip(''); + this.setHelpUrl(''); this.setColour(259); - this.setTooltip("dd"); - this.setHelpUrl(""); } } javascriptGenerator.forBlock['set_hsv'] = function (block: BlockSvg, generator: CodeGenerator) { - var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.set(' + generator.valueToCode(block, 'INDEX', 0) + ', HSVtoRgb(' + generator.valueToCode(block, 'H', 0) + '/360, ' + generator.valueToCode(block, 'S', 0) + '/256, ' + generator.valueToCode(block, 'V', 0) + '/256));\n'; + var code = generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + + '.set(' + generator.valueToCode(block, 'INDEX', 0) + + ', HSVtoRgb({h: ' + Math.min(Number(generator.valueToCode(block, 'HUE', 0)), 360) + '/360, s: ' + + Math.min(Number(generator.valueToCode(block, 'SATURATION', 0)), 256) + '/256, v: ' + + Math.min(Number(generator.valueToCode(block, 'VALUE', 0)), 256) + '/256}));\n'; return code; } +// ---- // Blockly.Blocks['set_rgb'] = { init: function () { @@ -281,6 +246,8 @@ javascriptGenerator.forBlock['set_rgb'] = function (block: BlockSvg, generator: return code; } +// ---- // + Blockly.Blocks['strip_clear'] = { init: function () { @@ -301,6 +268,8 @@ javascriptGenerator.forBlock['strip_clear'] = function (block: BlockSvg, generat return code; } +// ---- // + Blockly.Blocks['strip_show'] = { init: function () { this.appendValueInput("ID") @@ -318,4 +287,51 @@ Blockly.Blocks['strip_show'] = { javascriptGenerator.forBlock['strip_show'] = function (block: BlockSvg, generator: CodeGenerator) { var code = 'strip_' + generator.valueToCode(block, 'ID', 0) + '.show();\n' return code; -} \ No newline at end of file +} + +// ========== Custom Button ========== +// ========== Variables ========== +// ========== Functions ========== + + + + + +Blockly.Blocks['async_func'] = { + init: function () { + this.appendValueInput("NAME") + .setCheck(null) + .appendField("async function") + this.appendStatementInput("CODE") + .setCheck(null) + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(120); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['async_func'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = 'async function ' + generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '(){\n' + generator.statementToCode(block, 'CODE') + '};\n'; + return code; +} + + +Blockly.Blocks['call_func'] = { + init: function () { + this.appendValueInput("NAME") + .setCheck(null) + .appendField("call function") + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(120); + this.setTooltip("dd"); + this.setHelpUrl(""); + } +} + +javascriptGenerator.forBlock['call_func'] = function (block: BlockSvg, generator: CodeGenerator) { + var code = generator.valueToCode(block, 'NAME', 0).replaceAll("'", "") + '();\n'; + return code; +} From f8eebedecf1d7738930fa201ccf0fc4e247b9b73 Mon Sep 17 00:00:00 2001 From: c2coder Date: Thu, 15 Aug 2024 13:38:16 +0200 Subject: [PATCH 06/22] Fix code result --- src/App.tsx | 10 +-- src/components/topLevel/BlocklyEditor.tsx | 2 +- src/components/topLevel/CodeResult.tsx | 86 +++-------------------- src/components/topLevel/Monitor.tsx | 4 +- src/customBlocks/customBlocks.ts | 15 ++-- src/index.css | 12 ++++ 6 files changed, 36 insertions(+), 93 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 56e65c0..3034720 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -17,16 +17,16 @@ function App() {
-
-
+
+
-
-
+
+
-
+
diff --git a/src/components/topLevel/BlocklyEditor.tsx b/src/components/topLevel/BlocklyEditor.tsx index dc22607..d96d843 100644 --- a/src/components/topLevel/BlocklyEditor.tsx +++ b/src/components/topLevel/BlocklyEditor.tsx @@ -11,7 +11,7 @@ import {INITIAL_TOOLBOX_JSON} from "../../blockly-config"; export interface HeaderProps extends InputHTMLAttributes { } -const defaultJson = "{\"blocks\":{\"languageVersion\":0,\"blocks\":[{\"type\":\"variables_set\",\"id\":\"}1_p%V(HNyTe5C:mf~e1\",\"x\":197,\"y\":56,\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}},\"inputs\":{\"VALUE\":{\"block\":{\"type\":\"math_number\",\"id\":\"VDY%P}5af(~Ez)TOfngK\",\"fields\":{\"NUM\":0}}}},\"next\":{\"block\":{\"type\":\"set_interval\",\"id\":\"jVN+X=B5Nj$QTT4^T/Rm\",\"inputs\":{\"INTERVAL\":{\"shadow\":{\"type\":\"math_number\",\"id\":\"|:7NXb@w|PQMij.0B!CL\",\"fields\":{\"NUM\":500}},\"block\":{\"type\":\"math_number\",\"id\":\"{ma][[.bDXk{1b$1:{wv\",\"fields\":{\"NUM\":500}}},\"CODE\":{\"block\":{\"type\":\"console\",\"id\":\"vd{u/{gQGNX@10O?0^`e\",\"fields\":{\"TYPE\":\"log\"},\"inputs\":{\"TEXT\":{\"shadow\":{\"type\":\"text\",\"id\":\"3B;mEtby0w@V..@F-z{H\",\"fields\":{\"TEXT\":\"abc\"}},\"block\":{\"type\":\"text_join\",\"id\":\"pI68/n|TwP?+.HW!m)~D\",\"extraState\":{\"itemCount\":2},\"inputs\":{\"ADD0\":{\"block\":{\"type\":\"text\",\"id\":\"wrtNHiKtON%B38gE^o=y\",\"fields\":{\"TEXT\":\"JacLy - index: \"}}},\"ADD1\":{\"block\":{\"type\":\"variables_get\",\"id\":\"X94KpDGK,zGh]#o]ZIFH\",\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}}}}}}}},\"next\":{\"block\":{\"type\":\"math_change\",\"id\":\"1/U093lt?YL?,dR6^I^z\",\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}},\"inputs\":{\"DELTA\":{\"shadow\":{\"type\":\"math_number\",\"id\":\"uL[6zYZsdx%2#+v[CWI!\",\"fields\":{\"NUM\":1}},\"block\":{\"type\":\"math_number\",\"id\":\"RZTdhlLJtqGkDu$Pp}VO\",\"fields\":{\"NUM\":1}}}}}}}}}}}}]},\"variables\":[{\"name\":\"i\",\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}]}" +const defaultJson = "{\"blocks\":{\"languageVersion\":0,\"blocks\":[{\"type\":\"variables_set\",\"id\":\"kZ{ZEV/O8cPC_oh[Mpjn\",\"x\":250,\"y\":218,\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}},\"inputs\":{\"VALUE\":{\"block\":{\"type\":\"math_number\",\"id\":\"--,JgL_QK!$/M2(lpR^@\",\"fields\":{\"NUM\":0}}}},\"next\":{\"block\":{\"type\":\"set_interval\",\"id\":\"V_=!FlwxB^y*25j%~7C3\",\"inputs\":{\"INTERVAL\":{\"shadow\":{\"type\":\"math_number\",\"id\":\"[4j05-#y^%Q@ie*HVkeg\",\"fields\":{\"NUM\":1000}}},\"CODE\":{\"block\":{\"type\":\"console\",\"id\":\"C-+=%9dmwT9NND+F(LgH\",\"fields\":{\"type\":\"log\"},\"inputs\":{\"text\":{\"shadow\":{\"type\":\"text\",\"id\":\"/#dp!xm?6YywQn{f}P#U\",\"fields\":{\"TEXT\":\"\"}},\"block\":{\"type\":\"text_join\",\"id\":\"q,-[sl[oyFUS8Zk4hFQA\",\"extraState\":{\"itemCount\":2},\"inputs\":{\"ADD0\":{\"block\":{\"type\":\"text\",\"id\":\";UHIu%eF5=Gb%CxZgDQT\",\"fields\":{\"TEXT\":\"JacLy - index: \"}}},\"ADD1\":{\"block\":{\"type\":\"variables_get\",\"id\":\"AdTAoR8q$rXJ6Ov7.6J(\",\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}}}}}}}},\"next\":{\"block\":{\"type\":\"math_change\",\"id\":\"|)7{~;~4p=KQS#]kcNyj\",\"fields\":{\"VAR\":{\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}},\"inputs\":{\"DELTA\":{\"shadow\":{\"type\":\"math_number\",\"id\":\"B!#ac;Nw5OZGlOTjpc?2\",\"fields\":{\"NUM\":1}}}}}}}}}}}}]},\"variables\":[{\"name\":\"i\",\"id\":\"C(8;cYCF}~vSgkxzJ+{O\"}]}" const BlocklyEditor: FC = ({}) => { diff --git a/src/components/topLevel/CodeResult.tsx b/src/components/topLevel/CodeResult.tsx index 9271fa8..12e0ca8 100644 --- a/src/components/topLevel/CodeResult.tsx +++ b/src/components/topLevel/CodeResult.tsx @@ -42,7 +42,7 @@ const oneDark: { [key: string]: React.CSSProperties } = { "MozHyphens": "none", "msHyphens": "none", "hyphens": "none", - "padding": "1em 1em 1em .5em", + "padding": ".5em", "margin": "0", // this is why this code is here "overflow": "scroll", "borderRadius": "0.3em" @@ -180,86 +180,12 @@ const oneDark: { [key: string]: React.CSSProperties } = { "special-attr > .token.attr-value > .token.value.css": { "color": "hsl(220, 14%, 71%)" }, - ".language-css .token.selector": { - "color": "hsl(355, 65%, 65%)" - }, - ".language-css .token.property": { - "color": "hsl(220, 14%, 71%)" - }, - ".language-css .token.function": { - "color": "hsl(187, 47%, 55%)" - }, - ".language-css .token.url > .token.function": { - "color": "hsl(187, 47%, 55%)" - }, - ".language-css .token.url > .token.string.url": { - "color": "hsl(95, 38%, 62%)" - }, - ".language-css .token.important": { - "color": "hsl(286, 60%, 67%)" - }, - ".language-css .token.atrule .token.rule": { - "color": "hsl(286, 60%, 67%)" - }, ".language-javascript .token.operator": { "color": "hsl(286, 60%, 67%)" }, ".language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation": { "color": "hsl(5, 48%, 51%)" }, - ".language-json .token.operator": { - "color": "hsl(220, 14%, 71%)" - }, - ".language-json .token.null.keyword": { - "color": "hsl(29, 54%, 61%)" - }, - ".language-markdown .token.url": { - "color": "hsl(220, 14%, 71%)" - }, - ".language-markdown .token.url > .token.operator": { - "color": "hsl(220, 14%, 71%)" - }, - ".language-markdown .token.url-reference.url > .token.string": { - "color": "hsl(220, 14%, 71%)" - }, - ".language-markdown .token.url > .token.content": { - "color": "hsl(207, 82%, 66%)" - }, - ".language-markdown .token.url > .token.url": { - "color": "hsl(187, 47%, 55%)" - }, - ".language-markdown .token.url-reference.url": { - "color": "hsl(187, 47%, 55%)" - }, - ".language-markdown .token.blockquote.punctuation": { - "color": "hsl(220, 10%, 40%)", - "fontStyle": "italic" - }, - ".language-markdown .token.hr.punctuation": { - "color": "hsl(220, 10%, 40%)", - "fontStyle": "italic" - }, - ".language-markdown .token.code-snippet": { - "color": "hsl(95, 38%, 62%)" - }, - ".language-markdown .token.bold .token.content": { - "color": "hsl(29, 54%, 61%)" - }, - ".language-markdown .token.italic .token.content": { - "color": "hsl(286, 60%, 67%)" - }, - ".language-markdown .token.strike .token.content": { - "color": "hsl(355, 65%, 65%)" - }, - ".language-markdown .token.strike .token.punctuation": { - "color": "hsl(355, 65%, 65%)" - }, - ".language-markdown .token.list.punctuation": { - "color": "hsl(355, 65%, 65%)" - }, - ".language-markdown .token.title.important > .token.punctuation": { - "color": "hsl(355, 65%, 65%)" - }, "bold": { "fontWeight": "bold" }, @@ -518,8 +444,14 @@ const CodeResult: FC = ({}) => { return ( -
- +
+ {code}
diff --git a/src/components/topLevel/Monitor.tsx b/src/components/topLevel/Monitor.tsx index 39c0f6c..ef7c1ac 100644 --- a/src/components/topLevel/Monitor.tsx +++ b/src/components/topLevel/Monitor.tsx @@ -17,7 +17,7 @@ export interface HeaderProps extends InputHTMLAttributes { } const Monitor: FC = ({ }) => { const { device } = useDevice(); - const [lines, setLines] = useState(14); // TODO: add UI for this - DONE + const [lines, setLines] = useState(10); // TODO: add UI for this - DONE const [text, setText] = useState("\n".repeat(lines)); @@ -60,7 +60,7 @@ const Monitor: FC = ({ }) => { }, [device, setText, text]); return ( -
+
); } From 4f16bf0989e4f87290c4f611b0f0a60982a5f896 Mon Sep 17 00:00:00 2001 From: c2coder Date: Fri, 6 Sep 2024 00:01:14 +0200 Subject: [PATCH 12/22] Add Upload libs button --- package-lock.json | 409 +++-------------------- package.json | 3 +- src/components/buttons/UploadLibsBtn.tsx | 191 +++++++++++ src/components/topLevel/TopBar.tsx | 4 + 4 files changed, 246 insertions(+), 361 deletions(-) create mode 100644 src/components/buttons/UploadLibsBtn.tsx diff --git a/package-lock.json b/package-lock.json index 510acac..d5fe1bc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@blockly/field-colour": "^4.0.0", "@types/w3c-web-serial": "^1.0.3", + "axios": "^1.7.5", "blockly": "^10.0.0", "classnames": "^2.3.2", "jaculus-tools": "^0.0.23", @@ -33,7 +34,7 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.1", "postcss": "^8.4.25", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.4.10", "vite": "^4.4.0", "vite-plugin-checker": "^0.6.1", "vite-plugin-node-polyfills": "^0.9.0" @@ -443,246 +444,6 @@ "kuler": "^2.0.0" } }, - "node_modules/@esbuild/android-arm": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.18.11.tgz", - "integrity": "sha512-q4qlUf5ucwbUJZXF5tEQ8LF7y0Nk4P58hOsGk3ucY0oCwgQqAnqXVbUuahCddVHfrxmpyewRpiTHwVHIETYu7Q==", - "cpu": [ - "arm" - ], - "dev": true, - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/android-arm64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.18.11.tgz", - "integrity": "sha512-snieiq75Z1z5LJX9cduSAjUr7vEI1OdlzFPMw0HH5YI7qQHDd3qs+WZoMrWYDsfRJSq36lIA6mfZBkvL46KoIw==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/android-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.18.11.tgz", - "integrity": "sha512-iPuoxQEV34+hTF6FT7om+Qwziv1U519lEOvekXO9zaMMlT9+XneAhKL32DW3H7okrCOBQ44BMihE8dclbZtTuw==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "android" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/darwin-arm64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.18.11.tgz", - "integrity": "sha512-Gm0QkI3k402OpfMKyQEEMG0RuW2LQsSmI6OeO4El2ojJMoF5NLYb3qMIjvbG/lbMeLOGiW6ooU8xqc+S0fgz2w==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/darwin-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.18.11.tgz", - "integrity": "sha512-N15Vzy0YNHu6cfyDOjiyfJlRJCB/ngKOAvoBf1qybG3eOq0SL2Lutzz9N7DYUbb7Q23XtHPn6lMDF6uWbGv9Fw==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/freebsd-arm64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.11.tgz", - "integrity": "sha512-atEyuq6a3omEY5qAh5jIORWk8MzFnCpSTUruBgeyN9jZq1K/QI9uke0ATi3MHu4L8c59CnIi4+1jDKMuqmR71A==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "freebsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/freebsd-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.18.11.tgz", - "integrity": "sha512-XtuPrEfBj/YYYnAAB7KcorzzpGTvOr/dTtXPGesRfmflqhA4LMF0Gh/n5+a9JBzPuJ+CGk17CA++Hmr1F/gI0Q==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "freebsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-arm": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.18.11.tgz", - "integrity": "sha512-Idipz+Taso/toi2ETugShXjQ3S59b6m62KmLHkJlSq/cBejixmIydqrtM2XTvNCywFl3VC7SreSf6NV0i6sRyg==", - "cpu": [ - "arm" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-arm64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.18.11.tgz", - "integrity": "sha512-c6Vh2WS9VFKxKZ2TvJdA7gdy0n6eSy+yunBvv4aqNCEhSWVor1TU43wNRp2YLO9Vng2G+W94aRz+ILDSwAiYog==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-ia32": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.18.11.tgz", - "integrity": "sha512-S3hkIF6KUqRh9n1Q0dSyYcWmcVa9Cg+mSoZEfFuzoYXXsk6196qndrM+ZiHNwpZKi3XOXpShZZ+9dfN5ykqjjw==", - "cpu": [ - "ia32" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-loong64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.18.11.tgz", - "integrity": "sha512-MRESANOoObQINBA+RMZW+Z0TJWpibtE7cPFnahzyQHDCA9X9LOmGh68MVimZlM9J8n5Ia8lU773te6O3ILW8kw==", - "cpu": [ - "loong64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-mips64el": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.18.11.tgz", - "integrity": "sha512-qVyPIZrXNMOLYegtD1u8EBccCrBVshxMrn5MkuFc3mEVsw7CCQHaqZ4jm9hbn4gWY95XFnb7i4SsT3eflxZsUg==", - "cpu": [ - "mips64el" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-ppc64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.18.11.tgz", - "integrity": "sha512-T3yd8vJXfPirZaUOoA9D2ZjxZX4Gr3QuC3GztBJA6PklLotc/7sXTOuuRkhE9W/5JvJP/K9b99ayPNAD+R+4qQ==", - "cpu": [ - "ppc64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-riscv64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.18.11.tgz", - "integrity": "sha512-evUoRPWiwuFk++snjH9e2cAjF5VVSTj+Dnf+rkO/Q20tRqv+644279TZlPK8nUGunjPAtQRCj1jQkDAvL6rm2w==", - "cpu": [ - "riscv64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/linux-s390x": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.18.11.tgz", - "integrity": "sha512-/SlRJ15XR6i93gRWquRxYCfhTeC5PdqEapKoLbX63PLCmAkXZHY2uQm2l9bN0oPHBsOw2IswRZctMYS0MijFcg==", - "cpu": [ - "s390x" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=12" - } - }, "node_modules/@esbuild/linux-x64": { "version": "0.18.11", "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.18.11.tgz", @@ -699,102 +460,6 @@ "node": ">=12" } }, - "node_modules/@esbuild/netbsd-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.18.11.tgz", - "integrity": "sha512-aSjMHj/F7BuS1CptSXNg6S3M4F3bLp5wfFPIJM+Km2NfIVfFKhdmfHF9frhiCLIGVzDziggqWll0B+9AUbud/Q==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "netbsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/openbsd-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.18.11.tgz", - "integrity": "sha512-tNBq+6XIBZtht0xJGv7IBB5XaSyvYPCm1PxJ33zLQONdZoLVM0bgGqUrXnJyiEguD9LU4AHiu+GCXy/Hm9LsdQ==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "openbsd" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/sunos-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.18.11.tgz", - "integrity": "sha512-kxfbDOrH4dHuAAOhr7D7EqaYf+W45LsAOOhAet99EyuxxQmjbk8M9N4ezHcEiCYPaiW8Dj3K26Z2V17Gt6p3ng==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "sunos" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/win32-arm64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.18.11.tgz", - "integrity": "sha512-Sh0dDRyk1Xi348idbal7lZyfSkjhJsdFeuC13zqdipsvMetlGiFQNdO+Yfp6f6B4FbyQm7qsk16yaZk25LChzg==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/win32-ia32": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.18.11.tgz", - "integrity": "sha512-o9JUIKF1j0rqJTFbIoF4bXj6rvrTZYOrfRcGyL0Vm5uJ/j5CkBD/51tpdxe9lXEDouhRgdr/BYzUrDOvrWwJpg==", - "cpu": [ - "ia32" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, - "node_modules/@esbuild/win32-x64": { - "version": "0.18.11", - "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.18.11.tgz", - "integrity": "sha512-rQI4cjLHd2hGsM1LqgDI7oOCYbQ6IBOVsX9ejuRMSze0GqXUG2ekwiKkiBU1pRGSeCqFFHxTrcEydB2Hyoz9CA==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=12" - } - }, "node_modules/@eslint-community/eslint-utils": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz", @@ -1651,6 +1316,17 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/axios": { + "version": "1.7.5", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.5.tgz", + "integrity": "sha512-fZu86yCo+svH3uqJ/yTdQ0QHpQu5oL+/QE+QPSv6BZSkDAoky9vytxp7u5qk83OJFS3kEBcesWni9WTZAv3tSw==", + "license": "MIT", + "dependencies": { + "follow-redirects": "^1.15.6", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, "node_modules/b4a": { "version": "1.6.6", "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.6.tgz", @@ -3146,6 +2822,26 @@ "resolved": "https://registry.npmjs.org/fn.name/-/fn.name-1.1.0.tgz", "integrity": "sha512-GRnmB5gPyJpAhTQdSZTSp9uaPSvl09KoYcMQtsB9rQoOmzs9dH6ffeccH+Z+cv6P68Hu5bC6JjRh4Ah/mHSNRw==" }, + "node_modules/follow-redirects": { + "version": "1.15.6", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz", + "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "license": "MIT", + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, "node_modules/for-each": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", @@ -3215,20 +2911,6 @@ "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", "dev": true }, - "node_modules/fsevents": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", - "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "dev": true, - "hasInstallScript": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": "^8.16.0 || ^10.6.0 || >=11.0.0" - } - }, "node_modules/function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", @@ -4089,10 +3771,11 @@ } }, "node_modules/jiti": { - "version": "1.19.1", - "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.19.1.tgz", - "integrity": "sha512-oVhqoRDaBXf7sjkll95LHVS6Myyyb1zaunVwk4Z0+WPSW4gjS0pl01zYKHScTuyEhQsFxV5L4DR5r+YqSyqyyg==", + "version": "1.21.6", + "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.6.tgz", + "integrity": "sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==", "dev": true, + "license": "MIT", "bin": { "jiti": "bin/jiti.js" } @@ -5186,6 +4869,12 @@ "url": "https://github.com/sponsors/wooorm" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==", + "license": "MIT" + }, "node_modules/psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", @@ -5957,20 +5646,21 @@ "integrity": "sha512-FOxLFcXTe9eqC85SNCREyWw/CG8hyNSBJNrp+rjMDV7m63UoJzpkNJtXNrA0y3tE9m0d3ccNj8HBVQG/hfmNxA==" }, "node_modules/tailwindcss": { - "version": "3.3.2", - "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.2.tgz", - "integrity": "sha512-9jPkMiIBXvPc2KywkraqsUfbfj+dHDb+JPWtSJa9MLFdrPyazI7q6WX2sUrm7R9eVR7qqv3Pas7EvQFzxKnI6w==", + "version": "3.4.10", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.10.tgz", + "integrity": "sha512-KWZkVPm7yJRhdu4SRSl9d4AK2wM3a50UsvgHZO7xY77NQr2V+fIrEuoDGQcbvswWvFGbS2f6e+jC/6WJm1Dl0w==", "dev": true, + "license": "MIT", "dependencies": { "@alloc/quick-lru": "^5.2.0", "arg": "^5.0.2", "chokidar": "^3.5.3", "didyoumean": "^1.2.2", "dlv": "^1.1.3", - "fast-glob": "^3.2.12", + "fast-glob": "^3.3.0", "glob-parent": "^6.0.2", "is-glob": "^4.0.3", - "jiti": "^1.18.2", + "jiti": "^1.21.0", "lilconfig": "^2.1.0", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", @@ -5982,7 +5672,6 @@ "postcss-load-config": "^4.0.1", "postcss-nested": "^6.0.1", "postcss-selector-parser": "^6.0.11", - "postcss-value-parser": "^4.2.0", "resolve": "^1.22.2", "sucrase": "^3.32.0" }, diff --git a/package.json b/package.json index be53490..df40f3d 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "@blockly/field-colour": "^4.0.0", "@types/w3c-web-serial": "^1.0.3", + "axios": "^1.7.5", "blockly": "^10.0.0", "classnames": "^2.3.2", "jaculus-tools": "^0.0.23", @@ -35,7 +36,7 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.1", "postcss": "^8.4.25", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.4.10", "vite": "^4.4.0", "vite-plugin-checker": "^0.6.1", "vite-plugin-node-polyfills": "^0.9.0" diff --git a/src/components/buttons/UploadLibsBtn.tsx b/src/components/buttons/UploadLibsBtn.tsx new file mode 100644 index 0000000..e3cf224 --- /dev/null +++ b/src/components/buttons/UploadLibsBtn.tsx @@ -0,0 +1,191 @@ +import { FC, InputHTMLAttributes, useEffect, useState } from "react"; +import { useDevice } from "../../context/JaculusContext"; +import { Buffer } from "buffer"; +import Button from "./Button"; +import { useGenerateCode } from "../../context/GenerateCodeContext"; +import axios from "axios"; + + +export interface UploadLibsBtnProps extends InputHTMLAttributes { +} + +const UploadLibsBtn: FC = ({ }) => { + const { setNewDevice, disconnectDevice, device } = useDevice(); + const { code } = useGenerateCode(); + + let installStatus = 0; + // 0 = no libs dir + // 1 = libs dir exists + + type manifestDataType = { + description: string; + examples: { + file: string; + name: string; + }[]; + files: string[]; + folder: string; + name: string; + }[] + const [manifestData, setManifestData] = useState(null); + + const baseURL = "https://c2coder.github.io/Jaculus-libraries/" + + // Fetch the manifest JSON file + useEffect(() => { + axios.get(baseURL + "data/manifest.json") + .then((response) => { + setManifestData(response.data); // response.data is already parsed JSON + }) + .catch((error) => { + console.error('Error fetching the manifest JSON file:', error); + }); + }, []); + + const upload_libs = async () => { + if (!device) + return; + + // Check if got manifest file + if (manifestData == null) { + console.error("Manifest data is null"); + return; + } + + let codeLines = code.split("\n"); + + let filesInIndexFile: string[] = []; + let filesToImport: string[][][] = []; + + // Find what files are in the index file + for (let i = 0; i < codeLines.length; i++) { + if (codeLines[i].startsWith("import") && codeLines[i].includes("./libs/")) { + let libName = codeLines[i].split("from")[1].replace("./libs/", "").replaceAll("'", "").replaceAll("\"", "").replace(";", "").replace(" ", "") + filesInIndexFile.push(libName); + } + } + + // Remove duplicates + filesInIndexFile = [...new Set(filesInIndexFile)]; + + // Find what libs to import + manifestData.forEach(lib => { + lib.files.forEach(file => { + file = file.replace(".ts", ".js"); + if (filesInIndexFile.includes(file)) { + console.log("Install lib: " + lib.folder + "due to file: " + file); + const files = lib.files.map(item => [lib.folder, item.replace(".ts", ".js")]); + filesToImport.push(files); + } + }); + }); + + // Lock the device + await device.controller.lock().catch((err) => { + console.error("Error locking device: " + err); + throw 1; + }); + + // Check if libs folder exists + await device.uploader.listDirectory("code").then((dirs: [string, boolean, number][]) => { + dirs.forEach(dir => { + if (dir[0].includes("libs")) { + console.log("Found libs folder\n"); + installStatus = 1; + } + }); + }); + + // If libs folder doesn't exist, create it + if (installStatus == 0) { + console.log("Creating libs folder"); + await device.uploader.createDirectory("code/libs").catch((err) => { + console.error("Error creating libs folder: " + err); + throw 1; + }); + installStatus = 1; + } + + // Make sure that libs folder exists and everything is ready + if (installStatus == 1) { + // Stop the device + await device.controller.stop().catch((err) => { + console.error("Error stopping device: " + err); + }); + + try { + // Make a list of URLs to fetch + let fileUrls: string[] = []; + filesToImport.forEach(files => { + files.forEach(file => { + let url = baseURL + "data/" + file[0] + "/" + file[1]; + if (fileUrls.includes(url)) { + console.log("Duplicate file: " + url); + } else { + fileUrls.push(url); + } + }); + }) + + // Fetch the files concurrently + const filePromises = fileUrls.map(async (url) => { + const response = await axios.get(url); + return [url, response.data]; + }); + const fileData = await Promise.all(filePromises); + + // Process each file content sequentially + for (const data of fileData) { + const url = data[0]; + const content = data[1]; + + const fileName = url.split("/").pop(); + console.log("Uploading: " + fileName); + + let buff = Buffer.from(content, "utf-8") + const cmd = await device.uploader.writeFile("/data/code/libs/" + fileName, buff).catch((err) => { + console.error("Error: " + err + "\n"); + throw 1; + }); + console.log(cmd.toString() + "\n"); + } + + } catch (error) { + console.error('Error fetching the files:', error); + } + } + + + // Start the program + await device.controller.start("index.js").catch((err) => { + console.error("Error starting program: " + err + "\n"); + throw 1; + }); + + // Unlock the device + await device.controller.unlock().catch((err) => { + console.log("Error unlocking device: " + err); + throw 1; + }); + } + + let whenDisconnected = () => { + return <> +