added experimental support for a music site

src/components/mainForm.vue

@@ -17,7 +17,7 @@
         class="search-torrents option-buttons"
         @click.prevent="whichType('search', $event)"
       >
-        Search Torrents
+        {{ searchLabel }}
       </div>
     </div>
     <div class="action-group">
@@ -36,10 +36,14 @@
             >
           </div>
           <actionButton className="download-button" @clicked="download"></actionButton>
-          <uploadFile v-if="downloadType === 'aria2'" @uploadfile="uploadFile" :path="uris.upload_url"></uploadFile>
+          <uploadFile
+            v-if="downloadType === 'aria2'"
+            @uploadfile="uploadFile"
+            :path="uris.upload_url"
+          ></uploadFile>
         </div>
       </div>
-      <searchInput v-else @search="search"></searchInput>
+      <searchInput v-else @search="search" @optionSelected="optionCallback"></searchInput>
     </div>
   </form>
 </template>
@@ -48,6 +52,7 @@ import textInput from "./textInput";
 import searchInput from "./searchInput.vue";
 import actionButton from "./actionButton";
 import uploadFile from "./uploadFile";
+import { translate as t } from "@nextcloud/l10n";
 
 export default {
   data() {
@@ -57,7 +62,8 @@ export default {
       inputType: "download",
       checkboxes: false,
       downloadType: "aria2",
-      placeholder: "Paste your http/magnet link here",
+      placeholder: t("ncdownloader", "Paste your http/magnet link here"),
+      searchLabel: t("ncdownloader", "Search Torrents"),
     };
   },
   components: {
@@ -78,9 +84,8 @@ export default {
       this.downloadType = type;
       if (type === "aria2") {
         this.path = this.uris.aria2_url;
-        this.placeholder = "Paste your http/magnet link here";
       } else if (type === "youtube-dl") {
-        this.placeholder = "Paste your video link here";
+        this.placeholder = t("ncdownloader", "Paste your video link here");
         this.path = this.uris.ytd_url;
       } else {
         this.path = this.uris.search_url;
@@ -97,6 +102,13 @@ export default {
     uploadFile(event, vm) {
       this.$emit("uploadfile", event, vm);
     },
+    optionCallback(option) {
+      if (option.label.toLowerCase() == "music") {
+        this.searchLabel = t("ncdownloader", "Search Music");
+      }else{
+        this.searchLabel = t("ncdownloader", "Search Torrents");
+      }
+    },
   },
   mounted() {},
   name: "mainForm",

src/components/searchInput.vue

@@ -2,8 +2,8 @@
   <div class="search-input" id="nc-vue-search-input">
     <textInput :placeholder="placeholder" dataType="search"></textInput>
     <div class="search-controls-container">
-      <div id="select-value-search">
-        <select :value="selected">
+      <div id="select-value-search-container">
+        <select :value="selected" @change="selectHandler" id="select-value-search">
           <option
             v-for="(option, key) in selectOptions"
             v-bind:key="key"
@@ -22,15 +22,17 @@
 <script>
 import textInput from "./textInput";
 import actionButton from "./actionButton";
+import { translate as t } from "@nextcloud/l10n";
 
 export default {
   data() {
     return {
-      placeholder: "Enter keyword to search",
+      placeholder: t("ncdownloader", "Enter keyword to search"),
       selected: "TPB",
       selectOptions: [
         { name: "TPB", label: "THEPIRATEBAY" },
         { name: "bitSearch", label: "BITSEARCH" },
+        { name: "sliderkz", label: "MUSIC" },
       ],
     };
   },
@@ -42,6 +44,13 @@ export default {
     search(event, btnVm) {
       this.$emit("search", event, btnVm);
     },
+    selectHandler(event) {
+      const data = {};
+      const element = event.target;
+      data.key = element.value;
+      data.label = element.options[element.selectedIndex].text;
+      this.$emit("optionSelected", data);
+    },
   },
   name: "searchInput",
   props: [],