Hugging Face's logo

Spaces:
f25oh
/
deepsite-project
Running

App Files Community
f25oh commited on
Commit
ebeed0f
·
verified ·
1 Parent(s): 1f87703

Создай игру на рандом

Browse files
Files changed (2) hide show
  1. game.html +84 -0
  2. index.html +4 -1
game.html ADDED
@@ -0,0 +1,84 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!doctype html>
2
+ <html>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width" />
6
+ <title>Random Number Game</title>
7
+ <link rel="stylesheet" href="style.css" />
8
+ <style>
9
+ .game-container {
10
+ max-width: 500px;
11
+ margin: 0 auto;
12
+ padding: 20px;
13
+ text-align: center;
14
+ }
15
+ input, button {
16
+ padding: 8px;
17
+ margin: 5px;
18
+ font-size: 16px;
19
+ }
20
+ #message {
21
+ margin: 15px 0;
22
+ font-weight: bold;
23
+ min-height: 24px;
24
+ }
25
+ </style>
26
+ </head>
27
+ <body>
28
+ <div class="game-container">
29
+ <h1>Guess the Number Game</h1>
30
+ <p>I'm thinking of a number between 1 and 100. Can you guess it?</p>
31
+ <input type="number" id="guess" min="1" max="100" placeholder="Enter your guess">
32
+ <button id="check">Check</button>
33
+ <button id="new-game">New Game</button>
34
+ <div id="message"></div>
35
+ <div id="attempts">Attempts: 0</div>
36
+ <a href="index.html">Back to Home</a>
37
+ </div>
38
+
39
+ <script>
40
+ let randomNumber = Math.floor(Math.random() * 100) + 1;
41
+ let attempts = 0;
42
+
43
+ document.getElementById('check').addEventListener('click', checkGuess);
44
+ document.getElementById('new-game').addEventListener('click', newGame);
45
+ document.getElementById('guess').addEventListener('keypress', function(e) {
46
+ if (e.key === 'Enter') checkGuess();
47
+ });
48
+
49
+ function checkGuess() {
50
+ const guess = parseInt(document.getElementById('guess').value);
51
+ const message = document.getElementById('message');
52
+ const attemptsDisplay = document.getElementById('attempts');
53
+
54
+ if (isNaN(guess) || guess < 1 || guess > 100) {
55
+ message.textContent = 'Please enter a valid number between 1 and 100';
56
+ return;
57
+ }
58
+
59
+ attempts++;
60
+ attemptsDisplay.textContent = `Attempts: ${attempts}`;
61
+
62
+ if (guess === randomNumber) {
63
+ message.textContent = `Congratulations! You guessed the number in ${attempts} attempts!`;
64
+ message.style.color = 'green';
65
+ } else if (guess < randomNumber) {
66
+ message.textContent = 'Too low! Try again.';
67
+ message.style.color = 'red';
68
+ } else {
69
+ message.textContent = 'Too high! Try again.';
70
+ message.style.color = 'red';
71
+ }
72
+ }
73
+
74
+ function newGame() {
75
+ randomNumber = Math.floor(Math.random() * 100) + 1;
76
+ attempts = 0;
77
+ document.getElementById('guess').value = '';
78
+ document.getElementById('message').textContent = '';
79
+ document.getElementById('message').style.color = 'black';
80
+ document.getElementById('attempts').textContent = 'Attempts: 0';
81
+ }
82
+ </script>
83
+ </body>
84
+ </html>
index.html CHANGED
@@ -14,6 +14,9 @@
14
  Also don't forget to check the
15
  <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
  </p>
17
- </div>
 
 
 
18
  </body>
19
  </html>
 
14
  Also don't forget to check the
15
  <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
  </p>
17
+ <p>
18
+ <a href="game.html">Play Random Number Game</a>
19
+ </p>
20
+ </div>
21
  </body>
22
  </html>