updated js file of the website

Signed-off-by: Chirag <[email protected]>
shrey141102 · Dec 13, 2023 · 72c564c · 72c564c
2 parents 1b60e3e + 273964b
commit 72c564c
Show file tree

Hide file tree

Showing 27 changed files with 1,521 additions and 6 deletions.
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -1,10 +1,13 @@
-## Describe your changes
+## Describe your changes (Mandatory) 
 
-## Issue ticket number and link
+## Issue ticket number and link (Mandatory)
+
+## Screenshots of your project, whatever you have added. (Mandatory)
 
 ## Checklist before requesting a review
 - [ ] I have performed a self-review of my code
-- [ ] If it is a new project, I have added thorough tests.
+- [ ] If it is a new project, I have done thorough tests.
 - [ ] Have you updated the README file of the repository and added the name of the project in it?
-- [ ] Have you added a `README.md` file inside the directory of your project and explained it there properly?
+- [ ] Have you added a `README.md` file inside the directory of your project and explained it there properly (with images)?
+- [ ] Have you updated the `script.js` file so that the project is visible in the website?
 
diff --git a/Hide-show-pass/.DS_Store b/Hide-show-pass/.DS_Store
diff --git a/Hide-show-pass/.vscode/settings.json b/Hide-show-pass/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "git.ignoreLimitWarning": true
+}
diff --git a/Hide-show-pass/Images/.DS_Store b/Hide-show-pass/Images/.DS_Store
diff --git a/Hide-show-pass/Images/open.png b/Hide-show-pass/Images/open.png
diff --git a/Hide-show-pass/Images/shut.png b/Hide-show-pass/Images/shut.png
diff --git a/Hide-show-pass/README.md b/Hide-show-pass/README.md
@@ -0,0 +1,2 @@
+Hide/Show password
+A project made using HTML, CSS and JS which can be integrated easily to your website for better security when entering password in public spaces.}
diff --git a/Hide-show-pass/index.html b/Hide-show-pass/index.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hide/Show pass</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="input-box">
+        <input type="password" placeholder="Enter password" id="password">
+        <img src="./Images/shut.png" alt="error" id="eyeicon">
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Hide-show-pass/script.js b/Hide-show-pass/script.js
@@ -0,0 +1,13 @@
+let eyeicon = document.getElementById("eyeicon");
+let password = document.getElementById("password");
+
+eyeicon.onclick = function(){
+    if(password.type == "password"){
+        password.type = "text";
+        eyeicon.src = "./Images/open.png";
+    }
+    else{
+        password.type = "password";
+        eyeicon.src = "./Images/shut.png";
+    }
+}
diff --git a/Hide-show-pass/style.css b/Hide-show-pass/style.css
@@ -0,0 +1,40 @@
+*{
+    margin: 0;
+    padding: 0;
+    font-family: 'Poppins', sans-serif;
+    box-sizing: border-box;
+}
+
+body{
+    background:  #00008B;
+}
+
+.input-box{
+    background: #fff;
+    width: 90%;
+    max-width: 500px;
+    border-radius: 5px;
+    padding: 10px 20px;
+    margin: 300px auto;
+    display: flex;
+    align-items: center;
+}
+
+.input-box input{
+    width: 100%;
+    padding: 10px 0;
+    border: 0;
+    outline: 0;
+    font-size: 24px;
+    color: #555;
+}
+
+.input-box img{
+    width: 35px;
+    cursor: pointer;
+}
+
+img{
+    width: 35px;
+    cursor: pointer;
+}
diff --git a/README.md b/README.md
@@ -39,6 +39,7 @@
 - URL Shortener
 - Weather Appliation
 - Word Scramble
+- Snake Game
 
 
 <h2>🍰 Contribution Guidelines:</h2>
