French translation + automatic select best matching locale
This commit is contained in:
parent
56b38eba06
commit
57bf538325
@ -1,17 +1,17 @@
|
||||
<template>
|
||||
<v-container fluid>
|
||||
<v-layout row>
|
||||
<v-flex xs12>
|
||||
<p>This app lets you track and share issues with bike lanes.</p>
|
||||
<v-flex xs6 offset-xs3>
|
||||
<p>{{ $t('about.summary') }}</p>
|
||||
|
||||
<h2 class="body-2">The available reports so far are:</h2>
|
||||
<h2 class="body-2">{{ $t('about.availableReportsTitle') }}</h2>
|
||||
<ul class="ml-3">
|
||||
<li><strong>GCUM</strong>: A car poorly parked on a bike lane.</li>
|
||||
<li><strong>Interrupt</strong>: An interruption of the bike lane (works, unexpected end of the bike lane, etc.).</li>
|
||||
<li><strong>Pothole</strong>: A pothole in the ground.</li>
|
||||
<li><strong>{{ $t('reportLabels.gcum') }}</strong>{{ $t('misc.spaceBeforeDoublePunctuations') }}: {{ $t('about.gcumDescription') }}</li>
|
||||
<li><strong>{{ $t('reportLabels.interrupt') }}</strong>{{ $t('misc.spaceBeforeDoublePunctuations') }}: {{ $t('about.interruptDescription') }}</li>
|
||||
<li><strong>{{ $t('reportLabels.pothole') }}</strong>{{ $t('misc.spaceBeforeDoublePunctuations') }}: {{ $t('about.potholeDescription') }}</li>
|
||||
</ul>
|
||||
|
||||
<p class="mt-3">It is released under an <a href="">MIT license</a>. The map background is using tiles from <a href="https://www.opencyclemap.org/docs/">OpenCycleMap</a>, thanks to <a href="">OpenStreetMap contributors</a> and <a href="">Leaflet</a>.</p>
|
||||
<p class="mt-3" v-html="$t('about.license')"></p>
|
||||
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
@ -1,5 +1,13 @@
|
||||
// Keys should be sorted alphabetically
|
||||
export default {
|
||||
about: {
|
||||
availableReportsTitle: 'The available reports so far are:',
|
||||
gcumDescription: 'A car poorly parked on a bike lane.',
|
||||
interruptDescription: 'An interruption of the bike lane (works, unexpected end of the bike lane, etc.).',
|
||||
license: 'It is released under an <a href="https://opensource.org/licenses/MIT">MIT license</a>. The map background is using tiles from <a href="https://www.opencyclemap.org/docs/">OpenCycleMap</a>, thanks to <a href="https://www.openstreetmap.org/copyright">OpenStreetMap contributors</a> and <a href="http://leafletjs.com/">Leaflet</a>.',
|
||||
potholeDescription: 'A pothole in the ground.',
|
||||
summary: 'This app lets you track and share issues with bike lanes.',
|
||||
},
|
||||
geolocation: {
|
||||
fetching: 'Fetching current position…',
|
||||
unavailable: 'Sorry, geolocation is not available in your browser.',
|
||||
@ -7,6 +15,9 @@ export default {
|
||||
menu: {
|
||||
About: 'About',
|
||||
},
|
||||
misc: {
|
||||
spaceBeforeDoublePunctuations: '',
|
||||
},
|
||||
reportLabels: {
|
||||
gcum: 'GCUM',
|
||||
interrupt: 'Interruption',
|
||||
|
26
src/i18n/fr.js
Normal file
26
src/i18n/fr.js
Normal file
@ -0,0 +1,26 @@
|
||||
// Keys should be sorted alphabetically
|
||||
export default {
|
||||
about: {
|
||||
availableReportsTitle: "Les signalements disponibles pour l'instant sont :",
|
||||
gcumDescription: 'Une voiture (mal) garée sur la piste cyclable.',
|
||||
interruptDescription: "Une interruption d'itinéraire cyclable (travaux, arrêt inattendu d'une piste cyclable, etc)",
|
||||
license: "Le code source est sous <a href='https://opensource.org/licenses/MIT'>licence MIT license</a>. Les tuiles de fond de carte proviennent de chez <a href='https://www.opencyclemap.org/docs/'>OpenCycleMap</a>, grace aux <a href='https://www.openstreetmap.org/copyright'>contributeurs OpenStreetMap</a> et à <a href='http://leafletjs.com/'>Leaflet</a>.",
|
||||
potholeDescription: 'Un nid de poule dans la route.',
|
||||
summary: 'Cette application vous permet de signaler et de partager des problèmes avec les itinéraires cyclables.',
|
||||
},
|
||||
geolocation: {
|
||||
fetching: 'En attente de votre position…',
|
||||
unavailable: "Désolé, la géolocalisation n'est pas disponible dans votre navigateur.",
|
||||
},
|
||||
menu: {
|
||||
About: 'À-propos',
|
||||
},
|
||||
misc: {
|
||||
spaceBeforeDoublePunctuations: ' ',
|
||||
},
|
||||
reportLabels: {
|
||||
gcum: 'GCUM',
|
||||
interrupt: 'Interruption',
|
||||
pothole: 'Nid de poule',
|
||||
},
|
||||
};
|
@ -2,14 +2,53 @@ import Vue from 'vue';
|
||||
import VueI18n from 'vue-i18n';
|
||||
|
||||
import en from './en';
|
||||
import fr from './fr';
|
||||
|
||||
Vue.use(VueI18n);
|
||||
|
||||
export function getBrowserLocales() {
|
||||
let langs = [];
|
||||
|
||||
if (navigator.languages) {
|
||||
// Chrome does not currently set navigator.language correctly
|
||||
// https://code.google.com/p/chromium/issues/detail?id=101138
|
||||
// but it does set the first element of navigator.languages correctly
|
||||
langs = navigator.languages;
|
||||
} else if (navigator.userLanguage) {
|
||||
// IE only
|
||||
langs = [navigator.userLanguage];
|
||||
} else {
|
||||
// as of this writing the latest version of firefox + safari set this correctly
|
||||
langs = [navigator.language];
|
||||
}
|
||||
|
||||
// Some browsers does not return uppercase for second part
|
||||
const locales = langs.map((lang) => {
|
||||
const locale = lang.split('-');
|
||||
return locale[1] ? `${locale[0]}-${locale[1].toUpperCase()}` : lang;
|
||||
});
|
||||
|
||||
return locales;
|
||||
}
|
||||
|
||||
const messages = {
|
||||
en,
|
||||
fr,
|
||||
};
|
||||
|
||||
|
||||
const locales = getBrowserLocales();
|
||||
|
||||
let locale = 'en'; // Safe default
|
||||
// Get best matching locale
|
||||
for (let i = 0; i < locales.length; i += 1) {
|
||||
if (messages[locales[i]]) {
|
||||
locale = locales[i];
|
||||
break; // Break at first matching locale
|
||||
}
|
||||
}
|
||||
|
||||
export default new VueI18n({
|
||||
locale: 'en',
|
||||
locale,
|
||||
messages,
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user