Use ft-input-tags for external player custom args

src/datastores/handlers/base.js

@@ -10,6 +10,21 @@ class Settings {
       await this.upsert('currentLocale', currentLocale.value.replace('_', '-'))
     }
 
+    // In FreeTube 0.22.0 and earlier the external player arguments were displayed in a text box,
+    // with the user manually entering `;` to separate the different arguments.
+    // This is a one time migration that converts the old string to a JSON array
+    const externalPlayerCustomArgs = await db.settings.findOneAsync({ _id: 'externalPlayerCustomArgs' })
+
+    if (externalPlayerCustomArgs && !externalPlayerCustomArgs.value.startsWith('[')) {
+      let newValue = '[]'
+
+      if (externalPlayerCustomArgs.value.length > 0) {
+        newValue = JSON.stringify(externalPlayerCustomArgs.value.split(';'))
+      }
+
+      await this.upsert('externalPlayerCustomArgs', newValue)
+    }
+
     return db.settings.findAsync({ _id: { $ne: 'bounds' } })
   }
 

src/renderer/components/external-player-settings/external-player-settings.js

@@ -5,6 +5,7 @@ import FtSelect from '../ft-select/ft-select.vue'
 import FtInput from '../ft-input/ft-input.vue'
 import FtToggleSwitch from '../ft-toggle-switch/ft-toggle-switch.vue'
 import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
