-
Notifications
You must be signed in to change notification settings - Fork 838
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch
kunjgit:main
into Anjaliavv51/issue4313
- Loading branch information
Showing
5 changed files
with
157 additions
and
5 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
# **Modulo_Game** | ||
|
||
--- | ||
|
||
<br> | ||
|
||
## **Description 📃** | ||
|
||
-Find Modulo of given numbers. | ||
-This is time based game. | ||
-User needs to answer max quations. | ||
|
||
## **functionalities 🎮** | ||
|
||
-In 60s User needs to give max right answer. | ||
-Point counting. | ||
-Display Correct answer. | ||
-Giver Alert on wrong answer. | ||
|
||
<br> | ||
|
||
## **How to play? 🕹️** | ||
-When you open page your timer start. | ||
-Input your answer and submit. | ||
-If it is correct your score counts. | ||
|
||
<br> | ||
|
||
## **Screenshots 📸** | ||
|
||
<br> | ||
![image](../../assets/images/Modulo_Game.png) | ||
<br> | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,119 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Modulo_Game</title> | ||
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> | ||
</head> | ||
<body class="bg-light"> | ||
|
||
<nav class="navbar navbar-expand-lg navbar-light bg-light"> | ||
<div class="container"> | ||
<a class="navbar-brand" href="#">Modulo_Game</a> | ||
</div> | ||
</nav> | ||
|
||
<div class="container mt-5"> | ||
<div class="row"> | ||
<div class="col-md-6 offset-md-3"> | ||
<h3 class="text-center mb-4">Answer as many modulo questions as you can in 60 seconds!</h3> | ||
<div class="card"> | ||
<div class="card-body"> | ||
<div id="question-container"> | ||
<h5 id="question" class="card-title"></h5> | ||
<input type="text" id="answer" class="form-control mb-3" placeholder="Your answer"> | ||
<button class="btn btn-primary" onclick="submitAnswer()">Submit</button> | ||
</div> | ||
<div id="alert-container" class="mt-3"></div> | ||
<div class="mt-4"> | ||
<h5>Time Left: <span id="timer">60</span>s</h5> | ||
<h5>Score: <span id="score">0</span></h5> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<script> | ||
const questions = [ | ||
{ question: "What is 27 % 5?", answer: "2" }, | ||
{ question: "What is 34 % 7?", answer: "6" }, | ||
{ question: "What is 81 % 9?", answer: "0" }, | ||
{ question: "What is 123 % 10?", answer: "3" }, | ||
{ question: "What is 56 % 6?", answer: "2" }, | ||
{ question: "What is 97 % 8?", answer: "1" }, | ||
{ question: "What is 75 % 4?", answer: "3" }, | ||
{ question: "What is 44 % 3?", answer: "2" }, | ||
{ question: "What is 89 % 11?", answer: "1" }, | ||
{ question: "What is 91 % 13?", answer: "0" }, | ||
{ question: "What is 101 % 9?", answer: "2" }, | ||
{ question: "What is 66 % 8?", answer: "2" }, | ||
{ question: "What is 55 % 5?", answer: "0" }, | ||
{ question: "What is 37 % 4?", answer: "1" }, | ||
{ question: "What is 19 % 6?", answer: "1" }, | ||
{ question: "What is 99 % 10?", answer: "9" }, | ||
{ question: "What is 78 % 7?", answer: "1" }, | ||
{ question: "What is 63 % 5?", answer: "3" }, | ||
{ question: "What is 88 % 9?", answer: "7" }, | ||
{ question: "What is 111 % 12?", answer: "3" } | ||
]; | ||
let currentQuestionIndex = 0; | ||
let score = 0; | ||
let timer = 60; | ||
let interval; | ||
|
||
function startGame() { | ||
document.getElementById('question-container').style.display = 'block'; | ||
document.getElementById('answer').value = ''; | ||
score = 0; | ||
timer = 60; | ||
currentQuestionIndex = 0; | ||
document.getElementById('score').innerText = score; | ||
document.getElementById('timer').innerText = timer; | ||
interval = setInterval(updateTimer, 1000); | ||
displayQuestion(); | ||
} | ||
|
||
function updateTimer() { | ||
if (timer > 0) { | ||
timer--; | ||
document.getElementById('timer').innerText = timer; | ||
} else { | ||
clearInterval(interval); | ||
endGame(); | ||
} | ||
} | ||
|
||
function displayQuestion() { | ||
const questionElement = document.getElementById('question'); | ||
questionElement.innerText = questions[currentQuestionIndex].question; | ||
} | ||
|
||
function submitAnswer() { | ||
const answerElement = document.getElementById('answer'); | ||
const alertContainer = document.getElementById('alert-container'); | ||
if (answerElement.value === questions[currentQuestionIndex].answer) { | ||
score++; | ||
document.getElementById('score').innerText = score; | ||
alertContainer.innerHTML = `<div class="alert alert-success" role="alert">Correct!</div>`; | ||
} else { | ||
alertContainer.innerHTML = `<div class="alert alert-danger" role="alert">Wrong! Correct answer is ${questions[currentQuestionIndex].answer}</div>`; | ||
} | ||
answerElement.value = ''; | ||
currentQuestionIndex = (currentQuestionIndex + 1) % questions.length; | ||
displayQuestion(); | ||
} | ||
|
||
function endGame() { | ||
document.getElementById('question-container').style.display = 'none'; | ||
alert(`Game Over! Your score is ${score}`); | ||
} | ||
|
||
window.onload = startGame; | ||
</script> | ||
|
||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.