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

added time display to the result of word tests

Browse source
This commit is contained in:
Jack 2020-05-25 16:50:50 +01:00
parent 8a40990957
commit 85821fb95f
3 changed files with 36 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
public/css/style.scss
View file

@ -628,7 +628,7 @@ key {
grid-template-areas:
"wpm acc"
"wpm key"
"info info";
"info time";
.group{
.top{
color: var(--sub-color);
@ -690,6 +690,9 @@ key {
.key{
grid-area: key;
}
.time{
grid-area: time;
}
}
}

12
public/index.html
View file

@ -166,19 +166,23 @@
<!-- <div class="info">words 10<br>punctuation</div> -->
<div class="group info">
<div class="top">test type</div>
<div class="bottom">100</div>
<div class="bottom">-</div>
</div>
<div class="group wpm">
<div class="top">wpm<div class="crownWrapper"><div class="crown"><i class="fas fa-crown"></i></div></div></div>
<div class="bottom">100</div>
<div class="bottom">-</div>
</div>
<div class="group acc">
<div class="top">acc</div>
<div class="bottom">100%</div>
<div class="bottom">-</div>
</div>
<div class="group key">
<div class="top">key</div>
<div class="bottom">100/1</div>
<div class="bottom">-</div>
</div>
<div class="group time">
<div class="top">time</div>
<div class="bottom">-</div>
</div>
</div>
<div class="chart">

33
public/js/script.js
View file

@ -93,6 +93,11 @@ function capitalizeFirstLetter(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
function roundedToFixed(float, digits){
let rounded = Math.pow(10, digits);
return (Math.round(float * rounded) / rounded).toFixed(digits);
}
function initWords() {
testActive = false;
wordsList = [];
@ -429,7 +434,13 @@ function calculateStats() {
let testSeconds = (testNow - testStart) / 1000;
let wpm = Math.round((chars.correctWordChars * (60 / testSeconds)) / 5);
let acc = Math.floor((accuracyStats.correct / (accuracyStats.correct + accuracyStats.incorrect)) * 100);
return { wpm: wpm, acc: acc, correctChars: chars.allCorrectChars, incorrectChars: chars.incorrectChars + chars.extraChars + chars.missedChars };
return {
wpm: wpm,
acc: acc,
correctChars: chars.allCorrectChars,
incorrectChars: chars.incorrectChars + chars.extraChars + chars.missedChars,
time: testSeconds
};
}
function hideCrown() {
@ -444,13 +455,18 @@ function showCrown() {
function showResult() {
testEnd = Date.now();
testActive = false;
setFocus(false);
hideCaret();
hideLiveWpm();
let stats = calculateStats();
if(stats === undefined){
stats = {
wpm: 0,
acc: 0,
correctChars: 0,
incorrectChars: 0
incorrectChars: 0,
time: 0
}
}
clearIntervals();
@ -460,8 +476,11 @@ function showResult() {
let mode2 = "";
if (config.mode == "time") {
mode2 = config.time;
$("#result .stats .time").addClass('hidden');
} else if (config.mode == "words") {
mode2 = config.words;
$("#result .stats .time").removeClass('hidden');
$("#result .stats .time .bottom").text(roundedToFixed(stats.time,1)+'s');
}
if(afkDetected){
@ -532,15 +551,11 @@ function showResult() {
infoText += "<br>" + config.language.replace('_', ' ');
}
if (config.punctuation) {
infoText += "<br>with punctuation"
infoText += "<br>punctuation"
}
$("#result .stats .info .bottom").html(infoText);
testActive = false;
setFocus(false);
hideCaret();
hideLiveWpm();
let labels = [];
for (let i = 1; i <= wpmHistory.length; i++) {
labels.push(i.toString());
@ -1096,8 +1111,8 @@ $(document).keydown((event) => {
//space
if (event["keyCode"] == 32) {
if (!testActive) return;
event.preventDefault();
if (currentInput == "") return;
event.preventDefault();
let currentWord = wordsList[currentWordIndex];
if (config.mode == "time") {
let currentTop = $($("#words .word")[currentWordIndex]).position().top;