diff --git a/Games/Typing_Test/README.md b/Games/Typing_Test/README.md new file mode 100644 index 0000000000..8bd7ea4867 --- /dev/null +++ b/Games/Typing_Test/README.md @@ -0,0 +1,30 @@ +# **Game_Name** + +Typing Test + +
+ +## **Description šŸ“ƒ** +- The game shows a random paragrapn that has to be typed in a specified time limit, as fast as possible. A higher typing speed would show a higher WPM value. + + +## **functionalities šŸŽ®** +- Space: jump to next word (if the word is incomplete it will mark it as incorrect) +- Backspace: deletes the letter +- Try Again +- WPM: Words Per Minutes +
+ +## **How to play? šŸ•¹ļø** +- Start typing +- A 60 timer will start counting backwards +- A random paragraph will be generated if clicked on try again +- Use your keyboard to enter characters. +- A word will be counted as correct only if it is completely correct +
+ +## **Screenshots šŸ“ø** + +
+![image](../../assets/images/Typing_Test.png) + diff --git a/Games/Typing_Test/index.html b/Games/Typing_Test/index.html new file mode 100644 index 0000000000..d014f9da93 --- /dev/null +++ b/Games/Typing_Test/index.html @@ -0,0 +1,44 @@ + + + + + + Typing Test + + + +
+ +
+
+

I inadvertently went to See's Candy last week (I was in the mall looking for phone repair), and as it turns out, See's Candy now charges a dollar -- a full dollar -- for even the simplest of their wee confection offerings. I bought two chocolate lollipops and two chocolate-caramel-almond things. The total cost was four-something. I mean, the candies were tasty and all, but let's be real: A Snickers bar is fifty cents. After this dollar-per-candy revelation, I may not find myself wandering dreamily back into a See's Candy any time soon. + I've rented a car in Las Vegas and have reserved a hotel in Twentynine Palms which is just north of Joshua Tree. We'll drive from Las Vegas through Mojave National Preserve and possibly do a short hike on our way down. Then spend all day on Monday at Joshua Tree. We can decide the next morning if we want to do more in Joshua Tree or Mojave before we head back. +

+
+
+
    +
  • +

    Time Left:

    + 60s +
    • +
  • +

    Mistakes:

    + 0 +
    • +
  • +

    WPM:

    + 0 +
    • +
  • +

    CPM:

    + 0 +
    • +
