version 3, img-buttons added
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 5.7 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 9.4 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 132 KiB |
@@ -1,9 +1,27 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
|
|
||||||
<head> <title>Игрульки</title></head>
|
<head>
|
||||||
|
<title>Игрульки</title> </head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
<body>
|
<body>
|
||||||
<script type="text/javascript" src="main.js"></script>
|
<script type="text/javascript" src="main.js"></script>
|
||||||
<h1>Вас приветствует игра "Камень, Ножницы, Бумага"</h1>
|
<h1>Вас приветствует игра "Камень, Ножницы, Бумага"</h1>
|
||||||
|
|
||||||
|
<div class="card-imgs">
|
||||||
|
<div class="card-img", id="sci">
|
||||||
|
<img src="img/ножницы.png", onclick="game(2)">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card-img", id="pap", onclick="game(1)">
|
||||||
|
<img src="img/бумага.png">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card-img", id="rock", onclick="game(3)">
|
||||||
|
<img src="img/камушек.png">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
@@ -1,6 +1,3 @@
|
|||||||
let hum = prompt('Выберите "камень", "ножницы" или "бумага"');
|
|
||||||
let npc = Math.floor(Math.random() * 3) + 1;
|
|
||||||
|
|
||||||
let stats = JSON.parse(localStorage.getItem("stats"));
|
let stats = JSON.parse(localStorage.getItem("stats"));
|
||||||
|
|
||||||
if (!stats) {
|
if (!stats) {
|
||||||
@@ -22,40 +19,36 @@ const Stone = { num: 3, Name: 'камень' };
|
|||||||
const Scissors = { num: 2, Name: 'ножницы' };
|
const Scissors = { num: 2, Name: 'ножницы' };
|
||||||
const Paper = { num: 1, Name: 'бумага' };
|
const Paper = { num: 1, Name: 'бумага' };
|
||||||
|
|
||||||
|
function game(hum) {
|
||||||
|
|
||||||
if (hum === Stone.Name) {
|
let npc = Math.floor(Math.random() * 3) + 1;
|
||||||
hum = Stone.num;
|
|
||||||
} else if (hum === Scissors.Name) {
|
|
||||||
hum = Scissors.num;
|
|
||||||
} else if (hum === Paper.Name) {
|
|
||||||
hum = Paper.num;
|
|
||||||
};
|
|
||||||
|
|
||||||
|
if (npc === 1 && hum === 3) {
|
||||||
if (npc === 1 && hum === 3) {
|
|
||||||
npc = 4
|
npc = 4
|
||||||
}
|
}
|
||||||
if (npc === 3 && hum === 1) {
|
if (npc === 3 && hum === 1) {
|
||||||
hum = 4
|
hum = 4
|
||||||
}
|
}
|
||||||
|
|
||||||
if (npc > hum) {
|
if (npc > hum) {
|
||||||
console.log("Вы проиграли");
|
console.log("Вы проиграли");
|
||||||
alert("Вы проиграли");
|
alert("Вы проиграли");
|
||||||
stats.looses++;
|
stats.looses++;
|
||||||
save()
|
save()
|
||||||
} else if (npc === hum) {
|
} else if (npc === hum) {
|
||||||
console.log("Ничья");
|
console.log("Ничья");
|
||||||
alert("Ничья");
|
alert("Ничья");
|
||||||
stats.draws++;
|
stats.draws++;
|
||||||
save()
|
save()
|
||||||
} else if (npc < hum) {
|
} else if (npc < hum) {
|
||||||
console.log("Вы выиграли");
|
console.log("Вы выиграли");
|
||||||
alert("Вы выиграли");
|
alert("Вы выиграли");
|
||||||
stats.wins++;
|
stats.wins++;
|
||||||
save()
|
save()
|
||||||
} else {
|
} else {
|
||||||
console.log("Пользователь написал какую-то фигню");
|
console.log("Пользователь написал какую-то фигню");
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log("wins-" + stats.wins + ",looses-" + stats.looses + ",draws-" + stats.draws);
|
console.log("wins-" + stats.wins + ",looses-" + stats.looses + ",draws-" + stats.draws);
|
||||||
alert("Ваши победы - " + stats.wins + ",Ваши проигрыши - " + stats.looses + ",Ваши ничьи - " + stats.draws);
|
|
||||||
@@ -0,0 +1,19 @@
|
|||||||
|
.game-board {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 20px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.card-img {
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-img img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||