1.4.2 (#78)

- #68 - Unifier les vues pour la liste des albums
- #77 - Je suis capable de trier ma collection par date d'ajout
- #74 - Lors du changement de page on connait l'ordre de tri
- #73 - Savoir sur quelle page on est
- #76 - Avoir plus de détails sur le support physique sur la modale d'ajout
- #75 - Numérotation de la tracklist

Co-authored-by: dbroqua <contact@darkou.fr>
Reviewed-on: https://git.darkou.fr/dbroqua/MusicTopus/pulls/78

views/components/filters/artist.ejs

@@ -0,0 +1,11 @@
+<div class="field">
+    <label for="artist">Artiste</label>
+    <select id="artist" v-model="artist" @change="changeFilter">
+        <option value="">Tous</option>
+        <%
+            for (let i = 0; i < page.artists.length; i += 1 ) {
+                __append(`<option value="${page.artists[i]}">${page.artists[i]}</option>`);
+            }
+        %>
+    </select>
+</div>

views/components/filters/format.ejs

@@ -0,0 +1,11 @@
+<div class="field">
+    <label for="format">Format</label>
+    <select id="format" v-model="format" @change="changeFilter">
+        <option value="">Tous</option>
+        <%
+            for (let i = 0; i < page.formats.length; i += 1 ) {
+                __append(`<option value="${page.formats[i]}">${page.formats[i]}</option>`);
+            }
+        %>
+    </select>
+</div>

views/components/filters/genre.ejs

@@ -0,0 +1,12 @@
+
+<div class="field">
+    <label for="genre">Genre</label>
+    <select id="genre" v-model="genre" @change="changeFilter">
+        <option value="">Tous</option>
+        <%
+            for (let i = 0; i < page.genres.length; i += 1 ) {
+                __append(`<option value="${page.genres[i]}">${page.genres[i]}</option>`);
+            }
+        %>
+    </select>
+</div>

views/components/filters/index.ejs

@@ -0,0 +1,18 @@
+<div class="filters">
+    <%- include('./artist') %>
+    <%- include('./format') %>
+    <%- include('./sort') %>
+</div>
+
+<div class="filters" v-if="moreFilters">
+    <%- include('./year') %>
+    <%- include('./genre') %>
+    <%- include('./style') %>
+</div>
+
+<span @click="showMoreFilters" class="showMoreFilters">
+  <template v-if="!moreFilters">Voir plus de filtres</template>
+  <template v-if="moreFilters">Voir moins de filtres</template>
+  <i class="icon-left-open down" v-if="!moreFilters"></i>
+  <i class="icon-left-open up" v-if="moreFilters"></i>
+</span>

views/components/filters/sort.ejs

@@ -0,0 +1,15 @@
+<div class="field">
+  <label for="sortOrder">Trier par</label>
+  <select id="sortOrder" v-model="sortOrder" @change="changeSort">
+      <option value="artists_sort-asc">Artiste (A-Z)</option>
+      <option value="artists_sort-desc">Artiste (Z-A)</option>
+      <option value="year-asc">Année (1-9)</option>
+      <option value="year-desc">Année (9-1)</option>
+      <option value="country-asc">Pays (A-Z)</option>
+      <option value="country-desc">Pays (Z-A)</option>
+      <option value="formats.name-asc">Format (A-Z)</option>
+      <option value="formats.name-desc">Format (Z-A)</option>
+      <option value="createdAt-asc">Date d'ajout (1-9)</option>
+      <option value="createdAt-desc">Date d'ajout (9-1)</option>
+  </select>
+</div>

views/components/filters/style.ejs

@@ -0,0 +1,11 @@
+<div class="field">
+    <label for="style">Style</label>
+    <select id="style" v-model="style" @change="changeFilter">
+        <option value="">Tous</option>
+        <%
+            for (let i = 0; i < page.styles.length; i += 1 ) {
+                __append(`<option value="${page.styles[i]}">${page.styles[i]}</option>`);
+            }
+        %>
+    </select>
+</div>

views/components/filters/year.ejs

@@ -0,0 +1,11 @@
+<div class="field">
+    <label for="format">Année</label>
+    <select id="format" v-model="year" @change="changeFilter">
+        <option value="">Toutes</option>
+        <%
+            for (let i = 0; i < page.years.length; i += 1 ) {
+                __append(`<option value="${page.years[i]}">${page.years[i]}</option>`);
+            }
+        %>
+    </select>
+</div>