yuzu/liftinstall
1
0
Fork 0
mirror of https://github.com/yuzu-emu/liftinstall.git synced 2024-12-22 19:15:34 +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",
"vue": "^2.6.10",
"vue-axios": "^2.1.5",
"vue-i18n": "^8.15.0",
"vue-router": "^3.1.3"
},
"devDependencies": {

6
ui/src/App.vue
View file

@ -9,14 +9,14 @@
<br />
<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 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 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>
</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 axios from 'axios'
import VueAxios from 'vue-axios'
import VueI18n from 'vue-i18n'
import { stream_ajax as streamAjax } from './helpers'
import Buefy from 'buefy'
import messages from './locales/messages.js'
import 'buefy/dist/buefy.css'
Vue.config.productionTip = false
Vue.use(Buefy)
Vue.use(VueI18n)
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/
function intercept (method) {
console[method] = function () {
@ -76,7 +85,7 @@ window.addEventListener('keydown', disableShortcuts)
axios.get('/api/attrs').then(function (resp) {
document.getElementById('window-title').innerText =
resp.data.name + ' Installer'
i18n.t('app.window_title', { 'name': resp.data.name })
}).catch(function (err) {
console.error(err)
})
@ -88,6 +97,7 @@ function selectFileCallback (name) {
window.selectFileCallback = selectFileCallback
var app = new Vue({
i18n: i18n,
router: router,
data: {
attrs: {},
@ -115,13 +125,16 @@ var app = new Vue({
exit: function () {
axios.get('/api/exit').catch(function (msg) {
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',
params: { msg: msg +
'\n\nPlease upload the log file (in ' + searchLocation + ') to ' +
'the ' + app.attrs.name + ' team'
} })
params: { msg: i18n.t('error.exit_error', {
'name': app.attrs.name,
'path': searchLocation,
'msg': msg
})
}
})
})
},
stream_ajax: streamAjax

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

@ -2,28 +2,28 @@
<div class="column has-padding">
<div v-if="was_update">
<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 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 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 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 class="field is-grouped is-right-floating is-bottom-floating">
<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>
</div>
</div>

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

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

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

@ -1,12 +1,12 @@
<template>
<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>
</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 }">
<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="$root.$data.metadata.is_launcher" v-on:click="exit">Exit</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">{{ $t('exit') }}</a>
</p>
</div>
</div>

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

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

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

@ -1,32 +1,32 @@
<template>
<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">
Update
{{ $t('modify.update') }}
</a>
<br />
<br />
<a class="button is-dark is-medium" v-on:click="modify_packages">
Modify
{{ $t('modify.modify') }}
</a>
<br />
<br />
<a class="button is-dark is-medium" v-on:click="prepare_uninstall">
Uninstall
{{ $t('modify.uninstall') }}
</a>
<div class="modal is-active" v-if="show_uninstall">
<div class="modal-background"></div>
<div class="modal-card">
<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>
<footer class="modal-card-foot">
<button class="button is-danger" v-on:click="uninstall">Yes</button>
<button class="button" v-on:click="cancel_uninstall">No</button>
<button class="button is-danger" v-on:click="uninstall">{{ $t('yes') }}</button>
<button class="button" v-on:click="cancel_uninstall">{{ $t('no') }}</button>
</footer>
</div>
</div>

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

@ -1,6 +1,6 @@
<template>
<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 -->
<div class="tile is-ancestor">
@ -11,7 +11,7 @@
<b-checkbox v-model="Lpackage.default">
{{ Lpackage.name }}
</b-checkbox>
<span v-if="Lpackage.installed"><i>(installed)</i></span>
<span v-if="Lpackage.installed"><i>{{ $t('select_packages.installed') }}</i></span>
</label>
<p>
{{ Lpackage.description }}
@ -21,15 +21,15 @@
</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="control is-expanded">
<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 class="control">
<a class="button is-dark" v-on:click="select_file">
Select
{{ $t('select_packages.select') }}
</a>
</div>
</div>
@ -38,15 +38,15 @@
<div class="field is-grouped">
<p class="control">
<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 class="control">
<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 class="control">
<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>
</div>
</div>
@ -54,7 +54,7 @@
<div class="field is-grouped is-left-floating is-bottom-floating">
<p class="control">
<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>
</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"
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:
version "15.7.1"
resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.7.1.tgz#6ccacd4122aa80f69baaac08ff295a62e3aefcfd"