fix : i18n

SignItCoreContent.js

@@ -1,49 +1,38 @@
-var SignItCoreContent = function (locale,mapi18n) {
-  const sourceMap = new Map(mapi18n);
-  banana = { i18n: (msg) => sourceMap.get(locale)[msg] };
-  console.log("Passed trough ! :", locale);
-  console.log("SignItCoreContent.js",banana );
-  // let hlwa = browser.i18n.getMessage("si-panel-videos-title"); 
-  // console.log("hlwa = ",hlwa); 
+var SignItCoreContent = function () {
+  console.log("SignItCoreContent.js");
   this.$container = $(`
 		<div class="signit-modal-container">
 			<h1></h1>
 			<div class="signit-modal-content">
         <div class="signit-panel-videos">
           <div class="signit-panel-videos signit-novideo">
-            <h2>
-            ${ browser.i18n.getMessage("si_panel_videos_title") }</h2>
-            ${ browser.i18n.getMessage("si_panel_videos_empty") }<br><br>
+            <h2></h2>
+            <p></p>
           </div>
           <div class="signit-panel-videos signit-video"></div>
         </div>
 				<div class="signit-panel-separator"></div>
         <div class="signit-panel-definitions">
           <div class="signit-panel-definitions signit-definitions">
-            <h2>
-            ${ browser.i18n.getMessage("si_panel_definitions_title") }</h2>
+            <h2></h2>
             <div class="signit-definitions-text"></div>
             <div class="signit-definitions-source">
-              <a href="https://${ browser.i18n.getMessage("si_panel_definitions_wikt_iso") }.wiktionary.org">
-          ${ browser.i18n.getMessage("si_panel_definitions_wikt_pointer") }</a>
+              <a href></a>
             </div>
           </div>
           <div class="signit-panel-definitions signit-loading">
             <img class="signit-loading-spinner" src="${browser.runtime.getURL(
               "icons/Spinner_font_awesome.svg"
             )}" width="40" height="40">
           </div>
-          <div class="signit-panel-definitions signit-error">
-          ${ browser.i18n.getMessage("si_panel_definitions_empty") }</div>
+          <div class="signit-panel-definitions signit-error"></div>
         </div>
 			</div>
 		</div>
 	  `);
-
-    // Button contribute
     var optionsContribute = {
       flags: ["primary", "progressive"],
-      label: browser.i18n.getMessage("si_panel_videos_contribute_label") ,
+      label: " ",
       href: "https://lingualibre.org/wiki/Special:RecordWizard",
     };
     this.contributeButton = new OO.ui.ButtonWidget(optionsContribute);
@@ -62,9 +51,41 @@ var SignItCoreContent = function (locale,mapi18n) {
     this.$definitionPanelSpinner = this.$container.find(".signit-loading");
     this.$definitionPanelError = this.$container.find(".signit-error");
 
-    // this.contributeButton.on( 'click', function () {
-    //	// TODO: Do something
-    // }.bind( this ) );
+    SignItCoreContent.prototype.init = async function () {
+      try {
+        var banana = {i18n: async (msg,...arg) => {
+          return await chrome.runtime.sendMessage({
+            command:'bananai18n',arg : [msg,arg]
+          })
+        }
+      };
+        const translations = await Promise.all([
+          banana.i18n("si-panel-videos-title"),
+          banana.i18n("si-panel-videos-empty"),
+          banana.i18n("si-panel-definitions-title"),
+          banana.i18n("si-panel-videos-contribute-label"),
+          banana.i18n("si-panel-definitions-wikt-iso"),
+          banana.i18n("si-panel-definitions-wikt-pointer"),
+          banana.i18n("si-panel-definitions-empty") // May need a different key for error message
+        ]);
+        const [videosPanelNoVideoTitle, videosPanelNoVideoEmpty, definitionsPanelTitle, contributeButtonLabel, wiktIso, wiktPointer, definitionsEmpty] = translations;
+
+        this.$container.find(".signit-panel-videos .signit-novideo h2").text(videosPanelNoVideoTitle); 
+        this.$container.find(".signit-panel-videos .signit-novideo p").html(videosPanelNoVideoEmpty); // -- needs additional css
+        this.$container.find(".signit-panel-definitions .signit-definitions h2").text(definitionsPanelTitle); 
+        this.contributeButton.$label.text(contributeButtonLabel);
+        const definitionsSourceLink = `https://${wiktIso}.wiktionary.org`;
+        this.$container
+          .find(".signit-definitions-source a")
+          .attr("href", definitionsSourceLink)
+          .text(wiktPointer);
+
+        this.$container.find(".signit-panel-definitions .signit-error").text(definitionsEmpty);
+
+      } catch (error) {
+        console.error("Error fetching translations:", error);
+      }
+    };
 
   SignItCoreContent.prototype.refresh = function (title, files) {
     files = files || [];

SignItVideosGallery.js

@@ -17,42 +17,32 @@ var SignItVideosGallery = function ( container ) {
 };
 
 SignItVideosGallery.prototype.refresh = async function ( files ) {
-	var BetterBanana = await browser.storage.local.get( 'bananaInStore' );
-	var messageStore = await chrome.storage.local.get( 'sourceMap' ); 
-	var sourceMap = new Map(messageStore.sourceMap);
-	var locale = BetterBanana.bananaInStore.locale;
 	var banana = {
-    i18n: (msg, url, speaker,index, total) => {
-		let string = sourceMap.get(locale)[msg];
-		let Speaker = `<a href=${url} target="_blank">${speaker} </a>`;
-		let patterns = ["{{link|$1|$2}}", "$3", "$4"];
-		let replacements = [Speaker, index, total];
-
-		patterns.forEach((pattern,index)=>{
-			string = string.replace(pattern, replacements[index]);
-		})
-
-		return string;
+    i18n: async (msg, ...arg) => {
+      return await chrome.runtime.sendMessage({
+        command: "bananai18n",
+        arg: [msg, arg],
+      });
     },
   };
 	console.log("#20 files ",files )
 	console.log("Expected: [{ filename: url, speaker: ... },...]")	
 	var i;
 	files = files || [];
 	this.$videos = [];
-
+	
 	this.$videoContainer.empty();
 	this.currentIndex = 0;
-
 	for ( i = 0; i < files.length; i++ ) {
 		filename = files[ i ].filename,
 		url = `https://commons.wikimedia.org/wiki/File:${ filename.split( '/' ).pop()}`,
 		speaker = files[ i ].speaker,
 		total = files.length;
+		console.log(await banana.i18n("si-panel-videos-gallery-attribution",url, speaker, i+1, total));
 		this.$videos.push( $( `
 			<div style="display: none;">
 				<video controls="" muted="" preload="auto" src="${ files[ i ].filename }" width="250" class=""></video>
-				${browser.i18n.getMessage("si_panel_videos_gallery_attribution",[ url, speaker, i+1, total])}
+				${await banana.i18n("si-panel-videos-gallery-attribution",url, speaker, i+1, total)}
 			</div>
 		` ) );
 

background-script.js

@@ -408,6 +408,11 @@ browser.runtime.onMessage.addListener( async function ( message ) {
   else if (message.command === "changeUiLanguage") {
 	await changeUiLanguage(message.argument);
 	return;
+}
+else if (message.command === "storeParam") {
+	const [name,value] = message.argument;
+	storeParam(name,value);
+	return;
 }
 	message = normalizeMessage(message);
 
@@ -417,22 +422,17 @@ browser.runtime.onMessage.addListener( async function ( message ) {
 		return records[ message.text ] || records[ message.text.toLowerCase() ] || [];
 	}
 	 // When message 'signit.i18nCode' is heard, returns banada object
-	else if ( message.command === 'signit.getfilesb' ) {
-		console.log('bg>signit.getfilesB')
-		// var locale = await getStoredParam( 'uiLanguage' )
-		// loadI18nLocalization(locale);
-		return banana;
+	 else if (message.command === 'bananai18n') {
+		let [msg,placeholderValue] = message.arg;
+		const i18nMessage = banana.i18n(msg,placeholderValue);
+		return i18nMessage;
 	}
 
 	// Start modal
 	// When right click's menu "Lingua Libre SignIt" clicked, send message 'signit.sign' to the content script => opens Signit modal
 	else if ( message.command === 'signit.hinticon' ) {
 		callModal(message);
 	}
-	else if (message.command === "storeParam") {
-		storeParam([...message.arguments]);
-		return;
-	}
 });
 
 /* *************************************************************** */

content_scripts/signit.js

@@ -152,11 +152,8 @@
 
 		// Banana test, search `bananaInStore` in files for more
 		console.log("before")
-		var BetterBanana = await browser.storage.local.get( 'bananaInStore' );
-		var messageStore = await browser.storage.local.get( 'sourceMap' ); 
-		console.log("after: BetterBanana = ", BetterBanana.bananaInStore.locale,messageStore.sourceMap)
-
-		content = new SignItCoreContent(BetterBanana.bananaInStore.locale,messageStore.sourceMap);
+		content = new SignItCoreContent();
+		content.init();
 
 		// Setup an absolute-positionned $anchorModal we can programatically move
 		// to be able to point exactly some coords with our popup later