forked from noxious/client
Compare commits
18 Commits
feature/de
...
main
Author | SHA1 | Date | |
---|---|---|---|
af5e2449b5 | |||
5392093d71 | |||
27c775821a | |||
0d5acd48ce | |||
fc34a488d9 | |||
0b1e95f80f | |||
9f176aae45 | |||
4903a83c71 | |||
ba3ed8c099 | |||
2881d5f251 | |||
32ca61cc50 | |||
6897ad0f1e | |||
db1766026e | |||
3f28d85c30 | |||
a85ad94f15 | |||
e6c684e066 | |||
142d991265 | |||
9e5dcc31fa |
446
package-lock.json
generated
446
package-lock.json
generated
@ -60,14 +60,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@asamuzakjp/css-color": {
|
||||
"version": "2.8.3",
|
||||
"resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-2.8.3.tgz",
|
||||
"integrity": "sha512-GIc76d9UI1hCvOATjZPyHFmE5qhRccp3/zGfMPapK3jBi+yocEzp6BBB0UnfRYP9NP4FANqUZYb0hnfs3TM3hw==",
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.1.1.tgz",
|
||||
"integrity": "sha512-hpRD68SV2OMcZCsrbdkccTw5FXjNDLo5OuqSHyHZfwweGsDWZwDJ2+gONyNAbazZclobMirACLw0lk8WVxIqxA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@csstools/css-calc": "^2.1.1",
|
||||
"@csstools/css-color-parser": "^3.0.7",
|
||||
"@csstools/css-calc": "^2.1.2",
|
||||
"@csstools/css-color-parser": "^3.0.8",
|
||||
"@csstools/css-parser-algorithms": "^3.0.4",
|
||||
"@csstools/css-tokenizer": "^3.0.3",
|
||||
"lru-cache": "^10.4.3"
|
||||
@ -89,14 +89,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/generator": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.9.tgz",
|
||||
"integrity": "sha512-kEWdzjOAUMW4hAyrzJ0ZaTOu9OmpyDIQicIh0zg0EEcEkYXZb2TjtBhnHi2ViX7PKwZqF4xwqfAm299/QMP3lg==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.0.tgz",
|
||||
"integrity": "sha512-VybsKvpiN1gU1sdMZIp7FcqphVVKEwcuj02x73uvcHE0PTihx1nlBcowYWhDwjpoAXRv43+gDzyggGnn1XZhVw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/parser": "^7.26.9",
|
||||
"@babel/types": "^7.26.9",
|
||||
"@babel/parser": "^7.27.0",
|
||||
"@babel/types": "^7.27.0",
|
||||
"@jridgewell/gen-mapping": "^0.3.5",
|
||||
"@jridgewell/trace-mapping": "^0.3.25",
|
||||
"jsesc": "^3.0.2"
|
||||
@ -124,12 +124,12 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/parser": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.9.tgz",
|
||||
"integrity": "sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.0.tgz",
|
||||
"integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/types": "^7.26.9"
|
||||
"@babel/types": "^7.27.0"
|
||||
},
|
||||
"bin": {
|
||||
"parser": "bin/babel-parser.js"
|
||||
@ -139,9 +139,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/runtime": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.9.tgz",
|
||||
"integrity": "sha512-aA63XwOkcl4xxQa3HjPMqOP6LiK0ZDv3mUPYEFXkpHbaFjtGggE1A61FjFzJnB+p7/oy2gA8E+rcBNl/zC1tMg==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.0.tgz",
|
||||
"integrity": "sha512-VtPOkrdPHZsKc/clNqyi9WUA8TINkZ4cGk63UUE3u4pmB2k+ZMQRDuIOagv8UVd6j7k0T3+RRIb7beKTebNbcw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"regenerator-runtime": "^0.14.0"
|
||||
@ -151,32 +151,32 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/template": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.26.9.tgz",
|
||||
"integrity": "sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.0.tgz",
|
||||
"integrity": "sha512-2ncevenBqXI6qRMukPlXwHKHchC7RyMuu4xv5JBXRfOGVcTy1mXCD12qrp7Jsoxll1EV3+9sE4GugBVRjT2jFA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.26.2",
|
||||
"@babel/parser": "^7.26.9",
|
||||
"@babel/types": "^7.26.9"
|
||||
"@babel/parser": "^7.27.0",
|
||||
"@babel/types": "^7.27.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/traverse": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.9.tgz",
|
||||
"integrity": "sha512-ZYW7L+pL8ahU5fXmNbPF+iZFHCv5scFak7MZ9bwaRPLUhHh7QQEMjZUg0HevihoqCM5iSYHN61EyCoZvqC+bxg==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.0.tgz",
|
||||
"integrity": "sha512-19lYZFzYVQkkHkl4Cy4WrAVcqBkgvV2YM2TU3xG6DIwO7O3ecbDPfW3yM3bjAGcqcQHi+CCtjMR3dIEHxsd6bA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.26.2",
|
||||
"@babel/generator": "^7.26.9",
|
||||
"@babel/parser": "^7.26.9",
|
||||
"@babel/template": "^7.26.9",
|
||||
"@babel/types": "^7.26.9",
|
||||
"@babel/generator": "^7.27.0",
|
||||
"@babel/parser": "^7.27.0",
|
||||
"@babel/template": "^7.27.0",
|
||||
"@babel/types": "^7.27.0",
|
||||
"debug": "^4.3.1",
|
||||
"globals": "^11.1.0"
|
||||
},
|
||||
@ -185,9 +185,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/types": {
|
||||
"version": "7.26.9",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.9.tgz",
|
||||
"integrity": "sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==",
|
||||
"version": "7.27.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.0.tgz",
|
||||
"integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/helper-string-parser": "^7.25.9",
|
||||
@ -1497,9 +1497,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@rollup/rollup-android-arm-eabi": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.34.9.tgz",
|
||||
"integrity": "sha512-qZdlImWXur0CFakn2BJ2znJOdqYZKiedEPEVNTBrpfPjc/YuTGcaYZcdmNFTkUj3DU0ZM/AElcM8Ybww3xVLzA==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.37.0.tgz",
|
||||
"integrity": "sha512-l7StVw6WAa8l3vA1ov80jyetOAEo1FtHvZDbzXDO/02Sq/QVvqlHkYoFwDJPIMj0GKiistsBudfx5tGFnwYWDQ==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@ -1510,9 +1510,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-android-arm64": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.34.9.tgz",
|
||||
"integrity": "sha512-4KW7P53h6HtJf5Y608T1ISKvNIYLWRKMvfnG0c44M6In4DQVU58HZFEVhWINDZKp7FZps98G3gxwC1sb0wXUUg==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.37.0.tgz",
|
||||
"integrity": "sha512-6U3SlVyMxezt8Y+/iEBcbp945uZjJwjZimu76xoG7tO1av9VO691z8PkhzQ85ith2I8R2RddEPeSfcbyPfD4hA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1523,9 +1523,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-darwin-arm64": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.34.9.tgz",
|
||||
"integrity": "sha512-0CY3/K54slrzLDjOA7TOjN1NuLKERBgk9nY5V34mhmuu673YNb+7ghaDUs6N0ujXR7fz5XaS5Aa6d2TNxZd0OQ==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.37.0.tgz",
|
||||
"integrity": "sha512-+iTQ5YHuGmPt10NTzEyMPbayiNTcOZDWsbxZYR1ZnmLnZxG17ivrPSWFO9j6GalY0+gV3Jtwrrs12DBscxnlYA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1536,9 +1536,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-darwin-x64": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.34.9.tgz",
|
||||
"integrity": "sha512-eOojSEAi/acnsJVYRxnMkPFqcxSMFfrw7r2iD9Q32SGkb/Q9FpUY1UlAu1DH9T7j++gZ0lHjnm4OyH2vCI7l7Q==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.37.0.tgz",
|
||||
"integrity": "sha512-m8W2UbxLDcmRKVjgl5J/k4B8d7qX2EcJve3Sut7YGrQoPtCIQGPH5AMzuFvYRWZi0FVS0zEY4c8uttPfX6bwYQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1549,9 +1549,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-freebsd-arm64": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.34.9.tgz",
|
||||
"integrity": "sha512-2lzjQPJbN5UnHm7bHIUKFMulGTQwdvOkouJDpPysJS+QFBGDJqcfh+CxxtG23Ik/9tEvnebQiylYoazFMAgrYw==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.37.0.tgz",
|
||||
"integrity": "sha512-FOMXGmH15OmtQWEt174v9P1JqqhlgYge/bUjIbiVD1nI1NeJ30HYT9SJlZMqdo1uQFyt9cz748F1BHghWaDnVA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1562,9 +1562,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-freebsd-x64": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.34.9.tgz",
|
||||
"integrity": "sha512-SLl0hi2Ah2H7xQYd6Qaiu01kFPzQ+hqvdYSoOtHYg/zCIFs6t8sV95kaoqjzjFwuYQLtOI0RZre/Ke0nPaQV+g==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.37.0.tgz",
|
||||
"integrity": "sha512-SZMxNttjPKvV14Hjck5t70xS3l63sbVwl98g3FlVVx2YIDmfUIy29jQrsw06ewEYQ8lQSuY9mpAPlmgRD2iSsA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1575,9 +1575,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm-gnueabihf": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.34.9.tgz",
|
||||
"integrity": "sha512-88I+D3TeKItrw+Y/2ud4Tw0+3CxQ2kLgu3QvrogZ0OfkmX/DEppehus7L3TS2Q4lpB+hYyxhkQiYPJ6Mf5/dPg==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.37.0.tgz",
|
||||
"integrity": "sha512-hhAALKJPidCwZcj+g+iN+38SIOkhK2a9bqtJR+EtyxrKKSt1ynCBeqrQy31z0oWU6thRZzdx53hVgEbRkuI19w==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@ -1588,9 +1588,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm-musleabihf": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.34.9.tgz",
|
||||
"integrity": "sha512-3qyfWljSFHi9zH0KgtEPG4cBXHDFhwD8kwg6xLfHQ0IWuH9crp005GfoUUh/6w9/FWGBwEHg3lxK1iHRN1MFlA==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.37.0.tgz",
|
||||
"integrity": "sha512-jUb/kmn/Gd8epbHKEqkRAxq5c2EwRt0DqhSGWjPFxLeFvldFdHQs/n8lQ9x85oAeVb6bHcS8irhTJX2FCOd8Ag==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@ -1601,9 +1601,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm64-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-6TZjPHjKZUQKmVKMUowF3ewHxctrRR09eYyvT5eFv8w/fXarEra83A2mHTVJLA5xU91aCNOUnM+DWFMSbQ0Nxw==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-oNrJxcQT9IcbcmKlkF+Yz2tmOxZgG9D9GRq+1OE6XCQwCVwxixYAa38Z8qqPzQvzt1FCfmrHX03E0pWoXm1DqA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1614,9 +1614,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-arm64-musl": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.34.9.tgz",
|
||||
"integrity": "sha512-LD2fytxZJZ6xzOKnMbIpgzFOuIKlxVOpiMAXawsAZ2mHBPEYOnLRK5TTEsID6z4eM23DuO88X0Tq1mErHMVq0A==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.37.0.tgz",
|
||||
"integrity": "sha512-pfxLBMls+28Ey2enpX3JvjEjaJMBX5XlPCZNGxj4kdJyHduPBXtxYeb8alo0a7bqOoWZW2uKynhHxF/MWoHaGQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1627,9 +1627,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-loongarch64-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-dRAgTfDsn0TE0HI6cmo13hemKpVHOEyeciGtvlBTkpx/F65kTvShtY/EVyZEIfxFkV5JJTuQ9tP5HGBS0hfxIg==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-yCE0NnutTC/7IGUq/PUHmoeZbIwq3KRh02e9SfFh7Vmc1Z7atuJRYWhRME5fKgT8aS20mwi1RyChA23qSyRGpA==",
|
||||
"cpu": [
|
||||
"loong64"
|
||||
],
|
||||
@ -1640,9 +1640,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-PHcNOAEhkoMSQtMf+rJofwisZqaU8iQ8EaSps58f5HYll9EAY5BSErCZ8qBDMVbq88h4UxaNPlbrKqfWP8RfJA==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-NxcICptHk06E2Lh3a4Pu+2PEdZ6ahNHuK7o6Np9zcWkrBMuv21j10SQDJW3C9Yf/A/P7cutWoC/DptNLVsZ0VQ==",
|
||||
"cpu": [
|
||||
"ppc64"
|
||||
],
|
||||
@ -1653,9 +1653,22 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-riscv64-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-Z2i0Uy5G96KBYKjeQFKbbsB54xFOL5/y1P5wNBsbXB8yE+At3oh0DVMjQVzCJRJSfReiB2tX8T6HUFZ2k8iaKg==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-PpWwHMPCVpFZLTfLq7EWJWvrmEuLdGn1GMYcm5MV7PaRgwCEYJAwiN94uBuZev0/J/hFIIJCsYw4nLmXA9J7Pw==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-riscv64-musl": {
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.37.0.tgz",
|
||||
"integrity": "sha512-DTNwl6a3CfhGTAOYZ4KtYbdS8b+275LSLqJVJIrPa5/JuIufWWZ/QFvkxp52gpmguN95eujrM68ZG+zVxa8zHA==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
@ -1666,9 +1679,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-s390x-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-U+5SwTMoeYXoDzJX5dhDTxRltSrIax8KWwfaaYcynuJw8mT33W7oOgz0a+AaXtGuvhzTr2tVKh5UO8GVANTxyQ==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-hZDDU5fgWvDdHFuExN1gBOhCuzo/8TMpidfOR+1cPZJflcEzXdCy1LjnklQdW8/Et9sryOPJAKAQRw8Jq7Tg+A==",
|
||||
"cpu": [
|
||||
"s390x"
|
||||
],
|
||||
@ -1679,9 +1692,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-x64-gnu": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.34.9.tgz",
|
||||
"integrity": "sha512-FwBHNSOjUTQLP4MG7y6rR6qbGw4MFeQnIBrMe161QGaQoBQLqSUEKlHIiVgF3g/mb3lxlxzJOpIBhaP+C+KP2A==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.37.0.tgz",
|
||||
"integrity": "sha512-pKivGpgJM5g8dwj0ywBwe/HeVAUSuVVJhUTa/URXjxvoyTT/AxsLTAbkHkDHG7qQxLoW2s3apEIl26uUe08LVQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1692,9 +1705,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-x64-musl": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.34.9.tgz",
|
||||
"integrity": "sha512-cYRpV4650z2I3/s6+5/LONkjIz8MBeqrk+vPXV10ORBnshpn8S32bPqQ2Utv39jCiDcO2eJTuSlPXpnvmaIgRA==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.37.0.tgz",
|
||||
"integrity": "sha512-E2lPrLKE8sQbY/2bEkVTGDEk4/49UYRVWgj90MY8yPjpnGBQ+Xi1Qnr7b7UIWw1NOggdFQFOLZ8+5CzCiz143w==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1705,9 +1718,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-arm64-msvc": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.34.9.tgz",
|
||||
"integrity": "sha512-z4mQK9dAN6byRA/vsSgQiPeuO63wdiDxZ9yg9iyX2QTzKuQM7T4xlBoeUP/J8uiFkqxkcWndWi+W7bXdPbt27Q==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.37.0.tgz",
|
||||
"integrity": "sha512-Jm7biMazjNzTU4PrQtr7VS8ibeys9Pn29/1bm4ph7CP2kf21950LgN+BaE2mJ1QujnvOc6p54eWWiVvn05SOBg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1718,9 +1731,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-ia32-msvc": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.34.9.tgz",
|
||||
"integrity": "sha512-KB48mPtaoHy1AwDNkAJfHXvHp24H0ryZog28spEs0V48l3H1fr4i37tiyHsgKZJnCmvxsbATdZGBpbmxTE3a9w==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.37.0.tgz",
|
||||
"integrity": "sha512-e3/1SFm1OjefWICB2Ucstg2dxYDkDTZGDYgwufcbsxTHyqQps1UQf33dFEChBNmeSsTOyrjw2JJq0zbG5GF6RA==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
@ -1731,9 +1744,9 @@
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-win32-x64-msvc": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.34.9.tgz",
|
||||
"integrity": "sha512-AyleYRPU7+rgkMWbEh71fQlrzRfeP6SyMnRf9XX4fCdDPAJumdSBqYEcWPMzVQ4ScAl7E4oFfK0GUVn77xSwbw==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.37.0.tgz",
|
||||
"integrity": "sha512-LWbXUBwn/bcLx2sSsqy7pK5o+Nr+VCoRoAohfJ5C/aBio9nfJmGQqHAhU6pwxV/RmyTk5AqdySma7uwWGlmeuA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1750,9 +1763,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@tauri-apps/cli": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.3.1.tgz",
|
||||
"integrity": "sha512-xewcw/ZsCqgilTy2h7+pp2Baxoy7zLR2wXOV7SZLzkb6SshHVbm1BFAjn8iFATURRW85KLzl6wSGJ2dQHjVHqw==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.4.0.tgz",
|
||||
"integrity": "sha512-Esg7s20tuSULd2YF3lmtMa1vF7yr5eh/TlBHXjEyrC+XSD9aBxHVoXb6oz7oKybDY9Jf9OiBa0bf2PbybcmOLA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0 OR MIT",
|
||||
"bin": {
|
||||
@ -1766,22 +1779,23 @@
|
||||
"url": "https://opencollective.com/tauri"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@tauri-apps/cli-darwin-arm64": "2.3.1",
|
||||
"@tauri-apps/cli-darwin-x64": "2.3.1",
|
||||
"@tauri-apps/cli-linux-arm-gnueabihf": "2.3.1",
|
||||
"@tauri-apps/cli-linux-arm64-gnu": "2.3.1",
|
||||
"@tauri-apps/cli-linux-arm64-musl": "2.3.1",
|
||||
"@tauri-apps/cli-linux-x64-gnu": "2.3.1",
|
||||
"@tauri-apps/cli-linux-x64-musl": "2.3.1",
|
||||
"@tauri-apps/cli-win32-arm64-msvc": "2.3.1",
|
||||
"@tauri-apps/cli-win32-ia32-msvc": "2.3.1",
|
||||
"@tauri-apps/cli-win32-x64-msvc": "2.3.1"
|
||||
"@tauri-apps/cli-darwin-arm64": "2.4.0",
|
||||
"@tauri-apps/cli-darwin-x64": "2.4.0",
|
||||
"@tauri-apps/cli-linux-arm-gnueabihf": "2.4.0",
|
||||
"@tauri-apps/cli-linux-arm64-gnu": "2.4.0",
|
||||
"@tauri-apps/cli-linux-arm64-musl": "2.4.0",
|
||||
"@tauri-apps/cli-linux-riscv64-gnu": "2.4.0",
|
||||
"@tauri-apps/cli-linux-x64-gnu": "2.4.0",
|
||||
"@tauri-apps/cli-linux-x64-musl": "2.4.0",
|
||||
"@tauri-apps/cli-win32-arm64-msvc": "2.4.0",
|
||||
"@tauri-apps/cli-win32-ia32-msvc": "2.4.0",
|
||||
"@tauri-apps/cli-win32-x64-msvc": "2.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-darwin-arm64": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.3.1.tgz",
|
||||
"integrity": "sha512-TOhSdsXYt+f+asRU+Dl+Wufglj/7+CX9h8RO4hl5k7D6lR4L8yTtdhpS7btaclOMmjYC4piNfJE70GoxhOoYWw==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.4.0.tgz",
|
||||
"integrity": "sha512-MVzYrahJBgDyzUJ2gNEU8H+0oCVEucN115+CVorFnidHcJ6DtDRMCaKLkpjOZNfJyag1WQ25fu7imvZSe0mz/g==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1796,9 +1810,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-darwin-x64": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.3.1.tgz",
|
||||
"integrity": "sha512-LDwGg3AuBQ3aCeMAFaFwt0MSGOVFoXuXEe0z4QxQ7jZE5tdAOhKABaq4i569V5lShCgQZ6nLD/tmA5+GipvHnA==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.4.0.tgz",
|
||||
"integrity": "sha512-/4IdbWv6IWSuBn0WVe5JkiSIP1gZhXCZRcumSsYq3ZmOlq4BqXeXT36Oig5mlDnS/2/UpNS94kd8gOA1DNdIeQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1813,9 +1827,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-arm-gnueabihf": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.3.1.tgz",
|
||||
"integrity": "sha512-hu3HpbbtJBvHXw5i54QHwLxOUoXWqhf7CL2YYSPOrWEEQo10NKddulP61L5gfr5z+bSSaitfLwqgTidgnaNJCA==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.4.0.tgz",
|
||||
"integrity": "sha512-rOjlk3Vd6R847LXds4pOAFKUL5NVdSWlaiQvr4H9WDUwIWWoxnj7SQfpryTtElDb2wV7a0BNaOCXCpyFEAXjkw==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
@ -1830,9 +1844,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-arm64-gnu": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.3.1.tgz",
|
||||
"integrity": "sha512-mEGgwkiGSKYXWHhGodo7zU9PCd2I/d6KkR+Wp1nzK+DxsCrEK6yJ5XxYLSQSDcKkM4dCxpVEPUiVMbDhmn08jg==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.4.0.tgz",
|
||||
"integrity": "sha512-X/uCwao6R/weWT2y4f3JKJMeUsujo9H4nBMAv9RZhRsz93n9Amw9ETavAOP11pyhl57YkasvKTCRQN6FwsaoXg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1847,9 +1861,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-arm64-musl": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.3.1.tgz",
|
||||
"integrity": "sha512-tqQkafikGfnc7ISnGjSYkbpnzJKEyO8XSa0YOXTAL3J8R5Pss5ZIZY7G8kq1mwQSR/dPVR1ZLTVXgZGuysjP8w==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.4.0.tgz",
|
||||
"integrity": "sha512-GhvQtrTjadW3eLSmfrSfybSqgJMZzUXC+0WqDzFovLug3a1a1go0m9QK9YGvYLkyEpTY5zRxLtwv+tbZXN4tZw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1863,10 +1877,27 @@
|
||||
"node": ">= 10"
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-riscv64-gnu": {
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-riscv64-gnu/-/cli-linux-riscv64-gnu-2.4.0.tgz",
|
||||
"integrity": "sha512-NgeNihQ9uHS/ibMWLge5VA/BgsS/g8VPSVtCp8DSPyub3bBuCy79A8V+bzNKlMOiDVrqK4vQ//FS9kSxoJOtXw==",
|
||||
"cpu": [
|
||||
"riscv64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "Apache-2.0 OR MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 10"
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-x64-gnu": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.3.1.tgz",
|
||||
"integrity": "sha512-I3puDJ2wGEauXlXbzIHn2etz78TaWs1cpN6zre02maHr6ZR7nf7euTCOGPhhfoMG0opA5mT/eLuYpVw648/VAA==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.4.0.tgz",
|
||||
"integrity": "sha512-ebRmV2HLIVms1KlNNueQCp3OrXBv6cimU3mYEh5NbZ8dH88f2sF46dFCyPq8Qr/Zti4qPEaAArVG7RYFjfECPw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1881,9 +1912,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-linux-x64-musl": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.3.1.tgz",
|
||||
"integrity": "sha512-rbWiCOBuQN7tPySkUyBs914uUikE3mEUOqV/IFospvKESw4UC3G1DL5+ybfXH7Orb8/in3JpJuVzYQjo+OSbBA==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.4.0.tgz",
|
||||
"integrity": "sha512-FOp2cBFyq5LnUr3he95Z99PQm3nCSJv2GZNeH7UqmUpeHwdcYuhBERU7C+8VDJJPR98Q5fkcoV00Pc4nw0v5KQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1898,9 +1929,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-win32-arm64-msvc": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.3.1.tgz",
|
||||
"integrity": "sha512-PdTmUzSeTHjJuBpCV7L+V29fPhPtToU+NZU46slHKSA1aT38MiFDXBZ/6P5Zudrt9QPMfIubqnJKbK8Ivvv7Ww==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.4.0.tgz",
|
||||
"integrity": "sha512-SVf1wDagYsaFM+mpUYKmjNveKodcUSGPEM27WmMW4Enh6aXGzTJi4IYOE3GEFOJF1BpRNscslwE1Rd064kfpcg==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
@ -1915,9 +1946,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-win32-ia32-msvc": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.3.1.tgz",
|
||||
"integrity": "sha512-K/Xa97kspWT4UWj3t26lL2D3QsopTAxS7kWi5kObdqtAGn3qD52qBi24FH38TdvHYz4QlnLIb30TukviCgh4gw==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.4.0.tgz",
|
||||
"integrity": "sha512-j+fOFVeSSejk9hrUePY7bJuaYr+80xr+ftjXzxCj0CS0d2oSbq+lT8/zS514WemJk9e9yxUus+2ke/Ng17wkkQ==",
|
||||
"cpu": [
|
||||
"ia32"
|
||||
],
|
||||
@ -1932,9 +1963,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli-win32-x64-msvc": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.3.1.tgz",
|
||||
"integrity": "sha512-RgwzXbP8gAno3kQEsybMtgLp6D1Z1Nec2cftryYbPTJmoMJs6e4qgtxuTSbUz5SKnHe8rGgMiFSvEGoHvbG72Q==",
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.4.0.tgz",
|
||||
"integrity": "sha512-nv84b3a8eI5Y7ksTLBKjjvtr9NOlAGGGo7OJbjKT+xZLdiPOZ0nJ2cT+4IdfnNAZ33pKJugAfuj1fBvQKeTy0w==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
@ -1949,9 +1980,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tsconfig/node20": {
|
||||
"version": "20.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@tsconfig/node20/-/node20-20.1.4.tgz",
|
||||
"integrity": "sha512-sqgsT69YFeLWf5NtJ4Xq/xAF8p4ZQHlmGW74Nu2tD4+g5fAsposc4ZfaaPixVu4y01BEiDCWLRDCvDM5JOsRxg==",
|
||||
"version": "20.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@tsconfig/node20/-/node20-20.1.5.tgz",
|
||||
"integrity": "sha512-Vm8e3WxDTqMGPU4GATF9keQAIy1Drd7bPwlgzKJnZtoOsTm1tduUTbDjg0W5qERvGuxPI2h9RbMufH0YdfBylA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
@ -1980,9 +2011,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@types/node": {
|
||||
"version": "20.17.23",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.23.tgz",
|
||||
"integrity": "sha512-8PCGZ1ZJbEZuYNTMqywO+Sj4vSKjSjT6Ua+6RFOYlEvIvKQABPtrNkoVSLSKDb4obYcMhspVKmsw8Cm10NFRUg==",
|
||||
"version": "20.17.28",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.28.tgz",
|
||||
"integrity": "sha512-DHlH/fNL6Mho38jTy7/JT7sn2wnXI+wULR6PV4gy4VHLVvnrV/d3pHAMQHhc4gjdLmK2ZiPoMxzp6B3yRajLSQ==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -2003,9 +2034,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@vitejs/plugin-vue": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.1.tgz",
|
||||
"integrity": "sha512-cxh314tzaWwOLqVes2gnnCtvBDcM1UMdn+iFR+UjAn411dPT3tOmqrJjbMd7koZpMAmBM/GqeV4n9ge7JSiJJQ==",
|
||||
"version": "5.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.3.tgz",
|
||||
"integrity": "sha512-IYSLEQj4LgZZuoVpdSUCw3dIynTWQgPlaRP6iAvMle4My0HdYwr5g5wQAfwOeHQBmYwEkqF70nRpSilr6PoUDg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
@ -2546,9 +2577,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/autoprefixer": {
|
||||
"version": "10.4.20",
|
||||
"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz",
|
||||
"integrity": "sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==",
|
||||
"version": "10.4.21",
|
||||
"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.21.tgz",
|
||||
"integrity": "sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
@ -2566,11 +2597,11 @@
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"browserslist": "^4.23.3",
|
||||
"caniuse-lite": "^1.0.30001646",
|
||||
"browserslist": "^4.24.4",
|
||||
"caniuse-lite": "^1.0.30001702",
|
||||
"fraction.js": "^4.3.7",
|
||||
"normalize-range": "^0.1.2",
|
||||
"picocolors": "^1.0.1",
|
||||
"picocolors": "^1.1.1",
|
||||
"postcss-value-parser": "^4.2.0"
|
||||
},
|
||||
"bin": {
|
||||
@ -2584,9 +2615,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/axios": {
|
||||
"version": "1.8.2",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-1.8.2.tgz",
|
||||
"integrity": "sha512-ls4GYBm5aig9vWx8AWDSGLpnpDQRtWAfrjU+EuytuODrFBkqesN2RkOQCBzrA1RQNHw1SmRMSDDDSwzNAYQ6Rg==",
|
||||
"version": "1.8.4",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-1.8.4.tgz",
|
||||
"integrity": "sha512-eBSYY4Y68NNlHbHBMdeDmKNtDgXWhQsJcGqzO3iLUM0GraQFSS9cVgPX5I9b3lbdFKyYoAEGAZF1DwhTaljNAw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"follow-redirects": "^1.15.6",
|
||||
@ -2704,9 +2735,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/caniuse-lite": {
|
||||
"version": "1.0.30001702",
|
||||
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001702.tgz",
|
||||
"integrity": "sha512-LoPe/D7zioC0REI5W73PeR1e1MLCipRGq/VkovJnd6Df+QVqT+vT33OXCp8QUd7kA7RZrHWxb1B36OQKI/0gOA==",
|
||||
"version": "1.0.30001707",
|
||||
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001707.tgz",
|
||||
"integrity": "sha512-3qtRjw/HQSMlDWf+X79N206fepf4SOOU6SQLMaq/0KkZLmSjPxAkBOQQ+FxbHKfHmYLZFfdWsO3KA90ceHPSnw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
@ -2928,13 +2959,13 @@
|
||||
}
|
||||
},
|
||||
"node_modules/cssstyle": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.2.1.tgz",
|
||||
"integrity": "sha512-9+vem03dMXG7gDmZ62uqmRiMRNtinIZ9ZyuF6BdxzfOD+FdN5hretzynkn0ReS2DO2GSw76RWHs0UmJPI2zUjw==",
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.3.0.tgz",
|
||||
"integrity": "sha512-6r0NiY0xizYqfBvWp1G7WXJ06/bZyrk7Dc6PHql82C/pKGUTKu4yAX4Y8JPamb1ob9nBKuxWzCGTRuGwU3yxJQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@asamuzakjp/css-color": "^2.8.2",
|
||||
"@asamuzakjp/css-color": "^3.1.1",
|
||||
"rrweb-cssom": "^0.8.0"
|
||||
},
|
||||
"engines": {
|
||||
@ -3103,9 +3134,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.113",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.113.tgz",
|
||||
"integrity": "sha512-wjT2O4hX+wdWPJ76gWSkMhcHAV2PTMX+QetUCPYEdCIe+cxmgzzSSiGRCKW8nuh4mwKZlpv0xvoW7OF2X+wmHg==",
|
||||
"version": "1.5.127",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.127.tgz",
|
||||
"integrity": "sha512-Ke5OggqOtEqzCzcUyV+9jgO6L6sv1gQVKGtSExXHjD/FK0p4qzPZbrDsrCdy0DptcQprD0V80RCBYSWLMhTTgQ==",
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
@ -3781,9 +3812,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/immutable": {
|
||||
"version": "5.0.3",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
|
||||
"integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.1.tgz",
|
||||
"integrity": "sha512-3jatXi9ObIsPGr3N5hGw/vWWcTkq6hUYhpQz4k0wLC+owqWi/LiugIw9x0EdNZ2yGedKN/HzePiBvaJRXa0Ujg==",
|
||||
"devOptional": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
@ -4223,9 +4254,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/nanoid": {
|
||||
"version": "3.3.9",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.9.tgz",
|
||||
"integrity": "sha512-SppoicMGpZvbF1l3z4x7No3OlIjP7QJvC9XR7AhZr1kL133KHnKPztkKDc+Ir4aJ/1VhTySrtKhrsycmrMQfvg==",
|
||||
"version": "3.3.11",
|
||||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
|
||||
"integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "github",
|
||||
@ -4386,9 +4417,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/nwsapi": {
|
||||
"version": "2.2.18",
|
||||
"resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.18.tgz",
|
||||
"integrity": "sha512-p1TRH/edngVEHVbwqWnxUViEmq5znDvyB+Sik5cmuLpGOIfDf/39zLiq3swPF8Vakqn+gvNiOQAZu8djYlQILA==",
|
||||
"version": "2.2.19",
|
||||
"resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.19.tgz",
|
||||
"integrity": "sha512-94bcyI3RsqiZufXjkr3ltkI86iEl+I7uiHVDtcq9wJUTwYQJ5odHDeSzkkrRzi80jJ8MaeZgqKjH1bAWAFw9bA==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
@ -4608,9 +4639,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/pirates": {
|
||||
"version": "4.0.6",
|
||||
"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
|
||||
"integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
|
||||
"version": "4.0.7",
|
||||
"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.7.tgz",
|
||||
"integrity": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
@ -4930,9 +4961,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/rollup": {
|
||||
"version": "4.34.9",
|
||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.34.9.tgz",
|
||||
"integrity": "sha512-nF5XYqWWp9hx/LrpC8sZvvvmq0TeTjQgaZHYmAgwysT9nh8sWnZhBnM8ZyVbbJFIQBLwHDNoMqsBZBbUo4U8sQ==",
|
||||
"version": "4.37.0",
|
||||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.37.0.tgz",
|
||||
"integrity": "sha512-iAtQy/L4QFU+rTJ1YUjXqJOJzuwEghqWzCEYD2FEghT7Gsy1VdABntrO4CLopA5IkflTyqNiLNwPcOJ3S7UKLg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/estree": "1.0.6"
|
||||
@ -4945,25 +4976,26 @@
|
||||
"npm": ">=8.0.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@rollup/rollup-android-arm-eabi": "4.34.9",
|
||||
"@rollup/rollup-android-arm64": "4.34.9",
|
||||
"@rollup/rollup-darwin-arm64": "4.34.9",
|
||||
"@rollup/rollup-darwin-x64": "4.34.9",
|
||||
"@rollup/rollup-freebsd-arm64": "4.34.9",
|
||||
"@rollup/rollup-freebsd-x64": "4.34.9",
|
||||
"@rollup/rollup-linux-arm-gnueabihf": "4.34.9",
|
||||
"@rollup/rollup-linux-arm-musleabihf": "4.34.9",
|
||||
"@rollup/rollup-linux-arm64-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-arm64-musl": "4.34.9",
|
||||
"@rollup/rollup-linux-loongarch64-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-powerpc64le-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-riscv64-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-s390x-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-x64-gnu": "4.34.9",
|
||||
"@rollup/rollup-linux-x64-musl": "4.34.9",
|
||||
"@rollup/rollup-win32-arm64-msvc": "4.34.9",
|
||||
"@rollup/rollup-win32-ia32-msvc": "4.34.9",
|
||||
"@rollup/rollup-win32-x64-msvc": "4.34.9",
|
||||
"@rollup/rollup-android-arm-eabi": "4.37.0",
|
||||
"@rollup/rollup-android-arm64": "4.37.0",
|
||||
"@rollup/rollup-darwin-arm64": "4.37.0",
|
||||
"@rollup/rollup-darwin-x64": "4.37.0",
|
||||
"@rollup/rollup-freebsd-arm64": "4.37.0",
|
||||
"@rollup/rollup-freebsd-x64": "4.37.0",
|
||||
"@rollup/rollup-linux-arm-gnueabihf": "4.37.0",
|
||||
"@rollup/rollup-linux-arm-musleabihf": "4.37.0",
|
||||
"@rollup/rollup-linux-arm64-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-arm64-musl": "4.37.0",
|
||||
"@rollup/rollup-linux-loongarch64-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-powerpc64le-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-riscv64-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-riscv64-musl": "4.37.0",
|
||||
"@rollup/rollup-linux-s390x-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-x64-gnu": "4.37.0",
|
||||
"@rollup/rollup-linux-x64-musl": "4.37.0",
|
||||
"@rollup/rollup-win32-arm64-msvc": "4.37.0",
|
||||
"@rollup/rollup-win32-ia32-msvc": "4.37.0",
|
||||
"@rollup/rollup-win32-x64-msvc": "4.37.0",
|
||||
"fsevents": "~2.3.2"
|
||||
}
|
||||
},
|
||||
@ -5006,9 +5038,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/sass": {
|
||||
"version": "1.85.1",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.85.1.tgz",
|
||||
"integrity": "sha512-Uk8WpxM5v+0cMR0XjX9KfRIacmSG86RH4DCCZjLU2rFh5tyutt9siAXJ7G+YfxQ99Q6wrRMbMlVl6KqUms71ag==",
|
||||
"version": "1.86.0",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.86.0.tgz",
|
||||
"integrity": "sha512-zV8vGUld/+mP4KbMLJMX7TyGCuUp7hnkOScgCMsWuHtns8CWBoz+vmEhoGMXsaJrbUP8gj+F1dLvVe79sK8UdA==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -5605,9 +5637,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/tr46": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
|
||||
"integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.0.tgz",
|
||||
"integrity": "sha512-IUWnUK7ADYR5Sl1fZlO1INDUhVhatWl7BtJWsIhwJ0UAK7ilzzIa8uIqOO/aYVWHZPJkKbEL+362wrzoeRF7bw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -5722,9 +5754,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "5.4.14",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.14.tgz",
|
||||
"integrity": "sha512-EK5cY7Q1D8JNhSaPKVK4pwBFvaTmZxEnoKXLG/U9gmdDcihQGNzFlgIvaxezFR4glP1LsuiedwMBqCXH3wZccA==",
|
||||
"version": "5.4.15",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-5.4.15.tgz",
|
||||
"integrity": "sha512-6ANcZRivqL/4WtwPGTKNaosuNJr5tWiftOC7liM7G9+rMb8+oeJeyzymDu4rTN93seySBmbjSfsS3Vzr19KNtA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"esbuild": "^0.21.3",
|
||||
@ -6036,13 +6068,13 @@
|
||||
}
|
||||
},
|
||||
"node_modules/whatwg-url": {
|
||||
"version": "14.1.1",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.1.1.tgz",
|
||||
"integrity": "sha512-mDGf9diDad/giZ/Sm9Xi2YcyzaFpbdLpJPr+E9fSkyQ7KpQD4SdFcugkRQYzhmfI4KeV4Qpnn2sKPdo+kmsgRQ==",
|
||||
"version": "14.2.0",
|
||||
"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
|
||||
"integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"tr46": "^5.0.0",
|
||||
"tr46": "^5.1.0",
|
||||
"webidl-conversions": "^7.0.0"
|
||||
},
|
||||
"engines": {
|
||||
|
@ -37,7 +37,7 @@ export type MapObject = {
|
||||
id: string
|
||||
name: string
|
||||
tags: string[]
|
||||
pivotPoints: { x: number; y: number }[]
|
||||
depthOffsets: number[]
|
||||
originX: number
|
||||
originY: number
|
||||
frameRate: number
|
||||
|
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<Zone :originX="mapObj?.originX" :originY="mapObj?.originY" :width="mapObj?.frameWidth" :height="mapObj?.frameHeight" :x="x" :y="y" />
|
||||
<Zone :depth="baseDepth" :origin-x="mapObj?.originX" :origin-y="mapObj?.originY" :width="mapObj?.frameWidth" :height="mapObj?.frameHeight" :x="x" :y="y" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -7,59 +7,95 @@ import type { MapObject, PlacedMapObject } from '@/application/types'
|
||||
import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
|
||||
import { calculateIsometricDepth } from '@/services/mapService'
|
||||
import { onPreUpdate, useScene, Zone } from 'phavuer'
|
||||
import { defineProps, onUnmounted } from 'vue'
|
||||
import { computed, onUnmounted } from 'vue'
|
||||
|
||||
const mapEditor = useMapEditorComposable()
|
||||
|
||||
const props = defineProps<{
|
||||
interface Props {
|
||||
obj?: PlacedMapObject
|
||||
mapObj?: MapObject
|
||||
x?: number
|
||||
y?: number
|
||||
}>()
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const mapEditor = useMapEditorComposable()
|
||||
const scene = useScene()
|
||||
const group = scene.add.group()
|
||||
|
||||
const createImagePartition = (startX: number, endX: number, depthOffset: number) => {
|
||||
const group = scene.add.group()
|
||||
const partitionPoints = computed(() => {
|
||||
if (!props.mapObj?.frameWidth || !props.mapObj?.depthOffsets.length) return []
|
||||
|
||||
const sliceCount = props.mapObj.depthOffsets.length
|
||||
return Array.from({ length: sliceCount + 1 }, (_, i) => i * (props.mapObj!.frameWidth / sliceCount))
|
||||
})
|
||||
|
||||
let baseDepth = 0
|
||||
|
||||
const createImagePartition = (startX: number, endX: number, depthOffset: number): void => {
|
||||
if (!props.mapObj?.id) return
|
||||
|
||||
const img = scene.add.image(0, 0, props.mapObj.id)
|
||||
|
||||
img.setDepth(calculateIsometricDepth(props.obj!.positionX, props.obj!.positionY) + depthOffset)
|
||||
img.setOrigin(props.mapObj.originX, props.mapObj.originY)
|
||||
img.setCrop(startX, 0, endX, props.mapObj?.frameHeight)
|
||||
|
||||
img.setCrop(startX, 0, endX, props.mapObj.frameHeight)
|
||||
img.setDepth(baseDepth + depthOffset)
|
||||
group.add(img)
|
||||
}
|
||||
|
||||
onPreUpdate(() => {
|
||||
const updateGroupProperties = (): void => {
|
||||
if (!props.obj || !props.x || !props.y) return
|
||||
|
||||
group.setXY(props.x, props.y)
|
||||
|
||||
const isMoving = mapEditor.movingPlacedObject.value?.id === props.obj.id
|
||||
const isSelected = mapEditor.selectedMapObject.value?.id === props.obj.id
|
||||
const isPlacedSelected = mapEditor.selectedPlacedObject.value?.id === props.obj.id
|
||||
|
||||
baseDepth = calculateIsometricDepth(props.obj.positionX, props.obj.positionY)
|
||||
|
||||
group.setXY(props.x, props.y)
|
||||
group.setAlpha(isMoving || isSelected ? 0.5 : 1)
|
||||
group.setTint(isPlacedSelected ? 0x00ff00 : 0xffffff)
|
||||
group.setDepth(baseDepth)
|
||||
}
|
||||
|
||||
group.getChildren().forEach((child) => {
|
||||
const image = child as Phaser.GameObjects.Image
|
||||
if (image && props.obj) {
|
||||
image.flipX = props.obj.isRotated
|
||||
const updateImageProperties = (): void => {
|
||||
const orderedImages = group.getChildren() as Phaser.GameObjects.Image[]
|
||||
|
||||
orderedImages.forEach((image, index) => {
|
||||
if (!props.obj || !props.mapObj || !props.x) return
|
||||
|
||||
image.flipX = props.obj.isRotated
|
||||
|
||||
if (props.obj.isRotated) {
|
||||
const offsetNum = props.mapObj.depthOffsets.length
|
||||
const xOffset = props.mapObj.frameWidth / offsetNum
|
||||
image.x = props.x + (index < offsetNum / 2 ? -xOffset : xOffset)
|
||||
image.setDepth(baseDepth - props.mapObj.depthOffsets[index])
|
||||
} else {
|
||||
image.x = props.x
|
||||
image.setDepth(baseDepth + props.mapObj.depthOffsets[index])
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onPreUpdate(() => {
|
||||
updateGroupProperties()
|
||||
updateImageProperties()
|
||||
})
|
||||
|
||||
// Initial setup
|
||||
if (props.mapObj && props.x && props.y) {
|
||||
const initializeGroup = (): void => {
|
||||
if (!props.mapObj || !props.x || !props.y || !props.obj) return
|
||||
|
||||
baseDepth = calculateIsometricDepth(props.obj.positionX, props.obj.positionY)
|
||||
group.setXY(props.x, props.y)
|
||||
createImagePartition(0, props.mapObj.frameWidth * props.mapObj.originX, -1)
|
||||
createImagePartition(props.mapObj.frameWidth * props.mapObj.originX, props.mapObj.frameWidth, 1)
|
||||
group.setOrigin(props.mapObj.originX, props.mapObj.originY)
|
||||
|
||||
const points = partitionPoints.value
|
||||
for (let i = 0; i < points.length - 1; i++) {
|
||||
createImagePartition(points[i], points[i + 1], props.mapObj.depthOffsets[i])
|
||||
}
|
||||
}
|
||||
|
||||
initializeGroup()
|
||||
|
||||
onUnmounted(() => {
|
||||
group.destroy(true, true)
|
||||
})
|
||||
|
@ -5,12 +5,11 @@
|
||||
<script setup lang="ts">
|
||||
import type { MapObject, PlacedMapObject } from '@/application/types'
|
||||
import ImageGroup from '@/components/game/map/partials/ImageGroup.vue'
|
||||
import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
|
||||
import { loadMapObjectTextures, tileToWorldXY } from '@/services/mapService'
|
||||
import { MapObjectStorage } from '@/storage/storages'
|
||||
import { useGameStore } from '@/stores/gameStore'
|
||||
import { useScene } from 'phavuer'
|
||||
import { computed, onMounted, ref, watch } from 'vue'
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
|
||||
import Tilemap = Phaser.Tilemaps.Tilemap
|
||||
import TilemapLayer = Phaser.Tilemaps.TilemapLayer
|
||||
@ -24,7 +23,6 @@ const props = defineProps<{
|
||||
const scene = useScene()
|
||||
|
||||
const gameStore = useGameStore()
|
||||
const mapEditor = useMapEditorComposable()
|
||||
|
||||
const mapObject = ref<MapObject>()
|
||||
|
||||
@ -50,6 +48,8 @@ async function initialize() {
|
||||
const _mapObject = await mapObjectStorage.getById(props.placedMapObject.mapObject as string)
|
||||
if (!_mapObject) return
|
||||
|
||||
console.log(_mapObject)
|
||||
|
||||
mapObject.value = _mapObject
|
||||
|
||||
await loadMapObjectTextures([_mapObject], scene)
|
||||
@ -64,13 +64,6 @@ function calculateObjectPlacement(mapObj: PlacedMapObject): { x: number; y: numb
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => mapEditor.refreshMapObject.value,
|
||||
async () => {
|
||||
await initialize()
|
||||
}
|
||||
)
|
||||
|
||||
onMounted(async () => {
|
||||
await initialize()
|
||||
})
|
||||
|
@ -1,21 +1,30 @@
|
||||
<template>
|
||||
<div class="h-full overflow-auto">
|
||||
<div class="relative p-2.5 flex flex-col items-center justify-center h-72 rounded-md default-border bg-gray">
|
||||
<div class="relative">
|
||||
<img class="max-h-56" :src="`${config.server_endpoint}/textures/map_objects/${selectedMapObject?.id}.png`" :alt="'Object ' + selectedMapObject?.id" @click="addPivotPoint" ref="imageRef" />
|
||||
<svg class="absolute bottom-1 left-0 w-full h-full pointer-events-none">
|
||||
<line v-for="(_, index) in mapObjectPivotPoints.slice(0, -1)" :key="index" :x1="mapObjectPivotPoints[index].x" :y1="mapObjectPivotPoints[index].y" :x2="mapObjectPivotPoints[index + 1].x" :y2="mapObjectPivotPoints[index + 1].y" stroke="white" stroke-width="2" />
|
||||
</svg>
|
||||
<div
|
||||
v-for="(point, index) in mapObjectPivotPoints"
|
||||
:key="index"
|
||||
class="absolute w-2 h-2 bg-white rounded-full cursor-move -translate-x-1.5 -translate-y-1.5 ring-2 ring-black"
|
||||
:style="{ left: point.x + 'px', top: point.y + 'px' }"
|
||||
@mousedown="startDragging(index, $event)"
|
||||
@contextmenu.prevent="removePivotPoint(index)"
|
||||
/>
|
||||
<div class="grid grid-cols-[160px_auto_max-content] gap-12">
|
||||
<div>
|
||||
<input type="checkbox" checked v-model="showOrigin" /><label>Show Origin</label>
|
||||
<br />
|
||||
<input type="checkbox" checked v-model="showPartitionOverlay" /><label>Show Partitions</label>
|
||||
</div>
|
||||
<div class="relative w-fit h-fit">
|
||||
<img class="max-h-56" :src="`${config.server_endpoint}/textures/map_objects/${selectedMapObject?.id}.png`" :alt="'Object ' + selectedMapObject?.id" ref="imageRef" />
|
||||
<svg ref="svg" class="absolute top-0 left-0 w-full h-full inline-block pointer-events-none">
|
||||
<circle v-if="showOrigin && svg" r="4" :cx="mapObjectOriginX * width" :cy="mapObjectOriginY * height" stroke="white" stroke-width="2" />
|
||||
<rect v-if="showPartitionOverlay && svg" v-for="(offset, index) in mapObjectDepthOffsets" style="opacity: 0.5" stroke="red" :x="index * (width / mapObjectDepthOffsets.length)" :width="width / mapObjectDepthOffsets.length" :y="0" :height="height" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn-cyan px-4 py-1.5 min-w-24" @click="mapObjectDepthOffsets.push(0)">Add Partition</button>
|
||||
<p>Depth Offset</p>
|
||||
<div class="text-white grid grid-cols-[120px_80px_auto] items-baseline gap-2" v-for="(offset, index) in mapObjectDepthOffsets">
|
||||
<input class="input-field max-h-4 mt-2" type="number" :value="offset" @change="setPartitionDepth($event, index)" />
|
||||
<button @click="mapObjectDepthOffsets.splice(index, 1)">Remove</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-5 block">
|
||||
<form class="flex gap-2.5 flex-wrap" @submit.prevent="saveObject">
|
||||
<div class="form-field-full">
|
||||
@ -64,23 +73,27 @@ import ChipsInput from '@/components/forms/ChipsInput.vue'
|
||||
import { socketManager } from '@/managers/SocketManager'
|
||||
import { MapObjectStorage } from '@/storage/storages'
|
||||
import { useAssetManagerStore } from '@/stores/assetManagerStore'
|
||||
import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
|
||||
import { useElementSize } from '@vueuse/core'
|
||||
import { Rectangle } from 'phavuer'
|
||||
import { computed, onBeforeUnmount, onMounted, ref, useTemplateRef, watch } from 'vue'
|
||||
|
||||
const assetManagerStore = useAssetManagerStore()
|
||||
|
||||
const selectedMapObject = computed(() => assetManagerStore.selectedMapObject)
|
||||
const svg = useTemplateRef('svg')
|
||||
const { width, height } = useElementSize(svg)
|
||||
|
||||
const mapObjectName = ref('')
|
||||
const mapObjectTags = ref<string[]>([])
|
||||
const mapObjectPivotPoints = ref<Array<{ x: number; y: number }>>([])
|
||||
const mapObjectDepthOffsets = ref<number[]>([])
|
||||
const mapObjectOriginX = ref(0)
|
||||
const mapObjectOriginY = ref(0)
|
||||
const mapObjectFrameRate = ref(0)
|
||||
const mapObjectFrameWidth = ref(0)
|
||||
const mapObjectFrameHeight = ref(0)
|
||||
const imageRef = ref<HTMLImageElement | null>(null)
|
||||
const isDragging = ref(false)
|
||||
const draggedPointIndex = ref(-1)
|
||||
const showOrigin = ref(true)
|
||||
const showPartitionOverlay = ref(true)
|
||||
|
||||
if (!selectedMapObject.value) {
|
||||
console.error('No map mapObject selected')
|
||||
@ -89,7 +102,7 @@ if (!selectedMapObject.value) {
|
||||
if (selectedMapObject.value) {
|
||||
mapObjectName.value = selectedMapObject.value.name
|
||||
mapObjectTags.value = selectedMapObject.value.tags
|
||||
mapObjectPivotPoints.value = selectedMapObject.value.pivotPoints
|
||||
mapObjectDepthOffsets.value = selectedMapObject.value.depthOffsets
|
||||
mapObjectOriginX.value = selectedMapObject.value.originX
|
||||
mapObjectOriginY.value = selectedMapObject.value.originY
|
||||
mapObjectFrameRate.value = selectedMapObject.value.frameRate
|
||||
@ -97,6 +110,8 @@ if (selectedMapObject.value) {
|
||||
mapObjectFrameHeight.value = selectedMapObject.value.frameHeight
|
||||
}
|
||||
|
||||
const setPartitionDepth = (event: any, idx: number) => (mapObjectDepthOffsets.value[idx] = Number.parseInt(event.target.value))
|
||||
|
||||
async function removeObject() {
|
||||
if (!selectedMapObject.value) return
|
||||
socketManager.emit(SocketEvent.GM_MAPOBJECT_REMOVE, { mapObjectId: selectedMapObject.value.id }, async (response: boolean) => {
|
||||
@ -125,14 +140,13 @@ async function saveObject() {
|
||||
console.error('No mapObject selected')
|
||||
return
|
||||
}
|
||||
|
||||
socketManager.emit(
|
||||
SocketEvent.GM_MAPOBJECT_UPDATE,
|
||||
{
|
||||
id: selectedMapObject.value.id,
|
||||
name: mapObjectName.value,
|
||||
tags: mapObjectTags.value,
|
||||
pivotPoints: mapObjectPivotPoints.value,
|
||||
depthOffsets: mapObjectDepthOffsets.value,
|
||||
originX: mapObjectOriginX.value,
|
||||
originY: mapObjectOriginY.value,
|
||||
frameRate: mapObjectFrameRate.value,
|
||||
@ -155,7 +169,7 @@ watch(selectedMapObject, (mapObject: MapObject | null) => {
|
||||
if (!mapObject) return
|
||||
mapObjectName.value = mapObject.name
|
||||
mapObjectTags.value = mapObject.tags
|
||||
mapObjectPivotPoints.value = mapObject.pivotPoints
|
||||
mapObjectDepthOffsets.value = mapObject.depthOffsets
|
||||
mapObjectOriginX.value = mapObject.originX
|
||||
mapObjectOriginY.value = mapObject.originY
|
||||
mapObjectFrameRate.value = mapObject.frameRate
|
||||
@ -167,43 +181,29 @@ onMounted(() => {
|
||||
if (!selectedMapObject.value) return
|
||||
})
|
||||
|
||||
function addPivotPoint(event: MouseEvent) {
|
||||
if (!imageRef.value) return
|
||||
// Max 2
|
||||
if (mapObjectPivotPoints.value.length >= 2) return
|
||||
const rect = imageRef.value.getBoundingClientRect()
|
||||
const x = event.clientX - rect.left
|
||||
const y = event.clientY - rect.top
|
||||
mapObjectPivotPoints.value.push({ x, y })
|
||||
}
|
||||
|
||||
function startDragging(index: number, event: MouseEvent) {
|
||||
isDragging.value = true
|
||||
draggedPointIndex.value = index
|
||||
|
||||
const moveHandler = (e: MouseEvent) => {
|
||||
if (!isDragging.value || !imageRef.value) return
|
||||
const rect = imageRef.value.getBoundingClientRect()
|
||||
mapObjectPivotPoints.value[draggedPointIndex.value] = {
|
||||
x: e.clientX - rect.left,
|
||||
y: e.clientY - rect.top
|
||||
}
|
||||
}
|
||||
|
||||
const upHandler = () => {
|
||||
isDragging.value = false
|
||||
draggedPointIndex.value = -1
|
||||
window.removeEventListener('mousemove', moveHandler)
|
||||
window.removeEventListener('mouseup', upHandler)
|
||||
}
|
||||
|
||||
window.addEventListener('mousemove', moveHandler)
|
||||
window.addEventListener('mouseup', upHandler)
|
||||
}
|
||||
|
||||
function removePivotPoint(index: number) {
|
||||
mapObjectPivotPoints.value.splice(index, 1)
|
||||
}
|
||||
// function startDragging(index: number, event: MouseEvent) {
|
||||
// isDragging.value = true
|
||||
// draggedPointIndex.value = index
|
||||
//
|
||||
// const moveHandler = (e: MouseEvent) => {
|
||||
// if (!isDragging.value || !imageRef.value) return
|
||||
// const rect = imageRef.value.getBoundingClientRect()
|
||||
// mapObjectPivotPoints.value[draggedPointIndex.value] = {
|
||||
// x: e.clientX - rect.left,
|
||||
// y: e.clientY - rect.top
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// const upHandler = () => {
|
||||
// isDragging.value = false
|
||||
// draggedPointIndex.value = -1
|
||||
// window.removeEventListener('mousemove', moveHandler)
|
||||
// window.removeEventListener('mouseup', upHandler)
|
||||
// }
|
||||
//
|
||||
// window.addEventListener('mousemove', moveHandler)
|
||||
// window.addEventListener('mouseup', upHandler)
|
||||
// }
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
assetManagerStore.setSelectedMapObject(null)
|
||||
|
@ -1,21 +1,11 @@
|
||||
<template>
|
||||
<div class="h-full overflow-auto">
|
||||
<div class="relative flex flex-col">
|
||||
<div class="flex flex-wrap gap-2 p-2.5 rounded-md default-border bg-gray">
|
||||
<div class="flex flex-wrap gap-2 p-2.5 rounded-md default-border bg-gray mb-4">
|
||||
<div class="w-full flex flex-col">
|
||||
<label class="mb-1.5 font-titles" for="name">Name</label>
|
||||
<input v-model="spriteName" class="input-field" type="text" name="name" placeholder="New sprite" />
|
||||
</div>
|
||||
|
||||
<div class="form-field-half">
|
||||
<label class="mb-1.5 font-titles" for="name">Width override</label>
|
||||
<input v-model="spriteWidth" class="input-field" type="number" name="width" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label class="mb-1.5 font-titles" for="name">Height override</label>
|
||||
<input v-model="spriteHeight" class="input-field" type="number" name="height" />
|
||||
</div>
|
||||
|
||||
<div class="w-full flex gap-2 mt-2 pb-4 relative">
|
||||
<button class="btn-cyan px-4 py-2 flex-1 sm:flex-none sm:min-w-24" type="button" @click.prevent="saveSprite">Save</button>
|
||||
<button class="btn-red px-4 py-2 flex-1 sm:flex-none sm:min-w-24" type="button" @click.prevent="deleteSprite">Delete</button>
|
||||
@ -24,53 +14,39 @@
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="btn-cyan px-4" type="button" @click.prevent="addNewImage">New action</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn-cyan py-2 my-4" type="button" @click.prevent="addNewImage">New action</button>
|
||||
<Accordion v-for="action in spriteActions" :key="action.id">
|
||||
<template #header>
|
||||
<div class="flex items-center">
|
||||
{{ action.action }}
|
||||
<div class="ml-auto space-x-2">
|
||||
<button class="btn-cyan px-4 py-1.5 min-w-24" type="button" @click.stop.prevent="openPreviewModal(action)">View</button>
|
||||
<button class="btn-red px-4 py-1.5 min-w-24" type="button" @click.stop.prevent="() => spriteActions.splice(spriteActions.indexOf(action), 1)">Delete</button>
|
||||
</div>
|
||||
<div v-for="action in spriteActions" :key="action.id">
|
||||
<div class="flex flex-wrap gap-3 mb-3">
|
||||
<div v-for="(image, index) in action.sprites" :key="index" class="h-20 w-20 p-4 bg-gray-300 bg-opacity-50 rounded text-center relative group">
|
||||
<img :src="image.url" class="max-w-full max-h-full object-contain pointer-events-none" alt="Uploaded image" @load="updateImageDimensions($event, index)" />
|
||||
<div v-if="imageDimensions[index]" class="absolute bottom-1 right-1 bg-black/50 text-white text-xs px-1 py-0.5 rounded transition-opacity font-default">{{ imageDimensions[index].width }}x{{ imageDimensions[index].height }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<form class="flex gap-2.5 flex-wrap" @submit.prevent="saveSprite">
|
||||
<div class="form-field-full">
|
||||
<label for="action">Action</label>
|
||||
<input v-model="action.action" class="input-field" type="text" name="action" placeholder="Action" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="origin-x">Origin X</label>
|
||||
<input v-model.number="action.originX" class="input-field" type="number" step="any" name="origin-x" placeholder="Origin X" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="origin-y">Origin Y</label>
|
||||
<input v-model.number="action.originY" class="input-field" type="number" step="any" name="origin-y" placeholder="Origin Y" />
|
||||
</div>
|
||||
<div class="form-field-full">
|
||||
<label for="frame-speed">Frame rate</label>
|
||||
<input v-model.number="action.frameRate" class="input-field" type="number" step="any" name="frame-speed" placeholder="Frame rate" />
|
||||
</div>
|
||||
<div class="form-field-full">
|
||||
<SpriteActionsInput v-model="action.sprites" @tempOffsetChange="(index, offset) => handleTempOffsetChange(action, index, offset)" />
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
</Accordion>
|
||||
<SpritePreview
|
||||
v-if="selectedAction"
|
||||
:sprites="selectedAction.sprites"
|
||||
:frame-rate="selectedAction.frameRate"
|
||||
:is-modal-open="isModalOpen"
|
||||
:temp-offset-index="tempOffsetData.index"
|
||||
:temp-offset="tempOffsetData.offset"
|
||||
@update:frame-rate="updateFrameRate"
|
||||
@update:is-modal-open="isModalOpen = $event"
|
||||
</div>
|
||||
<div class="flex items-center mb-3">
|
||||
<div class="mr-3 space-x-2">
|
||||
<button class="btn-cyan px-4 py-1.5 min-w-24 text-left" type="button" @click.stop.prevent="openEditorModal(action)">
|
||||
Editor
|
||||
<div class="flex">
|
||||
<small class="text-xs font-default">{{ action.action }}</small>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<SpriteEditor
|
||||
v-for="[actionId, editorData] in Array.from(openEditors.entries())"
|
||||
:key="actionId"
|
||||
:sprite="selectedSprite!"
|
||||
:sprites="editorData.action.sprites"
|
||||
:frame-rate="editorData.action.frameRate"
|
||||
:is-modal-open="editorData.isOpen"
|
||||
:temp-offset-index="getTempOffsetIndex(editorData.action)"
|
||||
:temp-offset="getTempOffset(editorData.action)"
|
||||
@update:frame-rate="(value) => updateFrameRate(editorData.action, value)"
|
||||
@update:is-modal-open="(value) => handleEditorModalClose(editorData.action, value)"
|
||||
@update:temp-offset="(index, offset) => handleTempOffsetChange(editorData.action, index, offset)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -80,9 +56,7 @@
|
||||
import { SocketEvent } from '@/application/enums'
|
||||
import type { Sprite, SpriteAction } from '@/application/types'
|
||||
import { downloadCache, uuidv4 } from '@/application/utilities'
|
||||
import SpriteActionsInput from '@/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue'
|
||||
import SpritePreview from '@/components/gameMaster/assetManager/partials/sprite/partials/SpritePreview.vue'
|
||||
import Accordion from '@/components/utilities/Accordion.vue'
|
||||
import SpriteEditor from '@/components/gameMaster/assetManager/partials/sprite/partials/SpriteEditor.vue'
|
||||
import { socketManager } from '@/managers/SocketManager'
|
||||
import { SpriteStorage } from '@/storage/storages'
|
||||
import { useAssetManagerStore } from '@/stores/assetManagerStore'
|
||||
@ -91,13 +65,11 @@ import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
|
||||
const assetManagerStore = useAssetManagerStore()
|
||||
|
||||
const selectedSprite = computed(() => assetManagerStore.selectedSprite)
|
||||
|
||||
const tempOffsetData = ref<Map<string, { index: number | undefined; offset: { x: number; y: number } | undefined }>>(new Map())
|
||||
const spriteName = ref('')
|
||||
const spriteWidth = ref(0)
|
||||
const spriteHeight = ref(0)
|
||||
const spriteActions = ref<SpriteAction[]>([])
|
||||
const isModalOpen = ref(false)
|
||||
const selectedAction = ref<SpriteAction | null>(null)
|
||||
|
||||
const openEditors = ref(new Map<string, { action: SpriteAction; isOpen: boolean }>())
|
||||
|
||||
if (!selectedSprite.value) {
|
||||
console.error('No sprite selected')
|
||||
@ -105,8 +77,6 @@ if (!selectedSprite.value) {
|
||||
|
||||
if (selectedSprite.value) {
|
||||
spriteName.value = selectedSprite.value.name
|
||||
spriteWidth.value = selectedSprite.value.width
|
||||
spriteHeight.value = selectedSprite.value.height
|
||||
spriteActions.value = sortSpriteActions(selectedSprite.value.spriteActions)
|
||||
}
|
||||
|
||||
@ -153,20 +123,18 @@ async function saveSprite() {
|
||||
const updatedSprite = {
|
||||
id: selectedSprite.value.id,
|
||||
name: spriteName.value,
|
||||
width: spriteWidth.value,
|
||||
height: spriteHeight.value,
|
||||
spriteActions:
|
||||
spriteActions.value?.map((action) => {
|
||||
return {
|
||||
action: action.action,
|
||||
sprites: action.sprites,
|
||||
originX: action.originX,
|
||||
originY: action.originY,
|
||||
frameRate: action.frameRate,
|
||||
frameWidth: action.frameWidth,
|
||||
frameHeight: action.frameHeight
|
||||
}
|
||||
}) ?? []
|
||||
spriteActions.value?.map((action) => {
|
||||
return {
|
||||
action: action.action,
|
||||
sprites: action.sprites,
|
||||
originX: action.originX,
|
||||
originY: action.originY,
|
||||
frameRate: action.frameRate,
|
||||
frameWidth: action.frameWidth,
|
||||
frameHeight: action.frameHeight
|
||||
}
|
||||
}) ?? []
|
||||
}
|
||||
|
||||
socketManager.emit(SocketEvent.GM_SPRITE_UPDATE, updatedSprite, async (response: boolean) => {
|
||||
@ -207,41 +175,69 @@ function sortSpriteActions(actions: SpriteAction[]): SpriteAction[] {
|
||||
return [...actions].sort((a, b) => a.action.localeCompare(b.action))
|
||||
}
|
||||
|
||||
function openPreviewModal(action: SpriteAction) {
|
||||
selectedAction.value = action
|
||||
isModalOpen.value = true
|
||||
function openEditorModal(action: SpriteAction) {
|
||||
const newOpenEditors = new Map(openEditors.value)
|
||||
newOpenEditors.set(action.id, { action, isOpen: true })
|
||||
openEditors.value = newOpenEditors
|
||||
}
|
||||
|
||||
function updateFrameRate(value: number) {
|
||||
if (selectedAction.value) {
|
||||
selectedAction.value.frameRate = value
|
||||
}
|
||||
function updateFrameRate(action: SpriteAction, value: number) {
|
||||
console.log('update frame rate', action)
|
||||
action.frameRate = value
|
||||
}
|
||||
|
||||
const tempOffsetData = ref<{ index: number | undefined; offset: { x: number; y: number } | undefined }>({
|
||||
index: undefined,
|
||||
offset: undefined
|
||||
})
|
||||
function handleEditorModalClose(action: SpriteAction, isOpen: boolean) {
|
||||
if (isOpen) return
|
||||
const newOpenEditors = new Map(openEditors.value)
|
||||
newOpenEditors.delete(action.id)
|
||||
openEditors.value = newOpenEditors
|
||||
}
|
||||
|
||||
function handleTempOffsetChange(action: SpriteAction, index: number, offset: { x: number; y: number }) {
|
||||
if (selectedAction.value === action) {
|
||||
tempOffsetData.value = { index, offset }
|
||||
// Update the temporary offset data for this action
|
||||
const newTempOffsetData = new Map(tempOffsetData.value)
|
||||
newTempOffsetData.set(action.id, { index, offset })
|
||||
tempOffsetData.value = newTempOffsetData
|
||||
|
||||
// Also update the actual sprite data so changes persist
|
||||
if (action.sprites && action.sprites[index]) {
|
||||
action.sprites[index].offset = { ...offset };
|
||||
}
|
||||
}
|
||||
|
||||
function getTempOffsetIndex(action: SpriteAction): number | undefined {
|
||||
return tempOffsetData.value.get(action.id)?.index
|
||||
}
|
||||
|
||||
function getTempOffset(action: SpriteAction): { x: number; y: number } | undefined {
|
||||
return tempOffsetData.value.get(action.id)?.offset
|
||||
}
|
||||
|
||||
watch(selectedSprite, (sprite: Sprite | null) => {
|
||||
if (!sprite) return
|
||||
spriteName.value = sprite.name
|
||||
spriteWidth.value = sprite.width
|
||||
spriteHeight.value = sprite.height
|
||||
spriteActions.value = sortSpriteActions(sprite.spriteActions)
|
||||
openEditors.value = new Map()
|
||||
tempOffsetData.value = new Map() // Reset temp offset data when sprite changes
|
||||
})
|
||||
|
||||
watch(isModalOpen, (newValue) => {
|
||||
if (!newValue) {
|
||||
selectedAction.value = null
|
||||
interface SpriteImage {
|
||||
url: string
|
||||
offset: {
|
||||
x: number
|
||||
y: number
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const imageDimensions = ref<{ [key: number]: { width: number; height: number } }>({})
|
||||
|
||||
const updateImageDimensions = (event: Event, index: number) => {
|
||||
const img = event.target as HTMLImageElement
|
||||
imageDimensions.value[index] = {
|
||||
width: img.naturalWidth,
|
||||
height: img.naturalHeight
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (!selectedSprite.value) return
|
||||
@ -250,4 +246,4 @@ onMounted(() => {
|
||||
onBeforeUnmount(() => {
|
||||
assetManagerStore.setSelectedSprite(null)
|
||||
})
|
||||
</script>
|
||||
</script>
|
@ -0,0 +1,366 @@
|
||||
<template>
|
||||
<Modal :is-modal-open="isModalOpen" :modal-width="700" :modal-height="330" :can-full-screen="true" bg-style="none" @modal:close="closeModal">
|
||||
<template #modalHeader>
|
||||
<h3 class="m-0 font-medium shrink-0 text-white">Sprite editor</h3>
|
||||
</template>
|
||||
<template #modalBody>
|
||||
<div class="m-4 flex gap-4 h-full">
|
||||
<!-- Settings -->
|
||||
<div class="w-80 h-full flex flex-col overflow-y-auto">
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-1 text-white text-sm">Frame Rate: {{ frameRate }} FPS</label>
|
||||
<div class="text-xs font-default text-gray-400 mb-1">Duration: {{ totalDuration }}s</div>
|
||||
<input type="range" v-model.number="localFrameRate" min="0" max="60" step="1" class="w-full accent-cyan-500" @input="updateFrameRate" />
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-1 text-white text-sm">Frame: {{ currentFrame + 1 }} of {{ sprites.length }}</label>
|
||||
<input type="range" v-model.number="currentFrame" :min="0" :max="sprites.length - 1" step="1" class="w-full accent-cyan-500" @input="stopAnimation" />
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-1 text-white text-sm">Zoom: {{ zoomLevel }}%</label>
|
||||
<input type="range" v-model.number="zoomLevel" min="10" max="600" step="10" class="w-full accent-cyan-500" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6 space-y-2">
|
||||
<button @click="toggleAnimation" class="px-3 py-1 bg-cyan-600 hover:bg-cyan-700 text-white rounded transition-colors w-full">
|
||||
{{ isAnimating ? 'Pause' : 'Play' }}
|
||||
</button>
|
||||
<button @click="toggleReferenceSprites" class="px-3 py-1 bg-cyan-600 hover:bg-cyan-700 text-white rounded transition-colors w-full">
|
||||
{{ showReferenceSprites ? 'Hide References' : 'Show References' }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<form class="flex gap-2.5 flex-wrap" @submit.prevent="">
|
||||
<div class="relative flex py-5 items-center">
|
||||
<div class="flex-grow border-t border-gray-400"></div>
|
||||
<span class="flex-shrink mx-4 text-gray-400">Sprite action</span>
|
||||
<div class="flex-grow border-solid border-gray-200"></div>
|
||||
</div>
|
||||
<div class="form-field-full">
|
||||
<label for="action">Name</label>
|
||||
<input class="input-field" type="text" name="action" placeholder="Action" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="origin-x">Origin X</label>
|
||||
<input class="input-field" type="number" step="any" name="origin-x" placeholder="Origin X" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="origin-y">Origin Y</label>
|
||||
<input class="input-field" type="number" step="any" name="origin-y" placeholder="Origin Y" />
|
||||
</div>
|
||||
<div class="relative flex py-5 items-center">
|
||||
<div class="flex-grow border-t border-gray-400"></div>
|
||||
<span class="flex-shrink mx-4 text-gray-400">Sprite action image</span>
|
||||
<div class="flex-grow border-t border-gray-400"></div>
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="offset-x">Offset X</label>
|
||||
<input class="input-field" type="number" step="1" v-model.number="offsetXModel" :disabled="isAnimating" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="offset-y">Offset Y</label>
|
||||
<input class="input-field" type="number" step="1" v-model.number="offsetYModel" :disabled="isAnimating" />
|
||||
</div>
|
||||
<div class="form-field-full">
|
||||
<label for="frame-speed">Frame rate</label>
|
||||
<input class="input-field" type="number" step="any" name="frame-speed" placeholder="Frame rate" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Sprite thumbnails -->
|
||||
<div class="flex-1 flex flex-col h-full">
|
||||
<div class="bg-gray-800 border-solid border-white/10 rounded flex-grow mb-2 relative overflow-hidden" @mousedown="startDrag" @mousemove="onDrag" @mouseup="stopDrag" @mouseleave="stopDrag">
|
||||
<!-- Background reference sprites (semi-transparent) -->
|
||||
<img
|
||||
v-for="(sprite, index) in spritesWithTempOffset"
|
||||
:key="`bg-${index}`"
|
||||
:src="sprite.url"
|
||||
alt="Reference sprite"
|
||||
v-show="index !== currentFrame && showReferenceSprites"
|
||||
:style="{
|
||||
position: 'absolute',
|
||||
left: `${(sprite.offset?.x || 0) * (zoomLevel / 100)}px`,
|
||||
bottom: `${(sprite.offset?.y || 0) * (zoomLevel / 100)}px`,
|
||||
opacity: 0.3,
|
||||
transform: `scale(${zoomLevel / 100})`,
|
||||
transformOrigin: 'bottom left',
|
||||
pointerEvents: 'none'
|
||||
}"
|
||||
/>
|
||||
<!-- Current sprite (draggable) -->
|
||||
<img
|
||||
v-for="(sprite, index) in spritesWithTempOffset"
|
||||
:key="index"
|
||||
:src="sprite.url"
|
||||
alt="Sprite"
|
||||
:class="{ 'cursor-move': currentFrame === index }"
|
||||
:style="{
|
||||
position: 'absolute',
|
||||
left: `${(sprite.offset?.x || 0) * (zoomLevel / 100)}px`,
|
||||
bottom: `${(sprite.offset?.y || 0) * (zoomLevel / 100)}px`,
|
||||
display: currentFrame === index ? 'block' : 'none',
|
||||
transform: `scale(${zoomLevel / 100})`,
|
||||
transformOrigin: 'bottom left',
|
||||
userSelect: 'none',
|
||||
pointerEvents: currentFrame === index ? 'auto' : 'none'
|
||||
}"
|
||||
@dragstart.prevent
|
||||
/>
|
||||
</div>
|
||||
<div class="bg-gray-800 p-2 overflow-x-auto border-solid border-white/10 rounded mb-8 h-24 min-h-16">
|
||||
<div class="flex gap-2">
|
||||
<div
|
||||
v-for="(sprite, index) in sprites"
|
||||
:key="`thumb-${index}`"
|
||||
class="relative cursor-pointer border-solid transition-all duration-200 rounded flex-shrink-0 p-3 px-12"
|
||||
:class="currentFrame === index ? 'border-cyan-600 bg-cyan-500/10' : 'border-transparent hover:border-white/30'"
|
||||
@click="selectFrame(index)"
|
||||
>
|
||||
<img :src="sprite.url" alt="Sprite thumbnail" class="h-16 w-auto object-contain rounded" />
|
||||
<div class="absolute top-0 right-0 bg-gray-400 text-white text-xs font-default px-1 rounded-bl">
|
||||
{{ index + 1 }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { Sprite, SpriteImage } from '@/application/types'
|
||||
import Modal from '@/components/utilities/Modal.vue'
|
||||
import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
|
||||
|
||||
const props = defineProps<{
|
||||
sprite: Sprite
|
||||
sprites: SpriteImage[]
|
||||
frameRate: number
|
||||
isModalOpen?: boolean
|
||||
tempOffsetIndex?: number
|
||||
tempOffset?: { x: number; y: number }
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:frameRate', value: number): void
|
||||
(e: 'update:isModalOpen', value: boolean): void
|
||||
(e: 'update:tempOffset', index: number, offset: { x: number; y: number }): void
|
||||
}>()
|
||||
|
||||
const currentFrame = ref(0)
|
||||
const localFrameRate = ref(props.frameRate)
|
||||
const zoomLevel = ref(100)
|
||||
const isAnimating = ref(false)
|
||||
const isDragging = ref(false)
|
||||
const startDragPos = ref({ x: 0, y: 0 })
|
||||
const currentOffset = ref({ x: 0, y: 0 })
|
||||
let animationInterval: number | null = null
|
||||
|
||||
const totalDuration = computed(() => {
|
||||
if (props.frameRate <= 0) return 0
|
||||
return (props.sprites.length / props.frameRate).toFixed(2)
|
||||
})
|
||||
|
||||
const spritesWithTempOffset = computed(() => {
|
||||
return props.sprites.map((sprite, index) => {
|
||||
if (index === props.tempOffsetIndex && props.tempOffset) {
|
||||
return { ...sprite, offset: props.tempOffset }
|
||||
}
|
||||
return sprite
|
||||
})
|
||||
})
|
||||
|
||||
const currentSprite = computed(() => {
|
||||
if (currentFrame.value >= 0 && currentFrame.value < spritesWithTempOffset.value.length) {
|
||||
return spritesWithTempOffset.value[currentFrame.value]
|
||||
}
|
||||
return null
|
||||
})
|
||||
|
||||
// Create computed properties with getters and setters for two-way binding
|
||||
const offsetXModel = computed({
|
||||
get: () => currentSprite.value?.offset?.x || 0,
|
||||
set: (value) => {
|
||||
if (isAnimating.value) return
|
||||
const newOffset = {
|
||||
x: value,
|
||||
y: currentSprite.value?.offset?.y || 0
|
||||
}
|
||||
emit('update:tempOffset', currentFrame.value, newOffset)
|
||||
}
|
||||
})
|
||||
|
||||
const offsetYModel = computed({
|
||||
get: () => currentSprite.value?.offset?.y || 0,
|
||||
set: (value) => {
|
||||
if (isAnimating.value) return
|
||||
const newOffset = {
|
||||
x: currentSprite.value?.offset?.x || 0,
|
||||
y: value
|
||||
}
|
||||
emit('update:tempOffset', currentFrame.value, newOffset)
|
||||
}
|
||||
})
|
||||
|
||||
// Toggle for showing reference sprites
|
||||
const showReferenceSprites = ref(true)
|
||||
|
||||
function updateAnimation() {
|
||||
stopAnimation()
|
||||
if (props.frameRate <= 0 || props.sprites.length === 0) {
|
||||
currentFrame.value = 0
|
||||
return
|
||||
}
|
||||
|
||||
if (isAnimating.value) {
|
||||
animationInterval = window.setInterval(() => {
|
||||
currentFrame.value = (currentFrame.value + 1) % props.sprites.length
|
||||
}, 1000 / props.frameRate)
|
||||
}
|
||||
}
|
||||
|
||||
function toggleAnimation() {
|
||||
isAnimating.value = !isAnimating.value
|
||||
if (isAnimating.value) {
|
||||
updateAnimation()
|
||||
} else {
|
||||
stopAnimation()
|
||||
}
|
||||
}
|
||||
|
||||
function stopAnimation() {
|
||||
if (animationInterval) {
|
||||
clearInterval(animationInterval)
|
||||
animationInterval = null
|
||||
}
|
||||
}
|
||||
|
||||
function selectFrame(index: number) {
|
||||
currentFrame.value = index
|
||||
stopAnimation()
|
||||
isAnimating.value = false
|
||||
}
|
||||
|
||||
function updateFrameRate() {
|
||||
emit('update:frameRate', localFrameRate.value)
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
emit('update:isModalOpen', false)
|
||||
}
|
||||
|
||||
function startDrag(event: MouseEvent) {
|
||||
if (isAnimating.value) return
|
||||
|
||||
const previewContainer = event.currentTarget as HTMLElement
|
||||
const rect = previewContainer.getBoundingClientRect()
|
||||
|
||||
// Store initial mouse position
|
||||
startDragPos.value = {
|
||||
x: event.clientX,
|
||||
y: event.clientY
|
||||
}
|
||||
|
||||
// Store current offset
|
||||
if (currentSprite.value && currentSprite.value.offset) {
|
||||
currentOffset.value = {
|
||||
x: currentSprite.value.offset.x,
|
||||
y: currentSprite.value.offset.y
|
||||
}
|
||||
} else {
|
||||
currentOffset.value = { x: 0, y: 0 }
|
||||
}
|
||||
|
||||
isDragging.value = true
|
||||
}
|
||||
|
||||
function onDrag(event: MouseEvent) {
|
||||
if (!isDragging.value) return
|
||||
|
||||
// Calculate the difference from the start position
|
||||
const deltaX = event.clientX - startDragPos.value.x
|
||||
const deltaY = startDragPos.value.y - event.clientY // Inverted for bottom positioning
|
||||
|
||||
// Apply the zoom factor to the delta
|
||||
// This ensures that the movement in screen pixels is converted to the correct
|
||||
// number of pixels at the sprite's natural size, regardless of zoom level
|
||||
const zoomFactor = 100 / zoomLevel.value
|
||||
const scaledDeltaX = deltaX * zoomFactor
|
||||
const scaledDeltaY = deltaY * zoomFactor
|
||||
|
||||
// Calculate new offset
|
||||
// These offsets are in the sprite's natural coordinate space (as if zoom was 100%)
|
||||
const newOffset = {
|
||||
x: currentOffset.value.x + scaledDeltaX,
|
||||
y: currentOffset.value.y + scaledDeltaY
|
||||
}
|
||||
|
||||
// Emit the new offset
|
||||
emit('update:tempOffset', currentFrame.value, newOffset)
|
||||
}
|
||||
|
||||
function stopDrag() {
|
||||
if (isDragging.value && currentSprite.value?.offset) {
|
||||
// Ensure the final offset is applied when dragging stops
|
||||
emit('update:tempOffset', currentFrame.value, {
|
||||
x: currentSprite.value.offset.x,
|
||||
y: currentSprite.value.offset.y
|
||||
})
|
||||
}
|
||||
isDragging.value = false
|
||||
}
|
||||
|
||||
function toggleReferenceSprites() {
|
||||
showReferenceSprites.value = !showReferenceSprites.value
|
||||
}
|
||||
|
||||
function updateOffset(event: Event, axis: 'x' | 'y') {
|
||||
if (isAnimating.value) return
|
||||
|
||||
const input = event.target as HTMLInputElement
|
||||
const value = parseInt(input.value) || 0
|
||||
|
||||
if (currentSprite.value && currentSprite.value.offset) {
|
||||
const newOffset = { ...currentSprite.value.offset }
|
||||
newOffset[axis] = value
|
||||
emit('update:tempOffset', currentFrame.value, newOffset)
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.frameRate,
|
||||
(newValue) => {
|
||||
localFrameRate.value = newValue
|
||||
updateAnimation()
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
watch(() => props.sprites, updateAnimation, { immediate: true })
|
||||
|
||||
watch(
|
||||
() => isAnimating.value,
|
||||
(newValue) => {
|
||||
if (newValue) {
|
||||
updateAnimation()
|
||||
} else {
|
||||
stopAnimation()
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
onMounted(() => {
|
||||
isAnimating.value = props.frameRate > 0
|
||||
if (isAnimating.value) {
|
||||
updateAnimation()
|
||||
}
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
stopAnimation()
|
||||
})
|
||||
</script>
|
@ -1,185 +0,0 @@
|
||||
<template>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<div v-for="(image, index) in modelValue" :key="index" class="h-20 w-20 p-4 bg-gray-300 bg-opacity-50 rounded text-center relative group cursor-move" draggable="true" @dragstart="dragStart($event, index)" @dragover.prevent @dragenter.prevent @drop="drop($event, index)">
|
||||
<img :src="image.url" class="max-w-full max-h-full object-contain pointer-events-none" alt="Uploaded image" @load="updateImageDimensions($event, index)" />
|
||||
<div v-if="imageDimensions[index]" class="absolute bottom-1 right-1 bg-black/50 text-white text-xs px-1 py-0.5 rounded transition-opacity font-default">{{ imageDimensions[index].width }}x{{ imageDimensions[index].height }}</div>
|
||||
<div class="absolute top-1 left-1 flex-row space-y-1">
|
||||
<button @click.stop="deleteImage(index)" class="bg-red-500 text-white rounded-full w-6 h-6 flex items-center justify-center cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity" aria-label="Delete image">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
<button @click.stop="openOffsetModal(index)" class="bg-blue-500 text-white rounded-full w-6 h-6 flex items-center justify-center cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity" aria-label="Scope image">
|
||||
<svg width="50px" height="50px" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.29289 3.70711L1 11V15H5L12.2929 7.70711L8.29289 3.70711Z" fill="white" />
|
||||
<path d="M9.70711 2.29289L13.7071 6.29289L15.1716 4.82843C15.702 4.29799 16 3.57857 16 2.82843C16 1.26633 14.7337 0 13.1716 0C12.4214 0 11.702 0.297995 11.1716 0.828428L9.70711 2.29289Z" fill="white" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<Modal :is-modal-open="selectedImageIndex === index" :modal-width="300" :modal-height="210" :is-resizable="false" bg-style="none" @modal:close="closeOffsetModal">
|
||||
<template #modalHeader>
|
||||
<h3 class="m-0 font-medium shrink-0 text-white">Action offset ({{ selectedImageIndex }})</h3>
|
||||
</template>
|
||||
<template #modalBody>
|
||||
<div class="m-4">
|
||||
<form method="post" @submit.prevent="saveOffset(index)" class="inline">
|
||||
<div class="gap-2.5 flex flex-wrap">
|
||||
<div class="form-field-half">
|
||||
<label for="offsetX">Offset X</label>
|
||||
<input class="input-field max-w-64" v-model="tempOffset.x" name="offsetX" id="offsetX" type="number" />
|
||||
</div>
|
||||
<div class="form-field-half">
|
||||
<label for="offsetY">Offset Y</label>
|
||||
<input class="input-field max-w-64" v-model="tempOffset.y" name="offsetY" id="offsetY" type="number" />
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-cyan px-4 py-1.5 min-w-24" type="submit">Save</button>
|
||||
</form>
|
||||
</div>
|
||||
</template>
|
||||
</Modal>
|
||||
</div>
|
||||
<div class="h-20 w-20 p-4 bg-gray-200 bg-opacity-50 rounded justify-center items-center flex hover:cursor-pointer" @click="triggerFileInput" @drop.prevent="onDrop" @dragover.prevent>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 invert" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<input type="file" ref="fileInput" @change="onFileChange" multiple accept="image/png" class="hidden" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Modal from '@/components/utilities/Modal.vue'
|
||||
import { ref, watch } from 'vue'
|
||||
|
||||
interface SpriteImage {
|
||||
url: string
|
||||
offset: {
|
||||
x: number
|
||||
y: number
|
||||
}
|
||||
}
|
||||
|
||||
interface Props {
|
||||
modelValue: SpriteImage[]
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
modelValue: () => []
|
||||
})
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:modelValue', value: SpriteImage[]): void
|
||||
(e: 'close'): void
|
||||
(e: 'tempOffsetChange', index: number, offset: { x: number; y: number }): void
|
||||
}>()
|
||||
|
||||
const fileInput = ref<HTMLInputElement | null>(null)
|
||||
const draggedIndex = ref<number | null>(null)
|
||||
const selectedImageIndex = ref<number | null>(null)
|
||||
const tempOffset = ref({ x: 0, y: 0 })
|
||||
|
||||
const triggerFileInput = () => {
|
||||
fileInput.value?.click()
|
||||
}
|
||||
|
||||
const onFileChange = (event: Event) => {
|
||||
const target = event.target as HTMLInputElement
|
||||
if (target.files) {
|
||||
handleFiles(target.files)
|
||||
}
|
||||
}
|
||||
|
||||
const onDrop = (event: DragEvent) => {
|
||||
if (event.dataTransfer?.files) {
|
||||
handleFiles(event.dataTransfer.files)
|
||||
}
|
||||
}
|
||||
|
||||
const handleFiles = (files: FileList) => {
|
||||
Array.from(files).forEach((file) => {
|
||||
if (!file.type.startsWith('image/')) {
|
||||
return
|
||||
}
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onload = (e) => {
|
||||
if (typeof e.target?.result === 'string') {
|
||||
const newImage: SpriteImage = {
|
||||
url: e.target.result,
|
||||
offset: { x: 0, y: 0 }
|
||||
}
|
||||
updateImages([...props.modelValue, newImage])
|
||||
}
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
})
|
||||
}
|
||||
|
||||
const updateImages = (newImages: SpriteImage[]) => {
|
||||
emit('update:modelValue', newImages)
|
||||
}
|
||||
|
||||
const deleteImage = (index: number) => {
|
||||
const newImages = [...props.modelValue]
|
||||
newImages.splice(index, 1)
|
||||
updateImages(newImages)
|
||||
}
|
||||
|
||||
const dragStart = (event: DragEvent, index: number) => {
|
||||
draggedIndex.value = index
|
||||
if (event.dataTransfer) {
|
||||
event.dataTransfer.effectAllowed = 'move'
|
||||
event.dataTransfer.dropEffect = 'move'
|
||||
}
|
||||
}
|
||||
|
||||
const drop = (event: DragEvent, dropIndex: number) => {
|
||||
event.preventDefault()
|
||||
if (draggedIndex.value !== null && draggedIndex.value !== dropIndex) {
|
||||
const newImages = [...props.modelValue]
|
||||
const [reorderedItem] = newImages.splice(draggedIndex.value, 1)
|
||||
newImages.splice(dropIndex, 0, reorderedItem)
|
||||
updateImages(newImages)
|
||||
}
|
||||
draggedIndex.value = null
|
||||
}
|
||||
|
||||
const openOffsetModal = (index: number) => {
|
||||
selectedImageIndex.value = index
|
||||
tempOffset.value = { ...props.modelValue[index].offset }
|
||||
}
|
||||
|
||||
const closeOffsetModal = () => {
|
||||
selectedImageIndex.value = null
|
||||
}
|
||||
|
||||
const saveOffset = (index: number) => {
|
||||
const newImages = [...props.modelValue]
|
||||
newImages[index] = {
|
||||
...newImages[index],
|
||||
offset: { ...tempOffset.value }
|
||||
}
|
||||
updateImages(newImages)
|
||||
closeOffsetModal()
|
||||
}
|
||||
|
||||
const onOffsetChange = () => {
|
||||
if (selectedImageIndex.value !== null) {
|
||||
emit('tempOffsetChange', selectedImageIndex.value, tempOffset.value)
|
||||
}
|
||||
}
|
||||
|
||||
watch(tempOffset, onOffsetChange, { deep: true })
|
||||
|
||||
const imageDimensions = ref<{ [key: number]: { width: number; height: number } }>({})
|
||||
|
||||
const updateImageDimensions = (event: Event, index: number) => {
|
||||
const img = event.target as HTMLImageElement
|
||||
imageDimensions.value[index] = {
|
||||
width: img.naturalWidth,
|
||||
height: img.naturalHeight
|
||||
}
|
||||
}
|
||||
</script>
|
@ -1,151 +0,0 @@
|
||||
<template>
|
||||
<Modal :is-modal-open="isModalOpen" :modal-width="700" :modal-height="330" bg-style="none" @modal:close="closeModal">
|
||||
<template #modalHeader>
|
||||
<h3 class="m-0 font-medium shrink-0 text-white">View sprite</h3>
|
||||
</template>
|
||||
<template #modalBody>
|
||||
<div class="m-4 flex gap-8">
|
||||
<div class="relative">
|
||||
<div
|
||||
class="sprite-container bg-gray-800"
|
||||
:style="{
|
||||
width: `${maxWidth}px`,
|
||||
height: `${maxHeight}px`,
|
||||
position: 'relative',
|
||||
overflow: 'hidden'
|
||||
}"
|
||||
>
|
||||
<img
|
||||
v-for="(sprite, index) in spritesWithTempOffset"
|
||||
:key="index"
|
||||
:src="sprite.url"
|
||||
alt="Sprite"
|
||||
:style="{
|
||||
position: 'absolute',
|
||||
left: `${sprite.offset?.x || 0}px`,
|
||||
bottom: `${sprite.offset?.y || 0}px`,
|
||||
display: currentFrame === index ? 'block' : 'none',
|
||||
transform: `scale(${zoomLevel / 100})`,
|
||||
transformOrigin: 'bottom left'
|
||||
}"
|
||||
@load="updateContainerSize"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col justify-center gap-8 flex-1">
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-2 text-white">Frame Rate: {{ frameRate }} FPS (Duration: {{ totalDuration }}s)</label>
|
||||
<input type="range" v-model.number="localFrameRate" min="0" max="60" step="1" class="w-full accent-cyan-500" @input="updateFrameRate" />
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-2 text-white">Frame: {{ currentFrame + 1 }} of {{ sprites.length }}</label>
|
||||
<input type="range" v-model.number="currentFrame" :min="0" :max="sprites.length - 1" step="1" class="w-full accent-cyan-500" @input="stopAnimation" />
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<label class="block mb-2 text-white">Zoom: {{ zoomLevel }}%</label>
|
||||
<input type="range" v-model.number="zoomLevel" min="10" max="200" step="10" class="w-full accent-cyan-500" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { SpriteImage } from '@/application/types'
|
||||
import Modal from '@/components/utilities/Modal.vue'
|
||||
import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
|
||||
|
||||
const props = defineProps<{
|
||||
sprites: SpriteImage[]
|
||||
frameRate: number
|
||||
isModalOpen?: boolean
|
||||
tempOffsetIndex?: number
|
||||
tempOffset?: { x: number; y: number }
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:frameRate', value: number): void
|
||||
(e: 'update:isModalOpen', value: boolean): void
|
||||
}>()
|
||||
|
||||
const currentFrame = ref(0)
|
||||
const maxWidth = ref(250)
|
||||
const maxHeight = ref(250)
|
||||
const localFrameRate = ref(props.frameRate)
|
||||
const zoomLevel = ref(100)
|
||||
let animationInterval: number | null = null
|
||||
|
||||
const totalDuration = computed(() => {
|
||||
if (props.frameRate <= 0) return 0
|
||||
return (props.sprites.length / props.frameRate).toFixed(2)
|
||||
})
|
||||
|
||||
const spritesWithTempOffset = computed(() => {
|
||||
return props.sprites.map((sprite, index) => {
|
||||
if (index === props.tempOffsetIndex && props.tempOffset) {
|
||||
return { ...sprite, offset: props.tempOffset }
|
||||
}
|
||||
return sprite
|
||||
})
|
||||
})
|
||||
|
||||
function updateContainerSize(event: Event) {
|
||||
const img = event.target as HTMLImageElement
|
||||
maxWidth.value = Math.max(maxWidth.value, img.naturalWidth)
|
||||
maxHeight.value = Math.max(maxHeight.value, img.naturalHeight)
|
||||
}
|
||||
|
||||
function updateAnimation() {
|
||||
stopAnimation()
|
||||
if (props.frameRate <= 0 || props.sprites.length === 0) {
|
||||
currentFrame.value = 0
|
||||
return
|
||||
}
|
||||
|
||||
animationInterval = window.setInterval(() => {
|
||||
currentFrame.value = (currentFrame.value + 1) % props.sprites.length
|
||||
}, 1000 / props.frameRate)
|
||||
}
|
||||
|
||||
function stopAnimation() {
|
||||
if (animationInterval) {
|
||||
clearInterval(animationInterval)
|
||||
animationInterval = null
|
||||
}
|
||||
}
|
||||
|
||||
function updateFrameRate() {
|
||||
emit('update:frameRate', localFrameRate.value)
|
||||
}
|
||||
|
||||
function closeModal() {
|
||||
emit('update:isModalOpen', false)
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.frameRate,
|
||||
(newValue) => {
|
||||
localFrameRate.value = newValue
|
||||
updateAnimation()
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
watch(() => props.sprites, updateAnimation, { immediate: true })
|
||||
|
||||
onMounted(() => {
|
||||
updateAnimation()
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
stopAnimation()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.sprite-container {
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
</style>
|
@ -235,6 +235,10 @@ onUnmounted(() => {
|
||||
mapEditor.reset()
|
||||
})
|
||||
|
||||
setInterval(() => {
|
||||
scene.children.queueDepthSort()
|
||||
}, 0.2)
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
removeEventListener('keydown', handleKeyDown)
|
||||
})
|
||||
|
@ -7,7 +7,7 @@
|
||||
:placedMapObject="previewPlacedMapObject as PlacedMapObjectT"
|
||||
/>
|
||||
<SelectedPlacedMapObjectComponent v-if="mapEditor.selectedPlacedObject.value" :key="mapEditor.selectedPlacedObject.value.id" :map :placedMapObject="mapEditor.selectedPlacedObject.value" @move="moveMapObject" @rotate="rotatePlacedMapObject" @delete="deletePlacedMapObject" />
|
||||
<PlacedMapObject v-for="placedMapObject in mapEditor.currentMap.value?.placedMapObjects" :tileMap :tileMapLayer :placedMapObject @pointerdown="clickPlacedMapObject(placedMapObject)" />
|
||||
<PlacedMapObject v-for="placedMapObject in mapEditor.currentMap.value?.placedMapObjects" :tileMap :tileMapLayer :placedMapObject @pointerdown="clickPlacedMapObject(placedMapObject)" :key="`${placedMapObject.id}-${placedMapObjectKey}`" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -26,6 +26,7 @@ import TilemapLayer = Phaser.Tilemaps.TilemapLayer
|
||||
const scene = useScene()
|
||||
const mapEditor = useMapEditorComposable()
|
||||
const map = computed(() => mapEditor.currentMap.value!)
|
||||
const placedMapObjectKey = computed(() => mapEditor.refreshMapObject.value)
|
||||
|
||||
const emit = defineEmits<{ (e: 'update', map: MapT): void; (e: 'updateAndCommit', map: MapT): void; (e: 'pauseObjectTracking'): void; (e: 'resumeObjectTracking'): void }>()
|
||||
|
||||
|
@ -1,22 +0,0 @@
|
||||
<template>
|
||||
<div class="mb-4 flex flex-col gap-3">
|
||||
<div @click="toggle" class="p-3 bg-gray-300 bg-opacity-50 rounded hover:bg-gray-400 text-white font-default cursor-pointer">
|
||||
<slot name="header" />
|
||||
</div>
|
||||
<transition enter-active-class="transition-all duration-300 ease-in-out" leave-active-class="transition-all duration-300 ease-in-out" enter-from-class="opacity-0 max-h-0" enter-to-class="opacity-100 max-h-96" leave-from-class="opacity-100 max-h-96" leave-to-class="opacity-0 max-h-0">
|
||||
<div v-if="isOpen" class="overflow-hidden">
|
||||
<slot name="content" />
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
|
||||
const isOpen = ref(false)
|
||||
|
||||
const toggle = () => {
|
||||
isOpen.value = !isOpen.value
|
||||
}
|
||||
</script>
|
@ -62,8 +62,8 @@ export function createTileArray(width: number, height: number, tile: string = 'b
|
||||
return Array.from({ length: height }, () => Array.from({ length: width }, () => tile))
|
||||
}
|
||||
|
||||
export const calculateIsometricDepth = (positionX: number, positionY: number, pivotPoints: { x: number; y: number }[] = []) => {
|
||||
return Math.max(positionX + positionY)
|
||||
export const calculateIsometricDepth = (positionX: number, positionY: number) => {
|
||||
return positionX + positionY
|
||||
}
|
||||
|
||||
async function loadTileTextures(tiles: TileT[], scene: Phaser.Scene) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user