From 47fe0c6a46fe2e3856b3cb9a3e3e1985e8dbdef6 Mon Sep 17 00:00:00 2001
From: typer <teiqeo@gmail.com>
Date: Thu, 10 Sep 2020 05:25:22 -0700
Subject: [PATCH] Add support for right-to-left languages

---
 public/css/style.scss | 10 ++++++++++
 public/js/script.js   | 29 +++++++++++++++++++++++++----
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/public/css/style.scss b/public/css/style.scss
index 1592648bf..87880b73f 100644
--- a/public/css/style.scss
+++ b/public/css/style.scss
@@ -1522,6 +1522,16 @@ key {
       opacity: 0 !important;
     }
   }
+
+  /* a little hack for right-to-left languages */
+  div.pageTest.rightToLeftTest {
+    #words {
+      flex-direction: row-reverse;
+      .word {
+        flex-direction: row-reverse;
+      }
+    }
+  }
 }
 
 #showWordHistoryButton {
diff --git a/public/js/script.js b/public/js/script.js
index 3269d72a8..fdddc82be 100644
--- a/public/js/script.js
+++ b/public/js/script.js
@@ -554,9 +554,23 @@ function initWords() {
       wordsList.push(w[i]);
     }
   }
+  //special case right-to-left languages.
+  if (config.language == "hebrew") {
+    arrangeCharactersRightToLeft();
+  } else {
+    arrangeCharactersLeftToRight();
+  }
   showWords();
 }
 
+function arrangeCharactersRightToLeft() {
+  $("#middle > div.pageTest").addClass("rightToLeftTest");
+}
+
+function arrangeCharactersLeftToRight() {
+  $("#middle > div.pageTest").removeClass("rightToLeftTest");
+}
+
 function setToggleSettings(state) {
   setPunctuation(state);
   setNumbers(state);
@@ -1398,7 +1412,11 @@ function updateCaretPosition() {
       .querySelectorAll("letter")[currentLetterIndex];
 
     if ($(currentLetter).length == 0) return;
-    let currentLetterPosLeft = currentLetter.offsetLeft;
+    //special case right to left languages
+    const isLeftToRight = config.language !== "hebrew";
+    let currentLetterPosLeft = isLeftToRight
+      ? currentLetter.offsetLeft
+      : currentLetter.offsetLeft + $(currentLetter).width();
     let currentLetterPosTop = currentLetter.offsetTop;
     let letterHeight = $(currentLetter).height();
     let newTop = 0;
@@ -1406,10 +1424,13 @@ function updateCaretPosition() {
 
     newTop = currentLetterPosTop - letterHeight / 4;
     if (inputLen == 0) {
-      newLeft = currentLetterPosLeft - caret.width() / 2;
+      newLeft = isLeftToRight
+        ? currentLetterPosLeft - caret.width() / 2
+        : currentLetterPosLeft + caret.width() / 2;
     } else {
-      newLeft =
-        currentLetterPosLeft + $(currentLetter).width() - caret.width() / 2;
+      newLeft = isLeftToRight
+        ? currentLetterPosLeft + $(currentLetter).width() - caret.width() / 2
+        : currentLetterPosLeft - $(currentLetter).width() + caret.width() / 2;
     }
 
     let duration = 0;