FEAT: side A/B

server/api/boxes.ts

@@ -1,178 +1,71 @@
 import { eventHandler } from 'h3'
+import type { Box } from '~~/types/types'
+
+const boxes: Box[] = [
+  {
+    id: 'ES01',
+    type: 'compilation',
+    name: '...',
+    description: '...',
+    state: 'box-hidden',
+    duration: 3487 + 3773, // Somme des durées A et B
+    sides: {
+      A: {
+        name: '...',
+        description: '...',
+        duration: 3487,
+        color1: '#c7b3aa',
+        color2: '#000100'
+      },
+      B: {
+        name: '... B',
+        description: '...',
+        duration: 3773,
+        color1: '#f7dd01',
+        color2: '#010103'
+      }
+    },
+    activeSide: 'A'
+  },
+  {
+    id: 'ES00',
+    type: 'compilation',
+    name: 'manifeste',
+    description: 'Zero is for manifesto',
+    state: 'box-hidden',
+    duration: 2794 + 2470, // Somme des durées A et B
+    sides: {
+      A: {
+        name: 'manifeste',
+        description: 'Zero is for manifesto',
+        duration: 2794,
+        color1: '#ffffff',
+        color2: '#48959d'
+      },
+      B: {
+        name: 'manifeste B',
+        description: 'Even Zero has a b-side',
+        duration: 2470,
+        color1: '#0d01b9',
+        color2: '#3b7589'
+      }
+    },
+    activeSide: 'A'
+  },
+  {
+    id: 'ESPLAYLIST',
+    type: 'playlist',
+    name: 'playlists',
+    duration: 0,
+    description: '♠♦♣♥',
+    state: 'box-hidden',
+    activeSide: 'A'
+  }
+]
 
 export default eventHandler(() => {
-  const boxes = [
-    {
-      id: 'ES01B',
-      type: 'compilation',
-      name: '... B',
-      duration: 3773,
-      description: '...',
-      color1: '#f7dd01',
-      color2: '#010103',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES01A',
-      type: 'compilation',
-      name: '...',
-      duration: 3487,
-      description: '...',
-      color1: '#c7b3aa',
-      color2: '#000100',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES00B',
-      type: 'compilation',
-      name: 'manifeste B',
-      duration: 2470,
-      description: 'Even Zero has a b-side',
-      color1: '#0d01b9',
-      color2: '#3b7589',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES00A',
-      type: 'compilation',
-      name: 'manifeste',
-      duration: 2794,
-      description: 'Zero is for manifesto',
-      color1: '#ffffff',
-      color2: '#48959d',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2025',
-      type: 'playlist',
-      name: '2025',
-      duration: 0,
-      description: '🐍<i class="indice">🌳</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2024',
-      type: 'playlist',
-      name: '2024',
-      duration: 0,
-      description: '🐉<i class="indice">🌳</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2023',
-      type: 'playlist',
-      name: '2023',
-      duration: 0,
-      description: '🐇<i class="indice">💧</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2022',
-      type: 'playlist',
-      name: '2022',
-      duration: 0,
-      description: '🐅<i class="indice">💧</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2021',
-      type: 'playlist',
-      name: '2021',
-      duration: 0,
-      description: '🐃<i class="indice">🪙</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2020',
-      type: 'playlist',
-      name: '2020',
-      duration: 0,
-      description: '🐀<i class="indice">🪙</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2019',
-      type: 'playlist',
-      name: '2019',
-      duration: 0,
-      description: '🐖<i class="indice">🌱</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2018',
-      type: 'playlist',
-      name: '2018',
-      duration: 0,
-      description: '🐕<i class="indice">🌱</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2017',
-      type: 'playlist',
-      name: '2017',
-      duration: 0,
-      description: '🐓<i class="indice">🔥</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2016',
-      type: 'playlist',
-      name: '2016',
-      duration: 0,
-      description: '🐒<i class="indice">🔥</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2015',
-      type: 'playlist',
-      name: '2015',
-      duration: 0,
-      description: '🐐<i class="indice">🌳</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2013',
-      type: 'playlist',
-      name: '2013',
-      duration: 0,
-      description: '🐍<i class="indice">💧</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    },
-    {
-      id: 'ES2012',
-      type: 'playlist',
-      name: '2012',
-      duration: 0,
-      description: '🐉<i class="indice">💧</i>',
-      color1: '#ffffff',
-      color2: '#32021F',
-      color3: '#00ff00'
-    }
-  ]
-
-  return boxes.map((b) => ({ ...b, state: 'box-hidden' })) // boxes are first hidden to allow the animation to work (hidden -> list -> selected)
+  return boxes.map((box) => ({
+    ...box,
+    state: 'box-hidden' as const
+  }))
 })

server/api/tracks/compilation.ts

@@ -4,7 +4,8 @@ export default eventHandler(() => {
   const tracks = [
     {
       order: 1,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'The grinding wheel',
       artist: 0,
       start: 0,
@@ -13,7 +14,8 @@ export default eventHandler(() => {
     },
     {
       order: 2,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Bleach',
       artist: 1,
       start: 392,
@@ -22,7 +24,8 @@ export default eventHandler(() => {
     },
     {
       order: 3,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Televised mind',
       artist: 2,
       start: 896,
@@ -31,7 +34,8 @@ export default eventHandler(() => {
     },
     {
       order: 4,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'In it',
       artist: 3,
       start: 1139,
@@ -40,7 +44,8 @@ export default eventHandler(() => {
     },
     {
       order: 5,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Bad michel',
       artist: 4,
       start: 1245,
@@ -49,7 +54,8 @@ export default eventHandler(() => {
     },
     {
       order: 6,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Overall',
       artist: 5,
       start: 1394,
@@ -58,7 +64,8 @@ export default eventHandler(() => {
     },
     {
       order: 7,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Blowup',
       artist: 6,
       start: 1674,
@@ -67,7 +74,8 @@ export default eventHandler(() => {
     },
     {
       order: 8,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Guitar jet',
       artist: 7,
       start: 1880,
@@ -76,7 +84,8 @@ export default eventHandler(() => {
     },
     {
       order: 9,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Intercontinental radio waves',
       artist: 8,
       start: 2024,
@@ -85,7 +94,8 @@ export default eventHandler(() => {
     },
     {
       order: 10,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Here comes the sun',
       artist: 9,
       start: 2211,
@@ -94,7 +104,8 @@ export default eventHandler(() => {
     },
     {
       order: 11,
-      boxId: 'ES00A',
+      boxId: 'ES00',
+      side: 'A',
       title: 'Like in the movies',
       artist: 10,
       start: 2560,
@@ -103,7 +114,8 @@ export default eventHandler(() => {
     },
     {
       order: 1,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: "Ce que révèle l'éclipse",
       artist: 0,
       start: 0,
@@ -112,7 +124,8 @@ export default eventHandler(() => {
     },
     {
       order: 2,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: "Bleedin' Gums Mushrool",
       artist: 1,
       start: 263,
@@ -121,7 +134,8 @@ export default eventHandler(() => {
     },
     {
       order: 3,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'A lucid dream',
       artist: 2,
       start: 554,
@@ -130,7 +144,8 @@ export default eventHandler(() => {
     },
     {
       order: 4,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Lights off',
       artist: 3,
       start: 781,
@@ -139,7 +154,8 @@ export default eventHandler(() => {
     },
     {
       order: 5,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: "I'm sentimental",
       artist: 4,
       start: 969,
@@ -148,7 +164,8 @@ export default eventHandler(() => {
     },
     {
       order: 6,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Thrill or trip',
       artist: 5,
       start: 1128,
@@ -157,7 +174,8 @@ export default eventHandler(() => {
     },
     {
       order: 7,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Redhead',
       artist: 6,
       start: 1303,
@@ -166,7 +184,8 @@ export default eventHandler(() => {
     },
     {
       order: 8,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Supersonic twist',
       artist: 7,
       start: 1584,
@@ -175,7 +194,8 @@ export default eventHandler(() => {
     },
     {
       order: 9,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Flowers',
       artist: 8,
       start: 1749,
@@ -184,7 +204,8 @@ export default eventHandler(() => {
     },
     {
       order: 10,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'The shade',
       artist: 9,
       start: 1924,
@@ -193,7 +214,8 @@ export default eventHandler(() => {
     },
     {
       order: 11,
-      boxId: 'ES00B',
+      boxId: 'ES00',
+      side: 'B',
       title: 'Like in the movies',
       artist: 10,
       start: 2186,
@@ -202,7 +224,8 @@ export default eventHandler(() => {
     },
     {
       order: 1,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'He Walked In',
       artist: 11,
       start: 0,
@@ -211,7 +234,8 @@ export default eventHandler(() => {
     },
     {
       order: 2,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'The Third Wave',
       artist: 12,
       start: 841,
@@ -220,7 +244,8 @@ export default eventHandler(() => {
     },
     {
       order: 3,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Broadcaster',
       artist: 13,
       start: 1104.5,
@@ -229,7 +254,8 @@ export default eventHandler(() => {
     },
     {
       order: 4,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Mourn',
       artist: 14,
       start: 1441,
@@ -238,7 +264,8 @@ export default eventHandler(() => {
     },
     {
       order: 5,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Let it Blow',
       artist: 15,
       start: 1844.8,
@@ -247,7 +274,8 @@ export default eventHandler(() => {
     },
     {
       order: 6,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Sunday Mourning',
       artist: 16,
       start: 2091.7,
@@ -256,7 +284,8 @@ export default eventHandler(() => {
     },
     {
       order: 7,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: '3030 Instrumental',
       artist: 17,
       start: 2339.3,
@@ -265,7 +294,8 @@ export default eventHandler(() => {
     },
     {
       order: 8,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Immortality Break',
       artist: 18,
       start: 2530.5,
@@ -274,7 +304,8 @@ export default eventHandler(() => {
     },
     {
       order: 9,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Lazy Bones',
       artist: 19,
       start: 2718,
@@ -283,7 +314,8 @@ export default eventHandler(() => {
     },
     {
       order: 10,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'On the Train of Aches',
       artist: 20,
       start: 2948,
@@ -292,7 +324,8 @@ export default eventHandler(() => {
     },
     {
       order: 11,
-      boxId: 'ES01A',
+      boxId: 'ES01',
+      side: 'A',
       title: 'Me',
       artist: 21,
       start: 3265,
@@ -301,7 +334,8 @@ export default eventHandler(() => {
     },
     {
       order: 1,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Lady Hawke Blues',
       artist: 11,
       start: 0,
@@ -310,7 +344,8 @@ export default eventHandler(() => {
     },
     {
       order: 2,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Dreamscapes',
       artist: 12,
       start: 235,
@@ -319,7 +354,8 @@ export default eventHandler(() => {
     },
     {
       order: 3,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Crispy Skin',
       artist: 13,
       start: 644.2,
@@ -328,7 +364,8 @@ export default eventHandler(() => {
     },
     {
       order: 4,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'The Boy Who Stood Above The Earth',
       artist: 14,
       start: 1018,
@@ -337,7 +374,8 @@ export default eventHandler(() => {
     },
     {
       order: 5,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Better Off Alone',
       artist: 15,
       start: 1698,
@@ -346,7 +384,8 @@ export default eventHandler(() => {
     },
     {
       order: 6,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Celebration #1',
       artist: 16,
       start: 2235,
@@ -355,7 +394,8 @@ export default eventHandler(() => {
     },
     {
       order: 7,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: '3030 Instrumental',
       artist: 17,
       start: 2458.3,
@@ -364,7 +404,8 @@ export default eventHandler(() => {
     },
     {
       order: 8,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'The Emptiness Of Nothingness',
       artist: 18,
       start: 2864.5,
@@ -373,7 +414,8 @@ export default eventHandler(() => {
     },
     {
       order: 9,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Rising',
       artist: 19,
       start: 3145,
@@ -382,7 +424,8 @@ export default eventHandler(() => {
     },
     {
       order: 10,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'The Last Time',
       artist: 22,
       start: 3447,
@@ -392,7 +435,8 @@ export default eventHandler(() => {
     },
     {
       order: 11,
-      boxId: 'ES01B',
+      boxId: 'ES01',
+      side: 'B',
       title: 'Guajira Con Arpa',
       artist: 23,
       start: 3586,
@@ -404,7 +448,7 @@ export default eventHandler(() => {
   return tracks.map((track, index) => ({
     id: index + 1,
     ...track,
-    url: `https://files.erudi.fr/evilspins/${track.boxId}.mp3`,
+    url: `https://files.erudi.fr/evilspins/${track.boxId}${track.side}.mp3`,
     coverId: `https://f4.bcbits.com/img/${track.coverId}_4.jpg`,
     type: 'compilation'
   }))

server/api/tracks/playlist.ts

@@ -47,7 +47,8 @@ export default eventHandler(async (event) => {
 
       return {
         id: Number(`${year}${index + 1}`),
-        boxId: `ES${year}`,
+        boxId: `ESPLAYLIST`,
+        year,
         date,
         title: title.trim(),
         artist: artist.trim(),