From 1a32147d68938e9c1155b535f9212d9858947d45 Mon Sep 17 00:00:00 2001 From: Juan Rosario Date: Sun, 15 Jan 2023 17:41:56 -0600 Subject: [PATCH] feat: add new CodeStream control to Gcodeviewer (#1224) Co-authored-by: Stefan Dej --- package-lock.json | 214 +++++++++++----------- package.json | 2 +- src/components/gcodeviewer/CodeStream.vue | 82 +++++++++ src/components/gcodeviewer/Viewer.vue | 50 ++++- src/locales/en.json | 3 +- src/store/gui/index.ts | 1 + src/store/gui/types.ts | 1 + 7 files changed, 241 insertions(+), 112 deletions(-) create mode 100644 src/components/gcodeviewer/CodeStream.vue diff --git a/package-lock.json b/package-lock.json index c8a021b6f..eabbbe5fb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,7 +18,7 @@ "@codemirror/view": "^6.0.3", "@jaames/iro": "^5.5.2", "@lezer/highlight": "^1.0.0", - "@sindarius/gcodeviewer": "^3.1.4", + "@sindarius/gcodeviewer": "^3.1.14", "@types/node": "^18.0.0", "@types/overlayscrollbars": "^1.12.1", "axios": "^0.27.0", @@ -1901,23 +1901,23 @@ } }, "node_modules/@babylonjs/core": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/core/-/core-5.28.0.tgz", - "integrity": "sha512-muHxtHlQmkd8bH5VrF7iDDF4R1qxtzf3jsHLd+IdIJbKjbB1HDCJwekPROLHUA/GbPpb0F3Q4QGk2oixm1R9uQ==" + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/core/-/core-5.41.0.tgz", + "integrity": "sha512-PrY12n9IOql+9P/bFhEI7WTUqneTI0W9+ROKkwallqtTYku3XV7O5E7BXpdLJwrB/VufKApu6ErNoUb9Zhj9Cg==" }, "node_modules/@babylonjs/gui": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/gui/-/gui-5.28.0.tgz", - "integrity": "sha512-iXY9s6HDi4g6s9EjCoTYHB5RM2PCeEw2Oy/8U+9zvrUCKVUC9ec0FSVsQRxKloaI8XpNY0iBVj0N98Lvh89u/A==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/gui/-/gui-5.41.0.tgz", + "integrity": "sha512-eWoAb/TLM1+ANHVjSSx8VW6BfjCr6CTnQwKonKaOUcXtkjm0W0eAAd2BTTYbV3a5KoYxAnrYtZJT9YcxSPWG6Q==", "peer": true, "peerDependencies": { "@babylonjs/core": "^5.22.0" } }, "node_modules/@babylonjs/gui-editor": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/gui-editor/-/gui-editor-5.28.0.tgz", - "integrity": "sha512-E8Db3QWT+wmeTr9mMOI6XNtLG9k7z7k4bGDOvx94jD4iEQBcHJJCZpWjC3+Fdk6auaGlqq93JCtl7cWprntRdA==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/gui-editor/-/gui-editor-5.41.0.tgz", + "integrity": "sha512-rm2MvwlMw+Tpwsu9xPveDKCK44DKKAfCbvPCHz6rD2Vp1pqj7Yml1ExIrOQvzehHX/lT0WCaT0Ur58413215yg==", "peer": true, "peerDependencies": { "@babylonjs/core": "^5.22.0", @@ -1927,9 +1927,9 @@ } }, "node_modules/@babylonjs/inspector": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/inspector/-/inspector-5.28.0.tgz", - "integrity": "sha512-YQNGxqaFPa2Z/dMgxkUYCG+k4OSZrUMUwBVgzeRtELmAv9VVe3/GXEg60l2r1UuzUBA5NPPo1ZGhlwyYtWN4dw==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/inspector/-/inspector-5.41.0.tgz", + "integrity": "sha512-oVsQVVnkRBfdWfMLwnBPAp3zajoQYspVbdbuxjGs67xfnPinj13RYVuUhx51hhacKTwOkMhYRzhfEdO1oCcwjg==", "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.1.0", "@fortawesome/free-regular-svg-icons": "^6.0.0", @@ -1947,26 +1947,26 @@ } }, "node_modules/@babylonjs/loaders": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/loaders/-/loaders-5.28.0.tgz", - "integrity": "sha512-N7B46skjG57frEm/h+zAR9cWswj9DV+byyy8Ttap0fu53y3Oe+b/v8wpoqriEbrHCR7JAlHtylMZa7ltkFQSGg==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/loaders/-/loaders-5.41.0.tgz", + "integrity": "sha512-a4zHmmk26Cn22S3eL+wkY2pRCFB2pLmBNHZ0CTD+Xv0S4Ctdj3HHC1Q+lgO3z7I40uM8jb5xdoG0+uTIwTm+RQ==", "peerDependencies": { "@babylonjs/core": "^5.22.0", "babylonjs-gltf2interface": "^5.22.0" } }, "node_modules/@babylonjs/materials": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/materials/-/materials-5.28.0.tgz", - "integrity": "sha512-Hiw7Qj2TFqUEP0F/vHxNlZ6rZH6XjI0/E1Kpx3WzrOgGEbwv6YNDLzIsfZ8PA8eTiq3CZnKHB/6x4l4fXYzxWw==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/materials/-/materials-5.41.0.tgz", + "integrity": "sha512-b5p94ATWc0e2E3xsWk6GG7jh3NUnOwy21rlYMhdc1TTTL16+BOtKoe9ju7Amv8VfwMubqLF+nMvZcJRBQWVreA==", "peerDependencies": { "@babylonjs/core": "^5.22.0" } }, "node_modules/@babylonjs/serializers": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/serializers/-/serializers-5.28.0.tgz", - "integrity": "sha512-hGDFoh50dKmmbJjqRvBWfMgy3TigyVCwa8r3DJs5l3KHF98RtG060JQmdOQaavs0LOjxNMgXj4hDRS89550kZA==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/serializers/-/serializers-5.41.0.tgz", + "integrity": "sha512-PcYley4WdF1Aeiiaw6c0NxO25LmZWllN3ltg1YOdud/U08JRDCJol/yqLRS7XKBInC2X+ENU2laToQswBxQhPQ==", "peer": true, "peerDependencies": { "@babylonjs/core": "^5.22.0", @@ -2214,45 +2214,45 @@ } }, "node_modules/@fortawesome/fontawesome-common-types": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.0.tgz", - "integrity": "sha512-rBevIsj2nclStJ7AxTdfsa3ovHb1H+qApwrxcTVo+NNdeJiB9V75hsKfrkG5AwNcRUNxrPPiScGYCNmLMoh8pg==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.1.tgz", + "integrity": "sha512-Sz07mnQrTekFWLz5BMjOzHl/+NooTdW8F8kDQxjWwbpOJcnoSg4vUDng8d/WR1wOxM0O+CY9Zw0nR054riNYtQ==", "hasInstallScript": true, "engines": { "node": ">=6" } }, "node_modules/@fortawesome/fontawesome-svg-core": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.0.tgz", - "integrity": "sha512-Cf2mAAeMWFMzpLC7Y9H1I4o3wEU+XovVJhTiNG8ZNgSQj53yl7OCJaS80K4YjrABWZzbAHVaoHE1dVJ27AAYXw==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.1.tgz", + "integrity": "sha512-HELwwbCz6C1XEcjzyT1Jugmz2NNklMrSPjZOWMlc+ZsHIVk+XOvOXLGGQtFBwSyqfJDNgRq4xBCwWOaZ/d9DEA==", "hasInstallScript": true, "dependencies": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" }, "engines": { "node": ">=6" } }, "node_modules/@fortawesome/free-regular-svg-icons": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.2.0.tgz", - "integrity": "sha512-M1dG+PAmkYMTL9BSUHFXY5oaHwBYfHCPhbJ8qj8JELsc9XCrUJ6eEHWip4q0tE+h9C0DVyFkwIM9t7QYyCpprQ==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.2.1.tgz", + "integrity": "sha512-wiqcNDNom75x+pe88FclpKz7aOSqS2lOivZeicMV5KRwOAeypxEYWAK/0v+7r+LrEY30+qzh8r2XDaEHvoLsMA==", "hasInstallScript": true, "dependencies": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" }, "engines": { "node": ">=6" } }, "node_modules/@fortawesome/free-solid-svg-icons": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.0.tgz", - "integrity": "sha512-UjCILHIQ4I8cN46EiQn0CZL/h8AwCGgR//1c4R96Q5viSRwuKVo0NdQEc4bm+69ZwC0dUvjbDqAHF1RR5FA3XA==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz", + "integrity": "sha512-oKuqrP5jbfEPJWTij4sM+/RvgX+RMFwx3QZCZcK9PrBDgxC35zuc7AOFsyMjMd/PIFPeB2JxyqDr5zs/DZFPPw==", "hasInstallScript": true, "dependencies": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" }, "engines": { "node": ">=6" @@ -2757,14 +2757,14 @@ "dev": true }, "node_modules/@sindarius/gcodeviewer": { - "version": "3.1.4", - "resolved": "https://registry.npmjs.org/@sindarius/gcodeviewer/-/gcodeviewer-3.1.4.tgz", - "integrity": "sha512-yiasBlojKFe3vpelfdzpe0J/SY0WNgWSEjbXqkOv9wKcWwoIwotaJ0c+qusSEjbyFgEy+6slQNUyKuy3hsEjXA==", - "dependencies": { - "@babylonjs/core": "^5.28.0", - "@babylonjs/inspector": "^5.28.0", - "@babylonjs/loaders": "^5.28.0", - "@babylonjs/materials": "^5.28.0", + "version": "3.1.14", + "resolved": "https://registry.npmjs.org/@sindarius/gcodeviewer/-/gcodeviewer-3.1.14.tgz", + "integrity": "sha512-+kmw2ougPYJzfU4lKvjSNZLsyDbhTKgeOA2KYAHgNnD0BUiSGCmveVLdcs8bSusmnrv8J+M+90eco0LSUuywiw==", + "dependencies": { + "@babylonjs/core": "^5.34.0", + "@babylonjs/inspector": "^5.34.0", + "@babylonjs/loaders": "^5.34.0", + "@babylonjs/materials": "^5.34.0", "d3": "^7.4.4" } }, @@ -2848,9 +2848,9 @@ "peer": true }, "node_modules/@types/react": { - "version": "18.0.21", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.21.tgz", - "integrity": "sha512-7QUCOxvFgnD5Jk8ZKlUAhVcRj7GuJRjnjjiY/IUBWKgOlnvDvTMLD4RTF7NPyVmbRhNrbomZiOepg7M/2Kj1mA==", + "version": "18.0.26", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.26.tgz", + "integrity": "sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug==", "peer": true, "dependencies": { "@types/prop-types": "*", @@ -2859,9 +2859,9 @@ } }, "node_modules/@types/react-dom": { - "version": "18.0.6", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.6.tgz", - "integrity": "sha512-/5OFZgfIPSwy+YuIBP/FgJnQnsxhZhjjrnxudMddeblOouIodEQ75X14Rr4wGSG/bknL+Omy9iWlLo1u/9GzAA==", + "version": "18.0.10", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.10.tgz", + "integrity": "sha512-E42GW/JA4Qv15wQdqJq8DL4JhNpB3prJgjgapN3qJT9K2zO5IIAQh4VXvCEDupoqAwnz0cY4RlXeC/ajX5SFHg==", "peer": true, "dependencies": { "@types/react": "*" @@ -3663,9 +3663,9 @@ } }, "node_modules/babylonjs-gltf2interface": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/babylonjs-gltf2interface/-/babylonjs-gltf2interface-5.28.0.tgz", - "integrity": "sha512-Mm0s5yaaCbbU6DJr/lXpa7ZV3FziT5wWlvC2Yyn6Rhl7xgZQQUub1NjDn+vt0wh4XjETDEEuHwOYpm1i5cID3w==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/babylonjs-gltf2interface/-/babylonjs-gltf2interface-5.41.0.tgz", + "integrity": "sha512-+aARV7Q6rxLxKnLX7aqe2klaPHzg6c5JBtsadpSAfMLL9laF3e7YqfTlPR6Zf7XxsAZGJBxU9BULLvC5R3BapA==", "peer": true }, "node_modules/balanced-match": { @@ -11373,28 +11373,28 @@ } }, "@babylonjs/core": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/core/-/core-5.28.0.tgz", - "integrity": "sha512-muHxtHlQmkd8bH5VrF7iDDF4R1qxtzf3jsHLd+IdIJbKjbB1HDCJwekPROLHUA/GbPpb0F3Q4QGk2oixm1R9uQ==" + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/core/-/core-5.41.0.tgz", + "integrity": "sha512-PrY12n9IOql+9P/bFhEI7WTUqneTI0W9+ROKkwallqtTYku3XV7O5E7BXpdLJwrB/VufKApu6ErNoUb9Zhj9Cg==" }, "@babylonjs/gui": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/gui/-/gui-5.28.0.tgz", - "integrity": "sha512-iXY9s6HDi4g6s9EjCoTYHB5RM2PCeEw2Oy/8U+9zvrUCKVUC9ec0FSVsQRxKloaI8XpNY0iBVj0N98Lvh89u/A==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/gui/-/gui-5.41.0.tgz", + "integrity": "sha512-eWoAb/TLM1+ANHVjSSx8VW6BfjCr6CTnQwKonKaOUcXtkjm0W0eAAd2BTTYbV3a5KoYxAnrYtZJT9YcxSPWG6Q==", "peer": true, "requires": {} }, "@babylonjs/gui-editor": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/gui-editor/-/gui-editor-5.28.0.tgz", - "integrity": "sha512-E8Db3QWT+wmeTr9mMOI6XNtLG9k7z7k4bGDOvx94jD4iEQBcHJJCZpWjC3+Fdk6auaGlqq93JCtl7cWprntRdA==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/gui-editor/-/gui-editor-5.41.0.tgz", + "integrity": "sha512-rm2MvwlMw+Tpwsu9xPveDKCK44DKKAfCbvPCHz6rD2Vp1pqj7Yml1ExIrOQvzehHX/lT0WCaT0Ur58413215yg==", "peer": true, "requires": {} }, "@babylonjs/inspector": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/inspector/-/inspector-5.28.0.tgz", - "integrity": "sha512-YQNGxqaFPa2Z/dMgxkUYCG+k4OSZrUMUwBVgzeRtELmAv9VVe3/GXEg60l2r1UuzUBA5NPPo1ZGhlwyYtWN4dw==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/inspector/-/inspector-5.41.0.tgz", + "integrity": "sha512-oVsQVVnkRBfdWfMLwnBPAp3zajoQYspVbdbuxjGs67xfnPinj13RYVuUhx51hhacKTwOkMhYRzhfEdO1oCcwjg==", "requires": { "@fortawesome/fontawesome-svg-core": "^6.1.0", "@fortawesome/free-regular-svg-icons": "^6.0.0", @@ -11402,21 +11402,21 @@ } }, "@babylonjs/loaders": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/loaders/-/loaders-5.28.0.tgz", - "integrity": "sha512-N7B46skjG57frEm/h+zAR9cWswj9DV+byyy8Ttap0fu53y3Oe+b/v8wpoqriEbrHCR7JAlHtylMZa7ltkFQSGg==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/loaders/-/loaders-5.41.0.tgz", + "integrity": "sha512-a4zHmmk26Cn22S3eL+wkY2pRCFB2pLmBNHZ0CTD+Xv0S4Ctdj3HHC1Q+lgO3z7I40uM8jb5xdoG0+uTIwTm+RQ==", "requires": {} }, "@babylonjs/materials": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/materials/-/materials-5.28.0.tgz", - "integrity": "sha512-Hiw7Qj2TFqUEP0F/vHxNlZ6rZH6XjI0/E1Kpx3WzrOgGEbwv6YNDLzIsfZ8PA8eTiq3CZnKHB/6x4l4fXYzxWw==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/materials/-/materials-5.41.0.tgz", + "integrity": "sha512-b5p94ATWc0e2E3xsWk6GG7jh3NUnOwy21rlYMhdc1TTTL16+BOtKoe9ju7Amv8VfwMubqLF+nMvZcJRBQWVreA==", "requires": {} }, "@babylonjs/serializers": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/@babylonjs/serializers/-/serializers-5.28.0.tgz", - "integrity": "sha512-hGDFoh50dKmmbJjqRvBWfMgy3TigyVCwa8r3DJs5l3KHF98RtG060JQmdOQaavs0LOjxNMgXj4hDRS89550kZA==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/@babylonjs/serializers/-/serializers-5.41.0.tgz", + "integrity": "sha512-PcYley4WdF1Aeiiaw6c0NxO25LmZWllN3ltg1YOdud/U08JRDCJol/yqLRS7XKBInC2X+ENU2laToQswBxQhPQ==", "peer": true, "requires": {} }, @@ -11623,32 +11623,32 @@ } }, "@fortawesome/fontawesome-common-types": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.0.tgz", - "integrity": "sha512-rBevIsj2nclStJ7AxTdfsa3ovHb1H+qApwrxcTVo+NNdeJiB9V75hsKfrkG5AwNcRUNxrPPiScGYCNmLMoh8pg==" + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.1.tgz", + "integrity": "sha512-Sz07mnQrTekFWLz5BMjOzHl/+NooTdW8F8kDQxjWwbpOJcnoSg4vUDng8d/WR1wOxM0O+CY9Zw0nR054riNYtQ==" }, "@fortawesome/fontawesome-svg-core": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.0.tgz", - "integrity": "sha512-Cf2mAAeMWFMzpLC7Y9H1I4o3wEU+XovVJhTiNG8ZNgSQj53yl7OCJaS80K4YjrABWZzbAHVaoHE1dVJ27AAYXw==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.1.tgz", + "integrity": "sha512-HELwwbCz6C1XEcjzyT1Jugmz2NNklMrSPjZOWMlc+ZsHIVk+XOvOXLGGQtFBwSyqfJDNgRq4xBCwWOaZ/d9DEA==", "requires": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" } }, "@fortawesome/free-regular-svg-icons": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.2.0.tgz", - "integrity": "sha512-M1dG+PAmkYMTL9BSUHFXY5oaHwBYfHCPhbJ8qj8JELsc9XCrUJ6eEHWip4q0tE+h9C0DVyFkwIM9t7QYyCpprQ==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.2.1.tgz", + "integrity": "sha512-wiqcNDNom75x+pe88FclpKz7aOSqS2lOivZeicMV5KRwOAeypxEYWAK/0v+7r+LrEY30+qzh8r2XDaEHvoLsMA==", "requires": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" } }, "@fortawesome/free-solid-svg-icons": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.0.tgz", - "integrity": "sha512-UjCILHIQ4I8cN46EiQn0CZL/h8AwCGgR//1c4R96Q5viSRwuKVo0NdQEc4bm+69ZwC0dUvjbDqAHF1RR5FA3XA==", + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.2.1.tgz", + "integrity": "sha512-oKuqrP5jbfEPJWTij4sM+/RvgX+RMFwx3QZCZcK9PrBDgxC35zuc7AOFsyMjMd/PIFPeB2JxyqDr5zs/DZFPPw==", "requires": { - "@fortawesome/fontawesome-common-types": "6.2.0" + "@fortawesome/fontawesome-common-types": "6.2.1" } }, "@hapi/hoek": { @@ -12056,14 +12056,14 @@ "dev": true }, "@sindarius/gcodeviewer": { - "version": "3.1.4", - "resolved": "https://registry.npmjs.org/@sindarius/gcodeviewer/-/gcodeviewer-3.1.4.tgz", - "integrity": "sha512-yiasBlojKFe3vpelfdzpe0J/SY0WNgWSEjbXqkOv9wKcWwoIwotaJ0c+qusSEjbyFgEy+6slQNUyKuy3hsEjXA==", - "requires": { - "@babylonjs/core": "^5.28.0", - "@babylonjs/inspector": "^5.28.0", - "@babylonjs/loaders": "^5.28.0", - "@babylonjs/materials": "^5.28.0", + "version": "3.1.14", + "resolved": "https://registry.npmjs.org/@sindarius/gcodeviewer/-/gcodeviewer-3.1.14.tgz", + "integrity": "sha512-+kmw2ougPYJzfU4lKvjSNZLsyDbhTKgeOA2KYAHgNnD0BUiSGCmveVLdcs8bSusmnrv8J+M+90eco0LSUuywiw==", + "requires": { + "@babylonjs/core": "^5.34.0", + "@babylonjs/inspector": "^5.34.0", + "@babylonjs/loaders": "^5.34.0", + "@babylonjs/materials": "^5.34.0", "d3": "^7.4.4" } }, @@ -12149,9 +12149,9 @@ "peer": true }, "@types/react": { - "version": "18.0.21", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.21.tgz", - "integrity": "sha512-7QUCOxvFgnD5Jk8ZKlUAhVcRj7GuJRjnjjiY/IUBWKgOlnvDvTMLD4RTF7NPyVmbRhNrbomZiOepg7M/2Kj1mA==", + "version": "18.0.26", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.26.tgz", + "integrity": "sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug==", "peer": true, "requires": { "@types/prop-types": "*", @@ -12160,9 +12160,9 @@ } }, "@types/react-dom": { - "version": "18.0.6", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.6.tgz", - "integrity": "sha512-/5OFZgfIPSwy+YuIBP/FgJnQnsxhZhjjrnxudMddeblOouIodEQ75X14Rr4wGSG/bknL+Omy9iWlLo1u/9GzAA==", + "version": "18.0.10", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.10.tgz", + "integrity": "sha512-E42GW/JA4Qv15wQdqJq8DL4JhNpB3prJgjgapN3qJT9K2zO5IIAQh4VXvCEDupoqAwnz0cY4RlXeC/ajX5SFHg==", "peer": true, "requires": { "@types/react": "*" @@ -12724,9 +12724,9 @@ } }, "babylonjs-gltf2interface": { - "version": "5.28.0", - "resolved": "https://registry.npmjs.org/babylonjs-gltf2interface/-/babylonjs-gltf2interface-5.28.0.tgz", - "integrity": "sha512-Mm0s5yaaCbbU6DJr/lXpa7ZV3FziT5wWlvC2Yyn6Rhl7xgZQQUub1NjDn+vt0wh4XjETDEEuHwOYpm1i5cID3w==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/babylonjs-gltf2interface/-/babylonjs-gltf2interface-5.41.0.tgz", + "integrity": "sha512-+aARV7Q6rxLxKnLX7aqe2klaPHzg6c5JBtsadpSAfMLL9laF3e7YqfTlPR6Zf7XxsAZGJBxU9BULLvC5R3BapA==", "peer": true }, "balanced-match": { diff --git a/package.json b/package.json index 01f2f624a..b73de224c 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "@codemirror/view": "^6.0.3", "@jaames/iro": "^5.5.2", "@lezer/highlight": "^1.0.0", - "@sindarius/gcodeviewer": "^3.1.4", + "@sindarius/gcodeviewer": "^3.1.14", "@types/node": "^18.0.0", "@types/overlayscrollbars": "^1.12.1", "axios": "^0.27.0", diff --git a/src/components/gcodeviewer/CodeStream.vue b/src/components/gcodeviewer/CodeStream.vue new file mode 100644 index 000000000..6f2e208f3 --- /dev/null +++ b/src/components/gcodeviewer/CodeStream.vue @@ -0,0 +1,82 @@ + + + + + diff --git a/src/components/gcodeviewer/Viewer.vue b/src/components/gcodeviewer/Viewer.vue index 6744031a8..93b7faca9 100644 --- a/src/components/gcodeviewer/Viewer.vue +++ b/src/components/gcodeviewer/Viewer.vue @@ -19,9 +19,19 @@ - +
+ +
+ +
+ @@ -123,6 +133,14 @@ hide-details :label="$t('GCodeViewer.ShowTravelMoves')"> + + + + @@ -255,6 +273,7 @@ import GCodeViewer from '@sindarius/gcodeviewer' import axios from 'axios' import { formatFilesize } from '@/plugins/helpers' import Panel from '@/components/ui/Panel.vue' +import CodeStream from '@/components/gcodeviewer/CodeStream.vue' import { mdiCameraRetake, mdiCog, @@ -286,7 +305,7 @@ interface downloadSnackbar { let viewer: any = null @Component({ - components: { Panel }, + components: { Panel, CodeStream }, }) export default class Viewer extends Mixins(BaseMixin) { /** @@ -342,6 +361,8 @@ export default class Viewer extends Mixins(BaseMixin) { name: '', } + private fileData: string = '' + @Prop({ type: String, default: '', required: false }) declare filename: string @Ref('fileInput') declare fileInput: HTMLInputElement @Ref('viewerCanvasContainer') declare viewerCanvasContainer: HTMLElement @@ -366,6 +387,9 @@ export default class Viewer extends Mixins(BaseMixin) { await this.init() if (this.loadedFile !== null) this.scrubFileSize = viewer.fileSize + if (viewer) { + this.fileData = viewer.fileData + } } beforeDestroy() { @@ -574,6 +598,7 @@ export default class Viewer extends Mixins(BaseMixin) { this.fileSize = blob.length // Do something with result await viewer.processFile(blob) + this.fileData = viewer.fileData } this.finishLoad() }) @@ -621,6 +646,7 @@ export default class Viewer extends Mixins(BaseMixin) { viewer.updateRenderQuality(this.renderQuality.value) await viewer.processFile(text) + this.fileData = viewer.fileData this.loadingPercent = 100 this.finishLoad() this.scrubFileSize = viewer.fileSize @@ -652,6 +678,7 @@ export default class Viewer extends Mixins(BaseMixin) { this.loading = true this.loadingPercent = 0 await viewer.reload() + this.fileData = viewer.fileData this.loadingPercent = 100 this.finishLoad() } @@ -694,6 +721,7 @@ export default class Viewer extends Mixins(BaseMixin) { const offset = 350 if (newVal > 0 && this.printerIsPrinting && this.tracking && newVal > offset) { viewer.gcodeProcessor.updateFilePosition(newVal - offset) + this.scrubPosition = newVal - offset } else { viewer.gcodeProcessor.updateFilePosition(viewer.fileSize) } @@ -739,6 +767,18 @@ export default class Viewer extends Mixins(BaseMixin) { this.$store.dispatch('gui/saveSetting', { name: 'gcodeViewer.showTravelMoves', value: newVal }) } + get showGCode(): boolean { + return this.$store.state.gui.gcodeViewer.showGCode ?? false + } + + set showGCode(newVal: boolean) { + this.$store.dispatch('gui/saveSetting', { name: 'gcodeViewer.showGCode', value: newVal }) + if (newVal && viewer) { + this.fileData = viewer.fileData + } + this.handleResize() + } + @Watch('showTravelMoves') showTravelMovesChanged(newVal: boolean) { viewer?.toggleTravels(newVal) @@ -1044,6 +1084,7 @@ export default class Viewer extends Mixins(BaseMixin) { this.scrubInterval = setInterval(() => { this.scrubPosition += 100 * this.scrubSpeed viewer.gcodeProcessor.updateFilePosition(this.scrubPosition) + viewer.simulateToolPosition() if (this.tracking || this.scrubPosition >= this.scrubFileSize) { this.scrubPlaying = false } @@ -1062,7 +1103,10 @@ export default class Viewer extends Mixins(BaseMixin) { @Debounce(200) @Watch('scrubPosition') updateScrubPosition(to: number): void { - if (!this.tracking) viewer.gcodeProcessor.updateFilePosition(to) + if (!this.tracking) { + viewer.gcodeProcessor.updateFilePosition(to) + viewer.simulateToolPosition() + } } fastForward(): void { diff --git a/src/locales/en.json b/src/locales/en.json index 936d869be..ebf3bda2a 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -253,7 +253,8 @@ "Tracking": "Tracking", "Transparency": "Transparency", "Ultra": "Ultra", - "VoxelMode": "Voxel Mode (ASMBL)" + "VoxelMode": "Voxel Mode (ASMBL)", + "ShowGCode": "Show G-Code" }, "Heightmap": { "Abort": "abort", diff --git a/src/store/gui/index.ts b/src/store/gui/index.ts index 5cb785269..d959655bc 100644 --- a/src/store/gui/index.ts +++ b/src/store/gui/index.ts @@ -138,6 +138,7 @@ export const getDefaultState = (): GuiState => { axis_minimum: null, axis_maximum: null, }, + showGCodePanel: false, }, uiSettings: { logo: defaultLogoColor, diff --git a/src/store/gui/types.ts b/src/store/gui/types.ts index c5520221e..e53e93385 100644 --- a/src/store/gui/types.ts +++ b/src/store/gui/types.ts @@ -86,6 +86,7 @@ export interface GuiState { axis_minimum: number[] | null axis_maximum: number[] | null } + showGCodePanel: boolean } macros?: GuiMacrosState notifications?: GuiNotificationState