0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-01 01:12:39 +00:00

feat: Start on Language Packs

This commit is contained in:
Kenny 2022-05-05 23:11:28 -04:00
parent cce0d90802
commit 06c2737694
6 changed files with 144 additions and 59 deletions

View file

@ -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>

View file

@ -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",

View file

@ -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
}, },

View file

@ -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
View 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);
};

View 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"
}
}