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

fixed quick toggle-to-highlight bug (#4481)

Browse source 
* fixed quick toggle-to-highlight bug

* eslint fix

* added return type to function, eslint
This commit is contained in:
ademirkan 2023-07-27 01:52:41 -07:00 • committed by GitHub
parent 50c96006c2
commit 17713fde87
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 21 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
frontend/src/ts/elements/result-word-highlight.ts
View file

@ -10,6 +10,7 @@ const PADDING_X = 16;
const PADDING_Y = 12;
const PADDING_OFFSET_X = PADDING_X / 2;
const PADDING_OFFSET_Y = PADDING_Y / 2;
const TOGGLE_RESULT_WORDS_BUFFER = 250;
// Type definition for a Line object, each representing a line of text in #resultWordsHistory
type Line = {
@ -46,6 +47,9 @@ let highlightRange: number[] = [];
let RWH_el: HTMLElement;
let RWH_rect: DOMRect;
// Last time toggleResultWords was toggled on
let lastToggleWordsHistoryTime = new Date();
// Flags
let isInitialized = false;
let isHoveringChart = false;
@ -183,6 +187,18 @@ async function init(): Promise<boolean> {
isInitInProgress = true;
// Wait for toggle button to fully populate resultWordHighlights before highlighting
const TIME_DIFF_SINCE_LAST_TOGGLE =
new Date().getTime() - lastToggleWordsHistoryTime.getTime();
if (TIME_DIFF_SINCE_LAST_TOGGLE < TOGGLE_RESULT_WORDS_BUFFER) {
await new Promise((resolve) =>
setTimeout(
resolve,
TOGGLE_RESULT_WORDS_BUFFER - TIME_DIFF_SINCE_LAST_TOGGLE
)
);
}
// Set isLanguageRTL
const currentLanguage = await Misc.getCurrentLanguage(Config.language);
isLanguageRightToLeft = currentLanguage.rightToLeft;
@ -192,7 +208,6 @@ async function init(): Promise<boolean> {
wordEls = $(RWH_el).find(".words .word[input]");
// remove non-input words
if (wordEls.length === 0) {
isInitInProgress = false;
return false;
@ -518,3 +533,7 @@ function getHighlightWidth(
width -= lastWordElRect.width - lastInputWordElRect.width;
return width;
}
export function updateToggleWordsHistoryTime(): void {
lastToggleWordsHistoryTime = new Date();
}

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

@ -1021,6 +1021,7 @@ async function loadWordsHistory(): Promise<boolean> {
export function toggleResultWords(noAnimation = false): void {
if (resultVisible) {
ResultWordHighlight.updateToggleWordsHistoryTime();
if ($("#resultWordsHistory").stop(true, true).hasClass("hidden")) {
//show