Add:Start of localization i18n #1103

2024-12-20 19:06:06 +01:00 · 2022-11-06 17:56:44 -06:00 · 2022-11-06 17:56:44 -06:00 · eb463a2958
commit eb463a2958
parent 3282ac67e4
13 changed files with 367 additions and 55 deletions
--- a/client/components/app/SideRail.vue
+++ b/client/components/app/SideRail.vue
@ -9,7 +9,7 @@
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
      </svg>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Home</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonHome }}</p>

      <div v-show="homePage" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -17,7 +17,7 @@
    <nuxt-link v-if="isPodcastLibrary" :to="`/library/${currentLibraryId}/podcast/latest`" class="w-full h-20 flex flex-col items-center justify-center text-white border-b border-primary border-opacity-70 hover:bg-primary cursor-pointer relative" :class="isPodcastLatestPage ? 'bg-primary bg-opacity-80' : 'bg-bg bg-opacity-60'">
      <span class="material-icons">format_list_bulleted</span>

-      <p class="font-book pt-1" style="font-size: 0.9rem">Latest</p>
+      <p class="font-book pt-1" style="font-size: 0.9rem">{{ $strings.ButtonLatest }}</p>

      <div v-show="isPodcastLatestPage" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -27,7 +27,7 @@
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" />
      </svg>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Library</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonLibrary }}</p>

      <div v-show="showLibrary" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -37,7 +37,7 @@
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17V7m0 10a2 2 0 01-2 2H5a2 2 0 01-2-2V7a2 2 0 012-2h2a2 2 0 012 2m0 10a2 2 0 002 2h2a2 2 0 002-2M9 7a2 2 0 012-2h2a2 2 0 012 2m0 10V7m0 10a2 2 0 002 2h2a2 2 0 002-2V7a2 2 0 00-2-2h-2a2 2 0 00-2 2" />
      </svg>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Series</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonSeries }}</p>

      <div v-show="isSeriesPage" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -45,7 +45,7 @@
    <nuxt-link v-if="!isPodcastLibrary" :to="`/library/${currentLibraryId}/bookshelf/collections`" class="w-full h-20 flex flex-col items-center justify-center text-white text-opacity-80 border-b border-primary border-opacity-70 hover:bg-primary cursor-pointer relative" :class="paramId === 'collections' ? 'bg-primary bg-opacity-80' : 'bg-bg bg-opacity-60'">
      <span class="material-icons-outlined">collections_bookmark</span>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Collections</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonCollections }}</p>

      <div v-show="paramId === 'collections'" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -58,7 +58,7 @@
        />
      </svg>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Authors</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonAuthors }}</p>

      <div v-show="isAuthorsPage" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -66,7 +66,7 @@
    <nuxt-link v-if="isPodcastLibrary && userIsAdminOrUp" :to="`/library/${currentLibraryId}/podcast/search`" class="w-full h-20 flex flex-col items-center justify-center text-white text-opacity-80 border-b border-primary border-opacity-70 hover:bg-primary cursor-pointer relative" :class="isPodcastSearchPage ? 'bg-primary bg-opacity-80' : 'bg-bg bg-opacity-60'">
      <span class="abs-icons icon-podcast text-xl"></span>

-      <p class="font-book pt-1.5" style="font-size: 0.9rem">Search</p>
+      <p class="font-book pt-1.5" style="font-size: 0.9rem">{{ $strings.ButtonSearch }}</p>

      <div v-show="isPodcastSearchPage" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
    </nuxt-link>
@ -74,7 +74,7 @@
    <nuxt-link v-if="numIssues" :to="`/library/${currentLibraryId}/bookshelf?filter=issues`" class="w-full h-20 flex flex-col items-center justify-center text-white text-opacity-80 border-b border-primary border-opacity-70 hover:bg-opacity-40 cursor-pointer relative" :class="showingIssues ? 'bg-error bg-opacity-40' : ' bg-error bg-opacity-20'">
      <span class="material-icons text-2xl">warning</span>

-      <p class="font-book pt-1.5" style="font-size: 1rem">Issues</p>
+      <p class="font-book pt-1.5" style="font-size: 1rem">{{ $strings.ButtonIssues }}</p>

      <div v-show="showingIssues" class="h-full w-0.5 bg-yellow-400 absolute top-0 left-0" />
      <div class="absolute top-1 right-1 w-4 h-4 rounded-full bg-white bg-opacity-30 flex items-center justify-center">
--- a/client/components/controls/GlobalSearch.vue
+++ b/client/components/controls/GlobalSearch.vue
@ -1,7 +1,7 @@
 <template>
  <div class="sm:w-80 w-full relative">
    <form @submit.prevent="submitSearch">
