diff --git a/Rock_paper_scissor_game/index.css b/Rock_paper_scissor_game/index.css new file mode 100644 index 0000000..9eef8fa --- /dev/null +++ b/Rock_paper_scissor_game/index.css @@ -0,0 +1,53 @@ +*{ + font-family: 'Source Code Pro', monospace; + background-color: rgb(248, 244, 238); +} +.outer_container{ + margin: auto; + display: flex; + flex-direction: column; + height: 80%; + width: 60%; + border: 2px solid black; + /* background-color: rgb(236, 228, 228); */ + box-shadow: 0px 0px 10px inset ; + border-radius: 20px; +} +.score_container{ + border: 2px solid black; + border-radius: 15px; + box-shadow: 0px 0px 5px ; + margin: 3rem; + display: flex; + flex-wrap: wrap; + justify-content: space-around; +} +.status{ + border: 2px solid black; + margin: 3rem; + display: flex; + flex-wrap: wrap; + justify-content: space-around; + border-radius: 15px; + box-shadow: 0px 0px 5px ; +} +.buttons_container{ + border: 2px solid black; + border-radius: 15px; + box-shadow: 0px 0px 5px ; + margin: 3rem; + display: flex; + flex-wrap: wrap; + justify-content: space-around; + +} +#rock ,#paper, #scissor{ + padding: 20px; + border-radius: 25px; + background-color:#16437E; + color: white; + cursor: pointer; + margin: 1rem; + border: 2px solid white; + font-size: 1.3rem; +} diff --git a/Rock_paper_scissor_game/index.html b/Rock_paper_scissor_game/index.html new file mode 100644 index 0000000..702aa0b --- /dev/null +++ b/Rock_paper_scissor_game/index.html @@ -0,0 +1,42 @@ + + + + + + + Document + + + + + + + +
+ +
+

Your Score +
+

+

Bot score +
+

+ +
+ +
+

+

+

+
+ +
+ + + +
+
+ + + + \ No newline at end of file diff --git a/Rock_paper_scissor_game/index.js b/Rock_paper_scissor_game/index.js new file mode 100644 index 0000000..86245c7 --- /dev/null +++ b/Rock_paper_scissor_game/index.js @@ -0,0 +1,106 @@ +const rock = document.getElementById("rock") +const paper = document.getElementById("paper") +const scissor = document.getElementById("scissor") +const stat = document.getElementById("status") +stat.innerText = "Start" +const status_human = document.getElementById("status_human") +const status_bot = document.getElementById("status_bot") + + +let human_count = 0 +let bot_count = 0 +const human_score = document.getElementById('human') +human_score.innerText = human_count +const bot_score = document.getElementById('bot') +bot_score.innerText = bot_count + +const random_number_generator = ()=>(Math.ceil(Math.random()*3)) //random number generator +const evaluator = (id)=>{ + const computer_choice = random_number_generator() + console.log(computer_choice) + // For rock + if(id===1){ + if(computer_choice == 2){ + status_human.innerText ="Rock" + stat.innerText= "You lose" + status_bot.innerText= "Paper" + bot_count++ + bot_score.innerText = bot_count + } + else if(computer_choice == 3){ + status_human.innerText ="Rock" + stat.innerText = "You won" + status_bot.innerText= "Scissor" + human_count++ + human_score.innerText = human_count + } + else{ + status_human.innerText ="Rock" + stat.innerText = "Score are tied" + status_bot.innerText= "Rock" + } + + stat.remove + } +// For paper + else if(id===2){ + if(computer_choice == 1) { + status_human.innerText ="Paper" + stat.innerText= "You won" + status_bot.innerText= "Rock" + human_count++ + human_score.innerText = human_count + } + + else if(computer_choice == 3){ + status_human.innerText ="Paper" + stat.innerText = "You Lose" + status_bot.innerText= "Scissor" + bot_count++ + bot_score.innerText = bot_count + } + else{ + status_human.innerText ="Paper" + stat.innerText = "Score are tied" + status_bot.innerText= "paper" + } + + stat.remove + } +// For Scissors + else{ + if(computer_choice == 1) { + status_human.innerText ="Scissor" + stat.innerText= "You Lose" + status_bot.innerText= "Rock" + bot_count++ + bot_score.innerText = bot_count + } + + else if(computer_choice == 2){ + status_human.innerText ="Scissor" + stat.innerText = "You Won" + status_bot.innerText= "Paper" + human_count++ + human_score.innerText = human_count + } + else{ + status_human.innerText ="Scissor" + stat.innerText = "Score are tied" + status_bot.innerText= "Scissor" + } + + stat.remove + } +} +rock.addEventListener('click',()=>{ + evaluator(1) +}) +paper.addEventListener('click',()=>{ + evaluator(2) + +}) +scissor.addEventListener('click',()=>{ + evaluator(3) +}) +