yuzu/liftinstall
1
0
Fork 0
mirror of https://github.com/yuzu-emu/liftinstall.git synced 2024-12-23 00:45:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

i18n: basic implementation and string interpolation

Browse source
This commit is contained in:
liushuyu 2019-11-07 22:30:43 -07:00 committed by James
parent adbd4a304d
commit 74cefc277e
11 changed files with 116 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
ui/package.json
View file

@ -12,6 +12,7 @@
"buefy": "^0.8.5", "buefy": "^0.8.5",
"vue": "^2.6.10", "vue": "^2.6.10",
"vue-axios": "^2.1.5", "vue-axios": "^2.1.5",
"vue-i18n": "^8.15.0",
"vue-router": "^3.1.3" "vue-router": "^3.1.3"
}, },
"devDependencies": { "devDependencies": {

6
ui/src/App.vue
View file

@ -9,14 +9,14 @@
<br /> <br />
<h2 class="subtitle" v-if="!$root.$data.metadata.preexisting_install"> <h2 class="subtitle" v-if="!$root.$data.metadata.preexisting_install">
Welcome to the {{ $root.$data.attrs.name }} installer! {{ $t('app.installer_title', {'name': $root.$data.attrs.name}) }}
</h2> </h2>
<h2 class="subtitle" v-if="!$root.$data.metadata.preexisting_install"> <h2 class="subtitle" v-if="!$root.$data.metadata.preexisting_install">
We will have you up and running in just a few moments. {{ $t('app.installer_subtitle') }}
</h2> </h2>
<h2 class="subtitle" v-if="$root.$data.metadata.preexisting_install"> <h2 class="subtitle" v-if="$root.$data.metadata.preexisting_install">
Welcome to the {{ $root.$data.attrs.name }} Maintenance Tool. {{ $t('app.maintenance_title', {'name': $root.$data.attrs.name}) }}
</h2> </h2>
</div> </div>

54
ui/src/locales/messages.js Normal file
View file

@ -0,0 +1,54 @@
export default {
en: {
app: {
installer_title: 'Welcome to the {name} installer!',
installer_subtitle: 'We will have you up and running in just a few moments.',
maintenance_title: 'Welcome to the {name} Maintenance Tool.',
window_title: '{name} Installer'
},
download_config: {
download_config: 'Downloading config...',
error_download_config: 'Got error while downloading config: {msg}'
},
select_packages: {
title: 'Select which packages you want to install:',
installed: '(installed)',
advanced: 'Advanced...',
install: 'Install',
modify: 'Modify',
location: 'Install Location',
location_placeholder: 'Enter a install path here',
select: 'Select'
},
install_packages: {
check_for_update: 'Checking for updates...',
uninstall: 'Uninstalling...',
self_update: 'Downloading self-update...',
install: 'Installing...',
please_wait: 'Please wait...'
},
error: {
title: 'An error occurred',
exit_error: '{msg}\n\nPlease upload the log file (in {path}) to the {name} team',
location_unknown: 'the location where this installer is'
},
complete: {
thanks: 'Thanks for installing {name}!',
up_to_date: '{name} is already up to date!',
updated: '{name} has been updated.',
uninstalled: '{name} has been uninstalled.',
where_to_find: 'You can find your installed applications in your start menu.'
},
modify: {
title: 'Choose an option:',
update: 'Update',
modify: 'Modify',
uninstall: 'Uninstall',
prompt: 'Are you sure you want to uninstall {name}?'
},
back: 'Back',
exit: 'Exit',
yes: 'Yes',
no: 'No'
}
}

25
ui/src/main.js
View file

@ -3,14 +3,23 @@ import App from './App.vue'
import router from './router' import router from './router'
import axios from 'axios' import axios from 'axios'
import VueAxios from 'vue-axios' import VueAxios from 'vue-axios'
import VueI18n from 'vue-i18n'
import { stream_ajax as streamAjax } from './helpers' import { stream_ajax as streamAjax } from './helpers'
import Buefy from 'buefy' import Buefy from 'buefy'
import messages from './locales/messages.js'
import 'buefy/dist/buefy.css' import 'buefy/dist/buefy.css'
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.use(Buefy) Vue.use(Buefy)
Vue.use(VueI18n)
Vue.use(VueAxios, axios) Vue.use(VueAxios, axios)
export const i18n = new VueI18n({
locale: 'en', // set locale
fallbackLocale: 'en',
messages // set locale messages
})
// Borrowed from http://tobyho.com/2012/07/27/taking-over-console-log/ // Borrowed from http://tobyho.com/2012/07/27/taking-over-console-log/
function intercept (method) { function intercept (method) {
console[method] = function () { console[method] = function () {
@ -76,7 +85,7 @@ window.addEventListener('keydown', disableShortcuts)
axios.get('/api/attrs').then(function (resp) { axios.get('/api/attrs').then(function (resp) {
document.getElementById('window-title').innerText = document.getElementById('window-title').innerText =
resp.data.name + ' Installer' i18n.t('app.window_title', { 'name': resp.data.name })
}).catch(function (err) { }).catch(function (err) {
console.error(err) console.error(err)
}) })
@ -88,6 +97,7 @@ function selectFileCallback (name) {
window.selectFileCallback = selectFileCallback window.selectFileCallback = selectFileCallback
var app = new Vue({ var app = new Vue({
i18n: i18n,
router: router, router: router,
data: { data: {
attrs: {}, attrs: {},
@ -115,13 +125,16 @@ var app = new Vue({
exit: function () { exit: function () {
axios.get('/api/exit').catch(function (msg) { axios.get('/api/exit').catch(function (msg) {
var searchLocation = app.metadata.install_path.length > 0 ? app.metadata.install_path var searchLocation = app.metadata.install_path.length > 0 ? app.metadata.install_path
: 'the location where this installer is' : i18n.t('error.location_unknown')
app.$router.replace({ name: 'showerr', app.$router.replace({ name: 'showerr',
params: { msg: msg + params: { msg: i18n.t('error.exit_error', {
'\n\nPlease upload the log file (in ' + searchLocation + ') to ' + 'name': app.attrs.name,
'the ' + app.attrs.name + ' team' 'path': searchLocation,
} }) 'msg': msg
})
}
})
}) })
}, },
stream_ajax: streamAjax stream_ajax: streamAjax

16
ui/src/views/CompleteView.vue
View file

@ -2,28 +2,28 @@
<div class="column has-padding"> <div class="column has-padding">
<div v-if="was_update"> <div v-if="was_update">
<div v-if="has_installed"> <div v-if="has_installed">
<h4 class="subtitle">{{ $root.$data.attrs.name }} has been updated.</h4> <h4 class="subtitle">{{ $t('complete.updated', {'name': $root.$data.attrs.name}) }}</h4>
<p>You can find your installed applications in your start menu.</p> <p>{{ $t('complete.where_to_find') }}</p>
</div> </div>
<div v-else> <div v-else>
<h4 class="subtitle">{{ $root.$data.attrs.name }} is already up to date!</h4> <h4 class="subtitle">{{ $t('complete.up_to_date', {'name': $root.$data.attrs.name}) }}</h4>
<p>You can find your installed applications in your start menu.</p> <p>{{ $t('complete.where_to_find') }}</p>
</div> </div>
</div> </div>
<div v-else-if="was_install"> <div v-else-if="was_install">
<h4 class="subtitle">Thanks for installing {{ $root.$data.attrs.name }}!</h4> <h4 class="subtitle">{{ $t('complete.thanks', {'name': $root.$data.attrs.name}) }}</h4>
<p>You can find your installed applications in your start menu.</p> <p>{{ $t('complete.where_to_find') }}</p>
</div> </div>
<div v-else> <div v-else>
<h4 class="subtitle">{{ $root.$data.attrs.name }} has been uninstalled.</h4> <h4 class="subtitle">{{ $t('complete.uninstalled', {'name': $root.$data.attrs.name}) }}</h4>
</div> </div>
<div class="field is-grouped is-right-floating is-bottom-floating"> <div class="field is-grouped is-right-floating is-bottom-floating">
<p class="control"> <p class="control">
<a class="button is-dark is-medium" v-on:click="exit">Exit</a> <a class="button is-dark is-medium" v-on:click="exit">{{ $t('exit') }}</a>
</p> </p>
</div> </div>
</div> </div>

5
ui/src/views/DownloadConfig.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div class="column has-padding"> <div class="column has-padding">
<h4 class="subtitle">Downloading config...</h4> <h4 class="subtitle">{{ $t('download_config.download_config') }}</h4>
<br /> <br />
<progress class="progress is-info is-medium" max="100"> <progress class="progress is-info is-medium" max="100">
@ -39,8 +39,7 @@ export default {
that.$root.exit() that.$root.exit()
} else { } else {
that.$router.replace({ name: 'showerr', that.$router.replace({ name: 'showerr',
params: { msg: 'Got error while downloading config: ' + params: { msg: this.$i18n.t('download_config.error_download_config', { msg: e }) } })
e } })
} }
}) })
}, },

6
ui/src/views/ErrorView.vue
View file

@ -1,12 +1,12 @@
<template> <template>
<div class="column" v-bind:class="{ 'has-padding': !$root.$data.metadata.is_launcher }"> <div class="column" v-bind:class="{ 'has-padding': !$root.$data.metadata.is_launcher }">
<b-message title="An error occurred" type="is-danger" :closable="false"> <b-message :title="$t('error.title')" type="is-danger" :closable="false">
<div id="error_msg" v-html="msg"></div> <div id="error_msg" v-html="msg"></div>
</b-message> </b-message>
<div class="field is-grouped is-right-floating" v-bind:class="{ 'is-bottom-floating': !$root.$data.metadata.is_launcher, 'is-top-floating': $root.$data.metadata.is_launcher }"> <div class="field is-grouped is-right-floating" v-bind:class="{ 'is-bottom-floating': !$root.$data.metadata.is_launcher, 'is-top-floating': $root.$data.metadata.is_launcher }">
<p class="control"> <p class="control">
<a class="button is-primary is-medium" v-if="remaining && !$root.$data.metadata.is_launcher" v-on:click="go_back">Back</a> <a class="button is-primary is-medium" v-if="remaining && !$root.$data.metadata.is_launcher" v-on:click="go_back">{{ $t('back') }}</a>
<a class="button is-primary is-medium" v-if="$root.$data.metadata.is_launcher" v-on:click="exit">Exit</a> <a class="button is-primary is-medium" v-if="$root.$data.metadata.is_launcher" v-on:click="exit">{{ $t('exit') }}</a>
</p> </p>
</div> </div>
</div> </div>

10
ui/src/views/InstallPackages.vue
View file

@ -1,9 +1,9 @@
<template> <template>
<div class="column has-padding"> <div class="column has-padding">
<h4 class="subtitle" v-if="$root.$data.metadata.is_launcher || is_update">Checking for updates...</h4> <h4 class="subtitle" v-if="$root.$data.metadata.is_launcher || is_update">{{ $t('install_packages.check_for_update') }}</h4>
<h4 class="subtitle" v-else-if="is_uninstall">Uninstalling...</h4> <h4 class="subtitle" v-else-if="is_uninstall">{{ $t('install_packages.uninstall') }}</h4>
<h4 class="subtitle" v-else-if="is_updater_update">Downloading self-update...</h4> <h4 class="subtitle" v-else-if="is_updater_update">{{ $t('install_packages.self_update') }}</h4>
<h4 class="subtitle" v-else>Installing...</h4> <h4 class="subtitle" v-else>{{ $t('install_packages.install') }}</h4>
<div v-html="$root.$data.config.installing_message"></div> <div v-html="$root.$data.config.installing_message"></div>
<br /> <br />
@ -20,7 +20,7 @@ export default {
data: function () { data: function () {
return { return {
progress: 0.0, progress: 0.0,
progress_message: 'Please wait...', progress_message: this.$i18n.t('install_packages.please_wait'),
is_uninstall: false, is_uninstall: false,
is_updater_update: false, is_updater_update: false,
is_update: false, is_update: false,

14
ui/src/views/ModifyView.vue
View file

@ -1,32 +1,32 @@
<template> <template>
<div class="column has-padding"> <div class="column has-padding">
<h4 class="subtitle">Choose an option:</h4> <h4 class="subtitle">{{ $t('modify.title') }}</h4>
<a class="button is-dark is-medium" v-on:click="update"> <a class="button is-dark is-medium" v-on:click="update">
Update {{ $t('modify.update') }}
</a> </a>
<br /> <br />
<br /> <br />
<a class="button is-dark is-medium" v-on:click="modify_packages"> <a class="button is-dark is-medium" v-on:click="modify_packages">
Modify {{ $t('modify.modify') }}
</a> </a>
<br /> <br />
<br /> <br />
<a class="button is-dark is-medium" v-on:click="prepare_uninstall"> <a class="button is-dark is-medium" v-on:click="prepare_uninstall">
Uninstall {{ $t('modify.uninstall') }}
</a> </a>
<div class="modal is-active" v-if="show_uninstall"> <div class="modal is-active" v-if="show_uninstall">
<div class="modal-background"></div> <div class="modal-background"></div>
<div class="modal-card"> <div class="modal-card">
<header class="modal-card-head"> <header class="modal-card-head">
<p class="modal-card-title">Are you sure you want to uninstall {{ $root.$data.attrs.name }}?</p> <p class="modal-card-title">{{ $t('modify.prompt', {'name': $root.$data.attrs.name}) }}</p>
</header> </header>
<footer class="modal-card-foot"> <footer class="modal-card-foot">
<button class="button is-danger" v-on:click="uninstall">Yes</button> <button class="button is-danger" v-on:click="uninstall">{{ $t('yes') }}</button>
<button class="button" v-on:click="cancel_uninstall">No</button> <button class="button" v-on:click="cancel_uninstall">{{ $t('no') }}</button>
</footer> </footer>
</div> </div>
</div> </div>

18
ui/src/views/SelectPackages.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<div class="column has-padding"> <div class="column has-padding">
<h4 class="subtitle">Select which packages you want to install:</h4> <h4 class="subtitle">{{ $t('select_packages.title') }}</h4>
<!-- Build options --> <!-- Build options -->
<div class="tile is-ancestor"> <div class="tile is-ancestor">
@ -11,7 +11,7 @@
<b-checkbox v-model="Lpackage.default"> <b-checkbox v-model="Lpackage.default">
{{ Lpackage.name }} {{ Lpackage.name }}
</b-checkbox> </b-checkbox>
<span v-if="Lpackage.installed"><i>(installed)</i></span> <span v-if="Lpackage.installed"><i>{{ $t('select_packages.installed') }}</i></span>
</label> </label>
<p> <p>
{{ Lpackage.description }} {{ Lpackage.description }}
@ -21,15 +21,15 @@
</div> </div>
</div> </div>
<div class="subtitle is-6" v-if="!$root.$data.metadata.preexisting_install && advanced">Install Location</div> <div class="subtitle is-6" v-if="!$root.$data.metadata.preexisting_install && advanced">{{ $t('select_packages.location') }}</div>
<div class="field has-addons" v-if="!$root.$data.metadata.preexisting_install && advanced"> <div class="field has-addons" v-if="!$root.$data.metadata.preexisting_install && advanced">
<div class="control is-expanded"> <div class="control is-expanded">
<input class="input" type="text" v-model="$root.$data.install_location" <input class="input" type="text" v-model="$root.$data.install_location"
placeholder="Enter a install path here"> :placeholder="$t('select_packages.location_placeholder')">
</div> </div>
<div class="control"> <div class="control">
<a class="button is-dark" v-on:click="select_file"> <a class="button is-dark" v-on:click="select_file">
Select {{ $t('select_packages.select') }}
</a> </a>
</div> </div>
</div> </div>
@ -38,15 +38,15 @@
<div class="field is-grouped"> <div class="field is-grouped">
<p class="control"> <p class="control">
<a class="button is-medium" v-if="!$root.$data.config.hide_advanced && !$root.$data.metadata.preexisting_install && !advanced" <a class="button is-medium" v-if="!$root.$data.config.hide_advanced && !$root.$data.metadata.preexisting_install && !advanced"
v-on:click="advanced = true">Advanced...</a> v-on:click="advanced = true">{{ $t('select_packages.advanced') }}</a>
</p> </p>
<p class="control"> <p class="control">
<a class="button is-dark is-medium" v-if="!$root.$data.metadata.preexisting_install" <a class="button is-dark is-medium" v-if="!$root.$data.metadata.preexisting_install"
v-on:click="install">Install</a> v-on:click="install">{{ $t('select_packages.install') }}</a>
</p> </p>
<p class="control"> <p class="control">
<a class="button is-dark is-medium" v-if="$root.$data.metadata.preexisting_install" <a class="button is-dark is-medium" v-if="$root.$data.metadata.preexisting_install"
v-on:click="install">Modify</a> v-on:click="install">{{ $t('select_packages.modify') }}</a>
</p> </p>
</div> </div>
</div> </div>
@ -54,7 +54,7 @@
<div class="field is-grouped is-left-floating is-bottom-floating"> <div class="field is-grouped is-left-floating is-bottom-floating">
<p class="control"> <p class="control">
<a class="button is-medium" v-if="$root.$data.metadata.preexisting_install" <a class="button is-medium" v-if="$root.$data.metadata.preexisting_install"
v-on:click="go_back">Back</a> v-on:click="go_back">{{ $t('back') }}</a>
</p> </p>
</div> </div>
</div> </div>

5
ui/yarn.lock
View file

@ -8116,6 +8116,11 @@ vue-hot-reload-api@^2.3.0:
resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2" resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
integrity sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog== integrity sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==
vue-i18n@^8.15.0:
version "8.15.0"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.15.0.tgz#9b11ef8e7a124f67cdf788c8c90a81f3606240ed"
integrity sha512-juJ/avAP39bOMycC+qQDLJ8U9z9LtLF/9PsRoJLBSfsYZo9bqYntyyX5QPicwlb1emJKjgxhZ3YofHiQcXBu0Q==
vue-loader@^15.7.0: vue-loader@^15.7.0:
version "15.7.1" version "15.7.1"
resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.7.1.tgz#6ccacd4122aa80f69baaac08ff295a62e3aefcfd" resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.7.1.tgz#6ccacd4122aa80f69baaac08ff295a62e3aefcfd"