-      <ui-text-input ref="input" v-model="search" placeholder="Search.." @input="inputUpdate" @focus="focussed" @blur="blurred" class="w-full h-8 text-sm" />
+      <ui-text-input ref="input" v-model="search" :placeholder="$strings.SearchPlaceholder" @input="inputUpdate" @focus="focussed" @blur="blurred" class="w-full h-8 text-sm" />
    </form>
    <div class="absolute top-0 right-0 bottom-0 h-full flex items-center px-2 text-gray-400 cursor-pointer" @click="clickClear">
      <span v-if="!search" class="material-icons" style="font-size: 1.2rem">search</span>
--- a/client/components/tables/UsersTable.vue
+++ b/client/components/tables/UsersTable.vue
@ -1,7 +1,7 @@
 <template>
  <div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
    <div class="flex items-center mb-2">
-      <h1 class="text-xl">Users</h1>
+      <h1 class="text-xl">{{ $strings.HeaderUsers }}</h1>
      <div class="mx-2 w-7 h-7 flex items-center justify-center rounded-full cursor-pointer hover:bg-white hover:bg-opacity-10 text-center" @click="clickAddUser">
        <span class="material-icons" style="font-size: 1.4rem">add</span>
      </div>
--- a/client/components/tables/library/LibrariesTable.vue
+++ b/client/components/tables/library/LibrariesTable.vue
@ -1,7 +1,7 @@
 <template>
  <div id="librariesTable" class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
    <div class="flex items-center mb-2">
-      <h1 class="text-xl">Libraries</h1>
+      <h1 class="text-xl">{{ $strings.HeaderLibraries }}</h1>
      <div class="mx-2 w-7 h-7 flex items-center justify-center rounded-full cursor-pointer hover:bg-white hover:bg-opacity-10 text-center" @click="clickAddLibrary">
        <span class="material-icons" style="font-size: 1.4rem">add</span>
      </div>
--- a/client/nuxt.config.js
+++ b/client/nuxt.config.js
@ -52,7 +52,8 @@ module.exports = {
    '@/plugins/init.client.js',
    '@/plugins/axios.js',
    '@/plugins/toast.js',
-    '@/plugins/utils.js'
+    '@/plugins/utils.js',
+    '@/plugins/i18n.js'
  ],

  // Auto import components: https://go.nuxtjs.dev/config-components
--- a/client/pages/account.vue
+++ b/client/pages/account.vue
@ -1,35 +1,35 @@
 <template>
  <div id="page-wrapper" class="page p-6 overflow-y-auto relative" :class="streamLibraryItem ? 'streaming' : ''">
    <div class="w-full max-w-xl mx-auto">
-      <h1 class="text-2xl">Account</h1>
+      <h1 class="text-2xl">{{ $strings.HeaderAccount }}</h1>

      <div class="my-4">
        <div class="flex -mx-2">
          <div class="w-2/3 px-2">
-            <ui-text-input-with-label disabled :value="username" label="Username" />
+            <ui-text-input-with-label disabled :value="username" :label="$strings.LabelUsername" />
          </div>
          <div class="w-1/3 px-2">
-            <ui-text-input-with-label disabled :value="usertype" label="Account Type" />
+            <ui-text-input-with-label disabled :value="usertype" :label="$strings.LabelAccountType" />
          </div>
        </div>

        <div class="w-full h-px bg-primary my-4" />

-        <p v-if="!isGuest" class="mb-4 text-lg">Change Password</p>
+        <p v-if="!isGuest" class="mb-4 text-lg">{{ $strings.HeaderChangePassword }}</p>
        <form v-if="!isGuest" @submit.prevent="submitChangePassword">
-          <ui-text-input-with-label v-model="password" :disabled="changingPassword" type="password" label="Password" class="my-2" />
-          <ui-text-input-with-label v-model="newPassword" :disabled="changingPassword" type="password" label="New Password" class="my-2" />
-          <ui-text-input-with-label v-model="confirmPassword" :disabled="changingPassword" type="password" label="Confirm Password" class="my-2" />
+          <ui-text-input-with-label v-model="password" :disabled="changingPassword" type="password" :label="$strings.LabelPassword" class="my-2" />
+          <ui-text-input-with-label v-model="newPassword" :disabled="changingPassword" type="password" :label="$strings.LabelNewPassword" class="my-2" />
+          <ui-text-input-with-label v-model="confirmPassword" :disabled="changingPassword" type="password" :label="$strings.LabelConfirmPassword" class="my-2" />
          <div class="flex items-center py-2">
-            <p v-if="isRoot" class="text-error py-2 text-xs">* Root user is the only user that can have an empty password</p>
+            <p v-if="isRoot" class="text-error py-2 text-xs">* {{ $strings.NoteChangeRootPassword }}</p>
            <div class="flex-grow" />
