See #161: initial poc/pos on App

.gitignore

@@ -92,4 +92,3 @@ po/*.po
 docs/swagger
 _build
 front/src/translations.json
-front/locales/*.pot

front/locales/app.pot

@@ -0,0 +1,66 @@
+# SOME DESCRIPTIVE TITLE.
+# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the front package.
+# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
+#
+#, fuzzy
+msgid ""
+msgstr ""
+"Project-Id-Version: front 1.0.0\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2018-06-30 11:34+0200\n"
+"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
+"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
+"Language-Team: LANGUAGE <LL@li.org>\n"
+"Language: \n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=utf-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/App.vue:51
+msgid "About Funkwhale"
+msgstr ""
+
+#: src/App.vue:53
+msgid "Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!"
+msgstr ""
+
+#: src/App.vue:29
+msgid "Links"
+msgstr ""
+
+#: src/App.vue:38
+msgid "Source code"
+msgstr ""
+
+#: src/App.vue:37
+msgid "Source code (%{version})"
+msgstr ""
+
+#: src/App.vue:56
+msgid "The funkwhale logo was kindly designed and provided by Francis Gading."
+msgstr ""
+
+#: src/App.vue:118
+msgid "This will erase your local data and disconnect you, do you want to continue?"
+msgstr ""
+
+#: src/App.vue:5
+msgid "Choose your instance"
+msgstr ""
+
+#: src/App.vue:7
+msgid "You need to select an instance in order to continue"
+msgstr ""
+
+#: src/App.vue:33
+msgid "About this instance"
+msgstr ""
+
+#: src/App.vue:36
+msgid "Documentation"
+msgstr ""
+
+#: src/App.vue:43
+msgid "Use another instance"
+msgstr ""

front/locales/en_US/LC_MESSAGES/app.po

@@ -0,0 +1,66 @@
+# English translations for front package.
+# Copyright (C) 2018 THE front'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the front package.
+# Automatically generated, 2018.
+#
+msgid ""
+msgstr ""
+"Project-Id-Version: front 1.0.0\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2018-06-30 11:34+0200\n"
+"PO-Revision-Date: 2018-06-30 11:34+0200\n"
+"Last-Translator: Automatically generated\n"
+"Language-Team: none\n"
+"Language: en_US\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+#: src/App.vue:51
+msgid "About Funkwhale"
+msgstr "About Funkwhale"
+
+#: src/App.vue:53
+msgid "Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!"
+msgstr "Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!"
+
+#: src/App.vue:29
+msgid "Links"
+msgstr "Links"
+
+#: src/App.vue:38
+msgid "Source code"
+msgstr "Source code"
+
+#: src/App.vue:37
+msgid "Source code (%{version})"
+msgstr "Source code (%{version})"
+
+#: src/App.vue:56
+msgid "The funkwhale logo was kindly designed and provided by Francis Gading."
+msgstr "The funkwhale logo was kindly designed and provided by Francis Gading."
+
+#: src/App.vue:118
+msgid "This will erase your local data and disconnect you, do you want to continue?"
+msgstr "This will erase your local data and disconnect you, do you want to continue?"
+
+#: src/App.vue:5
+msgid "Choose your instance"
+msgstr "Choose your instance"
+
+#: src/App.vue:7
+msgid "You need to select an instance in order to continue"
+msgstr "You need to select an instance in order to continue"
+
+#: src/App.vue:33
+msgid "About this instance"
+msgstr "About this instance"
+
+#: src/App.vue:36
+msgid "Documentation"
+msgstr "Documentation"
+
+#: src/App.vue:43
+msgid "Use another instance"
+msgstr "Use another instance"

front/locales/fr_FR/LC_MESSAGES/app.po

@@ -0,0 +1,66 @@
+# French translations for front package.
+# Copyright (C) 2018 THE front'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the front package.
+# Automatically generated, 2018.
+#
+msgid ""
+msgstr ""
+"Project-Id-Version: front 1.0.0\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2018-06-30 11:34+0200\n"
+"PO-Revision-Date: 2018-06-30 11:34+0200\n"
+"Last-Translator: Automatically generated\n"
+"Language-Team: none\n"
+"Language: fr\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n > 1);\n"
+
+#: src/App.vue:51
+msgid "About Funkwhale"
+msgstr ""
+
+#: src/App.vue:53
+msgid "Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!"
+msgstr ""
+
+#: src/App.vue:29
+msgid "Links"
+msgstr ""
+
+#: src/App.vue:38
+msgid "Source code"
+msgstr ""
+
+#: src/App.vue:37
+msgid "Source code (%{version})"
+msgstr ""
+
+#: src/App.vue:56
+msgid "The funkwhale logo was kindly designed and provided by Francis Gading."
+msgstr ""
+
+#: src/App.vue:118
+msgid "This will erase your local data and disconnect you, do you want to continue?"
+msgstr ""
+
+#: src/App.vue:5
+msgid "Choose your instance"
+msgstr ""
+
+#: src/App.vue:7
+msgid "You need to select an instance in order to continue"
+msgstr ""
+
+#: src/App.vue:33
+msgid "About this instance"
+msgstr ""
+
+#: src/App.vue:36
+msgid "Documentation"
+msgstr ""
+
+#: src/App.vue:43
+msgid "Use another instance"
+msgstr ""

front/src/App.vue

@@ -2,14 +2,14 @@
   <div id="app">
     <div class="ui main text container instance-chooser" v-if="!$store.state.instance.instanceUrl">
       <div class="ui padded segment">
-        <h1 class="ui header">{{ $t('Choose your instance') }}</h1>
+        <h1 class="ui header">{{ $gettext('Choose your instance') }}</h1>
         <form class="ui form" @submit.prevent="$store.dispatch('instance/setUrl', instanceUrl)">
-          <p>{{ $t('You need to select an instance in order to continue') }}</p>
+          <p>{{ $gettext('You need to select an instance in order to continue') }}</p>
           <div class="ui action input">
             <input type="text" v-model="instanceUrl">
-            <button type="submit" class="ui button">{{ $t('Submit') }}</button>
+            <button type="submit" class="ui button">{{ $gettext('Submit') }}</button>
           </div>
-          <p>{{ $t('Suggested choices') }}</p>
+          <p>{{ $gettext('Suggested choices') }}</p>
           <div class="ui bulleted list">
             <div class="ui item" v-for="url in suggestedInstances">
               <a @click="instanceUrl = url">{{ url }}</a>
@@ -27,20 +27,20 @@
         <div class="ui container">
           <div class="ui stackable equal height stackable grid">
             <div class="three wide column">
-              <i18next tag="h4" class="ui header" path="Links"></i18next>
+              <h4 v-translate class="ui header">Links</h4>
               <div class="ui link list">
                 <router-link class="item" to="/about">
-                  <i18next path="About this instance" />
+                  {{ $gettext('About this instance') }}
                 </router-link>
-                <a href="https://funkwhale.audio" class="item" target="_blank">{{ $t('Official website') }}</a>
+                <a href="https://funkwhale.audio" class="item" target="_blank">{{ $gettext('Official website') }}</a>
-                <a href="https://docs.funkwhale.audio" class="item" target="_blank">{{ $t('Documentation') }}</a>
+                <a href="https://docs.funkwhale.audio" class="item" target="_blank">{{ $gettext('Documentation') }}</a>
                 <a href="https://code.eliotberriot.com/funkwhale/funkwhale" class="item" target="_blank">
-                  <template v-if="version">{{ $t('Source code ({% version %})', {version: version}) }}</template>
+                  <translate :translate-params="{version: version}" v-if="version">Source code (%{version})</translate>
-                  <template v-else>{{ $t('Source code') }}</template>
+                  <translate v-else>Source code</translate>
                 </a>
-                <a href="https://code.eliotberriot.com/funkwhale/funkwhale/issues" class="item" target="_blank">{{ $t('Issue tracker') }}</a>
+                <a href="https://code.eliotberriot.com/funkwhale/funkwhale/issues" class="item" target="_blank">{{ $gettext('Issue tracker') }}</a>
                 <a @click="switchInstance" class="item" >
-                  {{ $t('Use another instance') }}
+                  {{ $gettext('Use another instance') }}
                   <template v-if="$store.state.instance.instanceUrl !== '/'">
                     <br>
                     ({{ $store.state.instance.instanceUrl }})
@@ -49,12 +49,12 @@
               </div>
             </div>
             <div class="ten wide column">
-              <i18next tag="h4" class="ui header" path="About funkwhale" />
+              <h4 v-translate class="ui header">About Funkwhale</h4>
               <p>
-                <i18next path="Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!"/>
+                <translate>Funkwhale is a free and open-source project run by volunteers. You can help us improve the platform by reporting bugs, suggesting features and share the project with your friends!</translate>
               </p>
               <p>
-                <i18next path="The funkwhale logo was kindly designed and provided by Francis Gading."/>
+                <translate>The funkwhale logo was kindly designed and provided by Francis Gading.</translate>
               </p>
             </div>
           </div>
@@ -115,7 +115,7 @@ export default {
       })
     },
     switchInstance () {
-      let confirm = window.confirm(this.$t('This will erase your local data and disconnect you, do you want to continue?'))
+      let confirm = window.confirm(this.$gettext('This will erase your local data and disconnect you, do you want to continue?'))
       if (confirm) {
         this.$store.commit('instance/instanceUrl', null)
       }