@@ -47,10 +48,15 @@ Open for contributions.
 
 Check this [file](https://github.com/shrey141102/Javascript-projects/blob/main/CONTRIBUTING.md) for steps to contribute.
 
+Please read the `CONTRIBUTING.md` file carefully before submitting a PR.
+Also, make sure your PR fulfills the required conditions present in the PR template.
+
 Please update this README file by adding your project name.
 
 Also remember to add a README inside your project directory explaining what your project is.
 
+Please avoid adding same projects again and again. (unless it has a very different approach/ui)
+
 <h2>💻 Built with</h2>
 
 <h4>Built by people around the globe. 🌐🧑‍🤝‍🧑</h4>
@@ -60,5 +66,3 @@ Technologies used in the project:
 - Javascript
 - HTML
 - CSS
-
-please feel free to use any technology while building the project. It can be AI or Blockchain or anything. Just remeber that it should be able to work with and intergrate with the website.
diff --git a/Snake_Game/Assets/food.png b/Snake_Game/Assets/food.png
diff --git a/Snake_Game/Assets/grass.jpg b/Snake_Game/Assets/grass.jpg
diff --git a/Snake_Game/Assets/preview.jpg b/Snake_Game/Assets/preview.jpg
diff --git a/Snake_Game/Assets/snake.png b/Snake_Game/Assets/snake.png
diff --git a/Snake_Game/README.md b/Snake_Game/README.md
@@ -0,0 +1,2 @@
+# Snake-Game
+Its a basics Javascript snake game using DOM Event
diff --git a/Snake_Game/app.js b/Snake_Game/app.js
@@ -0,0 +1,33 @@
+let food =document.querySelector(".food");
+let snake=document.querySelector(".snake");
+let move=document.querySelector("input");
+let h1=document.querySelector("h1");
+let mh=0;
+let mv=0;
+let fh=0;
+let fv=0;
+let count =-1;
+move.addEventListener("keydown",function(event){
+    if(mv==fv&&mh==fh){
+        fv=Math.floor(Math.random()*19)*30;
+        fh=Math.floor(Math.random()*29)*30;
+        food.style.marginTop=`${fv}px`;
+        food.style.marginLeft=`${fh}px`;
+        count++;
+        h1.innerText=`SCORE : ${count}`;
+    }
+    if(event.code=="ArrowUp"&&mv>0){
+        mv-=30;
+    }
+    if(event.code=="ArrowDown"&&mv<560){
+        mv+=30;
+    }
+    if(event.code=="ArrowLeft"&&mh>0){
+        mh-=30;
+    }
+    if(event.code=="ArrowRight"&&mh<860){
+        mh+=30;
+    }
+    snake.style.marginTop=`${mv}px`;
+    snake.style.marginLeft=`${mh}px`;
+});
diff --git a/Snake_Game/index.html b/Snake_Game/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Snake Game</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="playground">
+
+    </div>
+    <div class="snake"></div>
+    <div class="food"></div>
+   <div class="score">
+    <div class="input">MOVE<input type="text"></div>
+    <br><br>
+    <h1>SCORE : 0 </h1>
+   </div>
+
+    <Script src="app.js"></Script>
+</body>
+</html>
diff --git a/Snake_Game/style.css b/Snake_Game/style.css
@@ -0,0 +1,62 @@
+*{
+    margin: 0px;
+    padding: 0px;
+}
+.playground{
+    height:600px;
+    width: 900px;
+    background-image: url(Assets/grass.jpg);
+    background-size: cover;
+    position: absolute;
+    opacity: 0.8;
+}
+
+.food{
+    height: 50px;
+    width:70px;
+    background-image: url(Assets/food.png);
+    background-size: cover;
+    position: absolute;
+}
+
+.snake{
+    height: 60px;
+    width: 60px;
+    position: absolute;
+    background-image: url(Assets/snake.png);
+    background-size: cover;
+    position: absolute;
+}
+.score{
+
+    height: 300px;
+    width: 300px;
+    position: absolute; 
+    margin-left: 903px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Sudoku Game/.vscode/settings.json b/Sudoku Game/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "liveServer.settings.port": 5501
+}
diff --git a/Sudoku Game/bozhin-karaivanov-yqcWOAHH1Rs-unsplash.jpg b/Sudoku Game/bozhin-karaivanov-yqcWOAHH1Rs-unsplash.jpg
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		Hide/Show password
		A project made using HTML, CSS and JS which can be integrated easily to your website for better security when entering password in public spaces.}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		# Snake-Game
		Its a basics Javascript snake game using DOM Event