@saooti/octopus-sdk 31.0.13 → 31.0.14

package/README.md

@@ -588,3 +588,4 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
  * 31.0.11 Sécurisation
  * 31.0.12 Commentaires Events
  * 31.0.13 Update/delete Libraries
+ * 31.0.14 Lazy loading lang

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saooti/octopus-sdk",
-  "version": "31.0.13",
+  "version": "31.0.14",
   "private": false,
   "description": "Javascript SDK for using octopus",
   "author": "Saooti",

package/src/components/display/comments/CommentList.vue

@@ -185,7 +185,6 @@ export default defineComponent({
         comItem.receiveCommentEvent(data);
         return;
       }
-      const updatedStatus = data.comment.status;
       const index = this.findCommentIndex(data.comment.comId);
       if (-1 !== index) {
         if ((!this.editRight && 'Valid' !== data.comment.status) ||

package/src/components/misc/Footer.vue

@@ -142,9 +142,11 @@
 </template>
 
 <script lang="ts">
+import { cookies } from '../mixins/functions';
 import ClassicSelect from '../form/ClassicSelect.vue';
 import Player from './Player.vue';
 import { state } from '../../store/paramStore';
+import {loadLocaleMessages} from '@/i18n';
 import octopusApi from '@saooti/octopus-api';
 import moment from 'moment';
 import { Category } from '@/store/class/general/category';
@@ -157,6 +159,8 @@ export default defineComponent({
     ClassicSelect
   },
 
+  mixins:[cookies],
+
   data() {
     return {
       language: this.$i18n.locale as string,
@@ -199,7 +203,8 @@ export default defineComponent({
       }
     },
     changeLanguage(): void{
-      this.$i18n.locale= this.language;
+      this.setCookie('octopus-language', this.language);
+      loadLocaleMessages(this.$i18n, this.language, this.$store.state.general.isEducation);
       moment.locale(this.$i18n.locale);
       octopusApi.fetchCategories({ lang: this.$i18n.locale }).then((data: Array<Category>) => {
         this.$store.commit('categoriesSet', data);

package/src/i18n.ts

@@ -0,0 +1,36 @@
+
+import { nextTick } from 'vue'
+import { createI18n } from 'vue-i18n';
+
+
+export function setupI18n(options = { locale: 'en' }, isEducation: boolean) {
+  const i18n = createI18n(options)
+  loadLocaleMessages(i18n.global, options.locale, isEducation);
+  return i18n;
+}
+
+export function setI18nLanguage(i18n: any, locale: string) {
+  i18n.locale = locale;
+  const html= document.querySelector('html');
+  if(html){
+    html.setAttribute('lang', locale);
+  }
+}
+
+export async function loadLocaleMessages(i18n: any, locale:string, isEducation: boolean) {
+	if(!i18n.messages[locale] || 0===Object.keys(i18n.messages[locale]).length){
+		let messages = await import(
+			`./locale/${locale}.ts`
+		)
+		messages = messages.default;
+		if(isEducation && ('fr'===locale || 'en'===locale)){
+			const messagesEdu = await import(
+				`./locale/education${locale}.ts`
+			);
+			messages ={...messages, ...messagesEdu.default};
+		}
+		i18n.setLocaleMessage(locale, messages);
+	}
+  setI18nLanguage(i18n, locale)
+  return nextTick();
+}

package/src/main.ts

@@ -2,50 +2,48 @@ import { createApp } from 'vue';
 import { VueReCaptcha } from 'vue-recaptcha-v3';
 import VueLazyLoad from 'vue3-lazyload';
 import App from './App.vue';
-import { createI18n, VueMessageType } from 'vue-i18n';
-import I18nResources from './locale/messages';
+import {setupI18n} from './i18n';
 import router from '@/router/router';
 import moment from 'moment';
 import store from '@/store/AppStore';
 import paramStore from '@/store/paramStore';
-import { LocaleMessage } from '@intlify/core-base';
 /* import 'popper.js/dist/popper.min.js'; */
 /* import 'jquery/src/jquery.js'; */
 /* import 'jquery';
 import 'bootstrap/dist/js/bootstrap.bundle.min.js';
  */
 
+
 //TODO
-const navigatorLang = navigator.language /* || navigator.userLanguage */;
-let language = 'fr';
-if(navigatorLang.includes('en')){
-  language = 'en';
-}else if(navigatorLang.includes('it')){
-  language = 'it';
-}else if(navigatorLang.includes('sl')){
-  language = 'sl';
-}else if(navigatorLang.includes('es')){
-  language = 'es';
-}else if(navigatorLang.includes('de')){
-  language = 'de';
+const nameEQ = 'octopus-language=';
+const ca = document.cookie.split(';');
+let language = "";
+for (let i = 0; i < ca.length; i++) {
+  let c = ca[i];
+  while (c.charAt(0) == ' ') c = c.substring(1, c.length);
+  if (0 === c.indexOf(nameEQ)){
+    language = c.substring(nameEQ.length, c.length);
+    break;
+  }
 }
-let messages: {[key: string]: LocaleMessage<VueMessageType>} = I18nResources;
-if (store.state.general.education) {
-  messages = {
-    fr: { ...I18nResources.fr, ...I18nResources.educationfr },
-    en: { ...I18nResources.en, ...I18nResources.educationen },
-    it: I18nResources.it,
-    sl: I18nResources.it,
-    es: I18nResources.es,
-    de: I18nResources.de,
-  };
+if(0===language.length){
+  const navigatorLang = navigator.language /* || navigator.userLanguage */;
+  language = 'fr';
+  if(navigatorLang.includes('en')){
+    language = 'en';
+  }else if(navigatorLang.includes('it')){
+    language = 'it';
+  }else if(navigatorLang.includes('sl')){
+    language = 'sl';
+  }else if(navigatorLang.includes('es')){
+    language = 'es';
+  }else if(navigatorLang.includes('de')){
+    language = 'de';
+  }
 }
-const i18n = createI18n({
-  locale: language,
-  messages: messages,
-});
-moment.locale(language);
 
+const i18n = setupI18n({locale: language}, store.state.general.education);
+moment.locale(language);
 
 paramStore.initialize({
   generalParameters: {},