Podcast episode downloader, update podcast data model

client/components/modals/podcast/NewModal.vue

@@ -179,7 +179,51 @@ export default {
     toggleSelectEpisode(index) {
       this.selectedEpisodes[String(index)] = !this.selectedEpisodes[String(index)]
     },
-    submit() {},
+    submit() {
+      var episodesToDownload = []
+      if (this.episodesSelected.length) {
+        episodesToDownload = this.episodesSelected.map((episodeIndex) => this.episodes[Number(episodeIndex)])
+      }
+
+      const podcastPayload = {
+        path: this.fullPath,
+        folderId: this.selectedFolderId,
+        libraryId: this.currentLibrary.id,
+        media: {
+          metadata: {
+            title: this.podcast.title,
+            author: this.podcast.author,
+            description: this.podcast.description,
+            releaseDate: this.podcast.releaseDate,
+            genres: [...this.podcast.genres],
+            feedUrl: this.podcast.feedUrl,
+            imageUrl: this.podcast.imageUrl,
+            itunesPageUrl: this.podcast.itunesPageUrl,
+            itunesId: this.podcast.itunesId,
+            itunesArtistId: this.podcast.itunesArtistId,
+            language: this.podcast.language
+          },
+          autoDownloadEpisodes: this.podcast.autoDownloadEpisodes
+        },
+        episodesToDownload
+      }
+      console.log('Podcast payload', podcastPayload)
+
+      this.processing = true
+      this.$axios
+        .$post('/api/podcasts', podcastPayload)
+        .then((libraryItem) => {
+          this.processing = false
+          this.$toast.success('Podcast created successfully')
+          this.show = false
+          this.$router.push(`/item/${libraryItem.id}`)
+        })
+        .catch((error) => {
+          console.error('Failed to create podcast', error)
+          this.processing = false
+          this.$toast.error('Failed to create podcast')
+        })
+    },
     saveEpisode(episode) {
       console.log('Save episode', episode)
     },

client/pages/item/_id/index.vue

@@ -6,10 +6,10 @@
           <div class="relative" style="height: fit-content">
             <covers-book-cover :library-item="libraryItem" :width="bookCoverWidth" :book-cover-aspect-ratio="bookCoverAspectRatio" />
 
-            <!-- Book Progress Bar -->
+            <!-- Item Progress Bar -->
             <div class="absolute bottom-0 left-0 h-1.5 bg-yellow-400 shadow-sm z-10" :class="userIsFinished ? 'bg-success' : 'bg-yellow-400'" :style="{ width: 208 * progressPercent + 'px' }"></div>
 
-            <!-- Book Cover Overlay -->
+            <!-- Item Cover Overlay -->
             <div class="absolute top-0 left-0 w-full h-full z-10 bg-black bg-opacity-30 opacity-0 hover:opacity-100 transition-opacity" @mousedown.prevent @mouseup.prevent>
               <div v-show="showPlayButton && !streaming" class="h-full flex items-center justify-center pointer-events-none">
                 <div class="hover:text-white text-gray-200 hover:scale-110 transform duration-200 pointer-events-auto cursor-pointer" @click.stop.prevent="startStream">
@@ -28,10 +28,11 @@
                 <h1 class="text-2xl md:text-3xl font-sans">
                   {{ title }}
                 </h1>
-                <p v-if="subtitle" class="sm:ml-4 text-gray-400 text-xl md:text-2xl">{{ subtitle }}</p>
+                <p v-if="bookSubtitle" class="sm:ml-4 text-gray-400 text-xl md:text-2xl">{{ bookSubtitle }}</p>
               </div>
 
-              <p v-if="authorsList.length" class="mb-2 mt-0.5 text-gray-200 text-lg md:text-xl">
+              <p v-if="isPodcast" class="mb-2 mt-0.5 text-gray-200 text-lg md:text-xl">by {{ podcastAuthor }}</p>
+              <p v-else-if="authorsList.length" class="mb-2 mt-0.5 text-gray-200 text-lg md:text-xl">
                 by <nuxt-link v-for="(author, index) in authorsList" :key="index" :to="`/library/${libraryId}/bookshelf?filter=authors.${$encode(author)}`" class="hover:underline">{{ author }}<span v-if="index < authorsList.length - 1">,&nbsp;</span></nuxt-link>
               </p>
               <p v-else class="mb-2 mt-0.5 text-gray-200 text-xl">by Unknown</p>
@@ -162,7 +163,6 @@ export default {
       console.error('Failed', error)
       return false
     })
-    console.log(item)
     if (!item) {
       console.error('No item...', params.id)
       return redirect('/')
@@ -193,6 +193,9 @@ export default {
     showExperimentalFeatures() {
       return this.$store.state.showExperimentalFeatures
     },
+    isPodcast() {
+      return this.libraryItem.mediaType === 'podcast'
+    },
     isMissing() {
       return this.libraryItem.isMissing
     },
@@ -200,7 +203,9 @@ export default {
       return this.libraryItem.isInvalid
     },
     showPlayButton() {
-      return !this.isMissing && !this.isInvalid && this.audiobooks.length
+      if (this.isMissing || this.isInvalid) return false
+      if (this.isPodcast) return this.podcastEpisodes.length
+      return this.audiobooks.length
     },
     libraryId() {
       return this.libraryItem.libraryId
@@ -217,8 +222,8 @@ export default {
     mediaMetadata() {
       return this.media.metadata || {}
     },
-    audiobooks() {
-      return this.media.audiobooks || []
+    podcastEpisodes() {
+      return this.media.episodes || []
     },
     defaultAudiobook() {
       if (!this.audiobooks.length) return null
@@ -233,12 +238,16 @@ export default {
     narrator() {
       return this.mediaMetadata.narratorName
     },
-    subtitle() {
+    bookSubtitle() {
+      if (this.isPodcast) return null
       return this.mediaMetadata.subtitle
     },
     genres() {
       return this.mediaMetadata.genres || []
     },
+    podcastAuthor() {
+      return this.mediaMetadata.author || ''
+    },
     authors() {
       return this.mediaMetadata.authors || []
     },

client/pages/library/_library/podcast/search.vue

@@ -42,6 +42,16 @@
 
 <script>
 export default {
+  async asyncData({ params, query, store, app, redirect }) {
+    var libraryId = params.library
+    var library = await store.dispatch('libraries/fetch', libraryId)
+    if (!library) {
+      return redirect('/oops?message=Library not found')
+    }
+    return {
+      libraryId
+    }
+  },
   data() {
     return {
       searchTerm: '',