Merge branch 'home-i18n-fixes' into 'master'

Couple of i18n and homepage fixes

See merge request framasoft/mobilizon!610
This commit is contained in:
Thomas Citharel 2020-10-14 13:55:27 +02:00
commit 1a3600d1da
4 changed files with 44 additions and 27 deletions

View file

@ -174,7 +174,7 @@
"Instance Terms": "Instance Terms", "Instance Terms": "Instance Terms",
"Instance settings": "Instance settings", "Instance settings": "Instance settings",
"Instances": "Instances", "Instances": "Instances",
"Join {instance}, a Mobilizon instance": "Join {instance}, a Mobilizon instance", "Join <b>{instance}</b>, a Mobilizon instance": "Join <b>{instance}</b>, a Mobilizon instance",
"Last published event": "Last published event", "Last published event": "Last published event",
"Last week": "Last week", "Last week": "Last week",
"Learn more about Mobilizon": "Learn more about Mobilizon", "Learn more about Mobilizon": "Learn more about Mobilizon",
@ -466,7 +466,6 @@
"Contact": "Contact", "Contact": "Contact",
"Website": "Website", "Website": "Website",
"Actor": "Actor", "Actor": "Actor",
"Statut": "Statut",
"Text": "Text", "Text": "Text",
"All group members and other eventual server admins will still be able to view this information.": "All group members and other eventual server admins will still be able to view this information.", "All group members and other eventual server admins will still be able to view this information.": "All group members and other eventual server admins will still be able to view this information.",
"Upcoming events": "Upcoming events", "Upcoming events": "Upcoming events",

View file

@ -336,7 +336,7 @@
"Invited": "Invité·e", "Invited": "Invité·e",
"Italic": "Italique", "Italic": "Italique",
"Join group": "Rejoindre le groupe", "Join group": "Rejoindre le groupe",
"Join {instance}, a Mobilizon instance": "Rejoignez {instance}, une instance Mobilizon", "Join <b>{instance}</b>, a Mobilizon instance": "Rejoignez <b>{instance}</b>, une instance Mobilizon",
"Keep the entire conversation about a specific topic together on a single page.": "Rassemblez sur une seule page toute la conversation à propos d'un sujet spécifique.", "Keep the entire conversation about a specific topic together on a single page.": "Rassemblez sur une seule page toute la conversation à propos d'un sujet spécifique.",
"Key words": "Mots clés", "Key words": "Mots clés",
"Language": "Langue", "Language": "Langue",

View file