+import FtInputTags from '../ft-input-tags/ft-input-tags.vue'
 
 export default defineComponent({
   name: 'ExternalPlayerSettings',
@@ -13,7 +14,8 @@ export default defineComponent({
     'ft-select': FtSelect,
     'ft-input': FtInput,
     'ft-toggle-switch': FtToggleSwitch,
-    'ft-flex-box': FtFlexBox
+    'ft-flex-box': FtFlexBox,
+    'ft-input-tags': FtInputTags
   },
   computed: {
     externalPlayerNames: function () {
@@ -44,7 +46,7 @@ export default defineComponent({
       return this.$store.getters.getExternalPlayerIgnoreDefaultArgs
     },
     externalPlayerCustomArgs: function () {
-      return this.$store.getters.getExternalPlayerCustomArgs
+      return JSON.parse(this.$store.getters.getExternalPlayerCustomArgs)
     },
     externalPlayerCustomArgsTooltip: function () {
       const tooltip = this.$t('Tooltips.External Player Settings.Custom External Player Arguments')
@@ -60,6 +62,10 @@ export default defineComponent({
     }
   },
   methods: {
+    handleExternalPlayerCustomArgs(value) {
+      this.updateExternalPlayerCustomArgs(JSON.stringify(value))
+    },
+
     ...mapActions([
       'updateExternalPlayer',
       'updateExternalPlayerExecutable',

src/renderer/components/external-player-settings/external-player-settings.vue

@@ -43,13 +43,16 @@
         :tooltip="$t('Tooltips.External Player Settings.Custom External Player Executable')"
         @input="updateExternalPlayerExecutable"
       />
-      <ft-input
-        :placeholder="$t('Settings.External Player Settings.Custom External Player Arguments')"
-        :show-action-button="false"
-        :show-label="true"
-        :value="externalPlayerCustomArgs"
+    </ft-flex-box>
+    <ft-flex-box
+      v-if="externalPlayer !== ''"
+    >
+      <ft-input-tags
+        :label="$t('Settings.External Player Settings.Custom External Player Arguments')"
+        :tag-name-placeholder="$t('Settings.External Player Settings.Custom External Player Arguments')"
+        :tag-list="externalPlayerCustomArgs"
         :tooltip="externalPlayerCustomArgsTooltip"
-        @input="updateExternalPlayerCustomArgs"
+        @change="handleExternalPlayerCustomArgs"
       />
     </ft-flex-box>
   </ft-settings-section>

src/renderer/store/modules/settings.js

@@ -190,7 +190,7 @@ const state = {
   externalPlayerExecutable: '',
   externalPlayerIgnoreWarnings: false,
   externalPlayerIgnoreDefaultArgs: false,
-  externalPlayerCustomArgs: '',
+  externalPlayerCustomArgs: '[]',
   expandSideBar: false,
   hideActiveSubscriptions: false,
   hideChannelCommunity: false,

src/renderer/store/modules/utils.js

@@ -689,20 +689,19 @@ const actions = {
     const customArgs = rootState.settings.externalPlayerCustomArgs
 
     if (ignoreDefaultArgs) {
-      if (typeof customArgs === 'string' && customArgs !== '') {
-        const custom = customArgs.split(';')
+      if (typeof customArgs === 'string' && customArgs !== '[]') {
+        const custom = JSON.parse(customArgs)
         args.push(...custom)
       }
       if (payload.videoId != null) args.push(`${cmdArgs.videoUrl}https://www.youtube.com/watch?v=${payload.videoId}`)
     } else {
       // Append custom user-defined arguments,
       // or use the default ones specified for the external player.
-      if (typeof customArgs === 'string' && customArgs !== '') {
-        const custom = customArgs.split(';')
+      if (typeof customArgs === 'string' && customArgs !== '[]') {
+        const custom = JSON.parse(customArgs)
         args.push(...custom)
-      } else if (typeof cmdArgs.defaultCustomArguments === 'string' && cmdArgs.defaultCustomArguments !== '') {
-        const defaultCustomArguments = cmdArgs.defaultCustomArguments.split(';')
-        args.push(...defaultCustomArguments)
+      } else if (Array.isArray(cmdArgs.defaultCustomArguments)) {
+        args.push(...cmdArgs.defaultCustomArguments)
       }
 
       if (payload.watchProgress > 0 && payload.watchProgress < payload.videoLength - 10) {

static/external-player-map.json

@@ -43,7 +43,7 @@
         "value": "iina",
         "cmdArguments": {
             "defaultExecutable": "iina",
-            "defaultCustomArguments": "--no-stdin",
+            "defaultCustomArguments": ["--no-stdin"],
             "supportsYtdlProtocol": true,
             "videoUrl": "",
             "playlistUrl": "",

static/locales/af.yaml

@@ -996,8 +996,7 @@ Tooltips:
     Ignore Default Arguments: 'Moet geen verstek argumente na die eksterne videospeler
       stuur buiten die video-URL nie (bv. afspeelsnelheid, afspeellys-URL, ens.).
       Pasgemaakte argumente word steeds deurgestuur.'
-    Custom External Player Arguments: 'Enige pasgemaakte bevellynrgumente, geskei
-      deur kommapunte (‘;’), wat u aan die eksterne videospeler vir deurgee.'
+    Custom External Player Arguments: 'Enige pasgemaakte bevellynrgumente, wat u aan die eksterne videospeler vir deurgee.'
     DefaultCustomArgumentsTemplate: "(verstek: ‘{defaultCustomArguments}’)"
   Distraction Free Settings:
     Hide Channels: 'Voer ’n kanaal-ID in om alle video’s, afspeellyste en die kanaal

static/locales/be.yaml

@@ -1054,7 +1054,7 @@ Tooltips:
     Ignore Warnings: 'Адключыць папярэджанні, калі бягучы вонкавы прайгравальнік не
       падтрымлівае бягучае дзеянне (напрыклад, пераварочванне плэй-ліста і г.д.).'
     Custom External Player Arguments: 'Любыя карыстальніцкія аргументы каманднага
-      радка, падзеленыя кропкай з коскай ('';''), якія вы хочаце перадаць вонкаваму
+      радка, якія вы хочаце перадаць вонкаваму
       прайгравальніку.'
     DefaultCustomArgumentsTemplate: "(Па змаўчанні: '{defaultCustomArguments}')"
     Ignore Default Arguments: Не адпраўляйце ніякіх аргументаў па змаўчанні на вонкавы

static/locales/bg.yaml

@@ -1054,7 +1054,7 @@ Tooltips:
       FreeTube ще отвори връзката в браузъра по подразбиране.\n"
   External Player Settings:
     Custom External Player Arguments: Всички персонализирани аргументи от командния
-      ред, разделени с точка и запетая (";"), които искате да бъдат предадени на външния
+      ред, които искате да бъдат предадени на външния
       плейър.
     Ignore Warnings: Премахване на предупрежденията, когато текущият външен плейър
       не поддържа текущото действие (напр. обръщане на плейлисти и др.).

static/locales/br.yaml

@@ -1138,7 +1138,7 @@ Tooltips:
       nemet URL ar video (d.s. feur lenn, URL ar roll-videoioù, etc.). Treuzkaset
       e vo an arguzennoù personelaet.'
     Custom External Player Arguments: 'An holl arguzennoù personelaet el linennoù
-      urzhiañ, dispartiet gant poentoù-virgulenn ('';''), a faot deoc''h e vefe treuzkaset
+      urzhiañ, a faot deoc''h e vefe treuzkaset
       d''al lenner diavaez.'
     DefaultCustomArgumentsTemplate: "(Dre ziouer : '{defaultCustomArguments}')"
   Distraction Free Settings:

static/locales/cs.yaml

@@ -1058,7 +1058,7 @@ Tooltips:
       seznamu skladeb, pokud je podporován) v externím přehrávači, na náhledu. Varování,
       nastavení Invidious neovlivňují externí přehrávače.
     Custom External Player Arguments: Jakékoliv vlastní argumenty příkazové řádky,
-      oddělené středníkem (';'), které chcete předávat externímu přehrávač.
+      které chcete předávat externímu přehrávač.
     Custom External Player Executable: Ve výchozím nastavení Freetube předpokládá,
       že vybraný externí přehrávač lze nalézt přes proměnnou prostředí cesty PATH.
       V případě potřeby zde lze nastavit vlastní cestu.

static/locales/da.yaml

@@ -910,7 +910,7 @@ Tooltips:
       kan blive angivet her hvis det er nødvendigt.
     DefaultCustomArgumentsTemplate: "(Standard: '{defaultCustomArguments}')"
     Custom External Player Arguments: Alle brugerdefinerede kommandolinjeargumenter,
-      opdelt med semikoloner (';'), du ønsker viderebragt til den eksterne afspiller.
+      du ønsker viderebragt til den eksterne afspiller.
     External Player: 'Valg af ekstern afspiller vil fremvise et ikon, for åbning af
       videoen (playliste hvis understøttet) i den eksterne afspiller, på miniaturebilledet.
       Advarsel: Invidious-indstillinger har ingen effekt på eksterne afspillere.'

static/locales/de-DE.yaml

@@ -1103,8 +1103,7 @@ Tooltips:
       zu springen, MPV-Stil.
   External Player Settings:
     Custom External Player Arguments: Alle benutzerdefinierten Befehlszeilenargumente,
-      getrennt durch Semikolon (';'), die an den externen Abspieler übergeben werden
-      sollen.
+      die an den externen Abspieler übergeben werden sollen.
     Ignore Warnings: Warnungen unterdrücken, wenn der aktuelle externe Abspieler die
       aktuelle Aktion nicht unterstützt (z. B. das Umkehren von Wiedergabelisten usw.).
     Custom External Player Executable: Standardmäßig wird FreeTube annehmen, dass

static/locales/el.yaml

@@ -879,7 +879,7 @@ Tooltips:
       ρυθμίσεις δεν επηρεάζουν τις εξωτερικές συσκευές αναπαραγωγής.
     DefaultCustomArgumentsTemplate: "(Προεπιλογή: '{defaultCustomArguments}')"
     Custom External Player Arguments: Τυχόν προσαρμοσμένα ορίσματα γραμμής εντολών,
-      διαχωρισμένα με ερωτηματικά (';'), που θέλετε να μεταβιβαστούν στο εξωτερικό
+      που θέλετε να μεταβιβαστούν στο εξωτερικό
       πρόγραμμα αναπαραγωγής.
   Experimental Settings:
     Replace HTTP Cache: Απενεργοποιεί το Electron's disk-based HTTP cache και ενεργοποιεί

static/locales/en-GB.yaml

@@ -1063,8 +1063,7 @@ Tooltips:
     Ignore Default Arguments: Do not send any default arguments to the external player
       aside from the video URL (e.g. playback rate, playlist URL, etc.). Custom arguments
       will still be passed on.
-    Custom External Player Arguments: Any custom command line arguments, separated
-      by semicolons (';'), you want to be passed to the external player.
+    Custom External Player Arguments: Any custom command line arguments you want to be passed on to the external player.
     DefaultCustomArgumentsTemplate: '(Default: ‘{defaultCustomArguments}’)'
   Experimental Settings:
     Replace HTTP Cache: Disables Electron's disk-based HTTP cache and enables a custom

static/locales/en-US.yaml

@@ -1029,8 +1029,7 @@ Tooltips:
     Ignore Default Arguments: Do not send any default arguments to the external player
       aside from the video URL (e.g. playback rate, playlist URL, etc.).
       Custom arguments will still be passed on.
-    Custom External Player Arguments: Any custom command line arguments, separated by semicolons (';'),
-      you want to be passed to the external player.
+    Custom External Player Arguments: Any custom command line arguments you want to be passed on to the external player.
     DefaultCustomArgumentsTemplate: "(Default: '{defaultCustomArguments}')"
   Distraction Free Settings:
     Hide Channels: Enter a channel ID to hide all videos, playlists and the channel itself from appearing in search, trending, most popular and recommended.

static/locales/es-MX.yaml

@@ -635,8 +635,7 @@ Tooltips:
       problema, FreeTube intentará usar automáticamente otra API como método de respaldo
       al activar esta opción.
   External Player Settings:
-    Custom External Player Arguments: Cualquier argumento, con separaciones de punto
-      y coma (';'), que deseé anticipar al reproductor externo.
+    Custom External Player Arguments: Cualquier argumento, que deseé anticipar al reproductor externo.
     DefaultCustomArgumentsTemplate: "(Por defecto: '{defaultCustomArguments}')"
     External Player: Elegir un reproductor externo mostrará un ícono, para abrir el
       video (o lista, si es compatible) en el reproductor externo, sobre la miniatura

static/locales/eu.yaml

@@ -1077,7 +1077,7 @@ Tooltips:
       zerrenda (posible bada) irekitzerakoan, ikono bat agertuko da miniaturan. Kontuz,
       Individious-en ezarpenek ez dituzte kanpo erreproduzitzaileak trabatzen.
     Custom External Player Arguments: Komando-lerroko argumentu pertsonalizatuak,
-      puntu eta komaz bereizita (';'), kanpoko erreproduzitzailera pasatzea nahi duzu.
+      kanpoko erreproduzitzailera pasatzea nahi duzu.
     Ignore Default Arguments: Ez bidali argumentu lehenetsirik kanpoko erreproduzitzaileari
       bideoaren URLaz gain (adibidez, erreprodukzio-tasa, erreprodukzio-zerrendaren
       URLa, etab.). Argumentu pertsonalizatuak transmitituko dira oraindik.

static/locales/fi.yaml

@@ -892,8 +892,7 @@ Tooltips:
       MPV-tyyliin.
   External Player Settings:
     Custom External Player Arguments: Kaikki ne omavalintaiset komentorivin määreet,
-      puolipisteillä eroteltuina (';'), jotka haluat siirtää eteenpäin ulkoiselle
-      toisto-ohjelmalle.
+      jotka haluat siirtää eteenpäin ulkoiselle toisto-ohjelmalle.
     Ignore Warnings: Estä varoitukset, kun käytetty ulkoinen toisto-ohjelma ei tue
       määrättyä toimintamallia (kuten käänteiset soittoluettelot, jne.).
     Custom External Player Executable: Vakiollisesti FreeTube olettaa, että valittu

static/locales/fr-FR.yaml

@@ -1117,8 +1117,7 @@ Tooltips:
       le lien dans votre navigateur par défaut.\n"
   External Player Settings:
     Custom External Player Arguments: Tous les arguments de ligne de commande personnalisés,
-      séparés par des points-virgules (';'), que vous souhaitez transmettre au lecteur
-      externe.
+      que vous souhaitez transmettre au lecteur externe.
     Ignore Warnings: Suppression des avertissements lorsque le lecteur externe actuel
       ne prend pas en charge l'action en cours (par exemple, inversion des listes
       de lecture, etc.).

static/locales/gl.yaml

@@ -749,7 +749,7 @@ Tooltips:
       teu feed da subscrición, cando se abra unha nova ventá e cando cambies de perfil.
   External Player Settings:
     Custom External Player Arguments: Calquera argumento de liña de comandos personalizado,
-      separado por puntos e coma (';'), que desexa que se pase ao reprodutor externo.
+      que desexa que se pase ao reprodutor externo.
     Ignore Warnings: Suprime avisos para cando os reprodutores externos actuais non
       apoian a acción actual (e.g. Invertendo listas de reprodución, etc.).
     Custom External Player Executable: Por defecto, FreeTube asumirá que o reprodutor

static/locales/hr.yaml

@@ -1043,7 +1043,7 @@ Tooltips:
       videa (zbirka, ako je podržana) u vanjskom playeru, na minijaturi. Upozorenje,
       Invidious postavke ne utječu na vanjske playere.
     Custom External Player Arguments: Svi prilagođeni argumenti naredbenog retka,
-      odvojene točka-zarezom (;), koje želiš da se proslijede vanjskom playeru.
+      koje želiš da se proslijede vanjskom playeru.
     Ignore Warnings: Nemoj prikazati upozorenja kad trenutačni vanjski player ne podržava
       trenutačnu radnju (npr. preokretanje redoslijeda zbirke itd.).
     Custom External Player Executable: Prema standardnim postavkama, FreeTube će pretpostaviti

static/locales/id.yaml

@@ -849,8 +849,8 @@ Tooltips:
       dibuka di FreeTube, diklik.\nSecara default FreeTube akan membuka tautan yang
       diklik dengan browser default Anda.\n"
   External Player Settings:
-    Custom External Player Arguments: Semua argumen perintah khusus, dipisahkan dengan
-      titik koma (';'), yang Anda ingin gunakan dengan pemutar eksternal.
+    Custom External Player Arguments: Semua argumen perintah khusus,
+      yang Anda ingin gunakan dengan pemutar eksternal.
     Ignore Warnings: Jangan tampilkan peringatan saat pemutar eksternal saat ini tidak
       mendukung tindakan yang ada (mis. membalik urutan daftar putar, dsb.).
     Custom External Player Executable: Secara bawaan, FreeTube akan berasumsi bahwa

static/locales/is.yaml

@@ -1062,8 +1062,8 @@ Tooltips:
     Fetch Automatically: Þegar þetta er virkt, mun FreeTube sækja sjálfkrafa áskriftarstreymin
       þín þegar nýr gluggi er opnaður og þegar skipt er um notkunarsnið.
   External Player Settings:
-    Custom External Player Arguments: Öll sérsniðin skipanaviðföng og rofar, aðskilin
-      með semíkommum (';'), sem beina á til utanaðkomandi spilarans.
+    Custom External Player Arguments: Öll sérsniðin skipanaviðföng og rofar,
+      sem beina á til utanaðkomandi spilarans.
     Ignore Warnings: Hunsa aðvarinir þegar valinn utanaðkomandi spilari styður ekki
       viðkomandi aðgerð (t.d. að snúa við spilunarlista, o.s.frv.).
     Custom External Player Executable: Sjálfgefið gengur FreeTube út frá því að valinn

static/locales/it.yaml

@@ -1097,7 +1097,7 @@ Tooltips:
     Ignore Warnings: Non notifica gli avvisi quando il lettore esterno selezionato
       non supporta l'azione richiesta (ad esempio invertire la playlist, etc.).
     Custom External Player Arguments: Invia al lettore esterno qualsiasi argomento
-      personalizzato dalla linea di comando, separato da punto e virgola (';').
+      personalizzato dalla linea di comando.
     Custom External Player Executable: Per impostazione predefinita, FreeTube imposta
       il lettore esterno scelto tramite la variabile d'ambiente PATH. Se necessario,
       un percorso personalizzato può essere impostato qui.

static/locales/lt.yaml

@@ -729,8 +729,7 @@ Tooltips:
     Ignore Warnings: 'Neatvaizduoti įspėjimų, kai dabartinis išorinis grotuvas nepalaiko
       dabartinio veiksmo (pvz., grojaraščių atkūrimas ir kt.).'
     Custom External Player Arguments: 'Bet kokius pasirinktinius komandinės eilutės
-      argumentus, atskirtus kabliataškiais ('';''), kuriuos norite perduoti išoriniam
-      grotuvui.'
+      argumentus, kuriuos norite perduoti išoriniam grotuvui.'
     DefaultCustomArgumentsTemplate: '(Numatytasis: „{defaultCustomArguments}“)'
   Subscription Settings:
     Fetch Feeds from RSS: 'Kai bus įgalinta, „FreeTube“ naudos RSS, o ne numatytąjį

static/locales/nl.yaml

@@ -1015,8 +1015,8 @@ Tooltips:
       kan worden geopend in FreeTube is aangeklikt.\nStandaard zal FreeTube de aangeklikte
       link openen in je standaardbrowser.\n"
   External Player Settings:
-    Custom External Player Arguments: Aangepaste opdrachtregelargumenten, gescheiden
-      door puntkomma's (';'), die je wil doorgeven aan de externe videospeler.
+    Custom External Player Arguments: Aangepaste opdrachtregelargumenten,
+      die je wil doorgeven aan de externe videospeler.
     Ignore Warnings: Onderdruk waarschuwingen wanneer de geselecteerde videospeler
       een opgegeven actie niet ondersteund (bijv. afspeellijsten omkeren, etc.).
     Custom External Player Executable: Standaard gaat FreeTube er vanuit dat de gekozen