noxious/client
3
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added logic that allows socket events to exist in sub directories, moved said events for better DX, added logics for tile management (upload & read), started working on (zone) object logics too

Browse Source
This commit is contained in:
Dennis Postma 2024-06-22 21:00:30 +02:00
parent 98e9ae1a80
commit 4372dc5430
7 changed files with 190 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

172
package-lock.json generated
View File

@ -11,6 +11,7 @@
"@vueuse/core": "^10.9.0", "@vueuse/core": "^10.9.0",
"@vueuse/integrations": "^10.10.0", "@vueuse/integrations": "^10.10.0",
"axios": "^1.6.8", "axios": "^1.6.8",
"jszip": "^3.10.1",
"phaser": "^3.80.1", "phaser": "^3.80.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"socket.io-client": "^4.7.5", "socket.io-client": "^4.7.5",
@ -1774,9 +1775,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "20.14.6", "version": "20.14.8",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.6.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.8.tgz",
"integrity": "sha512-JbA0XIJPL1IiNnU7PFxDXyfAwcwVVrOoqyzzyQTyMeVhBzkJVMSkC1LlVsRQ2lpqiY4n6Bb9oCS6lzDKVQxbZw==", "integrity": "sha512-DO+2/jZinXfROG7j7WKFn/3C6nFwxy2lLpgLjEXJz+0XKphZlTLJ14mo8Vfg8X5BWN6XjyESXq+LcYdT7tR3bA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
@ -2136,33 +2137,30 @@
} }
}, },
"node_modules/@volar/language-core": { "node_modules/@volar/language-core": {
"version": "2.3.0", "version": "2.3.1",
"resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.3.0.tgz", "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.3.1.tgz",
"integrity": "sha512-pvhL24WUh3VDnv7Yw5N1sjhPtdx7q9g+Wl3tggmnkMcyK8GcCNElF2zHiKznryn0DiUGk+eez/p2qQhz+puuHw==", "integrity": "sha512-25CZ3ulM6jWgQsPQjKb7maKDlryvXWvsl7ytw4uj1Yyy17BgdiTWqMuNSxIODC3+/7IBOOGYoINC/1OOLACLLw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@volar/source-map": "2.3.0" "@volar/source-map": "2.3.1"
} }
}, },
"node_modules/@volar/source-map": { "node_modules/@volar/source-map": {
"version": "2.3.0", "version": "2.3.1",
"resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.3.0.tgz", "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.3.1.tgz",
"integrity": "sha512-G/228aZjAOGhDjhlyZ++nDbKrS9uk+5DMaEstjvzglaAw7nqtDyhnQAsYzUg6BMP9BtwZ59RIw5HGePrutn00Q==", "integrity": "sha512-fU3IL19wRy5S5OaGq67ejSl+/xdMuOHgp9Rsp3OiOhLyg25CctLYDdGZ9Y3+MJ1iqTLDh94PdvdR1BZX6I0hNQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT"
"dependencies": {
"muggle-string": "^0.4.0"
}
}, },
"node_modules/@volar/typescript": { "node_modules/@volar/typescript": {
"version": "2.3.0", "version": "2.3.1",
"resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.3.0.tgz", "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.3.1.tgz",
"integrity": "sha512-PtUwMM87WsKVeLJN33GSTUjBexlKfKgouWlOUIv7pjrOnTwhXHZNSmpc312xgXdTjQPpToK6KXSIcKu9sBQ5LQ==", "integrity": "sha512-OrUV6dYt/1h92+aWElexra6dp++gF/IEddvwyxeobyYfKAoKDUMsWU0iJCj0clZlfdyYaLmNEAkulJlVimxnOw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@volar/language-core": "2.3.0", "@volar/language-core": "2.3.1",
"path-browserify": "^1.0.1", "path-browserify": "^1.0.1",
"vscode-uri": "^3.0.8" "vscode-uri": "^3.0.8"
} }
@ -2302,14 +2300,14 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/@vue/devtools-core": { "node_modules/@vue/devtools-core": {
"version": "7.3.2", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/@vue/devtools-core/-/devtools-core-7.3.2.tgz", "resolved": "https://registry.npmjs.org/@vue/devtools-core/-/devtools-core-7.3.3.tgz",
"integrity": "sha512-WJ0VQJ+zIiS5Q0k7AEPXsFStdOnZY+Eg7vbFiMHq3Z2glfyJWVrBljJU2mOxPYHdqS/ok7z0dZSMP8gotY+1OA==", "integrity": "sha512-i6Bwkx4OwfY0QVHjAdsivhlzZ2HMj7fbNRYJsWspQ+dkA1f3nTzycPqZmVUsm2TGkbQlhTMhCAdDoP97JKoc+g==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/devtools-kit": "^7.3.2", "@vue/devtools-kit": "^7.3.3",
"@vue/devtools-shared": "^7.3.2", "@vue/devtools-shared": "^7.3.3",
"mitt": "^3.0.1", "mitt": "^3.0.1",
"nanoid": "^3.3.4", "nanoid": "^3.3.4",
"pathe": "^1.1.2", "pathe": "^1.1.2",
@ -2317,13 +2315,13 @@
} }
}, },
"node_modules/@vue/devtools-kit": { "node_modules/@vue/devtools-kit": {
"version": "7.3.2", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.3.2.tgz", "resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.3.3.tgz",
"integrity": "sha512-ba60JnbeLPzhfF5j0BPDGn9q5Ma9dWUV5gtVNjD+zm5uRf7LW8saAGNRnxxkRA56HZFzSAnXRGADc7YMAdrm0w==", "integrity": "sha512-m+dFI57BrzKYPKq73mt4CJ5GWld5OLBseLHPHGVP7CaILNY9o1gWVJWAJeF8XtQ9LTiMxZSaK6NcBsFuxAhD0g==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/devtools-shared": "^7.3.2", "@vue/devtools-shared": "^7.3.3",
"birpc": "^0.2.17", "birpc": "^0.2.17",
"hookable": "^5.5.3", "hookable": "^5.5.3",
"mitt": "^3.0.1", "mitt": "^3.0.1",
@ -2333,9 +2331,9 @@
} }
}, },
"node_modules/@vue/devtools-shared": { "node_modules/@vue/devtools-shared": {
"version": "7.3.2", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.3.2.tgz", "resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.3.3.tgz",
"integrity": "sha512-RpYfqStbzljD6zf9LPXF2T7kM3fMfepxJB5yjzyloFel5nEB49DUm4TeA426IH+hKvwjjRorZyh6CT1cG/H2Vw==", "integrity": "sha512-JQTVDM1WE4RRAsHTZvAB7+jczdHcbHgNUU/MWSIx5sV7FzCmnyWETPQ7K4/Y477weqT5xbybtBaK/OpzdaCiBQ==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
@ -3170,6 +3168,12 @@
"url": "https://github.com/sponsors/mesqueeb" "url": "https://github.com/sponsors/mesqueeb"
} }
}, },
"node_modules/core-util-is": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
"integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
"license": "MIT"
},
"node_modules/cross-fetch": { "node_modules/cross-fetch": {
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.0.0.tgz", "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.0.0.tgz",
@ -3440,9 +3444,9 @@
} }
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.4.806", "version": "1.4.810",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.806.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.810.tgz",
"integrity": "sha512-nkoEX2QIB8kwCOtvtgwhXWy2IHVcOLQZu9Qo36uaGB835mdX/h8uLRlosL6QIhLVUnAiicXRW00PwaPZC74Nrg==", "integrity": "sha512-Kaxhu4T7SJGpRQx99tq216gCq2nMxJo+uuT6uzz9l8TVN2stL7M06MIIXAtr9jsrLs2Glflgf2vMQRepxawOdQ==",
"dev": true, "dev": true,
"license": "ISC" "license": "ISC"
}, },
@ -4358,6 +4362,12 @@
"node": ">= 4" "node": ">= 4"
} }
}, },
"node_modules/immediate": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
"integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
"license": "MIT"
},
"node_modules/immutable": { "node_modules/immutable": {
"version": "4.3.6", "version": "4.3.6",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz", "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz",
@ -4408,7 +4418,6 @@
"version": "2.0.4", "version": "2.0.4",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
"integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
"dev": true,
"license": "ISC" "license": "ISC"
}, },
"node_modules/ini": { "node_modules/ini": {
@ -4568,6 +4577,12 @@
"url": "https://github.com/sponsors/sindresorhus" "url": "https://github.com/sponsors/sindresorhus"
} }
}, },
"node_modules/isarray": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
"integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
"license": "MIT"
},
"node_modules/isexe": { "node_modules/isexe": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@ -4777,6 +4792,18 @@
"node": ">= 10.0.0" "node": ">= 10.0.0"
} }
}, },
"node_modules/jszip": {
"version": "3.10.1",
"resolved": "https://registry.npmjs.org/jszip/-/jszip-3.10.1.tgz",
"integrity": "sha512-xXDvecyTpGLrqFrvkrUSoxxfJI5AH7U8zxxtVclpsUtMCq4JQ290LY8AW5c7Ggnr/Y/oK+bQMbqK2qmtk3pN4g==",
"license": "(MIT OR GPL-3.0-or-later)",
"dependencies": {
"lie": "~3.3.0",
"pako": "~1.0.2",
"readable-stream": "~2.3.6",
"setimmediate": "^1.0.5"
}
},
"node_modules/keyv": { "node_modules/keyv": {
"version": "4.5.4", "version": "4.5.4",
"resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz", "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
@ -4808,6 +4835,15 @@
"node": ">= 0.8.0" "node": ">= 0.8.0"
} }
}, },
"node_modules/lie": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
"integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
"license": "MIT",
"dependencies": {
"immediate": "~3.0.5"
}
},
"node_modules/local-pkg": { "node_modules/local-pkg": {
"version": "0.5.0", "version": "0.5.0",
"resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.5.0.tgz", "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-0.5.0.tgz",
@ -5020,13 +5056,6 @@
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/muggle-string": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz",
"integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==",
"dev": true,
"license": "MIT"
},
"node_modules/mustache": { "node_modules/mustache": {
"version": "4.2.0", "version": "4.2.0",
"resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz", "resolved": "https://registry.npmjs.org/mustache/-/mustache-4.2.0.tgz",
@ -5341,6 +5370,12 @@
"dev": true, "dev": true,
"license": "BlueOak-1.0.0" "license": "BlueOak-1.0.0"
}, },
"node_modules/pako": {
"version": "1.0.11",
"resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
"integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==",
"license": "(MIT AND Zlib)"
},
"node_modules/papaparse": { "node_modules/papaparse": {
"version": "5.4.1", "version": "5.4.1",
"resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.4.1.tgz", "resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.4.1.tgz",
@ -5710,6 +5745,12 @@
"url": "https://github.com/chalk/ansi-styles?sponsor=1" "url": "https://github.com/chalk/ansi-styles?sponsor=1"
} }
}, },
"node_modules/process-nextick-args": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
"integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
"license": "MIT"
},
"node_modules/proto-list": { "node_modules/proto-list": {
"version": "1.2.4", "version": "1.2.4",
"resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz", "resolved": "https://registry.npmjs.org/proto-list/-/proto-list-1.2.4.tgz",
@ -5789,6 +5830,21 @@
"node": "^14.17.0 || ^16.13.0 || >=18.0.0" "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
} }
}, },
"node_modules/readable-stream": {
"version": "2.3.8",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
"integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
"license": "MIT",
"dependencies": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.3",
"isarray": "~1.0.0",
"process-nextick-args": "~2.0.0",
"safe-buffer": "~5.1.1",
"string_decoder": "~1.1.1",
"util-deprecate": "~1.0.1"
}
},
"node_modules/readdirp": { "node_modules/readdirp": {
"version": "3.6.0", "version": "3.6.0",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
@ -5987,6 +6043,12 @@
"queue-microtask": "^1.2.2" "queue-microtask": "^1.2.2"
} }
}, },
"node_modules/safe-buffer": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
"integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
"license": "MIT"
},
"node_modules/safer-buffer": { "node_modules/safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
@ -6038,6 +6100,12 @@
"node": ">=10" "node": ">=10"
} }
}, },
"node_modules/setimmediate": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
"integrity": "sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA==",
"license": "MIT"
},
"node_modules/shebang-command": { "node_modules/shebang-command": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@ -6177,6 +6245,15 @@
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },
"node_modules/string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"license": "MIT",
"dependencies": {
"safe-buffer": "~5.1.0"
}
},
"node_modules/string-width": { "node_modules/string-width": {
"version": "5.1.2", "version": "5.1.2",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz", "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
@ -6632,7 +6709,6 @@
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
"integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
"dev": true,
"license": "MIT" "license": "MIT"
}, },
"node_modules/vite": { "node_modules/vite": {
@ -6760,15 +6836,15 @@
} }
}, },
"node_modules/vite-plugin-vue-devtools": { "node_modules/vite-plugin-vue-devtools": {
"version": "7.3.2", "version": "7.3.3",
"resolved": "https://registry.npmjs.org/vite-plugin-vue-devtools/-/vite-plugin-vue-devtools-7.3.2.tgz", "resolved": "https://registry.npmjs.org/vite-plugin-vue-devtools/-/vite-plugin-vue-devtools-7.3.3.tgz",
"integrity": "sha512-ysFbLOZrTfdk+jcQzwL3vv1wNaBXxBbY3Ux0eD88adZzdrpQ/AT8ZlepWJCJ6JWsZjjU5yC/7N9s9uXD7+PQiQ==", "integrity": "sha512-LWOCjArhHaSJ/rzInFkCnEccUB/F1sxyof0govFPpUeglq3CLnkP7bj55bQAixwYBN2pwK9DmDidcXXrX6QVFw==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/devtools-core": "^7.3.2", "@vue/devtools-core": "^7.3.3",
"@vue/devtools-kit": "^7.3.2", "@vue/devtools-kit": "^7.3.3",
"@vue/devtools-shared": "^7.3.2", "@vue/devtools-shared": "^7.3.3",
"execa": "^8.0.1", "execa": "^8.0.1",
"sirv": "^2.0.4", "sirv": "^2.0.4",
"vite-plugin-inspect": "^0.8.4", "vite-plugin-inspect": "^0.8.4",

1
package.json
View File

@ -18,6 +18,7 @@
"@vueuse/core": "^10.9.0", "@vueuse/core": "^10.9.0",
"@vueuse/integrations": "^10.10.0", "@vueuse/integrations": "^10.10.0",
"axios": "^1.6.8", "axios": "^1.6.8",
"jszip": "^3.10.1",
"phaser": "^3.80.1", "phaser": "^3.80.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"socket.io-client": "^4.7.5", "socket.io-client": "^4.7.5",

3
src/assets/scss/_variables.scss
View File

@ -12,6 +12,9 @@ $blue-gray: #778899;
$cyan: #368f8b; $cyan: #368f8b;
$dark-cyan: #376362; $dark-cyan: #376362;
$light-cyan: #00b3b3; $light-cyan: #00b3b3;
$bordeaux: #800020;
$dark-bordeaux: #4c0000;
$light-bordeaux: #cc0033;
$green: #09ad19; $green: #09ad19;
// Fonts // Fonts

13
src/assets/scss/main.scss
View File

@ -79,11 +79,22 @@ button {
border-radius: 5px; border-radius: 5px;
text-shadow: 0 3px 6px rgba($black, 0.2); text-shadow: 0 3px 6px rgba($black, 0.2);
&:hover { &.active, &:hover {
background-color: $cyan; background-color: $cyan;
} }
} }
&.btn-bordeaux {
background-color: rgba($bordeaux, 0.5);
border: 1px solid $white;
border-radius: 5px;
text-shadow: 0 3px 6px rgba($black, 0.2);
&.active, &:hover {
background-color: $bordeaux;
}
}
&:hover { &:hover {
cursor: pointer; cursor: pointer;
} }

19
src/components/utilities/GmPanel.vue
View File

@ -1,11 +1,14 @@
<template> <template>
<Modal :isModalOpen="true" :modal-width="800" :modal-height="650"> <Modal :isModalOpen="true" :modal-width="1000" :modal-height="650">
<template #modalHeader> <template #modalHeader>
<h3 class="modal-title">GM Panel</h3> <h3 class="modal-title">GM Panel</h3>
<div class="gm-selector"> <div class="gm-selector">
<button class="btn-cyan" @click="toggle = 'asset-manager'">Asset Manager</button> <button class="btn-cyan">General</button>
<button class="btn-cyan" >Button 2</button> <button class="btn-cyan">Users</button>
<button class="btn-cyan" >Button 3</button> <button class="btn-cyan">Items</button>
<button class="btn-cyan">NPCs</button>
<button class="btn-cyan">Chats</button>
<button class="btn-cyan active">AM</button>
</div> </div>
</template> </template>
<template #modalBody> <template #modalBody>
@ -19,24 +22,20 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue' import { ref } from 'vue'
import Modal from '@/components/utilities/Modal.vue' import Modal from '@/components/utilities/Modal.vue'
import AssetManager from '@/components/utilities/AssetManager/AssetManager.vue' import AssetManager from '@/components/utilities/assetManager/AssetManager.vue'
let toggle = ref('asset-manager'); let toggle = ref('asset-manager');
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
@import '@/assets/scss/main'; @import '@/assets/scss/main';
.gm-selector { .gm-selector {
display: flex; display: flex;
gap: 5px; gap: 5px;
align-self: end;
button { button {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom: none;
padding: 6px 15px; padding: 6px 15px;
min-width: 100px; min-width: 100px;
} }

66
src/components/utilities/AssetManager/AssetManager.vue → src/components/utilities/assetManager/AssetManager.vue
View File

@ -1,13 +1,13 @@
<template> <template>
<div class="assets-container"> <div class="assets-container">
<div class="asset-categories"> <div class="asset-categories">
<!-- TODO: Asset categories, replace with loop -->
<a class="category"> <!-- Asset Categories -->
<a class="category selected">
<span class="category-name">Tiles</span> <span class="category-name">Tiles</span>
</a> </a>
<!-- Example selected category --> <a class="category">
<a class="category selected"> <span class="category-name">Objects</span>
<span class="category-name">Walls</span>
</a> </a>
<a class="category"> <a class="category">
<span class="category-name">Weapons</span> <span class="category-name">Weapons</span>
@ -17,46 +17,42 @@
</a> </a>
</div> </div>
<!-- TODO: Show content based on selected category, replace with loop --> <!-- Assets -->
<div class="assets tiles"> <div class="assets active">
<a class="asset">
<span class="asset-name">Upload new</span>
<input ref="tileUploadField" type="file" accept="image/png" multiple @change="handleFileUpload" />
</a>
<a class="asset">
<span class="asset-name" v-for="(tile, index) in tiles" :key="index">{{ tile }}</span>
</a>
</div> </div>
<!-- Example selected category & asset --> <div class="assets">
<div class="assets walls active">
<a class="asset selected"> <a class="asset selected">
<span class="asset-name">Wall #1</span> <span class="asset-name">Wall #1</span>
</a> </a>
</div> </div>
<div class="assets weapons"> <div class="assets">
</div> </div>
<div class="assets npcs"> <div class="assets">
</div> </div>
<div class="asset-info"> <div class="asset-info">
<div class="image-container"> <div class="image-container">
<img src="/assets/placeholders/wall-1.png"/> <img src="/assets/placeholders/wall-1.png" />
</div> </div>
<div class="modal-form asset-manager"> <div class="modal-form asset-manager">
<form class="form-fields"> <form class="form-fields">
<div class="form-field name"> <div class="form-field name">
<label for="name">Name</label> <label for="name">Name</label>
<input class="input-cyan" type="text" name="name" placeholder="Wall #1"> <input class="input-cyan" type="text" name="name" placeholder="Wall #1" />
</div>
<div class="form-field">
<label for="originX">OriginX</label>
<input class="input-cyan" type="number" name="originX" placeholder="0">
</div>
<div class="form-field">
<label for="originY">OriginY</label>
<input class="input-cyan" type="number" name="originY" placeholder="0">
</div> </div>
<div class="submit"> <div class="submit">
<button class="btn-cyan" type="submit">SAVE</button> <button class="btn-cyan" type="submit">Save</button>
<button class="btn-bordeaux" type="submit">Remove</button>
</div> </div>
</form> </form>
</div> </div>
@ -65,6 +61,24 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue'
import {useSocketStore} from '@/stores/socket'
const socket = useSocketStore()
const tileUploadField = ref(null)
const tiles = ref()
const handleFileUpload = (e: Event) => {
const files = (e.target as HTMLInputElement).files
if (!files) return
socket.connection.emit('gm:tile:upload', files)
}
onMounted(() => {
socket.connection.emit('gm:tile:list', {}, (response: string[]) => {
tiles.value = response
})
})
</script> </script>
<style lang="scss"> <style lang="scss">
@ -87,7 +101,7 @@
} }
.assets { .assets {
width: 25%; width: 35%;
display: none; display: none;
&.active { &.active {
display: flex; display: flex;

1
src/components/utilities/zoneEditor/Tiles.vue
View File

@ -21,6 +21,7 @@ import { ref, onMounted, nextTick } from 'vue'
import config from '@/config' import config from '@/config'
import Modal from '@/components/utilities/Modal.vue' import Modal from '@/components/utilities/Modal.vue'
import { useZoneEditorStore } from '@/stores/zoneEditor' import { useZoneEditorStore } from '@/stores/zoneEditor'
import JSZip from 'jszip'
const tileWidth = config.tile_size.x const tileWidth = config.tile_size.x
const tileHeight = config.tile_size.y const tileHeight = config.tile_size.y