├── Clock ├── index.html ├── index.js └── style.css ├── Number Guessing Game.js ├── Random PASSWORD generation.js ├── Stop Watch ├── index.html ├── index.js └── style.css ├── game points increse,decrese using closure.js ├── index.html └── style.css /Clock/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | CLOCK 7 | 8 | 9 | 10 |

11 |

00:00.00 12 |

13 |

14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /Clock/index.js: -------------------------------------------------------------------------------- 1 | function updateClock(){ 2 | const now = new Date(); 3 | let hour = now.getHours().toString().padStart(2,0); 4 | const hours = hour>=12 ? "PM" : "AM"; 5 | hour = hour%12 || 12; 6 | hour = hour.toString().padStart(2,0) 7 | const minintue = now.getMinutes().toString().padStart(2,0); 8 | const sec = now.getSeconds().toString().padStart(2,0); 9 | const time = `${hour}:${minintue}:${sec} ${hours}`; 10 | document.getElementById("clock").textContent = time; 11 | } 12 | updateClock(); 13 | setInterval(updateClock,1000); 14 | -------------------------------------------------------------------------------- /Clock/style.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-image: url(https://images3.alphacoders.com/690/69009.jpg); 3 | background-position: center; 4 | background-repeat: no-repeat; 5 | background-size: cover; 6 | background-attachment: fixed; 7 | margin: 0; 8 | } 9 | #clock-container{ 10 | display: flex; 11 | justify-content: center; 12 | align-items: center; 13 | height: 100vh; 14 | } 15 | #clock{ 16 | font-family: monospace; 17 | font-size: 6.5rem; 18 | font-weight: bold; 19 | text-align: center; 20 | color: white; 21 | backdrop-filter: blur(5px); 22 | width: 100%; 23 | background-color: hsla(0, 0%, 100%,0.1); 24 | } -------------------------------------------------------------------------------- /Number Guessing Game.js: -------------------------------------------------------------------------------- 1 | const minimum = 1; 2 | const maximum = 10; 3 | const ran = Math.floor(Math.random()*(maximum-minimum+1)) + minimum; 4 | let guess; 5 | let guessed = false; 6 | let atempts = 0; 7 | while(!guessed) 8 | { 9 | guess = window.prompt(`Guess the number between ${minimum} & ${maximum}`); 10 | guess = Number(guess); 11 | if(isNaN(guess)) 12 | { 13 | window.alert(`Please enter a number!!!!`); 14 | } 15 | else if(guessmaximum) 16 | { 17 | window.alert(`Please enter a Number within the Given range!!!`); 18 | } 19 | else 20 | { 21 | if(guess===ran) 22 | { 23 | window.alert(`You guessed the Number ${guess} after ${atempts} attempts`); 24 | guessed = true; 25 | } 26 | else if(guess > ran) 27 | { 28 | window.alert(`The guess is too High!!!`); 29 | } 30 | else if(guess < ran) 31 | { 32 | window.alert(`The guess is too Low!!!`); 33 | } 34 | atempts++; 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /Random PASSWORD generation.js: -------------------------------------------------------------------------------- 1 | function generatePassword(length,Lcase,Ucase,num,symb){ 2 | 3 | const Lletters = "abcdefghijklmnopqrstuvwxyz"; 4 | const Uletters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 5 | const numbers = "0123456789"; 6 | const symbol = "!@#$%^&*()_+-="; 7 | let temp = ""; 8 | let final = ""; 9 | 10 | temp += Lcase ? Lletters:""; 11 | temp += Ucase ? Uletters:""; 12 | temp += num ? numbers:""; 13 | temp += symb ? symbol:""; 14 | 15 | if(length<=0) 16 | { 17 | return "Legth sholud be atleast 1"; 18 | } 19 | if(temp.length === 0) 20 | { 21 | return "Any one set of charecters shold be selected"; 22 | } 23 | for(let i=0;i 2 | 3 | 4 | 5 | 6 | STOP WATCH 7 | 8 | 9 | 10 |

STOP WATCH

11 |

12 |

13 | 00:00:00:00 14 |

15 |

16 | 17 | 18 | 19 |

20 |

21 | 22 | 23 | -------------------------------------------------------------------------------- /Stop Watch/index.js: -------------------------------------------------------------------------------- 1 | const display = document.getElementById("display"); 2 | let timer = null; 3 | let startTime = 0; 4 | let elapsedTime =0; 5 | let isRunning = false; 6 | 7 | function start(){ 8 | if(!isRunning) 9 | { 10 | startTime = Date.now() - elapsedTime; 11 | console.log(startTime); 12 | timer = setInterval(update,10); 13 | isRunning = true; 14 | } 15 | } 16 | function stop(){ 17 | if(isRunning) 18 | { 19 | clearInterval(timer); 20 | elapsedTime = Date.now() - startTime; 21 | isRunning = false; 22 | } 23 | } 24 | function reset(){ 25 | clearInterval(timer); 26 | startTime = 0; 27 | elapsedTime =0; 28 | isRunning = false; 29 | display.textContent = "00:00:00:00"; 30 | } 31 | function update(){ 32 | const currentTime = Date.now(); 33 | elapsedTime = currentTime - startTime; 34 | console.log(elapsedTime); 35 | let hour = Math.floor(elapsedTime/(1000 * 60 * 60)).toString().padStart(2,0); 36 | let mini = Math.floor(elapsedTime/(1000 * 60)%60).toString().padStart(2,0); 37 | let sec = Math.floor(elapsedTime/(1000)%60).toString().padStart(2,0); 38 | let mili = Math.floor((elapsedTime%1000)/10).toString().padStart(2,0); 39 | display.textContent = `${hour}:${mini}:${sec}:${mili}`; 40 | } -------------------------------------------------------------------------------- /Stop Watch/style.css: -------------------------------------------------------------------------------- 1 | body{ 2 | display: flex; 3 | flex-direction: column; 4 | align-items: center; 5 | background-color: hsl(0, 0%, 90%); 6 | } 7 | #myH1{ 8 | font-size: 4rem; 9 | font-family: Arial,sans-serif; 10 | color: hsl(0, 0%, 25%); 11 | } 12 | #container{ 13 | display: flex; 14 | flex-direction: column; 15 | align-items: center; 16 | padding: 30px; 17 | border: 5px solid; 18 | border-radius: 50px; 19 | background-color: white; 20 | } 21 | #display{ 22 | font-size: 5rem; 23 | font-family: monospace; 24 | font-weight: bold; 25 | color: hsl(0, 0%, 30%); 26 | text-shadow: 2px 2px 2px hsla(0, 0%,0%, 0.75); 27 | } 28 | #control button{ 29 | font-size: 1.5rem; 30 | font-weight: bold; 31 | padding: 10px 20px; 32 | margin: 5px; 33 | min-width: 120px; 34 | border: none; 35 | cursor: pointer; 36 | color: white; 37 | border-radius: 10px; 38 | transition: background-color 0.5s ease; 39 | } 40 | #startbtn{ 41 | background-color: hsl(115, 100%, 40%); 42 | } 43 | #startbtn:hover{ 44 | background-color: hsl(115, 100%, 30%); 45 | } 46 | #stopbtn{ 47 | background-color: hsl(11, 100%, 50%); 48 | } 49 | #stopbtn:hover{ 50 | background-color: hsl(11, 100%, 30%); 51 | } 52 | #resetbtn{ 53 | background-color: hsl(212, 100%, 50%); 54 | } 55 | #resetbtn:hover{ 56 | background-color: hsl(212, 100%, 30%); 57 | } -------------------------------------------------------------------------------- /game points increse,decrese using closure.js: -------------------------------------------------------------------------------- 1 | let score = 0; 2 | 3 | function game(){ 4 | function increaseScore(points){ 5 | score+=points; 6 | console.log(`+${points} pts`); 7 | } 8 | function decreseScore(points){ 9 | score-=points; 10 | console.log(`-${points} pts`); 11 | } 12 | function getScore(){ 13 | return score; 14 | } 15 | return{increaseScore,decreseScore,getScore}; 16 | } 17 | 18 | const object = game(); 19 | object.increaseScore(4); 20 | object.increaseScore(5); 21 | console.log(`The Current Score is : ${object.getScore()}`); 22 | object.decreseScore(5); 23 | console.log(`The Current Score is : ${object.getScore()}`); 24 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Git and GitHub 7 | 8 | 9 |

Learning Git and GitHub

10 |

Repositories are used to mainly store code files.

11 | 12 | 13 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Akash242005/Learning-Projects/6ad74cc40dc5f2e3e36b2b3c5059365bf034bdfa/style.css --------------------------------------------------------------------------------