Support for torrent direct download through magnet link in web panel

platypush/backend/http/static/css/source/webpanel/plugins/media/torrents.scss

@@ -7,6 +7,17 @@
                 padding: 0;
                 text-align: center;
 
+                .search {
+                    input[type=text] {
+                        width: 88%;
+                        max-width: none;
+                    }
+
+                    input[type=submit] {
+                        width: 8%;
+                    }
+                }
+
                 .head {
                     font-weight: bold;
                     padding: .5rem 0 2.5rem 0;

platypush/backend/http/static/js/plugins/media/torrents.js

@@ -63,6 +63,16 @@ Vue.component('media-torrents', {
             this.selectedItem = item;
             openDropdown(this.$refs.menu);
         },
+
+        onMagnetDownload: async function() {
+            const magnet = this.$refs.magnetLink.value.trim();
+            if (!magnet.length)
+                return;
+
+            const ret = await request('torrent.download', {
+                torrent: magnet,
+            });
+        }
     },
 });
 

platypush/backend/http/templates/plugins/media/index.html

@@ -27,7 +27,6 @@
 
             <div class="col-2 top-buttons">
                 <button type="button"
-                        v-if="torrentsDownloading"
                         @click="torrentModal.visible = !torrentModal.visible"
                         title="Show torrents progress">
                     <i class="fa fa-download"></i>

platypush/backend/http/templates/plugins/media/torrents.html

@@ -2,6 +2,15 @@
 
 <script type="text/x-template" id="tmpl-media-torrents">
     <div class="transfers-container">
+        <div class="search">
+            <form @submit.prevent="onMagnetDownload">
+                <input type="text" ref="magnetLink" placeholder="Magnet link">
+                <button type="submit">
+                    <i class="fas fa-download"></i>
+                </button>
+            </form>
+        </div>
+
         <div class="head">
             <div class="col-4">Name</div>
             <div class="col-2">State</div>