-            <ui-btn v-show="(password && newPassword && confirmPassword) || isRoot" type="submit" :loading="changingPassword" color="success">Submit</ui-btn>
+            <ui-btn v-show="(password && newPassword && confirmPassword) || isRoot" type="submit" :loading="changingPassword" color="success">{{ $strings.ButtonChangePasswordSubmit }}</ui-btn>
          </div>
        </form>
      </div>

      <div class="py-4 mt-8 flex">
-        <ui-btn color="primary flex items-center text-lg" @click="logout"><span class="material-icons mr-4 icon-text">logout</span>Logout</ui-btn>
+        <ui-btn color="primary flex items-center text-lg" @click="logout"><span class="material-icons mr-4 icon-text">logout</span>{{ $strings.ButtonLogout }}</ui-btn>
      </div>
    </div>
  </div>
--- a/client/pages/config/index.vue
+++ b/client/pages/config/index.vue
@ -2,19 +2,19 @@
  <div>
    <div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-2">
      <div class="mb-2">
-        <h1 class="text-xl">Settings</h1>
+        <h1 class="text-xl">{{ $strings.HeaderSettings }}</h1>
      </div>

      <div class="lg:flex">
        <div class="flex-1">
          <div class="pt-4">
-            <h2 class="font-semibold">General</h2>
+            <h2 class="font-semibold">{{ $strings.HeaderSettingsGeneral }}</h2>
          </div>
          <div class="flex items-end py-2">
            <ui-toggle-switch v-model="newServerSettings.storeCoverWithItem" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('storeCoverWithItem', val)" />
-            <ui-tooltip :text="tooltips.storeCoverWithItem">
+            <ui-tooltip :text="$strings.LabelSettingsStoreCoversWithItemHelp">
              <p class="pl-4">
