monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-11-10 14:10:59 +08:00
Code Issues Projects Releases Packages Wiki Activity

updating words input position each time user moves to the next word to move the IME suggestion box

Browse source 
only shows up in japanese, korean and chinese languages for now (not sure which other languages use this)
closes #4022
This commit is contained in:
Miodec 2023-03-07 15:08:04 +01:00
parent 31b1474a47
commit d5165f137c
2 changed files with 27 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/styles/test.scss
View file

@ -400,14 +400,10 @@
outline: none;
display: block;
resize: none;
position: fixed;
position: absolute;
z-index: -1;
cursor: default;
pointer-events: none;
margin-left: 1rem;
// left: 50%;
// top: 50%;
// transform: translate(-50%, -50%);
}
#capsWarning {

26
frontend/src/ts/test/test-ui.ts
View file

@ -131,6 +131,7 @@ export function updateActiveElement(backspace?: boolean): void {
});
}
} catch (e) {}
updateWordsInputPosition();
}
function getWordHTML(word: string): string {
@ -188,6 +189,30 @@ export function showWords(): void {
$("#words").html(wordsHTML);
updateWordsHeight();
updateWordsInputPosition(true);
}
const posUpdateLangList = ["japanese", "chinese", "korean"];
export function updateWordsInputPosition(force = false): void {
const shouldUpdate = posUpdateLangList.some((l) =>
Config.language.startsWith(l)
);
if (!force && !shouldUpdate) return;
const el = document.querySelector("#wordsInput") as HTMLElement;
const activeWord = document.querySelector(
"#words .active"
) as HTMLElement | null;
if (!shouldUpdate || !activeWord) {
el.style.top = "0px";
el.style.left = "0px";
return;
}
el.style.top = activeWord.offsetTop + "px";
el.style.left = activeWord.offsetLeft + "px";
}
export function updateWordsHeight(): void {
@ -711,6 +736,7 @@ export function lineJump(currentTop: number): void {
}
}
currentTestLine++;
updateWordsInputPosition();
}
export function arrangeCharactersRightToLeft(): void {