Translated Pages are Cached

2 files changed, 49 insertions, 0 deletions

diff --git a/static/js/db.js b/static/js/db.js
new file mode 100644
index 00000000..2cffa80c
--- /dev/null
+++ b/static/js/db.js
@@ -0,0 +1,20 @@
+function savePageToDB(entirePage, path) {
+    window.sessionStorage.setItem(path, entirePage);
+    // db.collection('pages').doc(path).set({ path: path, page: entirePage });
+}
+
+const lang = localStorage.getItem("lang");
+const path = window.location.pathname;
+
+const storedPage = window.sessionStorage.getItem(path);
+
+if (lang === "ja" && storedPage) {
+    console.log("Page already translated");
+    document.getElementById('wrap').innerHTML = storedPage;
+} else {
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.src =
+        "//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";
+    document.getElementById("tl_block").appendChild(script);
+}
diff --git a/static/js/tl.js b/static/js/tl.js
index 44c8b044..df6c69eb 100644
--- a/static/js/tl.js
+++ b/static/js/tl.js
@@ -45,6 +45,9 @@ function translateJapanese() {
   } else {
     selectEl.value = 'ja';
     selectEl.dispatchEvent(new Event("change"));
+    setTimeout(function () {
+      save();
+    }, 6969);
   }
 }
 
@@ -59,6 +62,9 @@ if (currentLang === "ja") {
   $('#tl_ja').show();
   $('body').addClass('ja');
   $('body').removeClass('en');
+  setTimeout(function () {
+    save();
+  }, 6969);
 } else {
   $('#tl_ja').hide();
   $('#tl_en').show();
@@ -66,3 +72,26 @@ if (currentLang === "ja") {
   $('body').removeClass('ja');
   restoreLang();
 }
+
+// let entirePage;
+
+function save() {
+  // only body
+  const entirePage = document.getElementById('wrap').innerHTML;
+  const path = window.location.pathname;
+  
+  const storedPage = window.sessionStorage.getItem(path);
+
+  if (storedPage === null || storedPage !== entirePage) {
+    console.log('Saving page to DB');
+    window.sessionStorage.setItem(path, entirePage);
+  }
+
+  // db.collection('pages').doc(path).get().then(page => {
+  //   const storedPage = page?.page;
+  //   if (storedPage === null || storedPage !== entirePage) {
+  //     console.log('Saving page to DB');
+  //     savePageToDB(entirePage, path);
+  //   }
+  // });
+}