-                Store covers with item
+                {{ $strings.LabelSettingsStoreCoversWithItem }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
@ -22,9 +22,9 @@

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="newServerSettings.storeMetadataWithItem" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('storeMetadataWithItem', val)" />
-            <ui-tooltip :text="tooltips.storeMetadataWithItem">
+            <ui-tooltip :text="$strings.LabelSettingsStoreMetadataWithItemHelp">
              <p class="pl-4">
-                Store metadata with item
+                {{ $strings.LabelSettingsStoreMetadataWithItem }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
@ -32,31 +32,31 @@

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="newServerSettings.sortingIgnorePrefix" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('sortingIgnorePrefix', val)" />
-            <ui-tooltip :text="tooltips.sortingIgnorePrefix">
+            <ui-tooltip :text="$strings.LabelSettingsSortingIgnorePrefixesHelp">
              <p class="pl-4">
-                Ignore prefixes when sorting
+                {{ $strings.LabelSettingsSortingIgnorePrefixes }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
          </div>
          <div v-if="newServerSettings.sortingIgnorePrefix" class="w-72 ml-14 mb-2">
-            <ui-multi-select v-model="newServerSettings.sortingPrefixes" small :items="newServerSettings.sortingPrefixes" label="Prefixes to Ignore (case insensitive)" @input="updateSortingPrefixes" :disabled="updatingServerSettings" />
+            <ui-multi-select v-model="newServerSettings.sortingPrefixes" small :items="newServerSettings.sortingPrefixes" :label="$strings.LabelPrefixesToIgnore" @input="updateSortingPrefixes" :disabled="updatingServerSettings" />
          </div>

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="newServerSettings.chromecastEnabled" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('chromecastEnabled', val)" />
-            <p class="pl-4">Chromecast support</p>
+            <p class="pl-4">{{ $strings.LabelSettingsChromecastSupport }}</p>
          </div>

          <div class="pt-4">
-            <h2 class="font-semibold">Display</h2>
+            <h2 class="font-semibold">{{ $strings.HeaderSettingsDisplay }}</h2>
          </div>

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="homepageUseBookshelfView" :disabled="updatingServerSettings" @input="updateHomeUseBookshelfView" />
-            <ui-tooltip :text="tooltips.bookshelfView">
+            <ui-tooltip :text="$strings.LabelSettingsBookshelfViewHelp">
              <p class="pl-4">
-                Home page use bookshelf view
+                {{ $strings.LabelSettingsHomePageBookshelfView }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
@ -64,30 +64,30 @@

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="useBookshelfView" :disabled="updatingServerSettings" @input="updateUseBookshelfView" />
-            <ui-tooltip :text="tooltips.bookshelfView">
+            <ui-tooltip :text="$strings.LabelSettingsBookshelfViewHelp">
              <p class="pl-4">
-                Library use bookshelf view
+                {{ $strings.LabelSettingsLibraryBookshelfView }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
          </div>

          <div class="flex items-center py-2">
-            <p class="pr-4">Date Format</p>
+            <p class="pr-4">{{ $strings.LabelSettingsDateFormat }}</p>
            <ui-dropdown v-model="newServerSettings.dateFormat" :items="dateFormats" small class="max-w-40" @input="(val) => updateSettingsKey('dateFormat', val)" />
          </div>
        </div>

        <div class="flex-1">
          <div class="pt-4">
-            <h2 class="font-semibold">Scanner</h2>
+            <h2 class="font-semibold">{{ $strings.HeaderSettingsScanner }}</h2>
          </div>

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="newServerSettings.scannerParseSubtitle" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerParseSubtitle', val)" />
-            <ui-tooltip :text="tooltips.scannerParseSubtitle">
+            <ui-tooltip :text="$strings.LabelSettingsParseSubtitlesHelp">
              <p class="pl-4">
-                Parse subtitles
+                {{ $strings.LabelSettingsParseSubtitles }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
@ -95,9 +95,9 @@

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="newServerSettings.scannerFindCovers" :disabled="updatingServerSettings" @input="(val) => updateSettingsKey('scannerFindCovers', val)" />
-            <ui-tooltip :text="tooltips.scannerFindCovers">
+            <ui-tooltip :text="$strings.LabelSettingsFindCoversHelp">
              <p class="pl-4">
-                Find covers
+                {{ $strings.LabelSettingsFindCovers }}
                <span class="material-icons icon-text text-sm">info_outlined</span>
              </p>
            </ui-tooltip>
@ -168,14 +168,14 @@
          </div> -->

          <div class="pt-4">
-            <h2 class="font-semibold">Experimental Features</h2>
+            <h2 class="font-semibold">{{ $strings.HeaderSettingsExperimental }}</h2>
          </div>

          <div class="flex items-center py-2">
            <ui-toggle-switch v-model="showExperimentalFeatures" />
            <ui-tooltip :text="tooltips.experimentalFeatures">
              <p class="pl-4">
-                Experimental Features
+                Experimental features
                <a href="https://github.com/advplyr/audiobookshelf/discussions/75" target="_blank">
                  <span class="material-icons icon-text text-sm">info_outlined</span>
                </a>
@ -210,14 +210,14 @@

    <div class="flex items-center py-4">
      <div class="flex-grow" />
-      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeCache">Purge All Cache</ui-btn>
-      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeItemsCache">Purge Items Cache</ui-btn>
-      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isResettingLibraryItems" @click="resetLibraryItems">Remove All Library Items</ui-btn>
+      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeCache">{{ $strings.ButtonPurgeAllCache }}</ui-btn>
+      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isPurgingCache" @click.stop="purgeItemsCache">{{ $strings.ButtonPurgeItemsCache }}</ui-btn>
+      <ui-btn color="bg" small :padding-x="4" class="hidden lg:block mr-2" :loading="isResettingLibraryItems" @click="resetLibraryItems">{{ $strings.ButtonRemoveAllLibraryItems }}</ui-btn>
    </div>
    <div class="flex items-center py-4">
      <div class="flex-grow" />
      <p class="pr-2 text-sm font-book text-yellow-400">
-        Report bugs, request features, and contribute on
+        {{ $strings.MessageReportBugsAndContribute }}
        <a class="underline" href="https://github.com/advplyr/audiobookshelf" target="_blank">github</a>
      </p>
      <a href="https://github.com/advplyr/audiobookshelf" target="_blank" class="text-white hover:text-gray-200 hover:scale-150 hover:rotate-6 transform duration-500">
@ -282,12 +282,6 @@ export default {
        scannerPreferOpfMetadata: 'OPF file metadata will be used for book details over folder names',
        scannerPreferMatchedMetadata: 'Matched data will overide book details when using Quick Match',
        scannerPreferAudioMetadata: 'Audio file ID3 meta tags will be used for book details over folder names',
-        scannerParseSubtitle: 'Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by " - "<br>i.e. "Book Title - A Subtitle Here" has the subtitle "A Subtitle Here"',
-        sortingIgnorePrefix: 'i.e. for prefix "the" book title "The Book Title" would sort as "Book Title, The"',
-        scannerFindCovers: 'If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time',
-        bookshelfView: 'Skeumorphic design with wooden shelves',
-        storeCoverWithItem: 'By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named "cover" will be kept',
-        storeMetadataWithItem: 'By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension',
        enableEReader: 'E-reader is still a work in progress, but use this setting to open it up to all your users (or use the "Experimental Features" toggle just for use by you)',
        scannerPreferOverdriveMediaMarker: 'MP3 files from Overdrive come with chapter timings embedded as custom metadata. Enabling this will use these tags for chapter timings automatically',
        scannerUseSingleThreadedProber: 'The old scanner used a single thread. Leaving it in to use as a comparison for now.',
--- a/client/plugins/i18n.js
+++ b/client/plugins/i18n.js
@ -0,0 +1,47 @@
+import Vue from "vue"
+
+const defaultCode = 'en-us'
+
+Vue.prototype.$i18nCode = ''
+Vue.prototype.$strings = {}
+
+var translations = {}
+
+function loadTranslationStrings(code) {
+  return new Promise((resolve) => {
+    import(`../strings/${code}`).then((fileContents) => {
+      resolve(fileContents.default)
+    }).catch((error) => {
+      console.error('Failed to load i18n strings', code, error)
+      resolve({})
+    })
+  })
+}
+
+async function loadi18n(code) {
+  if (Vue.prototype.$i18nCode == code) {
+    // already set
+    return
+  }
+
+  const currentCode = Vue.prototype.$i18nCode
+  const strings = translations[code] || await loadTranslationStrings(code)
+
+  translations[code] = strings
+  Vue.prototype.$i18nCode = code
+
+  if (!currentCode) {
+    // first load
+    Vue.prototype.$strings = strings
+    return
+  }
+
+  for (const key in Vue.prototype.$strings) {
+    Vue.prototype.$strings[key] = strings[key] || translations[defaultCode][key]
+  }
+  console.log('i18n strings=', Vue.prototype.$strings)
+}
+
+Vue.prototype.$i18nUpdate = loadi18n
+
+loadi18n(defaultCode)
--- a/client/strings/en-us.json
+++ b/client/strings/en-us.json
@ -0,0 +1,54 @@
+{
+  "ButtonHome": "Home",
+  "ButtonLatest": "Latest",
+  "ButtonLibrary": "Library",
+  "ButtonSeries": "Series",
+  "ButtonCollections": "Collections",
+  "ButtonAuthors": "Authors",
+  "ButtonSearch": "Search",
+  "ButtonIssues": "Issues",
+  "ButtonChangePasswordSubmit": "Submit",
+  "ButtonLogout": "Logout",
+  "ButtonPurgeAllCache": "Purge All Cache",
+  "ButtonPurgeItemsCache": "Purge Items Cache",
+  "ButtonRemoveAllLibraryItems": "Remove All Library Items",
+  "HeaderAccount": "Account",
+  "HeaderChangePassword": "Change Password",
+  "HeaderSettings": "Settings",
+  "HeaderLibraries": "Libraries",
+  "HeaderUsers": "Users",
+  "HeaderListeningSessions": "Listening Sessions",
+  "HeaderBackups": "Backups",
+  "HeaderLogs": "Logs",
+  "HeaderNotifications": "Notifications",
+  "HeaderLibraryStats": "Library Stats",
+  "HeaderYourStats": "Your Stats",
+  "HeaderSettingsGeneral": "General",
+  "HeaderSettingsScanner": "Scanner",
+  "HeaderSettingsDisplay": "Display",
+  "HeaderSettingsExperimental": "Experimental Features",
+  "LabelUsername": "Username",
+  "LabelAccountType": "Account Type",
+  "LabelPassword": "Password",
+  "LabelNewPassword": "New Password",
+  "LabelConfirmPassword": "Confirm Password",
+  "LabelSettingsStoreCoversWithItem": "Store covers with item",
+  "LabelSettingsStoreCoversWithItemHelp": "By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named \"cover\" will be kept",
+  "LabelSettingsStoreMetadataWithItem": "Store metadata with item",
+  "LabelSettingsStoreMetadataWithItemHelp": "By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension",
+  "LabelSettingsSortingIgnorePrefixes": "Ignore prefixes when sorting",
+  "LabelSettingsSortingIgnorePrefixesHelp": "i.e. for prefix \"the\" book title \"The Book Title\" would sort as \"Book Title, The\"",
+  "LabelPrefixesToIgnore": "Prefixes to Ignore (case insensitive)",
+  "LabelSettingsChromecastSupport": "Chromecast support",
+  "LabelSettingsHomePageBookshelfView": "Home page use bookshelf view",
+  "LabelSettingsLibraryBookshelfView": "Library use bookshelf view",
+  "LabelSettingsBookshelfViewHelp": "Skeumorphic design with wooden shelves",
+  "LabelSettingsDateFormat": "Date Format",
+  "LabelSettingsParseSubtitles": "Parse subtitles",
+  "LabelSettingsParseSubtitlesHelp": "Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by \" - \"<br>i.e. \"Book Title - A Subtitle Here\" has the subtitle \"A Subtitle Here\"",
+  "LabelSettingsFindCovers": "Find covers",
+  "LabelSettingsFindCoversHelp": "If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time",
+  "MessageReportBugsAndContribute": "Report bugs, request features, and contribute on",
+  "NoteChangeRootPassword": "Root user is the only user that can have an empty password",
+  "SearchPlaceholder": "Search.."
+}
--- a/client/strings/es.json
+++ b/client/strings/es.json
@ -0,0 +1,54 @@
+{
+  "ButtonHome": "Home",
+  "ButtonLatest": "Latest",
+  "ButtonLibrary": "Library",
+  "ButtonSeries": "Series",
+  "ButtonCollections": "Collections",
+  "ButtonAuthors": "Authors",
+  "ButtonSearch": "Search",
+  "ButtonIssues": "Issues",
+  "ButtonChangePasswordSubmit": "Submit",
+  "ButtonLogout": "Logout",
+  "ButtonPurgeAllCache": "Purge All Cache",
+  "ButtonPurgeItemsCache": "Purge Items Cache",
+  "ButtonRemoveAllLibraryItems": "Remove All Library Items",
+  "HeaderAccount": "Account",
+  "HeaderChangePassword": "Change Password",
+  "HeaderSettings": "Settings",
+  "HeaderLibraries": "Libraries",
+  "HeaderUsers": "Users",
+  "HeaderListeningSessions": "Listening Sessions",
+  "HeaderBackups": "Backups",
+  "HeaderLogs": "Logs",
+  "HeaderNotifications": "Notifications",
+  "HeaderLibraryStats": "Library Stats",
+  "HeaderYourStats": "Your Stats",
+  "HeaderSettingsGeneral": "General",
+  "HeaderSettingsScanner": "Scanner",
+  "HeaderSettingsDisplay": "Display",
+  "HeaderSettingsExperimental": "Experimental Features",
+  "LabelUsername": "Username",
+  "LabelAccountType": "Account Type",
+  "LabelPassword": "Password",
+  "LabelNewPassword": "New Password",
+  "LabelConfirmPassword": "Confirm Password",
+  "LabelSettingsStoreCoversWithItem": "Store covers with item",
+  "LabelSettingsStoreCoversWithItemHelp": "By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named \"cover\" will be kept",
+  "LabelSettingsStoreMetadataWithItem": "Store metadata with item",
+  "LabelSettingsStoreMetadataWithItemHelp": "By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension",
+  "LabelSettingsSortingIgnorePrefixes": "Ignore prefixes when sorting",
+  "LabelSettingsSortingIgnorePrefixesHelp": "i.e. for prefix \"the\" book title \"The Book Title\" would sort as \"Book Title, The\"",
+  "LabelPrefixesToIgnore": "Prefixes to Ignore (case insensitive)",
+  "LabelSettingsChromecastSupport": "Chromecast support",
+  "LabelSettingsHomePageBookshelfView": "Home page use bookshelf view",
+  "LabelSettingsLibraryBookshelfView": "Library use bookshelf view",
+  "LabelSettingsBookshelfViewHelp": "Skeumorphic design with wooden shelves",
+  "LabelSettingsDateFormat": "Date Format",
+  "LabelSettingsParseSubtitles": "Parse subtitles",
+  "LabelSettingsParseSubtitlesHelp": "Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by \" - \"<br>i.e. \"Book Title - A Subtitle Here\" has the subtitle \"A Subtitle Here\"",
+  "LabelSettingsFindCovers": "Find covers",
+  "LabelSettingsFindCoversHelp": "If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time",
+  "MessageReportBugsAndContribute": "Report bugs, request features, and contribute on",
+  "NoteChangeRootPassword": "Root user is the only user that can have an empty password",
+  "SearchPlaceholder": "Search.."
+}
--- a/client/strings/it.json
+++ b/client/strings/it.json
@ -0,0 +1,54 @@
+{
+  "ButtonHome": "Home",
+  "ButtonLatest": "Latest",
+  "ButtonLibrary": "Library",
+  "ButtonSeries": "Series",
+  "ButtonCollections": "Collections",
+  "ButtonAuthors": "Authors",
+  "ButtonSearch": "Search",
+  "ButtonIssues": "Issues",
+  "ButtonChangePasswordSubmit": "Submit",
+  "ButtonLogout": "Logout",
+  "ButtonPurgeAllCache": "Purge All Cache",
+  "ButtonPurgeItemsCache": "Purge Items Cache",
+  "ButtonRemoveAllLibraryItems": "Remove All Library Items",
+  "HeaderAccount": "Account",
+  "HeaderChangePassword": "Change Password",
+  "HeaderSettings": "Settings",
+  "HeaderLibraries": "Libraries",
+  "HeaderUsers": "Users",
+  "HeaderListeningSessions": "Listening Sessions",
+  "HeaderBackups": "Backups",
+  "HeaderLogs": "Logs",
+  "HeaderNotifications": "Notifications",
+  "HeaderLibraryStats": "Library Stats",
+  "HeaderYourStats": "Your Stats",
+  "HeaderSettingsGeneral": "General",
+  "HeaderSettingsScanner": "Scanner",
+  "HeaderSettingsDisplay": "Display",
+  "HeaderSettingsExperimental": "Experimental Features",
+  "LabelUsername": "Username",
+  "LabelAccountType": "Account Type",
+  "LabelPassword": "Password",
+  "LabelNewPassword": "New Password",
+  "LabelConfirmPassword": "Confirm Password",
+  "LabelSettingsStoreCoversWithItem": "Store covers with item",
+  "LabelSettingsStoreCoversWithItemHelp": "By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named \"cover\" will be kept",
+  "LabelSettingsStoreMetadataWithItem": "Store metadata with item",
+  "LabelSettingsStoreMetadataWithItemHelp": "By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension",
+  "LabelSettingsSortingIgnorePrefixes": "Ignore prefixes when sorting",
+  "LabelSettingsSortingIgnorePrefixesHelp": "i.e. for prefix \"the\" book title \"The Book Title\" would sort as \"Book Title, The\"",
+  "LabelPrefixesToIgnore": "Prefixes to Ignore (case insensitive)",
+  "LabelSettingsChromecastSupport": "Chromecast support",
+  "LabelSettingsHomePageBookshelfView": "Home page use bookshelf view",
+  "LabelSettingsLibraryBookshelfView": "Library use bookshelf view",
+  "LabelSettingsBookshelfViewHelp": "Skeumorphic design with wooden shelves",
+  "LabelSettingsDateFormat": "Date Format",
+  "LabelSettingsParseSubtitles": "Parse subtitles",
+  "LabelSettingsParseSubtitlesHelp": "Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by \" - \"<br>i.e. \"Book Title - A Subtitle Here\" has the subtitle \"A Subtitle Here\"",
+  "LabelSettingsFindCovers": "Find covers",
+  "LabelSettingsFindCoversHelp": "If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time",
+  "MessageReportBugsAndContribute": "Report bugs, request features, and contribute on",
+  "NoteChangeRootPassword": "Root user is the only user that can have an empty password",
+  "SearchPlaceholder": "Search.."
+}
--- a/client/strings/pl.json
+++ b/client/strings/pl.json
@ -0,0 +1,54 @@
+{
+  "ButtonHome": "Home",
+  "ButtonLatest": "Latest",
+  "ButtonLibrary": "Library",
+  "ButtonSeries": "Series",
+  "ButtonCollections": "Collections",
+  "ButtonAuthors": "Authors",
+  "ButtonSearch": "Search",
+  "ButtonIssues": "Issues",
+  "ButtonChangePasswordSubmit": "Submit",
+  "ButtonLogout": "Logout",
+  "ButtonPurgeAllCache": "Purge All Cache",
+  "ButtonPurgeItemsCache": "Purge Items Cache",
+  "ButtonRemoveAllLibraryItems": "Remove All Library Items",
+  "HeaderAccount": "Account",
+  "HeaderChangePassword": "Change Password",
+  "HeaderSettings": "Settings",
+  "HeaderLibraries": "Libraries",
+  "HeaderUsers": "Users",
+  "HeaderListeningSessions": "Listening Sessions",
+  "HeaderBackups": "Backups",
+  "HeaderLogs": "Logs",
+  "HeaderNotifications": "Notifications",
+  "HeaderLibraryStats": "Library Stats",
+  "HeaderYourStats": "Your Stats",
+  "HeaderSettingsGeneral": "General",
+  "HeaderSettingsScanner": "Scanner",
+  "HeaderSettingsDisplay": "Display",
+  "HeaderSettingsExperimental": "Experimental Features",
+  "LabelUsername": "Username",
+  "LabelAccountType": "Account Type",
+  "LabelPassword": "Password",
+  "LabelNewPassword": "New Password",
+  "LabelConfirmPassword": "Confirm Password",
+  "LabelSettingsStoreCoversWithItem": "Store covers with item",
+  "LabelSettingsStoreCoversWithItemHelp": "By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named \"cover\" will be kept",
+  "LabelSettingsStoreMetadataWithItem": "Store metadata with item",
+  "LabelSettingsStoreMetadataWithItemHelp": "By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension",
+  "LabelSettingsSortingIgnorePrefixes": "Ignore prefixes when sorting",
+  "LabelSettingsSortingIgnorePrefixesHelp": "i.e. for prefix \"the\" book title \"The Book Title\" would sort as \"Book Title, The\"",
+  "LabelPrefixesToIgnore": "Prefixes to Ignore (case insensitive)",
+  "LabelSettingsChromecastSupport": "Chromecast support",
+  "LabelSettingsHomePageBookshelfView": "Home page use bookshelf view",
+  "LabelSettingsLibraryBookshelfView": "Library use bookshelf view",
+  "LabelSettingsBookshelfViewHelp": "Skeumorphic design with wooden shelves",
+  "LabelSettingsDateFormat": "Date Format",
+  "LabelSettingsParseSubtitles": "Parse subtitles",
+  "LabelSettingsParseSubtitlesHelp": "Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by \" - \"<br>i.e. \"Book Title - A Subtitle Here\" has the subtitle \"A Subtitle Here\"",
+  "LabelSettingsFindCovers": "Find covers",
+  "LabelSettingsFindCoversHelp": "If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time",
+  "MessageReportBugsAndContribute": "Report bugs, request features, and contribute on",
+  "NoteChangeRootPassword": "Root user is the only user that can have an empty password",
+  "SearchPlaceholder": "Search.."
+}
--- a/client/strings/zh-ch.json
+++ b/client/strings/zh-ch.json
@ -0,0 +1,54 @@
+{
+  "ButtonHome": "Home",
+  "ButtonLatest": "Latest",
+  "ButtonLibrary": "Library",
+  "ButtonSeries": "Series",
+  "ButtonCollections": "Collections",
+  "ButtonAuthors": "Authors",
+  "ButtonSearch": "Search",
+  "ButtonIssues": "Issues",
+  "ButtonChangePasswordSubmit": "Submit",
+  "ButtonLogout": "Logout",
+  "ButtonPurgeAllCache": "Purge All Cache",
+  "ButtonPurgeItemsCache": "Purge Items Cache",
+  "ButtonRemoveAllLibraryItems": "Remove All Library Items",
+  "HeaderAccount": "Account",
+  "HeaderChangePassword": "Change Password",
+  "HeaderSettings": "Settings",
+  "HeaderLibraries": "Libraries",
+  "HeaderUsers": "Users",
+  "HeaderListeningSessions": "Listening Sessions",
+  "HeaderBackups": "Backups",
+  "HeaderLogs": "Logs",
+  "HeaderNotifications": "Notifications",
+  "HeaderLibraryStats": "Library Stats",
+  "HeaderYourStats": "Your Stats",
+  "HeaderSettingsGeneral": "General",
+  "HeaderSettingsScanner": "Scanner",
+  "HeaderSettingsDisplay": "Display",
+  "HeaderSettingsExperimental": "Experimental Features",
+  "LabelUsername": "Username",
+  "LabelAccountType": "Account Type",
+  "LabelPassword": "Password",
+  "LabelNewPassword": "New Password",
+  "LabelConfirmPassword": "Confirm Password",
+  "LabelSettingsStoreCoversWithItem": "Store covers with item",
+  "LabelSettingsStoreCoversWithItemHelp": "By default covers are stored in /metadata/items, enabling this setting will store covers in your library item folder. Only one file named \"cover\" will be kept",
+  "LabelSettingsStoreMetadataWithItem": "Store metadata with item",
+  "LabelSettingsStoreMetadataWithItemHelp": "By default metadata files are stored in /metadata/items, enabling this setting will store metadata files in your library item folders. Uses .abs file extension",
+  "LabelSettingsSortingIgnorePrefixes": "Ignore prefixes when sorting",
+  "LabelSettingsSortingIgnorePrefixesHelp": "i.e. for prefix \"the\" book title \"The Book Title\" would sort as \"Book Title, The\"",
+  "LabelPrefixesToIgnore": "Prefixes to Ignore (case insensitive)",
+  "LabelSettingsChromecastSupport": "Chromecast support",
+  "LabelSettingsHomePageBookshelfView": "Home page use bookshelf view",
+  "LabelSettingsLibraryBookshelfView": "Library use bookshelf view",
+  "LabelSettingsBookshelfViewHelp": "Skeumorphic design with wooden shelves",
+  "LabelSettingsDateFormat": "Date Format",
+  "LabelSettingsParseSubtitles": "Parse subtitles",
+  "LabelSettingsParseSubtitlesHelp": "Extract subtitles from audiobook folder names.<br>Subtitle must be seperated by \" - \"<br>i.e. \"Book Title - A Subtitle Here\" has the subtitle \"A Subtitle Here\"",
+  "LabelSettingsFindCovers": "Find covers",
+  "LabelSettingsFindCoversHelp": "If your audiobook does not have an embedded cover or a cover image inside the folder, the scanner will attempt to find a cover.<br>Note: This will extend scan time",
+  "MessageReportBugsAndContribute": "Report bugs, request features, and contribute on",
+  "NoteChangeRootPassword": "Root user is the only user that can have an empty password",
+  "SearchPlaceholder": "Search.."
+}