add artist images back

src/renderer/index.js

@@ -3911,6 +3911,21 @@ const app = new Vue({
         checkForUpdate() {
             ipcRenderer.send('check-for-update')
         },
+        async loadArtistImage(id){
+            try {
+                let u = await fetch(`https://music.apple.com/${app.mk.storefrontId}/artist/${id}`);
+                let html = await u.text();
+                function getStringBetween(str, start, end) {
+                    const result = str.match(new RegExp(start + "(.*)" + end));
+
+                    return result[1];
+                }
+                let string = getStringBetween(html, '<meta property="og:image:secure_url" content="', "cw.png").replace(`1200x630`, `300x300.png`);
+                return await string;
+            } catch (err) {
+                return await ''
+            }
+        }
     }
 })
 

src/renderer/views/components/artist-chip.ejs

@@ -1,7 +1,7 @@
 <script type="text/x-template" id="artist-chip">
     <div class="artist-chip" @click.self="route">
         <div class="artist-chip__image">
-            <mediaitem-artwork v-if="artist.id != null" :url="artist.attributes.artwork.url" :size="32"></mediaitem-artwork>
+            <mediaitem-artwork v-if="artist.id != null" :url="artistimage" :size="32"></mediaitem-artwork>
         </div>
         <div class="artist-chip__name">
             <span>{{ item.attributes.name }}</span>
@@ -16,24 +16,30 @@
         props: {
             item: {
                 type: Object,
-                required: true
+                required: true,
             }
         },
         data: function() {
             return {
                 artist: {
                     id: null
-                }
+                },
+                artistimage : ''
             }
         },
         template: '#artist-chip',
         async mounted() {
             let artistId = this.item.id           
+           
             if(typeof this.item.relationships.catalog == "object") {
                 artistId = this.item.relationships.catalog.data[0].id
             }
-            app.mk.api.music(`/v1/catalog/${app.mk.storefrontId}/artists/${artistId}`).then(response => {
+            app.mk.api.music(`/v1/catalog/${app.mk.storefrontId}/artists/${artistId}`).then(async (response) => {
                 this.artist = response.data.data[0];
+                if (this.artistimage == '' && artistId != null){
+                    this.artistimage = (await this.$root.loadArtistImage(artistId) ?? '').replace('300x300','50x50')
+                    
+                }
             });
         },
         methods: {

src/renderer/views/components/mediaitem-square.ejs

@@ -10,7 +10,7 @@
                 </div>
                 <div class="artwork" @click='app.routeView(item)'>
                     <mediaitem-artwork
-                            :url="getArtworkUrl()"
+                            :url="mainimageurl"
                             :video="(item.attributes != null && item.attributes.editorialVideo != null) ? (item.attributes.editorialVideo.motionDetailSquare ? item.attributes.editorialVideo.motionDetailSquare.video : (item.attributes.editorialVideo.motionSquareVideo1x1 ? item.attributes.editorialVideo.motionSquareVideo1x1.video : '')) : '' "
                             :size="size"
                             shadow="subtle"
@@ -77,7 +77,8 @@
                 app: this.$root,
                 badges: this.$root.socialBadges.badgeMap,
                 itemBadges: [],
-                unavailable: false
+                unavailable: false,
+                mainimageurl: '',
             }
         },
         async mounted() {
@@ -91,6 +92,7 @@
                     this.unavailable = true
                 }
             }
+            this.getMainImage()
         },
         methods: {
             getBgColor() {
@@ -205,7 +207,10 @@
                 );
             },
             getArtworkUrl(size = -1, includeUrl = false) {
-                let artwork = this.item.attributes.artwork ? this.item.attributes.artwork.url : ''
+                let artwork = this.item.attributes?.artwork ? this.item.attributes.artwork?.url : ''
+                // if (artwork == '' && this.item.type == "artists" && this.item.id != null) {
+                //     artwork = (await app.loadArtistImage(this.item.id)).toString();
+                // }
                 if(size != -1) {
                     artwork = artwork.replace('{w}', size).replace('{h}', size).replace('{f}', "webp").replace('{c}', ((size === 900) ? "sr" : "cc"))
                 }
@@ -220,6 +225,12 @@
                     return `url("${artwork}")`
                 }
             },
+            async getMainImage(){
+               this.mainimageurl = this.getArtworkUrl()
+               if (this.mainimageurl == '' && this.item.id != null && this.item.type == "artists") {
+                   this.mainimageurl = await this.app.loadArtistImage(this.item.id)
+               }
+            },
             getClasses() {
                 let type = this.item.type
                 if (this.kind != "") {

src/renderer/views/pages/artist.ejs

@@ -12,7 +12,7 @@
                         <div class="artist-image" v-if="!(data.attributes.editorialVideo && (data.attributes.editorialVideo.motionArtistWide16x9 || data.attributes.editorialVideo.motionArtistFullscreen16x9))">
                             <mediaitem-artwork
                                     shadow="large"
-                                    :url="data.attributes?.artwork ? data.attributes.artwork?.url : ''"
+                                    :url="artistimage"
                                     size="190" type="artists"></mediaitem-artwork>
                             <button class="overlay-play"  @click="app.mk.setStationQueue({artist:'a-'+data.id}).then(()=>{
                             app.mk.play()
@@ -143,9 +143,18 @@
             return {
                 topSongsExpanded: false,
                 app: this.$root,
-                headerVisible: true
+                headerVisible: true,
+                artistimage : ''
             }
         },
+        mounted: async function () {
+             this.artistimage = this.data.attributes?.artwork ? this.data.attributes.artwork?.url : ''
+
+            if (this.artistimage == '' && this.data.id != null){
+                 this.artistimage = await this.app.loadArtistImage(this.data.id)
+            }
+
+        },
         methods: {
             isHeaderVisible(visible) {
                 this.headerVisible = visible