Allow Translation to occur when TL is loaded

3 files changed, 18 insertions, 12 deletions

diff --git a/static/css/styles.css b/static/css/styles.css
index 491780c7..228234b4 100644
--- a/static/css/styles.css
+++ b/static/css/styles.css
@@ -18,6 +18,11 @@ body {
     display: none !important;
 }
 
+font:hover, .VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q {
+    background: none !important;
+    box-shadow: none !important;
+}
+
 input,
 textarea {
     font-family: 'Mali', sans-serif !important;
diff --git a/static/js/tl.js b/static/js/tl.js
index dd6a34b8..9fa8808f 100644
--- a/static/js/tl.js
+++ b/static/js/tl.js
@@ -14,8 +14,6 @@ var currentLang = document.cookie.replace(
   "$1"
 );
 
-console.log("currentLang: " + currentLang);
-
 if (currentLang == "ja") {
   triggerTranslation("ja");
 } else {
@@ -27,14 +25,17 @@ function triggerTranslation(language) {
   if (!selectEl) {
     setTimeout(function () {
       triggerTranslation(language);
-    }, 100);
+    }, 10);
   } else if (!selectEl.options || selectEl.options.length === 0) {
     setTimeout(function () {
       triggerTranslation(language);
-    }, 100);
+    }, 10);
   } else {
-    // Continue with the logic for handling the available options
-    selectEl.value = language; // Change the value of the select element
-    selectEl.dispatchEvent(new Event("change")); // Trigger change event
+    selectEl.value = language;
+    selectEl.dispatchEvent(new Event("change"));
+    // visiblity of #main-section is hidden until translation is done, show it after translation is done
+    setTimeout(function () {
+      document.getElementById("main-section").style.visibility = "visible";
+    }, 200);
   }
 }
diff --git a/templates/blog/partials/base.html b/templates/blog/partials/base.html
index f9b77652..c454290e 100644
--- a/templates/blog/partials/base.html
+++ b/templates/blog/partials/base.html
@@ -93,7 +93,7 @@
         </div>
       </div>
 
-      <table id="main-section" cellpadding="0" cellspacing="0">
+      <table id="main-section" cellpadding="0" cellspacing="0" {% if request.COOKIES.lang == 'ja' %}style="visibility: hidden"{% endif %}>
         <tr>
           <td id="sidebar" valign="top">
             {% include 'blog/partials/sidebar.html' %}
@@ -144,6 +144,10 @@
         </p>
       </div>
     </div>
+    
+    <script src="{% static 'js/jquery-1.12.4.min.js' %}"></script>
+    <script src="{% static 'js/globals.js' %}"></script>
+    <script src="{% static 'js/phone_compatibility.js' %}"></script>
     {% if request.COOKIES.lang == 'ja' %}
     <script
       type="text/javascript"
@@ -151,10 +155,6 @@
     ></script>
     <script src="{% static 'js/tl.js' %}"></script>
     {% endif %}
-
-    <script src="{% static 'js/jquery-1.12.4.min.js' %}"></script>
-    <script src="{% static 'js/globals.js' %}"></script>
-    <script src="{% static 'js/phone_compatibility.js' %}"></script>
     {% if request.COOKIES.summonOneko == 'true' %}
     <script src="{% static 'js/oneko.js' %}"></script>
     {% endif %} {% block scripts %} {% endblock %}