Skip to content

Commit e1839f6

Browse files
committed
change directory name
1 parent 02646b1 commit e1839f6

File tree

5 files changed

+340
-0
lines changed

5 files changed

+340
-0
lines changed

Computer Bingo/manifest.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"manifest_version": 3,
3+
"name": "Computer Bingo",
4+
"description": "Game where 15 numbers from 1 to 100 are randomly distributed between 2 cards (player and PC), the numbers can be repeated between player and machine but not in oneself. ",
5+
"permissions": [
6+
"storage"
7+
],
8+
"optional-permissions" : ["tabs"],
9+
"action": {
10+
"default_popup": "index.html"
11+
},
12+
"web_accessible_resources": [
13+
{
14+
"resources": [
15+
"index.html",
16+
"style.css",
17+
"script.js"
18+
],
19+
"matches": [
20+
"<all_urls>"
21+
]
22+
}
23+
]
24+
}

Crack code/your files/index.html

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
8+
<!-- Logo of website -->
9+
<link rel="shortcut icon"
10+
href="https://static.vecteezy.com/system/resources/previews/004/753/002/original/custom-coding-icon-shadowed-detailed-custom-coding-logo-free-vector.jpg"
11+
type="image/x-icon">
12+
13+
<title>Code Cracker</title>
14+
15+
<!-- custom css -->
16+
<link rel="stylesheet" href="./style.css">
17+
</head>
18+
19+
<body>
20+
<!-- game container -->
21+
<div class="game">
22+
<h1>Code Cracker</h1>
23+
<p class="developer">
24+
Created By <a href="https://github.com/Avdhesh-Varshney">Avdhesh Varshney</a>
25+
</p>
26+
27+
<div class="input-section">
28+
<input type="text" name="user_input" id="i_p" placeholder="XXXX">
29+
<button id="submit">Submit</button><br>
30+
<button id="show" style="margin: 3px 0; display: none;">show answer</button>
31+
</div>
32+
33+
<div class="output-section">
34+
<p id="o_p"></p>
35+
<p id="code" style="display: none;"></p>
36+
<p id="check"></p>
37+
<p id="is_game">Keep guessing</p>
38+
</div>
39+
40+
<div class="result-section">
41+
<ul id="step">
42+
<li>
43+
<b>Guess &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Result</b>
44+
</li>
45+
</ul>
46+
</div>
47+
48+
<div id="rules">
49+
<b>Rules :</b>
50+
<ul>
51+
<li>
52+
Each guess must consist of 4 numberic characters.
53+
</li>
54+
<li>
55+
Numbers may be used more than once!
56+
</li>
57+
<li>
58+
You win only if your guess is an exact match.
59+
</li>
60+
<li>
61+
You lose if you fail to guess the code under 10 guesses.
62+
</li>
63+
<li>
64+
'Y' Indicates a number is in the correct position.
65+
</li>
66+
<li>
67+
'E' Indicates a number is part of the code, but not in the right position.
68+
</li>
69+
<li>
70+
'E' Doesn't consider how many times a number exists in the code.
71+
</li>
72+
<li>
73+
'X' Indicates a number is not part of the code.
74+
</li>
75+
</ul>
76+
</div>
77+
</div>
78+
79+
<!-- custom js -->
80+
<script src="./script.js"></script>
81+
</body>
82+
83+
</html>
File renamed without changes.

