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

always show words history

Browse source 
corrected history
restarting on long tests impossible
This commit is contained in:
Jack 2020-08-07 00:42:25 +01:00
parent 02a4ed823a
commit 71f5b6dd1b
5 changed files with 145 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
public/css/style.scss
View file

@ -1326,6 +1326,11 @@ key {
& letter.correct {
color: var(--sub-color);
}
& letter.corrected {
color: var(--sub-color);
border-bottom: 2px dotted var(--sub-color);
}
}
}
@ -1335,6 +1340,11 @@ key {
color: var(--main-color);
}
& letter.corrected {
color: var(--main-color);
border-bottom: 2px dotted var(--main-color);
}
& letter.incorrect {
color: var(--colorful-error-color);
}
@ -1353,6 +1363,11 @@ key {
color: var(--sub-color);
}
& letter.corrected {
color: var(--sub-color);
border-bottom: 2px dotted var(--sub-color);
}
& letter.incorrect {
color: var(--colorful-error-color);
}
@ -1499,6 +1514,11 @@ key {
color: var(--text-color);
}
.word letter.corrected {
color: var(--text-color);
border-bottom: 2px dotted var(--text-color);
}
.word letter.incorrect {
color: var(--error-color);
}
@ -2190,6 +2210,7 @@ key {
cursor: pointer;
margin-right: 0.25rem;
cursor: pointer;
outline: none;
&:hover,
&:focus {

10
public/index.html
View file

@ -1083,6 +1083,16 @@
<div class="button on" tabindex="0" onclick="this.blur();">on</div>
</div>
</div>
<div class="section alwaysShowWordsHistory">
<h1>always show words history</h1>
<div class="text">This option will automatically show the words history at the end of the test. Can cause
slight lag with a lot of words.
</div>
<div class="buttons">
<div class="button off" tabindex="0" onclick="this.blur();">off</div>
<div class="button on" tabindex="0" onclick="this.blur();">on</div>
</div>
</div>
<div class="section tags">
<h1>tags</h1>
<div class="text">With tags, you can compare how fast you're typing in different situations. You can see

115
public/js/script.js
View file

@ -2,6 +2,8 @@ let wordsList = [];
let currentWordIndex = 0;
let currentWordElementIndex = 0;
let inputHistory = [];
let correctedHistory = [];
let currentCorrected = "";
let currentInput = "";
let time = 0;
let timers = [];
@ -26,6 +28,7 @@ let sameWordset = false;
let quotes = [];
let focusState = false;
let activeFunBox = "none";
let manualRestart = false;
let themeColors = {
bg: "#323437",
@ -272,6 +275,8 @@ function initWords() {
incorrect: 0,
};
inputHistory = [];
correctedHistory = [];
currentCorrected = "";
currentInput = "";
let language = words[config.language];
@ -696,6 +701,8 @@ function compareInput(showError) {
) {
inputHistory.push(input);
currentInput = "";
correctedHistory.push(currentCorrected);
currentCorrected = "";
//last character typed, show result
if (!resultVisible) {
if (keypressPerSecond.length === 0) {
@ -1858,6 +1865,9 @@ function showResult(difficultyFailed = false) {
swapElements($("#wordsWrapper"), $("#result"), 250, () => {
$("#words").empty();
wpmOverTimeChart.resize();
if (config.alwaysShowWordsHistory) {
toggleResultWordsDisplay();
}
// if (config.blindMode) {
// $.each($("#words .word"), (i, word) => {
// let input = inputHistory[i];
@ -1976,6 +1986,28 @@ function startTest() {
}
function restartTest(withSameWordset = false) {
if (!manualRestart) {
if (
(config.mode === "words" && config.words < 1000) ||
(config.mode === "time" && config.time < 3600) ||
config.mode === "quote" ||
(config.mode === "custom" &&
customTextIsRandom &&
customTextWordCount < 1000) ||
(config.mode === "custom" &&
!customTextIsRandom &&
customText.length < 1000)
) {
} else {
showNotification(
"Restart disabled for long tests. Use your mouse to confirm.",
4000
);
return;
}
}
manualRestart = false;
clearIntervals();
time = 0;
// afkDetected = false;
@ -2179,6 +2211,7 @@ function changePage(page) {
hideSignOutButton();
restartCount = 0;
incompleteTestSeconds = 0;
manualRestart = true;
restartTest();
} else if (page == "about") {
pageTransition = true;
@ -2497,7 +2530,12 @@ async function loadWordsHistory() {
$("#words").empty();
inputHistory.forEach((input, index) => {
if (input === "") return;
let wordEl = `<div class='word' input='${input}'>`;
let wordEl = "";
if (correctedHistory[index] !== "") {
wordEl = `<div class='word' input='${correctedHistory[index]}'>`;
} else {
wordEl = `<div class='word' input='${input}'>`;
}
if (input !== wordsList[index]) {
wordEl = `<div class='word error' input='${input}'>`;
}
@ -2513,10 +2551,21 @@ async function loadWordsHistory() {
for (let c = 0; c < loop; c++) {
// input.forEach((inputLetter, inputLetterIndex) => {
let correctedChar;
try {
correctedChar = correctedHistory[index][c];
} catch (e) {
correctedChar = undefined;
}
if (wordsList[index][c] !== undefined) {
if (input[c] === wordsList[index][c]) {
wordEl +=
'<letter class="correct">' + wordsList[index][c] + "</letter>";
if (correctedChar === input[c]) {
wordEl +=
'<letter class="correct">' + wordsList[index][c] + "</letter>";
} else {
wordEl +=
'<letter class="corrected">' + wordsList[index][c] + "</letter>";
}
} else {
if (input[c] === currentInput || input[c] === undefined) {
wordEl += "<letter>" + wordsList[index][c] + "</letter>";
@ -2877,6 +2926,7 @@ $("#customTextPopup .button").click((e) => {
// customTextIsRandom = false;
// }
customTextWordCount = $("#customTextPopup .wordcount input").val();
manualRestart = true;
restartTest();
// }
hideCustomTextPopup();
@ -2941,12 +2991,10 @@ function applyMode2Popup() {
if (mode == "time") {
if (val !== null && !isNaN(val) && val > 0) {
changeTimeConfig(val);
manualRestart = true;
restartTest();
if (val >= 1800) {
showNotification(
"Very long tests can cause performance issues or crash the website on some machines!",
5000
);
showNotification("Stay safe and take breaks!", 3000);
}
} else {
showNotification("Custom time can only be set between 1 and 3600", 3000);
@ -2954,12 +3002,10 @@ function applyMode2Popup() {
} else if (mode == "words") {
if (val !== null && !isNaN(val) && val > 0 && val <= 10000) {
changeWordCount(val);
manualRestart = true;
restartTest();
if (val > 2000) {
showNotification(
"Very long tests can cause performance issues or crash the website on some machines!",
5000
);
showNotification("Stay safe and take breaks!", 3000);
}
} else {
showNotification(
@ -2997,6 +3043,7 @@ $(document).on("click", "#top .config .wordCount .text-button", (e) => {
showCustomMode2Popup("words");
} else {
changeWordCount(wrd);
manualRestart = true;
restartTest();
}
});
@ -3019,6 +3066,8 @@ $(document).on("click", "#top .config .time .text-button", (e) => {
showCustomMode2Popup("time");
} else {
changeTimeConfig(time);
manualRestart = true;
restartTest();
}
});
@ -3031,6 +3080,8 @@ $(document).on("click", "#top .config .customText .text-button", (e) => {
$(document).on("click", "#top .config .punctuationMode .text-button", (e) => {
togglePunctuation();
manualRestart = true;
restartTest();
});
@ -3042,6 +3093,8 @@ $(document).on("click", "#top .config .mode .text-button", (e) => {
if ($(e.currentTarget).hasClass("active")) return;
mode = e.currentTarget.innerHTML;
changeMode(mode);
manualRestart = true;
restartTest();
});
@ -3093,12 +3146,13 @@ $(document).on("keypress", "#restartTestButton", (event) => {
}
restartTest();
} else {
showNotification("Quick restart disabled for long tests", 3000);
showNotification("Quick restart disabled for long tests", 2000);
}
}
});
$(document.body).on("click", "#restartTestButton", (event) => {
manualRestart = true;
restartTest();
});
@ -3113,6 +3167,8 @@ $(document.body).on("click", "#showWordHistoryButton", (event) => {
});
$(document.body).on("click", "#restartTestButtonWithSameWordset", (event) => {
manualRestart = true;
restartTest(true);
});
@ -3181,6 +3237,7 @@ $(document).keypress(function (event) {
if (!testActive) return;
}
let thisCharCorrect;
if (
wordsList[currentWordIndex].substring(
currentInput.length,
@ -3194,6 +3251,19 @@ $(document).keypress(function (event) {
accuracyStats.correct++;
thisCharCorrect = true;
}
if (currentCorrected === "") {
currentCorrected = currentInput + event["key"];
} else {
let cil = currentInput.length;
if (cil >= currentCorrected.length) {
currentCorrected += event["key"];
} else if (!thisCharCorrect) {
currentCorrected =
currentCorrected.substring(0, cil) +
event["key"] +
currentCorrected.substring(cil + 1);
}
}
currentKeypressCount++;
if (config.stopOnError && !thisCharCorrect) {
@ -3219,9 +3289,6 @@ $(document).keypress(function (event) {
// console.time("offcheck1");
let newActiveTop = document.querySelector("#words .word.active").offsetTop;
if (activeWordTopBeforeJump != newActiveTop && !lineTransition) {
console.log("word jumped");
console.log(activeWordTopBeforeJump);
console.log(newActiveTop);
activeWordJumped = true;
} else {
activeWordJumped = false;
@ -3291,7 +3358,7 @@ $(document).keydown((event) => {
}
restartTest();
} else {
showNotification("Quick restart disabled for long tests", 3000);
showNotification("Quick restart disabled for long tests", 2000);
}
} else {
changePage("test");
@ -3319,8 +3386,10 @@ $(document).keydown((event) => {
if (event["ctrlKey"] || event["altKey"]) {
currentInput = "";
inputHistory.pop();
correctedHistory.pop();
} else {
currentInput = inputHistory.pop();
currentCorrected = correctedHistory.pop();
}
currentWordIndex--;
currentWordElementIndex--;
@ -3495,6 +3564,17 @@ $(document).keydown((event) => {
}
return;
}
let cil = currentInput.length;
if (cil < wordsList[currentWordIndex].length) {
if (cil >= currentCorrected.length) {
currentCorrected += "_";
} else if (!thisCharCorrect) {
currentCorrected =
currentCorrected.substring(0, cil) +
"_" +
currentCorrected.substring(cil + 1);
}
}
inputHistory.push(currentInput);
highlightBadWord(currentWordElementIndex, !config.blindMode);
currentInput = "";
@ -3522,6 +3602,8 @@ $(document).keydown((event) => {
updateCaretPosition();
currentKeypressCount++;
}
correctedHistory.push(currentCorrected);
currentCorrected = "";
if (config.keymapMode === "react") {
flashPressedKeymapKey(event.code, true);
} else if (config.keymapMode === "next") {
@ -3597,6 +3679,7 @@ $(document).on("mouseleave", "#words .word", (e) => {
$(document).ready(() => {
updateFavicon(32, 14);
$("body").css("transition", ".25s");
manualRestart = true;
restartTest();
if (config.quickTab) {
$("#restartTestButton").addClass("hidden");

4
public/js/settings.js
View file

@ -131,6 +131,10 @@ settingsGroups.confidenceMode = new SettingsGroup(
);
settingsGroups.blindMode = new SettingsGroup("blindMode", setBlindMode);
settingsGroups.quickEnd = new SettingsGroup("quickEnd", setQuickEnd);
settingsGroups.alwaysShowWordsHistory = new SettingsGroup(
"alwaysShowWordsHistory",
setAlwaysShowWordsHistory
);
settingsGroups.flipTestColors = new SettingsGroup(
"flipTestColors",
setFlipTestColors

11
public/js/userconfig.js
View file

@ -44,6 +44,7 @@ let defaultConfig = {
fontFamily: "Roboto_Mono",
smoothLineScroll: false,
alwaysShowDecimalPlaces: false,
alwaysShowWordsHistory: false,
};
let cookieConfig = null;
@ -146,6 +147,7 @@ function applyConfig(configObj) {
setShowLiveWpm(configObj.showLiveWpm, true);
setShowTimerProgress(configObj.showTimerProgress, true);
setAlwaysShowDecimalPlaces(config.alwaysShowDecimalPlaces, true);
setAlwaysShowWordsHistory(config.alwaysShowWordsHistory, true);
if (
configObj.resultFilters == null ||
configObj.resultFilters == undefined
@ -248,6 +250,15 @@ function setAlwaysShowDecimalPlaces(val, nosave) {
if (!nosave) saveConfigToCookie();
}
//always show words history
function setAlwaysShowWordsHistory(val, nosave) {
if (val == undefined) {
val = false;
}
config.alwaysShowWordsHistory = val;
if (!nosave) saveConfigToCookie();
}
//show all lines
function toggleShowAllLines() {
sal = !config.showAllLines;