Skip to content

Commit

Permalink
Merge branch 'main' into Anurag-Branch
Browse files Browse the repository at this point in the history
  • Loading branch information
vishanurag authored Jul 18, 2024
2 parents e6757f8 + 236f53a commit def8220
Show file tree
Hide file tree
Showing 83 changed files with 2,193 additions and 12 deletions.
5 changes: 3 additions & 2 deletions Games/Avoider_Game/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -69,11 +69,12 @@ function startGame() {

function loop() {
let stopGame = false;

// adjust the screen size Logic
let cellsCalculate=window.innerWidth<600?6:8
for (let i = enemyCells.length - 1; i >= 0; i--) {
// From 29 till it reaches 0
const cell = enemyCells[i];
const nextCell = cells[i + 8];
const nextCell = cells[i + cellsCalculate];
const enemy = cell.children[0];

// Continue and move on
Expand Down
Binary file added Games/Avoider_Game/assets/Desktop.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Games/Avoider_Game/assets/iPad.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Games/Avoider_Game/assets/mobile.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions Games/Avoider_Game/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ body {
width: 90vh;
background-color: rgba(20, 198, 243, 0.25);
padding: 2%;
max-width: 700px;
border-radius: 10%;
box-shadow: 0 0 50px 0 rgba(20, 198, 243, 0.3);
}
Expand Down Expand Up @@ -116,4 +117,9 @@ hr {

.author a:hover {
text-decoration: underline;
}
@media (max-width:600px) {
.container{width:95% !important;}
.grid{grid-template-columns: repeat(6, 40px) !important;}
.cell{height:40px !important;}
}
8 changes: 8 additions & 0 deletions Games/Blink_Beat/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@

# Blink Beat
A web-based game inspired by the classic Simon game, built using HTML, CSS, and JavaScript.


## Live Website

https://github.com/Shantnu-singh/Blink-Beat
121 changes: 121 additions & 0 deletions Games/Blink_Beat/Script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
var colorOptions = ["red", "blue", "yellow", "green"];
var gamePattern = [];
var userChosenColor = [];
var levelCount = 0;
var started = false;

// Generate the game sequence
function gameSequence() {
userChosenColor = [];
levelCount++;
document.querySelector("#level-title").innerHTML = "Level " + levelCount;

var randomDigit = Math.floor(Math.random() * 4);
var newColor = colorOptions[randomDigit];
gamePattern.push(newColor);

$("." + newColor).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100);
playSound(newColor);
}

// Handle user click/touch events
function handleUserClick(event) {
if (event.type === "touchstart") {
event.preventDefault();
}

var colorName = event.target.id;
userChosenColor.push(colorName);

playSound(colorName);
animatePress(colorName);

checkAnswer(userChosenColor.length - 1);
}

// Play sound for a given color
function playSound(name) {
var audio = new Audio("sounds/" + name + ".mp3");
audio.play();
}

// Animate the button press
function animatePress(name) {
$("#" + name).addClass("pressed");
setTimeout(function() {
$("#" + name).removeClass("pressed");
}, 100);
}

// Start the game
function startGame(event) {
if (event.type === "touchstart") {
event.preventDefault();
}

if (!started) {
document.querySelector("#level-title").innerHTML = "Level " + (levelCount + 1);
gameSequence();
started = true;
}
}

// Check the user's answer
function checkAnswer(currentLevel) {
if (gamePattern[currentLevel] === userChosenColor[currentLevel]) {
if (userChosenColor.length === gamePattern.length) {
setTimeout(function() {
gameSequence();
}, 1000);
}
} else {
document.querySelector("#level-title").innerHTML = "Game Over, Press Any Key or Touch the Screen to Restart";
document.querySelector("body").classList.add("game-over");
setTimeout(function() {
document.querySelector("body").classList.remove("game-over");
}, 200);
playSound("wrong");

// Set up the event listeners to restart the game
document.addEventListener("keydown", restartGameOnEvent, { once: true });
document.addEventListener("touchstart", restartGameOnEvent, { once: true });
}
}

// Restart the game
function restartGameOnEvent(event) {
if (event.type === "touchstart") {
event.preventDefault();
}
restartTheGame();
}

function restartTheGame() {
levelCount = 0;
gamePattern = [];
started = false;

// Remove existing event listeners to avoid multiple bindings
document.removeEventListener("keydown", restartGameOnEvent);
document.removeEventListener("touchstart", restartGameOnEvent);

// Add event listeners to restart the game on key press or touch
document.addEventListener("keydown", startGame, { once: true });
document.addEventListener("touchstart", startGame, { once: true });
}

// Initial event listeners to start the game
document.addEventListener("keydown", startGame, { once: true });
document.addEventListener("touchstart", handleTouchStart, { once: true });

// Handle touch start event to start the game
function handleTouchStart(event) {
event.preventDefault();
startGame(event);
}

// Add event listeners to buttons
document.querySelectorAll(".btn").forEach(button => {
button.addEventListener("click", handleUserClick);
button.addEventListener("touchstart", handleUserClick);
});
Binary file added Games/Blink_Beat/assets/images/Blibk_Beat_1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Games/Blink_Beat/assets/images/Blink_Beat.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Games/Blink_Beat/assets/images/Blink_Beat_2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Games/Blink_Beat/assets/sounds/blue.mp3
Binary file not shown.
Binary file added Games/Blink_Beat/assets/sounds/green.mp3
Binary file not shown.
Binary file added Games/Blink_Beat/assets/sounds/red.mp3
Binary file not shown.
Binary file added Games/Blink_Beat/assets/sounds/wrong.mp3
Binary file not shown.
Binary file added Games/Blink_Beat/assets/sounds/yellow.mp3
Binary file not shown.
29 changes: 29 additions & 0 deletions Games/Blink_Beat/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
<meta charset="utf-8">
<title>Blink Beat</title>
<link rel="stylesheet" href="landing_style.css">
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.8.1/font/bootstrap-icons.min.css" rel="stylesheet">
</head>

<body>
<div class="image-background">
<div class="overlay"></div>
</div>
<div class="container">
<h1 id="level-title">Blink Beat</h1>
<p class="description">Test your memory and reflexes with Blink Beat! Follow the pattern of lights and sounds, and repeat the sequence. See how long you can go without making a mistake!</p>
<a href="page.html" class="play-button">Play <i class="bi bi-play-fill"></i></a>
</div>
</body>

<script>
if (window.location.pathname !== '/index.html') {
window.location.href = '/index.html';
}
</script>

</html>
73 changes: 73 additions & 0 deletions Games/Blink_Beat/landing_style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
body {
margin: 0;
padding: 0;
font-family: 'Press Start 2P', cursive;
background-color: #011F3F;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}

.image-background {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('sounds/bg.png');
background-size: cover;
background-position: center;
filter: brightness(50%); /* Adjust the opacity of the background image */
z-index: -1;
}

.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(1, 31, 63, 0.7); /* Overlay color with opacity */
}

.container {
text-align: center;
color: #FEF2BF;
max-width: 600px; /* Constrain the width of the container */
padding: 20px; /* Add some padding for better spacing */
}

#level-title {
font-size: 3rem;
margin: 20px 0;
}

.description {
font-size: 1.5rem;
margin: 20px 0;
line-height: 1.5;
}

.play-button {
display: inline-block;
padding: 15px 30px;
font-size: 2rem;
color: #FEF2BF;
background-color: #FF5733; /* Red background color */
border: none;
border-radius: 10px;
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
margin-top: 30px;
}

.play-button i {
margin-left: 10px; /* Adjust icon position */
}

.play-button:hover {
background-color: #FF6347; /* Darker red on hover */
}
41 changes: 41 additions & 0 deletions Games/Blink_Beat/page.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
<meta charset="utf-8">
<title>Simon</title>
<link rel="stylesheet" href="styles.css">
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
</head>

<body>
<h1 id="level-title">Press A Key to Start</h1>
<div class="container">
<div lass="row">

<div type="button" id="green" class="btn green">

</div>

<div type="button" id="red" class="btn red">

</div>
</div>

<div class="row">

<div type="button" id="yellow" class="btn yellow">

</div>
<div type="button" id="blue" class="btn blue">

</div>

</div>

</div>
<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
<script src="Script.js"></script>
</body>

</html>
87 changes: 87 additions & 0 deletions Games/Blink_Beat/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
body {
text-align: center;
background-color: #011F3F;
}

#level-title {
font-family: 'Press Start 2P', cursive;
font-size: 3rem;
margin: 5%;
color: #FEF2BF;
}

.container {
display: block;
width: 50%;
margin: auto;
}

.btn {
margin: 25px;
display: inline-block;
height: 200px;
width: 200px;
border: 10px solid black;
border-radius: 20%;
}

.game-over {
background-color: red;
opacity: 0.8;
}

.red {
background-color: red;
}

.green {
background-color: green;
}

.blue {
background-color: blue;
}

.yellow {
background-color: yellow;
}

.pressed {
box-shadow: 0 0 20px white;
background-color: grey;
}

/* Media Queries for responsiveness */
@media (max-width: 768px) {
#level-title {
font-size: 2rem;
margin: 5%;
}

.container {
width: 80%;
}

.btn {
height: 150px;
width: 150px;
margin: 15px;
}
}

@media (max-width: 480px) {
#level-title {
font-size: 1.5rem;
margin: 5%;
}

.container {
width: 100%;
}

.btn {
height: 100px;
width: 100px;
margin: 10px;
}
}
Loading

0 comments on commit def8220

Please sign in to comment.