Merge pull request #999 from ciderapp/enhancement/radio

Enhancement/radio

package.json

@@ -29,6 +29,7 @@
     "dist:macarm": "yarn build && electron-builder --mac --arm64",
     "dist:universalNotWorking": "yarn build && electron-builder --mac --universal",
     "dist:all": "yarn build && electron-builder -mwl",
+    "testdist": "yarn build && electron-builder --dir",
     "winget": "yarn build && electron-builder --win -c winget.json",
     "msft": "yarn build && electron-builder -c msft-package.json",
     "mstest": "yarn build && electron-builder -c msft-test.json",

src/i18n/README.md

@@ -299,7 +299,6 @@ Update 28/04/2022 21:45 UTC
 * `term.dynamic`: Added for `en_US`
 
 Update 29/04/2022 00:00 UTC
-
 * `menubar.options.about`: Added for `en_US`
 * `menubar.options.settings`: Added for `en_US`
 * `menubar.options.quit`: Added for `en_US`
@@ -393,7 +392,6 @@ Update 18/05/2022 14:20 UTC
 * `action.tray.previous`: Added for `en_US`,
 
 Update 22/05/2022 03:53 UTC
-
 * `settings.option.audio.enableAdvancedFunctionality.tunedAudioSpatialization.profile.diffused`: Added for `en_US`
 
 Update 22/05/2022 14:32 UTC

src/i18n/en_US.json

@@ -131,6 +131,8 @@
   "term.audioControls": "Volume Controls",
   "term.clearAll": "Clear All",
   "term.recentStations": "Recent Stations",
+  "term.personalStations": "Personal Stations",
+  "term.amLive": "Apple Music Live",
   "term.language": "Language",
   "term.funLanguages": "Fun",
   "term.noLyrics": "Loading... / Lyrics not found./ Instrumental.",

src/i18n/source/en_US.json

@@ -131,6 +131,8 @@
   "term.audioControls": "Volume Controls",
   "term.clearAll": "Clear All",
   "term.recentStations": "Recent Stations",
+  "term.personalStations": "Personal Stations",
+  "term.amLive": "Apple Music Live",
   "term.language": "Language",
   "term.funLanguages": "Fun",
   "term.noLyrics": "Loading... / Lyrics not found./ Instrumental.",

src/main/base/browserwindow.ts

