From e389534e30c923708c28752c3e1b7636a06f8c9f Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Fri, 31 Jan 2025 22:33:45 +0100
Subject: [PATCH] npm run format
---
src/components/game/gui/Minimap.vue | 8 ++---
.../partials/sprite/SpriteDetails.vue | 29 +++++++++----------
.../sprite/partials/SpriteImagesInput.vue | 6 ++--
.../sprite/partials/SpritePreview.vue | 12 ++------
.../controls/useBaseControlsComposable.ts | 6 ++--
.../controls/useGameControlsComposable.ts | 2 +-
.../useMapEditorControlsComposable.ts | 2 +-
src/composables/useControlsComposable.ts | 7 ++---
8 files changed, 29 insertions(+), 43 deletions(-)
diff --git a/src/components/game/gui/Minimap.vue b/src/components/game/gui/Minimap.vue
index d3cefb4..35c8ecd 100644
--- a/src/components/game/gui/Minimap.vue
+++ b/src/components/game/gui/Minimap.vue
@@ -5,12 +5,12 @@
</div>
<div class="absolute -bottom-3 left-1/2 -translate-x-1/2 flex gap-1">
<button class="w-6 h-6 relative p-0">
- <img class="w-3 h-3 center-element" src="/assets/icons/plus-icon.svg" alt="Zoom-in button icon"/>
- <img class="w-full h-full" src="/assets/ui-elements/button-ui-box-textured.svg" alt=""/>
+ <img class="w-3 h-3 center-element" src="/assets/icons/plus-icon.svg" alt="Zoom-in button icon" />
+ <img class="w-full h-full" src="/assets/ui-elements/button-ui-box-textured.svg" alt="" />
</button>
<button class="w-6 h-6 relative p-0">
- <img class="w-3 h-3 center-element" src="/assets/icons/minus-icon.svg" alt="Zoom-out button icon"/>
- <img class="w-full h-full" src="/assets/ui-elements/button-ui-box-textured.svg" alt=""/>
+ <img class="w-3 h-3 center-element" src="/assets/icons/minus-icon.svg" alt="Zoom-out button icon" />
+ <img class="w-full h-full" src="/assets/ui-elements/button-ui-box-textured.svg" alt="" />
</button>
</div>
</div>
diff --git a/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue b/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
index 705af93..bffd251 100644
--- a/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
+++ b/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
@@ -48,23 +48,20 @@
<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)"
- />
+ <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"
+ <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>
@@ -199,9 +196,9 @@ function updateFrameRate(value: number) {
}
}
-const tempOffsetData = ref<{ index: number | undefined; offset: { x: number; y: number } | undefined }>({
- index: undefined,
- offset: undefined
+const tempOffsetData = ref<{ index: number | undefined; offset: { x: number; y: number } | undefined }>({
+ index: undefined,
+ offset: undefined
})
function handleTempOffsetChange(action: SpriteAction, index: number, offset: { x: number; y: number }) {
diff --git a/src/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue b/src/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue
index 96b6061..00d047c 100644
--- a/src/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue
+++ b/src/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue
@@ -2,9 +2,7 @@
<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="image.dimensions" class="absolute bottom-1 right-1 bg-black/50 text-white text-xs px-1 py-0.5 rounded transition-opacity font-default">
- {{ image.dimensions.width }}x{{ image.dimensions.height }}
- </div>
+ <div v-if="image.dimensions" class="absolute bottom-1 right-1 bg-black/50 text-white text-xs px-1 py-0.5 rounded transition-opacity font-default">{{ image.dimensions.width }}x{{ image.dimensions.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">
@@ -78,7 +76,7 @@ const props = withDefaults(defineProps<Props>(), {
const emit = defineEmits<{
(e: 'update:modelValue', value: SpriteImage[]): void
(e: 'close'): void
- (e: 'tempOffsetChange', index: number, offset: { x: number, y: number }): void
+ (e: 'tempOffsetChange', index: number, offset: { x: number; y: number }): void
}>()
const fileInput = ref<HTMLInputElement | null>(null)
diff --git a/src/components/gameMaster/assetManager/partials/sprite/partials/SpritePreview.vue b/src/components/gameMaster/assetManager/partials/sprite/partials/SpritePreview.vue
index c44e6ea..61bcc4e 100644
--- a/src/components/gameMaster/assetManager/partials/sprite/partials/SpritePreview.vue
+++ b/src/components/gameMaster/assetManager/partials/sprite/partials/SpritePreview.vue
@@ -39,15 +39,7 @@
</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"
- />
+ <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>
@@ -69,7 +61,7 @@ const props = defineProps<{
frameRate: number
isModalOpen?: boolean
tempOffsetIndex?: number
- tempOffset?: { x: number, y: number }
+ tempOffset?: { x: number; y: number }
}>()
const emit = defineEmits<{
diff --git a/src/composables/controls/useBaseControlsComposable.ts b/src/composables/controls/useBaseControlsComposable.ts
index 5651152..dce4312 100644
--- a/src/composables/controls/useBaseControlsComposable.ts
+++ b/src/composables/controls/useBaseControlsComposable.ts
@@ -32,8 +32,8 @@ export function useBaseControlsComposable(scene: Phaser.Scene, layer: Phaser.Til
if (Math.abs(deltaX) <= dragThreshold && Math.abs(deltaY) <= dragThreshold) return
- const scrollX = camera.scrollX - (deltaX / camera.zoom)
- const scrollY = camera.scrollY - (deltaY / camera.zoom)
+ const scrollX = camera.scrollX - deltaX / camera.zoom
+ const scrollY = camera.scrollY - deltaY / camera.zoom
camera.setScroll(scrollX, scrollY)
pointerStartPosition.value = { x: pointer.x, y: pointer.y }
@@ -66,4 +66,4 @@ export function useBaseControlsComposable(scene: Phaser.Scene, layer: Phaser.Til
handleZoom,
pointerStartPosition
}
-}
\ No newline at end of file
+}
diff --git a/src/composables/controls/useGameControlsComposable.ts b/src/composables/controls/useGameControlsComposable.ts
index 79e26d3..a79297d 100644
--- a/src/composables/controls/useGameControlsComposable.ts
+++ b/src/composables/controls/useGameControlsComposable.ts
@@ -1,7 +1,7 @@
import { getTile } from '@/composables/mapComposable'
import { useGameStore } from '@/stores/gameStore'
-import { useBaseControlsComposable } from './useBaseControlsComposable'
import type { Ref } from 'vue'
+import { useBaseControlsComposable } from './useBaseControlsComposable'
export function useGameControlsComposable(scene: Phaser.Scene, layer: Phaser.Tilemaps.TilemapLayer, waypoint: Ref<{ visible: boolean; x: number; y: number }>, camera: Phaser.Cameras.Scene2D.Camera) {
const gameStore = useGameStore()
diff --git a/src/composables/controls/useMapEditorControlsComposable.ts b/src/composables/controls/useMapEditorControlsComposable.ts
index 8c3afa4..c0db832 100644
--- a/src/composables/controls/useMapEditorControlsComposable.ts
+++ b/src/composables/controls/useMapEditorControlsComposable.ts
@@ -1,6 +1,6 @@
import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
-import { useBaseControlsComposable } from './useBaseControlsComposable'
import { computed, type Ref } from 'vue'
+import { useBaseControlsComposable } from './useBaseControlsComposable'
export function useMapEditorControlsComposable(scene: Phaser.Scene, layer: Phaser.Tilemaps.TilemapLayer, waypoint: Ref<{ visible: boolean; x: number; y: number }>, camera: Phaser.Cameras.Scene2D.Camera) {
const mapEditor = useMapEditorComposable()
diff --git a/src/composables/useControlsComposable.ts b/src/composables/useControlsComposable.ts
index 92cab72..2ce48fb 100644
--- a/src/composables/useControlsComposable.ts
+++ b/src/composables/useControlsComposable.ts
@@ -1,15 +1,14 @@
-import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
-import { computed, watch, type Ref } from 'vue'
import { useGameControlsComposable } from '@/composables/controls/useGameControlsComposable'
import { useMapEditorControlsComposable } from '@/composables/controls/useMapEditorControlsComposable'
-import { useGameStore } from '@/stores/gameStore'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
+import { computed, type Ref } from 'vue'
export function useControlsComposable(scene: Phaser.Scene, layer: Phaser.Tilemaps.TilemapLayer, waypoint: Ref<{ visible: boolean; x: number; y: number }>) {
const camera = scene.cameras.main
- const mapEditor = useMapEditorComposable()
const gameHandlers = useGameControlsComposable(scene, layer, waypoint, camera)
const mapEditorHandlers = useMapEditorControlsComposable(scene, layer, waypoint, camera)
+ const mapEditor = useMapEditorComposable()
const currentHandlers = computed(() => (mapEditor.active.value ? mapEditorHandlers : gameHandlers))
const setupControls = () => currentHandlers.value.setupControls()