@ -4,7 +4,7 @@ import { DateFnsPlugin } from "@/plugins/dateFns";
import en from "../i18n/en_US.json"; import en from "../i18n/en_US.json";
import langs from "../i18n/langs.json"; import langs from "../i18n/langs.json";
const DEFAULT_LOCALE = "en"; const DEFAULT_LOCALE = "en_US";
let language = document.documentElement.getAttribute("lang") as string; let language = document.documentElement.getAttribute("lang") as string;
language = language || ((window.navigator as any).userLanguage || window.navigator.language).replace(/-/, "_"); language = language || ((window.navigator as any).userLanguage || window.navigator.language).replace(/-/, "_");
@ -13,36 +13,47 @@ export const locale =
Vue.use(VueI18n); Vue.use(VueI18n);
console.log(en);
console.log(locale);
export const i18n = new VueI18n({ export const i18n = new VueI18n({
locale: DEFAULT_LOCALE, // set locale locale: DEFAULT_LOCALE, // set locale
messages: (en as unknown) as VueI18n.LocaleMessages, // set locale messages // eslint-disable-next-line @typescript-eslint/ban-ts-comment
fallbackLocale: "en", // @ts-ignore
messages: en, // set locale messages
fallbackLocale: DEFAULT_LOCALE,
}); });
console.log(i18n);
Vue.use(DateFnsPlugin, { locale }); const loadedLanguages = [DEFAULT_LOCALE];
const loadedLanguages = ["en"];
function setI18nLanguage(lang: string): string { function setI18nLanguage(lang: string): string {
i18n.locale = lang; i18n.locale = lang;
return lang; return lang;
} }
function fileForLanguage(lang: string) { function fileForLanguage(matches: Record<string, string>, lang: string) {
const matches: Record<string, string> = {
fr: "fr_FR",
en: "en_US",
};
if (Object.prototype.hasOwnProperty.call(matches, lang)) { if (Object.prototype.hasOwnProperty.call(matches, lang)) {
return matches[lang]; return matches[lang];
} }
return lang; return lang;
} }
export async function loadLanguageAsync(lang: string): Promise<string> { function vueI18NfileForLanguage(lang: string) {
const matches: Record<string, string> = {
fr: "fr_FR",
en: "en_US",
};
return fileForLanguage(matches, lang);
}
function dateFnsfileForLanguage(lang: string) {
const matches: Record<string, string> = {
en_US: "en-US",
en: "en-US",
};
return fileForLanguage(matches, lang);
}
Vue.use(DateFnsPlugin, { locale: dateFnsfileForLanguage(locale) });
async function loadLanguageAsync(lang: string): Promise<string> {
// If the same language // If the same language
if (i18n.locale === lang) { if (i18n.locale === lang) {
return Promise.resolve(setI18nLanguage(lang)); return Promise.resolve(setI18nLanguage(lang));
@ -53,15 +64,13 @@ export async function loadLanguageAsync(lang: string): Promise<string> {
return Promise.resolve(setI18nLanguage(lang)); return Promise.resolve(setI18nLanguage(lang));
} }
console.log(fileForLanguage(lang));
// If the language hasn't been loaded yet // If the language hasn't been loaded yet
return import(/* webpackChunkName: "lang-[request]" */ `@/i18n/${fileForLanguage(lang)}.json`).then( const newMessages = await import(
(newMessages: any) => { /* webpackChunkName: "lang-[request]" */ `@/i18n/${vueI18NfileForLanguage(lang)}.json`
);
i18n.setLocaleMessage(lang, newMessages.default); i18n.setLocaleMessage(lang, newMessages.default);
loadedLanguages.push(lang); loadedLanguages.push(lang);
return setI18nLanguage(lang); return setI18nLanguage(lang);
}
);
} }
loadLanguageAsync(locale); loadLanguageAsync(locale);

View file

@ -4,7 +4,9 @@
<div class="hero-body"> <div class="hero-body">
<div class="container"> <div class="container">
<h1 class="title">{{ $t("Gather ⋅ Organize ⋅ Mobilize") }}</h1> <h1 class="title">{{ $t("Gather ⋅ Organize ⋅ Mobilize") }}</h1>
<p>{{ $t("Join {instance}, a Mobilizon instance", { instance: config.name }) }}</p> <p
v-html="$t('Join <b>{instance}</b>, a Mobilizon instance', { instance: config.name })"
/>
<p class="instance-description">{{ config.description }}</p> <p class="instance-description">{{ config.description }}</p>
<!-- We don't invite to find other instances yet --> <!-- We don't invite to find other instances yet -->
<!-- <p v-if="!config.registrationsOpen"> <!-- <p v-if="!config.registrationsOpen">
@ -154,6 +156,9 @@ import Subtitle from "../components/Utils/Subtitle.vue";
loggedUser: { loggedUser: {
query: USER_SETTINGS, query: USER_SETTINGS,
fetchPolicy: "no-cache", fetchPolicy: "no-cache",
error() {
return null;
},
}, },
config: CONFIG, config: CONFIG,
currentUserParticipations: { currentUserParticipations: {
@ -340,6 +345,7 @@ export default class Home extends Vue {
<style lang="scss" scoped> <style lang="scss" scoped>
main > div > .container { main > div > .container {
background: $white; background: $white;
padding: 1rem 1.5rem 3rem;
} }
.search-autocomplete { .search-autocomplete {
@ -382,9 +388,12 @@ span.view-all {
} }
section.hero { section.hero {
margin-top: -3px;
background: lighten($secondary, 20%); background: lighten($secondary, 20%);
& > .hero-body {
padding: 1rem 1.5rem 3rem;
}
.title { .title {
color: $background-color; color: $background-color;
} }