@@ -59,6 +59,7 @@ export class BrowserWindow {
                 "pages/settings",
                 "pages/installed-themes",
                 "pages/listen_now",
+                "pages/radio",
                 "pages/home",
                 "pages/artist-feed",
                 "pages/cider-playlist",
@@ -192,6 +193,11 @@ export class BrowserWindow {
                     component: `<cider-listen-now :data="listennow"></cider-listen-now>`,
                     condition: `page == 'listen_now'`,
                     onEnter: ``
+                }, {
+                    page: "radio",
+                    component: `<cider-radio :data="radio"></cider-radio>`,
+                    condition: `page == 'radio'`,
+                    onEnter: ``
                 }, {
                     page: "settings",
                     component: `<cider-settings></cider-settings>`,

src/renderer/main/vueapp.js

@@ -43,7 +43,9 @@ const app = new Vue({
         listennow: [],
         madeforyou: [],
         radio: {
-            personal: []
+            personal: {},
+            recent: {},
+            amlive: {},
         },
         mklang: 'en',
         webview: {
@@ -326,6 +328,7 @@ const app = new Vue({
             try {
                 this.listennow.timestamp = 0;
                 this.browsepage.timestamp = 0;
+                this.radio.timestamp = 0;
             } catch (e) { }
         },
         /**
@@ -2648,21 +2651,6 @@ const app = new Vue({
                 this.getBrowsePage(attempt + 1)
             }
         },
-        async getRadioStations(attempt = 0) {
-            if (attempt > 3) {
-                return
-            }
-            try {
-                this.radio.personal = (await app.mk.api.v3.music(`/v1/me/recent/radio-stations`, {
-                    "platform": "web",
-                    "art[url]": "f",
-                    l: this.mklang
-                })).data.data;
-            } catch (e) {
-                console.log(e)
-                this.getRadioStations(attempt + 1)
-            }
-        },
         async getMadeForYou(attempt = 0) {
             if (attempt > 3) {
                 return

src/renderer/views/app/app-content.ejs

@@ -25,15 +25,6 @@
         </transition>
     <% } %>
 
-    <transition v-on:enter="getRadioStations()" :name="chrome.desiredPageTransition">
-        <template v-if="page == 'radio'" @created="console.log('radio')">
-            <div class="content-inner">
-                <h1 class="header-text">{{$root.getLz('term.radio')}}</h1>
-                <h3>{{$root.getLz('term.recentStations')}}</h3>
-                <mediaitem-square :item="item" v-for="item in radio.personal"></mediaitem-square>
-            </div>
-        </template>
-    </transition>
     <!-- Library - Recently Added -->
     <transition :name="chrome.desiredPageTransition" v-on:enter="getLibraryAlbumsFull(null, 0); searchLibraryAlbums(0);">
         <%- include('../pages/library-recentlyadded') %>');

src/renderer/views/app/sidebar.ejs

@@ -43,8 +43,8 @@
             <sidebar-library-item :name="$root.getLz('term.browse')" svg-icon="./assets/feather/globe.svg"
                 page="browse">
             </sidebar-library-item>
-            <sidebar-library-item :name="$root.getLz('term.radio')" svg-icon="./assets/feather/radio.svg" page="radio">
+            <sidebar-library-item :name="$root.getLz('term.radio')" svg-icon="./assets/feather/radio.svg"
-            </sidebar-library-item>
+                page="radio"></sidebar-library-item>
         </template>
 
         <div class="app-sidebar-header-text"

src/renderer/views/pages/radio.ejs

@@ -0,0 +1,91 @@
+<script type="text/x-template" id="cider-radio">
+    <div class="content-inner">
+        <h1 class="header-text">{{ app.getLz('term.radio') }}</h1>
+        <div class="row">
+            <div class="col">
+                <h3>{{ app.getLz('term.personalStations') }}</h3>
+            </div>
+        </div>
+<!--        <mediaitem-square :kind="'385'" size="600"-->
+<!--                          :item="item ? (item.attributes.kind ? item : ((item.relationships && item.relationships.contents ) ? item.relationships.contents.data[0] : item)) : []"-->
+<!--                          :imagesize="800"-->
+<!--                          v-for="item of getFlattenedCategories()">-->
+        <mediaitem-square :item="item" v-for="item in radio.personal"></mediaitem-square>
+        <div class="row">
+            <div class="col">
+                <h3>{{ app.getLz('term.recentStations') }}</h3>
+            </div>
+        </div>
+        <mediaitem-square :item="station" v-for="station in radio.recent"></mediaitem-square>
+        <div class="row">
+            <div class="col">
+                <h3>{{ app.getLz('term.amLive') }}</h3>
+            </div>
+        </div>
+        <mediaitem-square :item="station" v-for="station in radio.am"></mediaitem-square>
+    </div>
+</script>
+
+<script>
+	Vue.component('cider-radio', {
+		template: "#cider-radio",
+		props: ["data"],
+		data: function () {
+			return {
+				app: this.$root,
+                radio: {personal: [], recent: [], am: []}
+			}
+		},
+        async mounted() {
+	        this.radio.personal = await this.getPersonalStations()
+            this.radio.recent = await this.getRecentStations()
+            this.radio.am = await this.getAmStations()
+            console.log(this.radio)
+	        // this.getPersonalStations();
+	        // this.getAmStations();
+        },
+		methods: {
+			async getPersonalStations(attempts = 0) {
+				if (attempts > 3) {
+					return []
+				}
+				try {
+					return (await app.mk.api.v3.music(`/v1/catalog/${app.mk.api.v3.storefrontId}/stations`, {
+						"filter[identity]": "personal",
+					})).data.data
+				} catch (e) {
+					console.error(`Failed to get personal stations: ${e}`)
+					await this.getPersonalStations(attempts + 1)
+				}
+			},
+			async getRecentStations(attempts = 0) {
+				if (attempts > 3) {
+					return []
+				}
+				try {
+					return (await app.mk.api.v3.music(`/v1/me/recent/radio-stations`, {
+						"platform": "web",
+						"art[url]": "f",
+						l: app.mklang
+					})).data.data
+				} catch (e) {
+					console.error(`Failed to get recent stations: ${e}`)
+					await this.getRecentStations(attempts + 1)
+				}
+			},
+			async getAmStations(attempt = 0) {
+				if (attempt > 3) {
+					return []
+				}
+				try {
+					return (await app.mk.api.v3.music(`/v1/catalog/${app.mk.api.v3.storefrontId}/stations`, {
+						"filter[featured]": "apple-music-live-radio",
+					})).data.data
+				} catch (e) {
+					console.error(`Failed to get AM stations: ${e}`)
+					await this.getAmStations(attempt + 1)
+				}
+			},
+		}
+	})
+</script>