From 3c06f7db97563397c943008ef5b88ca6b79fc9b7 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Wed, 5 Feb 2025 19:50:53 +0100
Subject: [PATCH] Loop fix, added btn-indigo to general styling

---
 src/assets/scss/main.scss                                | 9 +++++++++
 .../assetManager/partials/sprite/SpriteDetails.vue       | 2 +-
 .../mapEditor/partials/SelectedPlacedMapObject.vue       | 3 +++
 src/composables/useCharacterSpriteComposable.ts          | 4 ++--
 4 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss
index 6254f42..ff9d857 100644
--- a/src/assets/scss/main.scss
+++ b/src/assets/scss/main.scss
@@ -122,6 +122,15 @@ button {
     }
   }
 
+  &.btn-indigo {
+    @apply bg-indigo-500 text-gray-50 text-base leading-5 rounded py-2.5;
+
+    &.active,
+    &:hover {
+      @apply bg-indigo-600;
+    }
+  }
+
   &.btn-empty {
     @apply text-gray-50 border-2 border-solid border-gray-500 text-base leading-5 rounded py-2.5;
 
diff --git a/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue b/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
index bffd251..7c3d2d6 100644
--- a/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
+++ b/src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue
@@ -10,7 +10,7 @@
         <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>
-          <button class="btn bg-indigo-500 hover:bg-indigo-600 rounded text-white px-4 py-2 flex-1 sm:flex-none" type="button" @click.prevent="copySprite">
+          <button class="btn-indigo px-4 py-2 flex-1 sm:flex-none" type="button" @click.prevent="copySprite">
             <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
               <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>
diff --git a/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue b/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
index 3e146d1..d3740fb 100644
--- a/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
+++ b/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
@@ -4,6 +4,9 @@
       <button @mousedown.stop @click="handleDelete" class="btn-red py-1.5 px-4">
         <img src="/assets/icons/trashcan.svg" class="w-4 h-4" alt="Delete" />
       </button>
+      <button @mousedown.stop @click="handleDelete" class="btn-indigo py-1.5 px-4">
+        <img src="/assets/icons/mapEditor/gear.svg" class="w-4 h-4 invert" alt="Delete" />
+      </button>
       <button @mousedown.stop @click="handleRotate" class="btn-cyan py-1.5 px-4">Rotate</button>
       <button @mousedown.stop @click="handleMove" class="btn-cyan py-1.5 px-4 min-w-24">Move</button>
     </div>
diff --git a/src/composables/useCharacterSpriteComposable.ts b/src/composables/useCharacterSpriteComposable.ts
index ae93e98..69d36ad 100644
--- a/src/composables/useCharacterSpriteComposable.ts
+++ b/src/composables/useCharacterSpriteComposable.ts
@@ -59,7 +59,7 @@ export function useCharacterSpriteComposable(scene: Phaser.Scene, tilemap: Phase
     })
   }
 
-  const playAnimation = (animation: string, loop = false) => {
+  const playAnimation = (animation: string, loop = false, ignoreIfPlaying = true) => {
     if (!characterSprite.value || !characterSpriteId.value) return
 
     const fullAnimationName = `${characterSpriteId.value}-${animation}_${currentDirection.value}`
@@ -76,7 +76,7 @@ export function useCharacterSpriteComposable(scene: Phaser.Scene, tilemap: Phase
     characterSprite.value.anims.play({
       key: fullAnimationName,
       repeat: loop ? -1 : 0
-    })
+    }, ignoreIfPlaying)
   }
 
   const calcDirection = (oldPositionX: number, oldPositionY: number, newPositionX: number, newPositionY: number): Direction => {