optim

frontend/app/components/Sprite.vue

@@ -1,7 +1,7 @@
 <template>
 <img ref="sprite" v-show="loaded"
     class="sprite pixelated"
-    :src="frame_paths[0]" 
+    :src="props.path" 
     :width="props.width">
 </template>
 
@@ -10,39 +10,16 @@ import { ref, onMounted } from 'vue';
 
 const props = defineProps<{
   path: string,
-  frames: string,
   top?: string,
   right?: string,
   left?: string,
   bottom?: string,
-  width: string,
+  width: string
-  fps?: string
 }>();
 
 const sprite = ref(null);
 const loaded = ref(false);
 
-let frame_paths = [];
-for(let i = 1; i <= parseInt(props.frames); i++){
-    frame_paths.push(props.path + "frame" + i + ".png");
-}
-
-let current = 0;
-const fps = props.fps ? parseInt(props.fps) : 4;
-
-function preloadImages(imageArray) {
-  return Promise.all(
-    imageArray.map(src => {
-      return new Promise((resolve, reject) => {
-        const img = new Image();
-        img.src = src;
-        img.onload = resolve;
-        img.onerror = reject;
-      });
-    })
-  );
-}
-
 onMounted(() => {
     sprite.value.style.top = props.top;
     sprite.value.style.left = props.left;
@@ -50,14 +27,6 @@ onMounted(() => {
     sprite.value.style.right = props.right;
     
     loaded.value = true;
-    
-    preloadImages(frame_paths).then(() => {
-        setInterval(() => {
-            current = (current + 1) % frame_paths.length;
-            sprite.value.src = frame_paths[current];
-        }, 1000 / fps);
-    });
-    
 });
 </script>
 

frontend/app/components/parts/TableHeader.vue

@@ -11,7 +11,7 @@ import SiteOptions from './site_options/SiteOptions.vue';
         <div class="undertable">
             <h1>ARANROIG.COM</h1>
             <HeaderLinks></HeaderLinks>
-            <Sprite path="/sprites/alfadir/" frames="13" fps="6" top="-267px" left="-80px" width="1300"></Sprite> 
+            <Sprite path="/sprites/katlum/katlum.gif" top="-267px" left="-80px" width="1300"></Sprite> 
         </div>
         <div class="header-container">
             <SiteOptions></SiteOptions>