From 7ebce51c2de151d70e6c4e90aa55b7278d2be1fe Mon Sep 17 00:00:00 2001
From: Artem Anufrij <artem.anufrij@live.de>
Date: Wed, 27 Sep 2023 16:51:44 +0200
Subject: [PATCH] load random covers

---
 public/config.json                    | 4 ++--
 src/store/modules/albums/actions.js   | 5 +++++
 src/store/modules/albums/getters.js   | 3 +++
 src/store/modules/albums/mutations.js | 3 +++
 src/store/modules/albums/state.js     | 1 +
 src/views/Home.vue                    | 8 +++-----
 6 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/public/config.json b/public/config.json
index a3b7d4a..f966bb7 100644
--- a/public/config.json
+++ b/public/config.json
@@ -1,5 +1,5 @@
 {
-  "backend_de": "http://localhost:31204",
-  "backend_dev": "https://webplay.rocks",
+  "backend_dev": "http://localhost:31204",
+  "backend_de": "https://webplay.rocks",
   "backend": "https://webplay.rocks"
 }
\ No newline at end of file
diff --git a/src/store/modules/albums/actions.js b/src/store/modules/albums/actions.js
index 301ddb5..90bb4f6 100644
--- a/src/store/modules/albums/actions.js
+++ b/src/store/modules/albums/actions.js
@@ -176,5 +176,10 @@ export default {
         resolve();
       });
     });
+  },
+  loadRandomCovers(context, count) {
+    axios.get(context.rootGetters.server + "/api/albums/random/" + count, context.rootGetters.headers).then((res) => {
+      context.commit("setRandomCovers", res.data);
+    });
   }
 }
\ No newline at end of file
diff --git a/src/store/modules/albums/getters.js b/src/store/modules/albums/getters.js
index 94440bf..cecc746 100644
--- a/src/store/modules/albums/getters.js
+++ b/src/store/modules/albums/getters.js
@@ -32,5 +32,8 @@ export default {
     },
     newest(state) {
         return state.newest;
+    },
+    randomCovers(state) {
+        return state.randomCovers;
     }
 }
\ No newline at end of file
diff --git a/src/store/modules/albums/mutations.js b/src/store/modules/albums/mutations.js
index dafa403..c1c8222 100644
--- a/src/store/modules/albums/mutations.js
+++ b/src/store/modules/albums/mutations.js
@@ -76,5 +76,8 @@ export default {
       }
     });
     state.newest = albums;
+  },
+  setRandomCovers(state, covers) {
+    state.randomCovers = covers;
   }
 }
\ No newline at end of file
diff --git a/src/store/modules/albums/state.js b/src/store/modules/albums/state.js
index e504bbe..6fb4e5f 100644
--- a/src/store/modules/albums/state.js
+++ b/src/store/modules/albums/state.js
@@ -2,6 +2,7 @@ export default {
     collection: [],
     newest: [],
     selectedAlbum: { tracks: [], covers: {}, share: {} },
+    randomCovers: [],
     page: 1,
     loading: false,
     eos: false
diff --git a/src/views/Home.vue b/src/views/Home.vue
index f3c87c2..c04b288 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -8,9 +8,7 @@
               <animateTransform id="animY1" attributeName="transform" type="translate" begin="0s; animY2.end" from="-40 -20" to="0 0" dur="30s" />
               <animateTransform id="animY2" attributeName="transform" type="translate" begin="animY1.end" from="0 0" to="-40 -20" dur="30s" />
 
-              <image :xlink:href="item.covers.cover128" :x="i * 64" y="0" width="64" height="64" v-for="(item, i) in albums" :key="item" />
-              <image :xlink:href="item.covers.cover256" :x="i * 128" y="64" width="128" v-for="(item, i) in artists" :key="item" />
-              <image :xlink:href="item.covers.cover128 || item.covers.cover256" :x="i * 64" y="128" v-for="(item, i) in history" :key="item" />
+              <image :xlink:href="item.covers.cover64" :x="i * 64" y="0" width="64" height="64" v-for="(item, i) in randomCovers" :key="item" />
             </g>
           </svg>
         </div>
@@ -115,6 +113,7 @@ export default {
       this.$store.dispatch("tracks/loadMostListened");
       this.$store.dispatch("videos/loadMostViewed");
 
+      this.$store.dispatch("albums/loadRandomCovers", 24);
       this.$store.dispatch("albums/loadAlbums", true);
       this.$store.dispatch("artists/loadArtists", true);
     },
@@ -151,8 +150,7 @@ export default {
       serverInfo: "serverInfo",
       mostListened: "tracks/mostListened",
       mostViewed: "videos/mostViewed",
-      albums: ["albums/collection"],
-      artists: ["artists/collection"],
+      randomCovers: ["albums/randomCovers"],
     }),
     historyToggleText() {
       return this.historyAll ? "less..." : "more...";