From bc6e3da691792e10f626d0c08ff4d135ead2bea2 Mon Sep 17 00:00:00 2001 From: Sayantan Date: Tue, 3 Oct 2023 22:56:44 +0530 Subject: [PATCH 1/2] new game added of bubble game --- .vscode/settings.json | 2 +- Bubble Game | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) create mode 160000 Bubble Game diff --git a/.vscode/settings.json b/.vscode/settings.json index 6f3a291..f673a71 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,3 @@ { - "liveServer.settings.port": 5501 + "liveServer.settings.port": 5502 } \ No newline at end of file diff --git a/Bubble Game b/Bubble Game new file mode 160000 index 0000000..80ddd9c --- /dev/null +++ b/Bubble Game @@ -0,0 +1 @@ +Subproject commit 80ddd9c0b0b56b47cd9c325f51f425866c42955a From 58723811e802ba7b293de1efc255c566f738be51 Mon Sep 17 00:00:00 2001 From: Sayantan Date: Tue, 3 Oct 2023 23:20:44 +0530 Subject: [PATCH 2/2] new game added of a bubble game --- Bubble Game | 1 - Bubble_game/.vscode/settings.json | 3 ++ Bubble_game/index.html | 36 +++++++++++++ Bubble_game/script.js | 51 ++++++++++++++++++ Bubble_game/style.css | 88 +++++++++++++++++++++++++++++++ 5 files changed, 178 insertions(+), 1 deletion(-) delete mode 160000 Bubble Game create mode 100644 Bubble_game/.vscode/settings.json create mode 100644 Bubble_game/index.html create mode 100644 Bubble_game/script.js create mode 100644 Bubble_game/style.css diff --git a/Bubble Game b/Bubble Game deleted file mode 160000 index 80ddd9c..0000000 --- a/Bubble Game +++ /dev/null @@ -1 +0,0 @@ -Subproject commit 80ddd9c0b0b56b47cd9c325f51f425866c42955a diff --git a/Bubble_game/.vscode/settings.json b/Bubble_game/.vscode/settings.json new file mode 100644 index 0000000..6f3a291 --- /dev/null +++ b/Bubble_game/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/Bubble_game/index.html b/Bubble_game/index.html new file mode 100644 index 0000000..1d8c6c1 --- /dev/null +++ b/Bubble_game/index.html @@ -0,0 +1,36 @@ + + + + + + + + Bubble Game + + + +
+
+
+
+

Hit

+
5
+
+
+

Timer

+
60
+
+
+

Score

+
7
+
+
+
+ + +
+
+
+ + + \ No newline at end of file diff --git a/Bubble_game/script.js b/Bubble_game/script.js new file mode 100644 index 0000000..3fa4f4c --- /dev/null +++ b/Bubble_game/script.js @@ -0,0 +1,51 @@ + +var timer = 60; +var score = 0; +var hitrn = 0; +function increaseScore(){ + score += 10; + document.querySelector('#scoreval').textContent = score; +} + +function getNewHit(){ + hitrn = Math.floor(Math.random()*10); + document.querySelector('#hitval').textContent = hitrn; +} + +function makeBubble(){ +clutter= ""; +for(i=1;i<=185;i++){ + var rn = Math.floor(Math.random()*10); + clutter += `
${rn}
`; +} +document.querySelector('#pbtm').innerHTML=clutter; + +}; + +function runTimer(){ + var timerint = setInterval(function(){ + if(timer>0){ + timer--; + document.querySelector('#timerval').textContent = timer; + } + else{ + clearInterval(timerint); + document.querySelector('#pbtm').innerHTML = `

Game Over

` + } + + },1000); +} + +document.querySelector("#pbtm").addEventListener("click",function(dets){ + var clickedNumber = Number(dets.target.textContent); + if(clickedNumber === hitrn){ + increaseScore(); + getNewHit(); + makeBubble(); + } +}); + +runTimer(); +makeBubble(); +getNewHit(); +increaseScore(); \ No newline at end of file diff --git a/Bubble_game/style.css b/Bubble_game/style.css new file mode 100644 index 0000000..38cb250 --- /dev/null +++ b/Bubble_game/style.css @@ -0,0 +1,88 @@ +*{ + margin: 0; + padding: 0; + font-family: "Gilroy"; + box-sizing: border-box; +} + +html,body{ + height: 100%; + width: 100%; +} + +#main{ + display: flex; + justify-content: center; + align-items: center; + height: 100%; + width: 100%; + background-color: rgb(195, 249, 195); +} + +#panel +{ + height: 80%; + width: 90%; + background-color: #fff; + border-radius: 10px; + overflow: hidden; +} + +#ptop{ + padding: 0px 30%; + display: flex; + align-items: center; + color: #fff; + justify-content: space-between; + width: 100%; + height: 100px; + background-color: rgb(56, 245, 56); +} +.elem{ + + display: flex; + align-items: center; + gap: 20px; +} +.elem h2{ + font-weight: 600; + font-size: 22px; +} + +.box{ + color: rgb(10, 178, 38); + font-weight: 600; + font-size: 25px; + padding: 10px 20px; + background-color: #fff; + border-radius: 5px; + +} + +#pbtm{ + flex-wrap: wrap; + display: flex; + justify-content: center; + align-items: center; + gap: 10px; + padding: 20px; + width: 100%; + height:calc(100% - 100px); + +} + +.bubble{ + display: flex; + justify-content: center; + align-items: center; + width: 40px; + height: 40px; + background-color: rgb(10, 178, 38); + border-radius: 50%; + font-weight: 500; +} + +.bubble:hover{ + cursor: pointer; + background-color:chocolate; +} \ No newline at end of file