+ +
+
+
+ + + + \ No newline at end of file diff --git a/Games/Typing_Test/js/paragraph.js b/Games/Typing_Test/js/paragraph.js new file mode 100644 index 0000000000..4f1218b030 --- /dev/null +++ b/Games/Typing_Test/js/paragraph.js @@ -0,0 +1,22 @@ +const paragraphs=[ + "It was a rat's nest. Not a literal one, but that is what her hair seemed to resemble every morning when she got up. It was going to take at least an hour to get it under control and she was sick and tired of it. She peered into the mirror and wondered if it was worth it. It wasn't. She opened the drawer and picked up the hair clippers.She had been told time and time again that the most important steps were the first and the last. It was something that she carried within her in everything she did, but then he showed up and disrupted everything. He told her that she had it wrong. The first step wasn't the most important. The last step wasn't the most important. It was the next step that was the most important.", + "Sometimes there isn't a good answer. No matter how you try to rationalize the outcome, it doesn't make sense. And instead of an answer, you are simply left with a question. Why?Do you really listen when you are talking with someone? I have a friend who listens in an unforgiving way. She actually takes every word you say as being something important and when you have a friend that listens like that, words take on a whole new meaning.", + "Adaptability is the ability to adjust to changing circumstances and environments, and it is essential to resilience and success. Whether it's embracing new challenges and opportunities, remaining flexible and adaptable in the face of uncertainty, or seeking out support and resources when needed, adaptability can help us thrive in a constantly changing world.", + "With six children in tow, Catherine raced to the airport departing gate. This wasn't an easy task as the children had other priorities than to get to the gate. She knew that she was tight on time and the frustration came out as she yelled at the kids to keep up. They continued to test her, pretending not to listen and to move in directions that only slowed them down. They had no idea the wrath they were about to receive when Catherine made it to the gate only to be informed that they had all missed the plane.", + "Active learning goes beyond passively absorbing information; it involves actively engaging with the material to enhance comprehension and retention. Instead of simply reading or listening to lectures, active learners seek ways to interact with the content. This can include asking questions, participating in discussions, summarizing key points, creating mind maps, or teaching the material to someone else. These strategies help to reinforce learning, identify knowledge gaps, and promote critical thinking. By actively participating in the learning process, students can gain a deeper understanding of the subject matter and improve their academic performance.", + "He read about a hike called the incline in the guidebook. It said it was a strenuous hike and to bring plenty of water. ā€œA beautiful hike to the cloudsā€ described one review. ā€œNot for the faint-hearted,ā€ said another. ā€œNot too bad of a workoutā€, bragged a third review. I thought Iā€™d hike it when I fly in from Maryland on my day off from the senior citizen's wellness conference. I hiked 2 miles a day around the neighborhood so I could handle a 1.1-mile hike. What a foolish mistake that was for a 70-year-old low-lander.", + "It was the best compliment that he'd ever received although the person who gave it likely never knew. It had been an off-hand observation on his ability to hold a conversation and actually add pertinent information to it on practically any topic. Although he hadn't consciously strived to be able to do so, he'd started to voraciously read the news when he couldn't keep up on topics his friends discussed because their conversations went above his head. The fact that someone had noticed enough to compliment him that he could talk intelligently about many topics meant that he had succeeded in his quest to be better informed.", + "There was something in the tree. It was difficult to tell from the ground, but Rachael could see movement. She squinted her eyes and peered in the direction of the movement, trying to decipher exactly what she had spied. The more she peered, however, the more she thought it might be a figment of her imagination. Nothing seemed to move until the moment she began to take her eyes off the tree. Then in the corner of her eye, she would see the movement again and begin the process of staring again.", + "He stared out the window at the snowy field. He'd been stuck in the house for close to a month and his only view of the outside world was through the window. There wasn't much to see. It was mostly just the field with an occasional bird or small animal who ventured into the field. As he continued to stare out the window, he wondered how much longer he'd be shackled to the steel bar inside the house.", + "What were the chances? It would have to be a lot more than 100 to 1. It was likely even more than 1,000 to 1. The more he thought about it, the odds of it happening had to be more than 10,000 to 1 and even 100,000 to 1. People often threw around the chances of something happening as being 1,000,000 to 1 as an exaggeration of an unlikely event, but he could see that they may actually be accurate in this situation. Whatever the odds of it happening, he knew they were big. What he didn't know was whether this happening was lucky or unlucky.", + "What if dogs were racist? Would they care about fur colorā€¦.. ā€œson, only play with other tan dogsā€? Or maybe it would depend on breed, ā€œhoney, only play with other German Shepards, never poodlesā€. Better yet it could depend on occupation. ā€œIā€™m a sled dog while youā€™re only a running companion, leave me aloneā€. Maybe the neighborhood they live in could be the way they choose which dogs to associate with and which to shun? Size could be the determining factor, ā€œsee how tall that dog is, they are probably dumbā€. Luckily dogs donā€™t discriminate. Just watch at a dog park. Big black and white dogs wag their tails and play with tiny tan dogs. A service dog chases after the same ball as the off-duty police dog. So if dogs donā€™t discriminate then why do we?", + "Dave watched as the forest burned up on the hill, only a few miles from her house. The car had been hastily packed and Marta was inside trying to round up the last of the pets. Dave went through his mental list of the most important papers and documents that they couldn't leave behind. He scolded himself for not having prepared these better in advance and hoped that he had remembered everything that was needed. He continued to wait for Marta to appear with the pets, but she still was nowhere to be seen.", + "Was it a whisper or was it the wind? He wasn't quite sure. He thought he heard a voice but at this moment all he could hear was the wind rustling the leaves of the trees all around him. He stopped and listened more intently to see if he could hear the voice again. Nothing but the wind rustling the leaves could be heard. He was about to continue his walk when he felt a hand on his shoulder, and he quickly turned to see who it was. There was nobody there, but he heard the voice again.", + "How had she been so wrong? All her instincts and intuition completely failed her for the first time in her life. She had so heavily relied on both when making decisions up until this moment and she felt a seismic shift take place in her self-confidence. If she could be so completely wrong about something so simple as this, how could she make decisions about really important things taking place in her life? She wasn't sure what she should do next.", + "Betty decided to write a short story and she was sure it was going to be amazing. She had already written it in her head and each time she thought about it she grinned from ear to ear knowing how wonderful it would be. She could imagine the accolades coming in and the praise she would receive for creating such a wonderful piece. She was therefore extremely frustrated when she actually sat down to write the short story and the story that was so beautiful inside her head refused to come out that way on paper.", + "Indescribable oppression, which seemed to generate in some unfamiliar part of her consciousness, filled her whole being with a vague anguish. It was like a shadow, like a mist passing across her soul's summer day. It was strange and unfamiliar; it was a mood. She did not sit there inwardly upbraiding her husband, lamenting at Fate, which had directed her footsteps to the path which they had taken. She was just having a good cry all to herself. The mosquitoes made merry over her, biting her firm, round arms and nipping at her bare insteps.", + "She nervously peered over the edge. She understood in her mind that the view was supposed to be beautiful, but all she felt was fear. There had always been something about heights that disturbed her, and now she could feel the full force of this unease. She reluctantly crept a little closer with the encouragement of her friends as the fear continued to build. She couldn't help but feel that something horrible was about to happen.", + "There was a time when he would have embraced the change that was coming. In his youth, he sought adventure and the unknown, but that had been years ago. He wished he could go back and learn to find the excitement that came with change but it was useless. That curiosity had long left him to where he had come to loathe anything that put him out of his comfort zone.", + "Sleeping in his car was never the plan but sometimes things don't work out as planned. This had been his life for the last three months and he was just beginning to get used to it. He didn't actually enjoy it, but he had accepted it and come to terms with it. Or at least he thought he had. All that changed when he put the key into the ignition, turned it and the engine didn't make a sound.", + "Green vines attached to the trunk of the tree had wound themselves toward the top of the canopy. Ants used the vine as their private highway, avoiding all the creases and crags of the bark, to freely move at top speed from top to bottom or bottom to top depending on their current chore. At least this was the way it was supposed to be. Something had damaged the vine overnight halfway up the tree leaving a gap in the once pristine ant highway." +] \ No newline at end of file diff --git a/Games/Typing_Test/js/script.js b/Games/Typing_Test/js/script.js new file mode 100644 index 0000000000..0e4ab011bd --- /dev/null +++ b/Games/Typing_Test/js/script.js @@ -0,0 +1,99 @@ +// script.js + +const typingText = document.querySelector(".text p"); +const field = document.querySelector(".container .input"); +const timeTag = document.querySelector(".time span b"); +const mistakeTag = document.querySelector(".mistake span"); +const cpmTag = document.querySelector(".cpm span"); +const wpmTag = document.querySelector(".wpm span"); +const tryAgain = document.querySelector("button"); +let charIndex = 0; +let mistakes = 0; +let isTyping = false; +let timer; +let maxTime = 60; +let timeLeft = maxTime; + +function randomParagraph() { + let randIndex = Math.floor(Math.random() * paragraphs.length); // Get a random paragraph + typingText.innerHTML = ""; // Clear previous paragraph + + paragraphs[randIndex].split("").forEach(span => { + let spanTag = `${span}`; + typingText.innerHTML += spanTag; + }); + typingText.querySelectorAll("span")[0].classList.add("active"); + // Focusing input field on keydown or click event + document.addEventListener("keydown", () => field.focus()); + typingText.addEventListener("click", () => field.focus()); +} + +function initTyping() { + const characters = typingText.querySelectorAll("span"); + let typedChar = field.value.split("")[charIndex]; + if(charIndex 0 ){ + if (!isTyping) { + timer = setInterval(initTimer, 1000); + isTyping = true; + } + + if (typedChar == null) { // If typed character is null or presses backspace + if (charIndex > 0) { + charIndex--; + if (characters[charIndex].classList.contains("incorrect")) { + mistakes--; // Decrements mistakes only if class is incorrect + } + characters[charIndex].classList.remove("correct", "incorrect"); + } + } else { + if (characters[charIndex].innerText === typedChar) { + // If user types character correctly then class becomes correct otherwise incorrect with mistakes incremented + characters[charIndex].classList.add("correct"); + } else { + mistakes++; + characters[charIndex].classList.add("incorrect"); + } + charIndex++; + } + + characters.forEach(span => span.classList.remove("active")); + if (charIndex < characters.length) { + characters[charIndex].classList.add("active"); + } + let wpm = Math.round((((charIndex-mistakes)/5)/(maxTime-timeLeft)) * 60); + //if wpm value is less than 0,empty or infinity then setting its value to 0 + wpm=wpm<0 || !wpm || wpm === Infinity ? 0: wpm; + wpmTag.innerText=wpm; + mistakeTag.innerText = mistakes; + cpmTag.innerText = charIndex - mistakes; +}else{ + + clearInterval(timer); +} +} + +function initTimer() { + if (timeLeft > 0) { + timeLeft--; + timeTag.innerText = timeLeft; + } else { + clearInterval(timer); + field.disabled = true; // Optional: Disable input when time runs out + alert("Time's up!"); + } +} +function reset() +{ + randomParagraph(); + field.value=""; + clearInterval(timer); + timeLeft=maxTime; + charIndex=mistakes=isTyping =0; + timeTag.innerText = timeLeft; + wpmTag.innerText=0; + mistakeTag.innerText =mistakes; + cpmTag.innerText = 0; +} +randomParagraph(); +field.addEventListener("input", initTyping); +tryAgain.addEventListener("click", reset); \ No newline at end of file diff --git a/Games/Typing_Test/styles.css b/Games/Typing_Test/styles.css new file mode 100644 index 0000000000..c5a71d26fb --- /dev/null +++ b/Games/Typing_Test/styles.css @@ -0,0 +1,125 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap'); +*{ + margin:0; + padding:0; + box-sizing:border-box; + font-family:'Poppins',sans-serif; +} +body{ + display:flex; + align-items:center; + justify-content:center; + min-height: 100vh; + background: #c4c4ff; +} +.container{ + width:770px; + background:#e6e6fa; + padding:35px; + border-radius: 10px; +} +.container .input{ + z-index: -999; + opacity: 0; + position:absolute; +} +.container .box{ + padding:13px 20px 0; + border-radius:10px; + border: 1px solid #ccc; +} +.box .text{ + max-height:255px; + overflow-y:auto; +} +.text::-webkit-scrollbar{ + width:0; +} +.text p{ + font-size:21px; + text-align:justify; + letter-spacing:1px; + word-break:break-all; +} +.text p span{ + position:relative; +} +.text p span.correct{ + color: #56964f; +} +.text p span.incorrect{ + color:#cb3439; + background:#ffc0cb; + outline: 1px solid #fff; + border-radius:4px; +} +.text p span.active{ + color:#17a2b8; +} +.text p span.active::before{ + content:""; + position:absolute; + left:0; + bottom:0; + height:2px; + width:1000%; + background:#17a2b8; + animation:blink 1s ease-in-out infinite; +} +@keyframes blink{ + 50%{ + opacity: 1; + } +} +.box .content{ + display:flex; + margin-top:17px; + padding: 12px 0; + align-items:center; + border-top:1px solid #ccc; + justify-content:space-between; +} +.content .result{ + display:flex; + width:calc(100% - 140px); + justify-content:space-between; +} +.content button{ + border:none; + outline:none; + width:105px; + padding:8px 0; + color:#fff; + cursor:pointer; + font-size:16px; + border-radius:5px; + background:#c4c4ff; + transition:transform 0.3s ease; +} +.content button:active{ + transform:scale(0.97); +} +.result li{ + height:22px; + list-style:none; + display:flex; + align-items:center; +} +.result li span{ + display:block; + font-size:20px; + margin-left:10px; +} +.result li p{ + font-size:19px; +} +.result li:not(:first-child){ + padding-left:22px; + border-left:1px solid #a5a5a5; +} +.result li:not(:first-child) span{ + font-weight:500; +} +.result li b{ + font-weight:500; +} \ No newline at end of file diff --git a/README.md b/README.md index a64d16537e..139626dda0 100644 --- a/README.md +++ b/README.md @@ -345,7 +345,7 @@ This repository also provides one such platforms where contributers come over an | [Intellect Quest](https://github.com/Will2Jacks/GameZoneForked/tree/Task/Games/Intellect_Quest) | | [Number_Guessing_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Number_Guessing_Game) | | [Modulo_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Modulo_Game) | - +| [Typing_Test](https://github.com/kunjgit/GameZone/tree/main/Games/Typing_Test) |
diff --git a/assets/images/Screenshot from 2024-07-21 20-00-06.png b/assets/images/Screenshot from 2024-07-21 20-00-06.png new file mode 100644 index 0000000000..72305a8dda Binary files /dev/null and b/assets/images/Screenshot from 2024-07-21 20-00-06.png differ