[Media UI] Download Audio support.

platypush/backend/http/webapp/src/components/panels/Media/Browser.vue

@@ -28,6 +28,7 @@
             @add-to-playlist="$emit('add-to-playlist', $event)"
             @back="back"
             @download="$emit('download', $event)"
+            @download-audio="$emit('download-audio', $event)"
             @path-change="$emit('path-change', $event)"
             @play="$emit('play', $event)"
         />
@@ -50,6 +51,7 @@ export default {
     'back',
     'create-playlist',
     'download',
+    'download-audio',
     'path-change',
     'play',
     'remove-from-playlist',

platypush/backend/http/webapp/src/components/panels/Media/Index.vue

@@ -60,6 +60,7 @@
                        @play="play"
                        @view="view"
                        @download="download"
+                       @download-audio="downloadAudio"
                        v-if="selectedView === 'search'"
               />
 
@@ -82,6 +83,7 @@
                        @add-to-playlist="addToPlaylistItem = $event"
                        @back="selectedResult = null"
                        @download="download"
+                       @download-audio="downloadAudio"
                        @path-change="browserFilter = ''"
                        @play="play($event)"
                        v-else-if="selectedView === 'browser'"
@@ -344,15 +346,19 @@ export default {
       window.open(ret.url, '_blank')
     },
 
-    async download(item) {
+    async download(item, args) {
       switch (item.type) {
         case 'torrent':
-          return await this.downloadTorrent(item)
+          return await this.downloadTorrent(item, args)
         case 'youtube':
-          return await this.downloadYoutube(item)
+          return await this.downloadYoutube(item, args)
       }
     },
 
+    async downloadAudio(item) {
+      await this.download(item, {onlyAudio: true})
+    },
+
     async refresh() {
       this.selectedPlayer.status = await this.selectedPlayer.component.status(this.selectedPlayer)
     },
@@ -454,7 +460,7 @@ export default {
       return await this.request(`${torrentPlugin}.download`, {torrent: item.url || item})
     },
 
-    async downloadYoutube(item) {
+    async downloadYoutube(item, args) {
       if (!item?.url) {
         this.notify({
           text: 'No YouTube URL available',
@@ -464,10 +470,13 @@ export default {
         return
       }
 
-      await this.request(
+      const requestArgs = {url: item.url}
-        `${this.pluginName}.download`,
+      const onlyAudio = !!args?.onlyAudio
-        {url: item.url},
+      if (onlyAudio) {
-      )
+        requestArgs.only_audio = true
+      }
+
+      await this.request(`${this.pluginName}.download`, requestArgs)
     },
 
     async selectSubtitles(item) {

platypush/backend/http/webapp/src/components/panels/Media/Item.vue

@@ -17,6 +17,8 @@
                           v-if="item.type !== 'torrent'" />
             <DropdownItem icon-class="fa fa-download" text="Download" @click="$emit('download')"
                           v-if="(item.type === 'torrent' || item.type === 'youtube') && item.item_type !== 'channel' && item.item_type !== 'playlist'" />
+            <DropdownItem icon-class="fa fa-volume-high" text="Download Audio" @click="$emit('download-audio')"
+                          v-if="item.type === 'youtube' && item.item_type !== 'channel' && item.item_type !== 'playlist'" />
             <DropdownItem icon-class="fa fa-list" text="Add to playlist" @click="$emit('add-to-playlist')"
                           v-if="item.type === 'youtube'" />
             <DropdownItem icon-class="fa fa-trash" text="Remove from playlist" @click="$emit('remove-from-playlist')"
@@ -55,6 +57,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
     'remove-from-playlist',

platypush/backend/http/webapp/src/components/panels/Media/Providers/Mixin.vue

@@ -8,6 +8,7 @@ export default {
     'back',
     'create-playlist',
     'download',
+    'download-audio',
     'path-change',
     'play',
     'remove-from-playlist',

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube.vue

@@ -10,6 +10,7 @@
         <Feed :filter="filter"
               @add-to-playlist="$emit('add-to-playlist', $event)"
               @download="$emit('download', $event)"
+              @download-audio="$emit('download-audio', $event)" 
               @open-channel="selectChannelFromItem"
               @play="$emit('play', $event)"
               v-if="selectedView === 'feed'"
@@ -19,6 +20,7 @@
                    :selected-playlist="selectedPlaylist_"
                    @add-to-playlist="$emit('add-to-playlist', $event)"
                    @download="$emit('download', $event)"
+                   @download-audio="$emit('download-audio', $event)"
                    @open-channel="selectChannelFromItem"
                    @play="$emit('play', $event)"
                    @remove-from-playlist="removeFromPlaylist"
@@ -30,6 +32,7 @@
                        :selected-channel="selectedChannel_"
                        @add-to-playlist="$emit('add-to-playlist', $event)"
                        @download="$emit('download', $event)"
+                       @download-audio="$emit('download-audio', $event)"
                        @play="$emit('play', $event)"
                        @select="onChannelSelected"
                        v-else-if="selectedView === 'subscriptions'"

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube/Channel.vue

@@ -48,6 +48,7 @@
                ref="results"
                @add-to-playlist="$emit('add-to-playlist', $event)"
                @download="$emit('download', $event)"
+               @download-audio="$emit('download-audio', $event)"
                @open-channel="$emit('open-channel', $event)"
                @play="$emit('play', $event)"
                @scroll-end="loadNextPage"
@@ -67,6 +68,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
   ],

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube/Feed.vue

@@ -11,6 +11,7 @@
              :selected-result="selectedResult"
              @add-to-playlist="$emit('add-to-playlist', $event)"
              @download="$emit('download', $event)"
+             @download-audio="$emit('download-audio', $event)"
              @open-channel="$emit('open-channel', $event)"
              @select="selectedResult = $event"
              @play="$emit('play', $event)"
@@ -29,6 +30,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
   ],

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube/Playlist.vue

@@ -51,6 +51,7 @@
                :selected-result="selectedResult"
                @add-to-playlist="$emit('add-to-playlist', $event)"
                @download="$emit('download', $event)"
+               @download-audio="$emit('download-audio', $event)"
                @open-channel="$emit('open-channel', $event)"
                @play="$emit('play', $event)"
                @remove-from-playlist="$emit('remove-from-playlist', $event)"
@@ -71,6 +72,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
     'remove-from-playlist',

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube/Playlists.vue

@@ -32,6 +32,7 @@
         :metadata="playlistsById[selectedPlaylist.id] || selectedPlaylist"
         @add-to-playlist="$emit('add-to-playlist', $event)"
         @download="$emit('download', $event)"
+        @download-audio="$emit('download-audio', $event)"
         @open-channel="$emit('open-channel', $event)"
         @remove-from-playlist="$emit('remove-from-playlist', {item: $event, playlist_id: selectedPlaylist.id})"
         @play="$emit('play', $event)"
@@ -113,6 +114,7 @@ export default {
     'add-to-playlist',
     'create-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
     'remove-from-playlist',

platypush/backend/http/webapp/src/components/panels/Media/Providers/YouTube/Subscriptions.vue

@@ -25,6 +25,7 @@
         :filter="filter"
         @add-to-playlist="$emit('add-to-playlist', $event)"
         @download="$emit('download', $event)"
+        @download-audio="$emit('download-audio', $event)"
         @play="$emit('play', $event)"
       />
     </div>
@@ -42,6 +43,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'play',
     'select',
   ],

platypush/backend/http/webapp/src/components/panels/Media/Results.vue

@@ -14,7 +14,9 @@
             @select="$emit('select', i)"
             @play="$emit('play', item)"
             @view="$emit('view', item)"
-            @download="$emit('download', item)" />
+            @download="$emit('download', item)"
+            @download-audio="$emit('download-audio', item)"
+      />
     </div>
 
     <Modal ref="infoModal" title="Media info" @close="$emit('select', null)">
@@ -37,6 +39,7 @@ export default {
   emits: [
     'add-to-playlist',
     'download',
+    'download-audio',
     'open-channel',
     'play',
     'remove-from-playlist',