Lint and format

frontend/components/LaneFilter.vue

@@ -1,67 +1,75 @@
 <script setup lang="ts">
-import { LANE_IMAGES, LANE_IMAGES_HOVER, LANE_IMAGES_SELECTED, POSITIONS_STR } from '~/utils/cdragon';
+import {
+  LANE_IMAGES,
+  LANE_IMAGES_HOVER,
+  LANE_IMAGES_SELECTED,
+  POSITIONS_STR
+} from '~/utils/cdragon'
 
 const emit = defineEmits<{
-    filterChange: [value: number]
+  filterChange: [value: number]
 }>()
 
-const laneImgs = Array(5).fill(ref("")).map((_, index) => ref(LANE_IMAGES[index]))
+const laneImgs = Array(5)
+  .fill(ref(''))
+  .map((_, index) => ref(LANE_IMAGES[index]))
 const laneFilter = ref(-1)
 
 function selectLaneFilter(index: number) {
-    // Unselect previous filter
-    if(laneFilter.value != -1) {
-        laneImgs[laneFilter.value].value = LANE_IMAGES[laneFilter.value]
+  // Unselect previous filter
+  if (laneFilter.value != -1) {
+    laneImgs[laneFilter.value].value = LANE_IMAGES[laneFilter.value]
 
-        // This is a deselection.
-        if(laneFilter.value == index) {
-            laneFilter.value = -1;
-            emit('filterChange', laneFilter.value)
-            return;
-        }
+    // This is a deselection.
+    if (laneFilter.value == index) {
+      laneFilter.value = -1
+      emit('filterChange', laneFilter.value)
+      return
     }
+  }
 
-    // Select new one
-    laneImgs[index].value = LANE_IMAGES_SELECTED[index]
-    laneFilter.value = index
-    emit('filterChange', laneFilter.value)
+  // Select new one
+  laneImgs[index].value = LANE_IMAGES_SELECTED[index]
+  laneFilter.value = index
+  emit('filterChange', laneFilter.value)
 }
 
 function handleMouseOut(laneImg: Ref<string>, index: number) {
-    if(laneImg.value == LANE_IMAGES_HOVER[index]) 
-        laneImg.value = LANE_IMAGES[index]
+  if (laneImg.value == LANE_IMAGES_HOVER[index]) laneImg.value = LANE_IMAGES[index]
 }
 function handleHover(laneImg: Ref<string>, index: number) {
-    if(laneImg.value == LANE_IMAGES[index])
-        laneImg.value = LANE_IMAGES_HOVER[index]
+  if (laneImg.value == LANE_IMAGES[index]) laneImg.value = LANE_IMAGES_HOVER[index]
 }
 </script>
 
 <template>
-<div style="width: fit-content;">
-    <NuxtImg v-for="(laneImg, index) in laneImgs"
-    format="webp"
-    :alt="POSITIONS_STR[index]"
-    class="lane-img" :src="laneImg.value" 
-    @mouseout="handleMouseOut(laneImg, index)"
-    @mouseover="handleHover(laneImg, index)"
-    @click="selectLaneFilter(index)"/>
-</div>
+  <div style="width: fit-content">
+    <NuxtImg
+      v-for="(laneImg, index) in laneImgs"
+      format="webp"
+      :alt="POSITIONS_STR[index]"
+      class="lane-img"
+      :src="laneImg.value"
+      @mouseout="handleMouseOut(laneImg, index)"
+      @mouseover="handleHover(laneImg, index)"
+      @click="selectLaneFilter(index)"
+    />
+  </div>
 </template>
 
 <style>
 .lane-img {
-    width: 64px;
-    margin-left: 5px;
-    margin-right: 5px;
+  width: 64px;
+  margin-left: 5px;
+  margin-right: 5px;
 }
 .lane-img:hover {
-    cursor: pointer;
+  cursor: pointer;
 }
 
 @media only screen and (max-width: 450px) {
-    .lane-img {
-        width: 48px;
-    }
+  .lane-img {
+    width: 48px;
+  }
 }
 </style>