Crack code/your files/script.js

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
var secret_code = generateCode();
2+
var step_counter = 0;
3+
var show = document.getElementById('show');
4+
var ans = document.getElementById('code');
5+
6+
document.getElementById("submit").addEventListener("click", getInput);
7+
8+
document.addEventListener('keypress', (e) => {
9+
if (e.key === 'Enter') {
10+
getInput();
11+
}
12+
});
13+
14+
function getInput() {
15+
var x = document.getElementById('i_p').value;
16+
var o_p = document.getElementById("o_p");
17+
o_p.innerHTML = x;
18+
processInput(x);
19+
}
20+
21+
function processInput(input) {
22+
var n = input.length;
23+
if (document.getElementById("submit").innerHTML === "Reset") {
24+
cleanAll();
25+
}
26+
else if (n > 4) {
27+
o_p.innerHTML = "Input exceeds 4 character!";
28+
}
29+
else if (n < 4) {
30+
o_p.innerHTML = "Input is less than 4 character!";
31+
}
32+
else if (step_counter === 10) {
33+
document.getElementById("is_game").innerHTML = "Fool, You Loose! Eat some Horlics!";
34+
35+
show.style.display = '';
36+
show.addEventListener('click', () => {
37+
ans.style.display = '';
38+
show.style.display = 'none';
39+
});
40+
resetGame();
41+
}
42+
else {
43+
step_counter++;
44+
checkSubmission(input);
45+
}
46+
47+
return;
48+
}
49+
50+
function generateCode() {
51+
var code = "";
52+
for (var i = 0; i < 4; i++) {
53+
var n = getRandomIntInclusive(0, 9);
54+
code += n.toString();
55+
}
56+
document.getElementById("code").innerHTML = code;
57+
return code;
58+
}
59+
60+
function getRandomIntInclusive(min, max) {
61+
min = Math.ceil(min);
62+
max = Math.floor(max);
63+
return Math.floor(Math.random() * (max - min + 1)) + min;
64+
}
65+
66+
function checkSubmission(usr_input) {
67+
if (usr_input === secret_code) {
68+
document.getElementById("is_game").innerHTML = "Good guess! You win!!";
69+
resetGame();
70+
}
71+
var result = "";
72+
73+
for (var i = 0; i < 4; i++) {
74+
var found = false;
75+
if (usr_input[i] === secret_code[i]) {
76+
result += "Y ";
77+
found = true;
78+
continue;
79+
}
80+
for (var j = 0; j < 4; j++) {
81+
if (usr_input[i] === secret_code[j]) {
82+
result += "E ";
83+
found = true;
84+
break;
85+
}
86+
}
87+
if (!found) {
88+
result += "X ";
89+
}
90+
}
91+
document.getElementById("check").innerHTML = result;
92+
showSubmission(result, usr_input);
93+
return;
94+
}
95+
function showSubmission(result, usr_input) {
96+
var ul = document.getElementById("step");
97+
var li = document.createElement("li");
98+
li.appendChild(document.createTextNode(usr_input + " >>> " + result));
99+
ul.appendChild(li);
100+
}
101+
102+
function resetGame() {
103+
document.getElementById("submit").innerHTML = "Reset";
104+
}
105+
106+
function cleanAll() {
107+
secret_code = generateCode();
108+
step_counter = 0;
109+
document.getElementById("step").innerHTML = "<li><b>Guess &nbsp; Result</b></li>"
110+
document.getElementById("submit").innerHTML = "Submit";
111+
show.style.display = 'none';
112+
ans.style.display = 'none';
113+
document.getElementById('is_game').innerHTML = '';
114+
return;
115+
}

Crack code/your files/style.css

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
* {
2+
margin: 0;
3+
padding: 0;
4+
box-sizing: border-box;
5+
text-decoration: none;
6+
user-select: none;
7+
}
8+
9+
body {
10+
background-color: aquamarine;
11+
}
12+
13+
#step {
14+
list-style: none;
15+
}
16+
17+
.game {
18+
position: absolute;
19+
top: 50%;
20+
left: 50%;
21+
transform: translate(-50%, -50%);
22+
background-color: rgba(red, green, blue, 0.3);
23+
box-shadow: 0 0 100px 0 black;
24+
border-radius: 1rem;
25+
width: 90vh;
26+
height: 90vh;
27+
padding: 1rem;
28+
text-align: center;
29+
display: flex;
30+
flex-direction: column;
31+
justify-content: center;
32+
align-items: center;
33+
transition: all 0.4s;
34+
}
35+
36+
h1 {
37+
font-size: 2.5rem;
38+
margin-bottom: 5px;
39+
font-weight: 500;
40+
font-family: cursive;
41+
color: chocolate;
42+
}
43+
44+
.input-section,
45+
.output-section,
46+
.result-section,
47+
#rules {
48+
margin: 5px 0;
49+
}
50+
51+
.input-section input {
52+
padding: 5px;
53+
outline: none;
54+
border: none;
55+
text-align: center;
56+
border-radius: 10px;
57+
font-size: 1.2rem;
58+
}
59+
60+
.input-section input:hover {
61+
box-shadow: 0 2px 50px 0 lightseagreen;
62+
}
63+
64+
.input-section button {
65+
padding: 10px;
66+
font-size: 1rem;
67+
border-radius: 10px;
68+
outline: none;
69+
border: none;
70+
text-transform: uppercase;
71+
background-color: aqua;
72+
box-shadow: 0 2px 10px black;
73+
transition: all 0.2s;
74+
}
75+
76+
.input-section button:hover {
77+
box-shadow: 0 0 25px 0 black;
78+
background-color: black;
79+
color: white;
80+
}
81+
82+
.output-section p {
83+
font-size: 1.2rem;
84+
margin: 2px 0;
85+
font-weight: 700;
86+
text-transform: uppercase;
87+
letter-spacing: 2px;
88+
}
89+
90+
.output-section #code {
91+
color: lightcoral;
92+
}
93+
94+
.result-section {
95+
margin: 5px 0;
96+
letter-spacing: 2px;
97+
list-style: none;
98+
}
99+
100+
#rules ul {
101+
list-style: none;
102+
letter-spacing: 1px;
103+
}
104+
105+
.developer {
106+
font-size: 1.2rem;
107+
color: #313136;
108+
margin-bottom: 10px;
109+
}
110+
111+
.developer a {
112+
text-decoration: none;
113+
color: #313136;
114+
}
115+
116+
.developer a:hover {
117+
text-decoration: underline;
118+
}

0 commit comments

Comments
 (0)