Skip to content

Commit

Permalink
impr(tape mode): support RTL languages (@NadAlaba)
Browse files Browse the repository at this point in the history
  • Loading branch information
@NadAlaba
NadAlaba committed Sep 13, 2024
1 parent 550eb61 commit 1151c9f
Show file tree
Hide file tree
Showing 5 changed files with 102 additions and 76 deletions.
57 changes: 32 additions & 25 deletions frontend/src/ts/controllers/input-controller.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,7 @@ function updateUI(): void {
}
}

function backspaceToPrevious(): void {
async function backspaceToPrevious(): Promise<void> {
if (!TestState.isActive) return;

if (
Expand Down Expand Up @@ -152,7 +152,7 @@ function backspaceToPrevious(): void {
}
TestWords.words.decreaseCurrentIndex();
TestUI.setActiveWordElementIndex(TestUI.activeWordElementIndex - 1);
TestUI.updateActiveElement(true);
await TestUI.updateActiveElement(true);
Funbox.toggleScript(TestWords.words.getCurrent());
void TestUI.updateActiveWordLetters();

Expand Down Expand Up @@ -337,7 +337,7 @@ async function handleSpace(): Promise<void> {
}
}
TestUI.setActiveWordElementIndex(TestUI.activeWordElementIndex + 1);
TestUI.updateActiveElement();
await TestUI.updateActiveElement();
void Caret.updatePosition();

if (
Expand All @@ -363,7 +363,7 @@ async function handleSpace(): Promise<void> {
}

if (nextTop > currentTop) {
TestUI.lineJump(currentTop);
await TestUI.lineJump(currentTop);
}
} //end of line wrap

Expand Down Expand Up @@ -461,32 +461,32 @@ function isCharCorrect(char: string, charIndex: number): boolean {
return false;
}

function handleChar(
async function handleChar(
char: string,
charIndex: number,
realInputValue?: string
): void {
): Promise<void> {
if (TestUI.resultCalculating || TestUI.resultVisible) {
return;
}

if (char === "…" && TestWords.words.getCurrent()[charIndex] !== "…") {
for (let i = 0; i < 3; i++) {
handleChar(".", charIndex + i);
await handleChar(".", charIndex + i);
}

return;
}

if (char === "œ" && TestWords.words.getCurrent()[charIndex] !== "œ") {
handleChar("o", charIndex);
handleChar("e", charIndex + 1);
await handleChar("o", charIndex);
await handleChar("e", charIndex + 1);
return;
}

if (char === "æ" && TestWords.words.getCurrent()[charIndex] !== "æ") {
handleChar("a", charIndex);
handleChar("e", charIndex + 1);
await handleChar("a", charIndex);
await handleChar("e", charIndex + 1);
return;
}

Expand Down Expand Up @@ -745,7 +745,7 @@ function handleChar(
TestInput.input.current.length > 1
) {
if (Config.mode === "zen") {
if (!Config.showAllLines) TestUI.lineJump(activeWordTopBeforeJump);
if (!Config.showAllLines) await TestUI.lineJump(activeWordTopBeforeJump);
} else {
TestInput.input.current = TestInput.input.current.slice(0, -1);
void TestUI.updateActiveWordLetters();
Expand Down Expand Up @@ -785,7 +785,10 @@ function handleChar(
}
}

function handleTab(event: JQuery.KeyDownEvent, popupVisible: boolean): void {
async function handleTab(
event: JQuery.KeyDownEvent,
popupVisible: boolean
): Promise<void> {
if (TestUI.resultCalculating) {
event.preventDefault();
return;
Expand Down Expand Up @@ -813,7 +816,7 @@ function handleTab(event: JQuery.KeyDownEvent, popupVisible: boolean): void {
event.preventDefault();
// insert tab character if needed (only during the test)
if (!TestUI.resultVisible && shouldInsertTabCharacter) {
handleChar("\t", TestInput.input.current.length);
await handleChar("\t", TestInput.input.current.length);
setWordsInput(" " + TestInput.input.current);
return;
}
Expand All @@ -840,7 +843,7 @@ function handleTab(event: JQuery.KeyDownEvent, popupVisible: boolean): void {
// insert tab character if needed (only during the test)
if (!TestUI.resultVisible && shouldInsertTabCharacter) {
event.preventDefault();
handleChar("\t", TestInput.input.current.length);
await handleChar("\t", TestInput.input.current.length);
setWordsInput(" " + TestInput.input.current);
return;
}
Expand All @@ -859,7 +862,7 @@ function handleTab(event: JQuery.KeyDownEvent, popupVisible: boolean): void {
// insert tab character if needed
if (shouldInsertTabCharacter) {
event.preventDefault();
handleChar("\t", TestInput.input.current.length);
await handleChar("\t", TestInput.input.current.length);
setWordsInput(" " + TestInput.input.current);
return;
}
Expand Down Expand Up @@ -936,7 +939,7 @@ $(document).on("keydown", async (event) => {

//tab
if (event.key === "Tab") {
handleTab(event, popupVisible);
await handleTab(event, popupVisible);
}

//esc
Expand Down Expand Up @@ -1050,7 +1053,7 @@ $(document).on("keydown", async (event) => {
Monkey.type();

if (event.key === "Backspace" && TestInput.input.current.length === 0) {
backspaceToPrevious();
await backspaceToPrevious();
if (TestInput.input.current) {
setWordsInput(" " + TestInput.input.current + " ");
}
Expand Down Expand Up @@ -1088,7 +1091,7 @@ $(document).on("keydown", async (event) => {
}
}
} else {
handleChar("\n", TestInput.input.current.length);
await handleChar("\n", TestInput.input.current.length);
setWordsInput(" " + TestInput.input.current);
}
}
Expand Down Expand Up @@ -1145,7 +1148,7 @@ $(document).on("keydown", async (event) => {
)
) {
event.preventDefault();
handleChar(event.key, TestInput.input.current.length);
await handleChar(event.key, TestInput.input.current.length);
updateUI();
setWordsInput(" " + TestInput.input.current);
}
Expand All @@ -1161,7 +1164,7 @@ $(document).on("keydown", async (event) => {
const char: string | null = await LayoutEmulator.getCharFromEvent(event);
if (char !== null) {
event.preventDefault();
handleChar(char, TestInput.input.current.length);
await handleChar(char, TestInput.input.current.length);
updateUI();
setWordsInput(" " + TestInput.input.current);
}
Expand Down Expand Up @@ -1247,7 +1250,7 @@ $("#wordsInput").on("beforeinput", (event) => {
}
});

$("#wordsInput").on("input", (event) => {
$("#wordsInput").on("input", async (event) => {
if (!event.originalEvent?.isTrusted || TestUI.testRestarting) {
(event.target as HTMLInputElement).value = " ";
return;
Expand Down Expand Up @@ -1316,7 +1319,7 @@ $("#wordsInput").on("input", (event) => {

if (realInputValue.length === 0 && currTestInput.length === 0) {
// fallback for when no Backspace keydown event (mobile)
backspaceToPrevious();
await backspaceToPrevious();
} else if (inputValue.length < currTestInput.length) {
if (containsChinese) {
if (
Expand All @@ -1336,7 +1339,11 @@ $("#wordsInput").on("input", (event) => {
iOffset = inputValue.indexOf(" ") + 1;
}
for (let i = diffStart; i < inputValue.length; i++) {
handleChar(inputValue[i] as string, i - iOffset, realInputValue);
await handleChar(
inputValue[i] as string,
i - iOffset,
realInputValue
);
}
}
} else if (containsKorean) {
Expand Down Expand Up @@ -1373,7 +1380,7 @@ $("#wordsInput").on("input", (event) => {
}
for (let i = diffStart; i < inputValue.length; i++) {
// passing realInput to allow for correct Korean character compilation
handleChar(inputValue[i] as string, i - iOffset, realInputValue);
await handleChar(inputValue[i] as string, i - iOffset, realInputValue);
}
}

Expand Down
10 changes: 8 additions & 2 deletions frontend/src/ts/test/caret.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,11 +110,17 @@ function getTargetPositionLeft(

if (Config.tapeMode === "word" && inputLen > 0) {
let currentWordWidth = 0;
let lastPositiveLetterWidth = 0;
for (let i = 0; i < inputLen; i++) {
if (invisibleExtraLetters && i >= wordLen) break;
currentWordWidth +=
$(currentWordNodeList[i] as HTMLElement).outerWidth(true) ?? 0;
const letterOuterWidth =
$(currentWordNodeList[i] as Element).outerWidth(true) ?? 0;
currentWordWidth += letterOuterWidth;
if (letterOuterWidth > 0) lastPositiveLetterWidth = letterOuterWidth;
}
// if current letter has zero width move the caret to previous positive width letter
if ($(currentWordNodeList[inputLen] as Element).outerWidth(true) === 0)
currentWordWidth -= lastPositiveLetterWidth;
if (isLanguageRightToLeft) currentWordWidth *= -1;
result += currentWordWidth;
}
Expand Down
9 changes: 1 addition & 8 deletions frontend/src/ts/test/test-logic.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -418,13 +418,6 @@ export async function init(): Promise<void> {
}
}

if (Config.tapeMode !== "off" && language.rightToLeft) {
Notifications.add("This language does not support tape mode.", 0, {
important: true,
});
UpdateConfig.setTapeMode("off");
}

const allowLazyMode = !language.noLazyMode || Config.mode === "custom";
if (Config.lazyMode && !allowLazyMode) {
rememberLazyMode = true;
Expand Down Expand Up @@ -507,7 +500,7 @@ export async function init(): Promise<void> {
Funbox.toggleScript(TestWords.words.getCurrent());
TestUI.setRightToLeft(language.rightToLeft);
TestUI.setLigatures(language.ligatures ?? false);
TestUI.showWords();
await TestUI.showWords();
console.debug("Test initialized with words", generatedWords);
console.debug(
"Test initialized with section indexes",
Expand Down
Loading

0 comments on commit 1151c9f

Please sign in to comment.