Changeset View

Standalone View

				import Vue from 'vue'
				import VueI18n from 'vue-i18n'
				import messages from '../lang-js/en'

				Vue.use(VueI18n)

				export const i18n = new VueI18n({
				locale: 'en',
				fallbackLocale: 'en',
				messages: { en: messages },
				silentFallbackWarn: true
				})

				let currentLanguage

				const loadedLanguages = [ 'en' ] // our default language that is preloaded

				const setI18nLanguage = (lang) => {
				i18n.locale = lang
				window.axios.defaults.headers.common['Accept-Language'] = lang
				document.querySelector('html').setAttribute('lang', lang)

				return lang
				}

				export const getLang = () => {
				// TODO: On init get the current user language from the browser?
				if (!currentLanguage) {
				currentLanguage = document.querySelector('html').getAttribute('lang') \|\| 'en'
				}

				return currentLanguage
				}

				export const setLang = lang => {
				// TODO: Save the selected language in the browser?
				currentLanguage = lang
				loadLanguageAsync()
				}

				export function loadLanguageAsync() {
				const lang = getLang()

				// If the language was already loaded
				if (loadedLanguages.includes(lang)) {
				return Promise.resolve(setI18nLanguage(lang))
				}

				// If the language hasn't been loaded yet
				return import(/* webpackChunkName: "locale/[request]" */ `../lang-js/${lang}`)
				.then(messages => {
				i18n.setLocaleMessage(lang, messages.default)
				loadedLanguages.push(lang)
				return setI18nLanguage(lang)
				})
				}