mirror of
https://github.com/VueTubeApp/VueTube
synced 2024-11-26 05:05:23 +00:00
feat: ✨ Start on Language Packs
This commit is contained in:
parent
cce0d90802
commit
06c2737694
6 changed files with 144 additions and 59 deletions
|
@ -35,7 +35,7 @@
|
||||||
"
|
"
|
||||||
v-text="item.icon"
|
v-text="item.icon"
|
||||||
/>
|
/>
|
||||||
<!--
|
<!--
|
||||||
Add the following to 'v-text- above to make the icons outlined unless active
|
Add the following to 'v-text- above to make the icons outlined unless active
|
||||||
+ (tabSelection == i ? '' : '-outline')
|
+ (tabSelection == i ? '' : '-outline')
|
||||||
|
|
||||||
|
@ -55,19 +55,26 @@ export default {
|
||||||
tabSelection: 0,
|
tabSelection: 0,
|
||||||
tabs: [
|
tabs: [
|
||||||
// TODO: pull from Vuex & localStorage for customizations
|
// TODO: pull from Vuex & localStorage for customizations
|
||||||
{ name: "Home", icon: "mdi-home", link: "/home" },
|
{ name: "...", icon: "mdi-home", link: "/home" },
|
||||||
//{ name: "Shorts", icon: "mdi-lightning-bolt", link: "/shorts" },
|
//{ name: "Shorts", icon: "mdi-lightning-bolt", link: "/shorts" },
|
||||||
//{ name: "Upload", icon: "mdi-plus", link: "/upload" },
|
//{ name: "Upload", icon: "mdi-plus", link: "/upload" },
|
||||||
{
|
{
|
||||||
name: "Subscriptions",
|
name: "...",
|
||||||
icon: "mdi-youtube-subscription",
|
icon: "mdi-youtube-subscription",
|
||||||
link: "/subscriptions",
|
link: "/subscriptions",
|
||||||
},
|
},
|
||||||
{ name: "Library", icon: "mdi-view-list", link: "/library" },
|
{ name: "...", icon: "mdi-view-list", link: "/library" },
|
||||||
// { name: "Settings", icon: "mdi-menu", link: "/settings" },
|
// { name: "Settings", icon: "mdi-menu", link: "/settings" },
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.tabs[0].name = this.$lang('global').home;
|
||||||
|
this.tabs[1].name = this.$lang('global').subscriptions;
|
||||||
|
this.tabs[2].name = this.$lang('global').library;
|
||||||
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -17,6 +17,7 @@ export default {
|
||||||
{ src: "~/plugins/vuetube", mode: "client" },
|
{ src: "~/plugins/vuetube", mode: "client" },
|
||||||
{ src: "~/plugins/ryd", mode: "client" },
|
{ src: "~/plugins/ryd", mode: "client" },
|
||||||
{ src: "~/plugins/thirdPartyPluginLoader", mode: "client" },
|
{ src: "~/plugins/thirdPartyPluginLoader", mode: "client" },
|
||||||
|
{ src: "~/plugins/language", mode: "client" },
|
||||||
],
|
],
|
||||||
generate: {
|
generate: {
|
||||||
dir: "../dist",
|
dir: "../dist",
|
||||||
|
|
|
@ -18,9 +18,11 @@ export default {
|
||||||
layout: "empty",
|
layout: "empty",
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
progressMsg: "Connecting",
|
progressMsg: "...",
|
||||||
}),
|
}),
|
||||||
async mounted() {
|
async mounted() {
|
||||||
|
this.progressMsg = this.$lang('index').connecting;
|
||||||
|
|
||||||
this.$store.commit("tweaks/initTweaks");
|
this.$store.commit("tweaks/initTweaks");
|
||||||
const theming = new Promise((resolve) =>
|
const theming = new Promise((resolve) =>
|
||||||
// Set timeout is required for $vuetify.theme... dont ask me why -Front
|
// Set timeout is required for $vuetify.theme... dont ask me why -Front
|
||||||
|
@ -53,7 +55,7 @@ export default {
|
||||||
|
|
||||||
await theming;
|
await theming;
|
||||||
await this.$youtube.getAPI();
|
await this.$youtube.getAPI();
|
||||||
this.progressMsg = "Launching";
|
this.progressMsg = this.$lang('index').launching;
|
||||||
|
|
||||||
this.$router.replace(`/${localStorage.getItem("startPage") || "home"}`); // Prevent user from navigating back to the splash screen
|
this.$router.replace(`/${localStorage.getItem("startPage") || "home"}`); // Prevent user from navigating back to the splash screen
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,12 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div style="padding-top: 1em">
|
<div style="padding-top: 1em">
|
||||||
<v-list-item v-for="(item, index) in settingsItems" :key="index">
|
<v-list-item v-for="(item, index) in settingsItems" :key="index">
|
||||||
<v-btn
|
<v-btn text class="entry text-left text-capitalize" :to="item.to" :disabled="item.disabled">
|
||||||
text
|
|
||||||
class="entry text-left text-capitalize"
|
|
||||||
:to="item.to"
|
|
||||||
:disabled="item.disabled"
|
|
||||||
>
|
|
||||||
<v-icon size="30px" class="icon" v-text="item.icon" />
|
<v-icon size="30px" class="icon" v-text="item.icon" />
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</v-btn>
|
</v-btn>
|
||||||
|
@ -18,56 +13,98 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.entry {
|
.entry {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
justify-content: left !important;
|
justify-content: left !important;
|
||||||
padding: 1.5em 0.5em 1.5em 0.5em !important;
|
padding: 1.5em 0.5em 1.5em 0.5em !important;
|
||||||
}
|
}
|
||||||
.icon {
|
|
||||||
margin-right: 0.5em;
|
.icon {
|
||||||
}
|
margin-right: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
devClicks: 0,
|
devClicks: 0,
|
||||||
|
|
||||||
settingsItems: [
|
settingsItems: [{
|
||||||
{ name: "General", icon: "mdi-cog", to: "", disabled: true },
|
name: "General",
|
||||||
{ name: "Theme", icon: "mdi-brush-variant", to: "/mods/theme" },
|
icon: "mdi-cog",
|
||||||
{
|
to: "",
|
||||||
name: "Player",
|
disabled: true
|
||||||
icon: "mdi-motion-play-outline",
|
},
|
||||||
to: "",
|
{
|
||||||
disabled: true,
|
name: "Theme",
|
||||||
},
|
icon: "mdi-brush-variant",
|
||||||
{
|
to: "/mods/theme"
|
||||||
name: "UI Tweaker",
|
},
|
||||||
icon: "mdi-television-guide",
|
{
|
||||||
to: "/mods/tweaks",
|
name: "Player",
|
||||||
},
|
icon: "mdi-motion-play-outline",
|
||||||
{ name: "Startup Options", icon: "mdi-restart", to: "/mods/startup" },
|
to: "",
|
||||||
{ name: "Plugins", icon: "mdi-puzzle", to: "", to: "/mods/plugins", disabled: true },
|
disabled: true,
|
||||||
{
|
},
|
||||||
name: "Updates",
|
{
|
||||||
icon: "mdi-cloud-download-outline",
|
name: "UI Tweaker",
|
||||||
to: "/mods/updates",
|
icon: "mdi-television-guide",
|
||||||
},
|
to: "/mods/tweaks",
|
||||||
{ name: "Logs", icon: "mdi-text-box-outline", to: "/mods/logs" },
|
},
|
||||||
{ name: "About", icon: "mdi-information-outline", to: "/mods/about" },
|
{
|
||||||
],
|
name: "Startup Options",
|
||||||
};
|
icon: "mdi-restart",
|
||||||
},
|
to: "/mods/startup"
|
||||||
methods: {
|
},
|
||||||
dev() {
|
{
|
||||||
this.devClicks++;
|
name: "Plugins",
|
||||||
if (this.devClicks >= 6) {
|
icon: "mdi-puzzle",
|
||||||
this.$router.push("/mods/developer");
|
to: "",
|
||||||
}
|
to: "/mods/plugins",
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Updates",
|
||||||
|
icon: "mdi-cloud-download-outline",
|
||||||
|
to: "/mods/updates",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Logs",
|
||||||
|
icon: "mdi-text-box-outline",
|
||||||
|
to: "/mods/logs"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "About",
|
||||||
|
icon: "mdi-information-outline",
|
||||||
|
to: "/mods/about"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
mounted() {
|
||||||
|
this.settingsItems[0].name = this.$lang('settings').general;
|
||||||
|
this.settingsItems[1].name = this.$lang('settings').theme;
|
||||||
|
this.settingsItems[2].name = this.$lang('settings').player;
|
||||||
|
this.settingsItems[3].name = this.$lang('settings').uitweaker;
|
||||||
|
this.settingsItems[4].name = this.$lang('settings').startupoptions;
|
||||||
|
this.settingsItems[5].name = this.$lang('settings').plugins;
|
||||||
|
this.settingsItems[6].name = this.$lang('settings').updates;
|
||||||
|
this.settingsItems[7].name = this.$lang('settings').logs;
|
||||||
|
this.settingsItems[8].name = this.$lang('settings').about;
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
dev() {
|
||||||
|
this.devClicks++;
|
||||||
|
if (this.devClicks >= 6) {
|
||||||
|
this.$router.push("/mods/developer");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
12
NUXT/plugins/language.js
Normal file
12
NUXT/plugins/language.js
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
function module(text) {
|
||||||
|
const selectedLanguage = localStorage.getItem(text) || "english";
|
||||||
|
const languagePack = require('./languages/'+selectedLanguage);
|
||||||
|
|
||||||
|
if (!text) return languagePack;
|
||||||
|
return languagePack[text];
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ({ app }, inject) => {
|
||||||
|
inject("lang", module);
|
||||||
|
};
|
26
NUXT/plugins/languages/english.js
Normal file
26
NUXT/plugins/languages/english.js
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
module.exports = {
|
||||||
|
name: "English",
|
||||||
|
|
||||||
|
global: {
|
||||||
|
home: "Home",
|
||||||
|
subscriptions: "Subscriptions",
|
||||||
|
library: "Libraary"
|
||||||
|
},
|
||||||
|
|
||||||
|
index: {
|
||||||
|
connecting: "Connecting",
|
||||||
|
launching: "Launching"
|
||||||
|
},
|
||||||
|
|
||||||
|
settings: {
|
||||||
|
general: "General",
|
||||||
|
theme: "Theme",
|
||||||
|
player: "Player",
|
||||||
|
uitweaker: "UI Tweaker",
|
||||||
|
startupoptions: "Startup Options",
|
||||||
|
plugins: "Plugins",
|
||||||
|
updates: "Updates",
|
||||||
|
logs: "Logs",
|
||||||
|
about: "About"
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue