Skip to content

Commit 1c5facf

Browse files
committed
updates to multiple projects
1 parent 59148e1 commit 1c5facf

File tree

4 files changed

+91
-43
lines changed

4 files changed

+91
-43
lines changed

filterInTable/script.js

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,7 @@ search.addEventListener("keyup", () => {
1313
emptyTable();
1414
data.forEach(populateTable);
1515
} else {
16-
let tempData = data;
17-
tempData = tempData.filter((dt) => {
16+
let tempData = data.filter((dt) => {
1817
return dt.name.toLowerCase().includes(search.value);
1918
});
2019
//EMPTY THE TABLE
@@ -29,8 +28,7 @@ gender.addEventListener("change", () => {
2928
emptyTable();
3029
data.forEach(populateTable);
3130
} else {
32-
let tempData = data;
33-
tempData = tempData.filter((dt) => {
31+
let tempData = data.filter((dt) => {
3432
return dt.gender === gender.value;
3533
});
3634

@@ -46,8 +44,7 @@ active.addEventListener("change", () => {
4644
emptyTable();
4745
data.forEach(populateTable);
4846
} else {
49-
let tempData = data;
50-
tempData = tempData.filter((dt) => {
47+
let tempData = data.filter((dt) => {
5148
return (
5249
dt.lastSeen.slice(dt.lastSeen.lastIndexOf("-") + 1) === active.value
5350
);

typingTest/index.html

Lines changed: 10 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -7,28 +7,18 @@
77
<link rel="stylesheet" href="style.css" />
88
</head>
99
<body>
10-
<div id="wrapper">
11-
<div id="test">
12-
<div class="reference">
13-
<p>
14-
My name is Rohit Jain. I am a sofware developer and a trainer. I
15-
teach programming concepts. Languages I specialize in are HTML, CSS,
16-
Javascript, ReactJS, NodeJS and MongoDB
17-
</p>
18-
</div>
19-
20-
<div class="user">
21-
<textarea
22-
name=""
23-
placeholder="Type Here..."
24-
id=""
25-
cols="30"
26-
rows="10"
27-
></textarea>
28-
</div>
10+
<div class="container">
11+
<h1>Typing Test</h1>
12+
<div class="quote-display">
13+
<p id="quote"></p>
14+
</div>
15+
<div class="textarea-container">
16+
<textarea id="textarea" autofocus></textarea>
17+
</div>
18+
<div class="result-container">
19+
<p id="result"></p>
2920
</div>
3021
</div>
31-
3222
<script src="script.js"></script>
3323
</body>
3424
</html>

typingTest/script.js

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
const quoteDisplay = document.getElementById('quote');
2+
const textarea = document.getElementById('textarea');
3+
const resultDisplay = document.getElementById('result');
4+
5+
// Sample quote for testing
6+
const quote = "My name is Khan.";
7+
8+
// Function to calculate typing speed and accuracy
9+
function calculateResult() {
10+
const typedText = textarea.value.trim();
11+
const words = typedText.split(/\s+/).filter(word => word.length > 0);
12+
const totalWords = quote.split(/\s+/).filter(word => word.length > 0).length;
13+
const correctWords = words.filter(word => quote.includes(word)).length;
14+
const accuracy = Math.round((correctWords / totalWords) * 100);
15+
const typingDuration = new Date().getTime() - startTime;
16+
const wpm = Math.round((correctWords / (typingDuration / 60000)) * 100) / 100;
17+
18+
const result = `Words per minute: ${wpm}\nAccuracy: ${accuracy}%`;
19+
resultDisplay.textContent = result;
20+
}
21+
22+
// Initialize the quote display
23+
quoteDisplay.textContent = quote;
24+
25+
let startTime;
26+
27+
// Event listener for the textarea
28+
textarea.addEventListener('input', () => {
29+
if (textarea.value.trim() === '') {
30+
startTime = null;
31+
} else if (!startTime) {
32+
startTime = new Date().getTime();
33+
}
34+
});
35+
36+
// Event listener for the textarea's keyup event
37+
textarea.addEventListener('keyup', () => {
38+
const typedText = textarea.value.trim();
39+
if (typedText === quote) {
40+
calculateResult();
41+
textarea.disabled = true;
42+
}
43+
});

typingTest/style.css

Lines changed: 35 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,40 @@
1-
* {
1+
body {
2+
font-family: Arial, sans-serif;
3+
background-color: #f0f0f0;
4+
display: flex;
5+
justify-content: center;
6+
align-items: center;
7+
height: 100vh;
28
margin: 0;
3-
padding: 0;
4-
box-sizing: border-box;
5-
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
69
}
7-
#test {
8-
width: 80vw;
9-
margin: 1rem auto;
10+
11+
.container {
12+
background-color: #fff;
13+
padding: 20px;
14+
border-radius: 5px;
15+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
16+
max-width: 800px;
17+
width: 90%;
1018
}
11-
.reference{
12-
margin: 1rem 0;
19+
20+
.quote-display {
21+
background-color: #f9f9f9;
22+
padding: 10px;
23+
border: 1px solid #ddd;
24+
margin-bottom: 10px;
25+
height: 100px;
26+
overflow: auto;
1327
}
14-
.reference p{
15-
font-size: 18px;
16-
line-height: 1.5;
17-
}
18-
.user textarea{
19-
width: 100%;
20-
padding: 0.5rem;
21-
font-size: 18px;
28+
29+
textarea {
30+
width: 100%;
31+
height: 150px;
32+
resize: none;
33+
padding: 10px;
34+
font-size: 16px;
2235
}
36+
37+
.result-container {
38+
margin-top: 10px;
39+
font-weight: bold;
40+
}

0 commit comments

Comments
 (0)