From 20d4167dd32f837d43767d71add5b573a3fa774d Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Thu, 25 Jul 2024 20:47:57 +0200
Subject: [PATCH] npm update, changes a few things regarding sprite logic
---
package-lock.json | 24 +++++------
.../partials/sprite/SpriteDetails.vue | 41 +++++++++++++------
src/types.ts | 1 +
3 files changed, 41 insertions(+), 25 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index f23ac5a..74593f7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3450,9 +3450,9 @@
}
},
"node_modules/electron-to-chromium": {
- "version": "1.5.0",
- "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.0.tgz",
- "integrity": "sha512-Vb3xHHYnLseK8vlMJQKJYXJ++t4u1/qJ3vykuVrVjvdiOEhYyT1AuP4x03G8EnPmYvYOhe9T+dADTmthjRQMkA==",
+ "version": "1.5.1",
+ "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.1.tgz",
+ "integrity": "sha512-FKbOCOQ5QRB3VlIbl1LZQefWIYwszlBloaXcY2rbfpu9ioJnNh3TK03YtIDKDo3WKBi8u+YV4+Fn2CkEozgf4w==",
"dev": true,
"license": "ISC"
},
@@ -6629,9 +6629,9 @@
}
},
"node_modules/tailwindcss": {
- "version": "3.4.6",
- "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.6.tgz",
- "integrity": "sha512-1uRHzPB+Vzu57ocybfZ4jh5Q3SdlH7XW23J5sQoM9LhE9eIOlzxer/3XPSsycvih3rboRsvt0QCmzSrqyOYUIA==",
+ "version": "3.4.7",
+ "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.7.tgz",
+ "integrity": "sha512-rxWZbe87YJb4OcSopb7up2Ba4U82BoiSGUdoDr3Ydrg9ckxFS/YWsvhN323GMcddgU65QRy7JndC7ahhInhvlQ==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -6949,9 +6949,9 @@
"license": "MIT"
},
"node_modules/vite": {
- "version": "5.3.4",
- "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.4.tgz",
- "integrity": "sha512-Cw+7zL3ZG9/NZBB8C+8QbQZmR54GwqIz+WMI4b3JgdYJvX+ny9AjJXqkGQlDXSXRP9rP0B4tbciRMOVEKulVOA==",
+ "version": "5.3.5",
+ "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.5.tgz",
+ "integrity": "sha512-MdjglKR6AQXQb9JGiS7Rc2wC6uMjcm7Go/NHNO63EwiJXfuk9PgqiP/n5IDJCziMkfw9n4Ubp7lttNwz+8ZVKA==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -7202,9 +7202,9 @@
}
},
"node_modules/vue-component-type-helpers": {
- "version": "2.0.28",
- "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.0.28.tgz",
- "integrity": "sha512-hoK0UsKXrXDY9zdpdk+drqOqYHpPhbmfQUJ2mFYK57+l73mQxcYyCteQsolllwGaxhWihT077+OA/FR5ZPTceg==",
+ "version": "2.0.29",
+ "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.0.29.tgz",
+ "integrity": "sha512-58i+ZhUAUpwQ+9h5Hck0D+jr1qbYl4voRt5KffBx8qzELViQ4XdT/Tuo+mzq8u63teAG8K0lLaOiL5ofqW38rg==",
"dev": true,
"license": "MIT"
},
diff --git a/src/components/utilities/assetManager/partials/sprite/SpriteDetails.vue b/src/components/utilities/assetManager/partials/sprite/SpriteDetails.vue
index a153919..3c1d895 100644
--- a/src/components/utilities/assetManager/partials/sprite/SpriteDetails.vue
+++ b/src/components/utilities/assetManager/partials/sprite/SpriteDetails.vue
@@ -63,11 +63,8 @@
<input v-model.number="action.frameHeight" class="input-cyan" type="number" step="any" name="frame-height" placeholder="Frame height" />
</div>
<div class="w-full flex mb-5 gap-2">
- <SpriteActionsInput v-model="action.spriteActions" />
- </div>
- <div v-if="action.base64">
- <div class="w-full h-px bg-cyan-200"></div>
- <img class="max-h-56" :src="`data:image/png;base64,${action.base64}`" />
+<!-- Component with images in base64 format, ordered -->
+ <SpriteActionsInput v-model="action.images" />
</div>
</form>
</template>
@@ -90,12 +87,7 @@ const assetManagerStore = useAssetManagerStore()
const selectedSprite = computed(() => assetManagerStore.selectedSprite)
const spriteName = ref('')
-
-type uploadSpriteAction = spriteAction & {
- base64?: string
-}
-
-const spriteActions = ref<uploadSpriteAction[]>([])
+const spriteActions = ref<spriteAction[]>([])
if (!selectedSprite.value) {
console.error('No sprite selected')
@@ -106,6 +98,12 @@ if (selectedSprite.value) {
spriteActions.value = selectedSprite.value.spriteActions
}
+function getSpriteActionImages(action: spriteAction) {
+ gameStore.connection?.emit('gm:sprite:images:list', { id: selectedSprite.value?.id }, (response: string[]) => {
+ action.images = response
+ })
+}
+
function removeSprite() {
gameStore.connection?.emit('gm:sprite:remove', { id: selectedSprite.value?.id }, (response: boolean) => {
if (!response) {
@@ -135,7 +133,18 @@ function saveSprite() {
const updatedSprite = {
id: selectedSprite.value.id,
name: spriteName.value,
- spriteActions: spriteActions.value
+ spriteActions: spriteActions.value.map((action) => {
+ return {
+ action: action.action,
+ origin_x: action.origin_x,
+ origin_y: action.origin_y,
+ frameSpeed: action.frameSpeed,
+ frameWidth: action.frameWidth,
+ frameHeight: action.frameHeight,
+ isAnimated: action.isAnimated,
+ isLooping: action.isLooping
+ }
+ })
}
gameStore.connection?.emit('gm:sprite:update', updatedSprite, (response: boolean) => {
@@ -150,8 +159,12 @@ function saveSprite() {
function addNewImage() {
if (!selectedSprite.value) return
+ function uuidv4() {
+ return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (c) => (+c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (+c / 4)))).toString(16))
+ }
+
const newImage: spriteAction = {
- id: Date.now().toString(), // Temporary ID, should be replaced by server-generated ID
+ id: uuidv4(), // Temporary ID, should be replaced by server-generated ID
action: 'new_action',
origin_x: 0,
origin_y: 0,
@@ -164,6 +177,8 @@ function addNewImage() {
isLooping: false
}
+ console.log(newImage)
+
// spriteimages value can be undefined
if (!spriteActions.value) {
spriteActions.value = []
diff --git a/src/types.ts b/src/types.ts
index 9021a47..fb378d5 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -168,6 +168,7 @@ export type spriteAction = {
frameWidth: number
frameHeight: number
frameSpeed: number
+ images?: string[]
}
export type Chat = {