animated artwork in fullscreen

src/renderer/views/components/fullscreen.ejs

@@ -14,7 +14,9 @@
                 <div class="artwork"  @click="app.fullscreen(false)">
                     <mediaitem-artwork
                             :size="600"
-                            :url="(image ?? '').replace('{w}','600').replace('{h}','600') "
+                            :video="video"
+                            :videoPriority="true"
+                            :url="(image ?? '').replace('{w}','600').replace('{h}','600')"
                     ></mediaitem-artwork>
                 </div>
                 <div class="controls-parents">
@@ -149,6 +151,24 @@
             return {
                 app: this.$root,
                 tabMode: "lyrics",
+                video: null
+            }
+        },
+        async mounted() {
+            if (app.mk.nowPlayingItem._container.type == "albums") {
+                try {
+                    const result = (await app.mk.api.v3.music(`/v1/catalog/${app.mk.storefrontId}/${app.mk.nowPlayingItem._container.type}/${app.mk.nowPlayingItem._container.id}`, {
+                        "fields": "editorialArtwork,editorialVideo",
+                    })).data.data[0].attributes?.editorialVideo?.motionDetailSquare?.video
+                    if (result) {
+                        this.video = result
+                    } else {
+                        this.video = null
+                    }
+                } catch (e) {
+                    this.video = null
+                    e = null
+                }
             }
         },
         beforeMount() {

src/renderer/views/pages/zoo.ejs

@@ -19,6 +19,8 @@
         <apple-music-playback-controls theme="dark" />
         <apple-music-progress theme="dark"></apple-music-progress>
         <apple-music-volume theme="dark"></apple-music-volume>
+        <amp-user-menu/>
+        <amp-tv-overlay/>
     </div>
 </script>
 <script>