Last 10 Commits for hangman.scroll.pub

commit f6d5bc2267293aef20ba619e14f4105ce8a774da Author: root <root@hub.scroll.pub> Date: 2024-12-28 10:46:04 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..a2c75ca --- /dev/null +++ b/body.html @@ -0,0 +1,41 @@ +<header> + <h1>Hangman Game</h1> + <p>Guess the word before the man gets hanged!</p> +</header> + +<main> + <div class="game-container"> + <div class="hangman-display"> + <svg viewBox="0 0 200 200" class="hangman-svg"> +  + <line x1="20" y1="180" x2="100" y2="180" class="scaffold" /> + <line x1="60" y1="180" x2="60" y2="20" class="scaffold" /> + <line x1="60" y1="20" x2="140" y2="20" class="scaffold" /> + <line x1="140" y1="20" x2="140" y2="40" class="scaffold" /> + +  + <circle cx="140" cy="60" r="20" class="hangman-part" id="head" /> + <line x1="140" y1="80" x2="140" y2="120" class="hangman-part" id="body" /> + <line x1="140" y1="90" x2="120" y2="110" class="hangman-part" id="left-arm" /> + <line x1="140" y1="90" x2="160" y2="110" class="hangman-part" id="right-arm" /> + <line x1="140" y1="120" x2="120" y2="140" class="hangman-part" id="left-leg" /> + <line x1="140" y1="120" x2="160" y2="140" class="hangman-part" id="right-leg" /> + </svg> + </div> + + <div class="word-display" id="word-display"></div> + + <div class="keyboard" id="keyboard"></div> + + <div class="game-status"> + <p>Guesses left: <span id="guesses-left">6</span></p> + <p id="game-message"></p> + </div> + + <button id="reset-button" class="reset-button">New Game</button> + </div> +</main> + +<footer> + <p>Enjoy the classic word guessing game!</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..30a363f --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://hangman.scroll.pub +metaTags +editButton /edit.html +title Hangman Game - Play Online +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..1c8bd9a --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "da72fee9-6e21-4102-9904-e42d32d583eb", + "object": "chat.completion", + "created": 1735382736, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nhangman.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://hangman.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Hangman Game - Play Online\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Hangman Game</h1>\n <p>Guess the word before the man gets hanged!</p>\n</header>\n\n<main>\n <div class=\"game-container\">\n <div class=\"hangman-display\">\n <svg viewBox=\"0 0 200 200\" class=\"hangman-svg\">\n \n <line x1=\"20\" y1=\"180\" x2=\"100\" y2=\"180\" class=\"scaffold\" />\n <line x1=\"60\" y1=\"180\" x2=\"60\" y2=\"20\" class=\"scaffold\" />\n <line x1=\"60\" y1=\"20\" x2=\"140\" y2=\"20\" class=\"scaffold\" />\n <line x1=\"140\" y1=\"20\" x2=\"140\" y2=\"40\" class=\"scaffold\" />\n \n \n <circle cx=\"140\" cy=\"60\" r=\"20\" class=\"hangman-part\" id=\"head\" />\n <line x1=\"140\" y1=\"80\" x2=\"140\" y2=\"120\" class=\"hangman-part\" id=\"body\" />\n <line x1=\"140\" y1=\"90\" x2=\"120\" y2=\"110\" class=\"hangman-part\" id=\"left-arm\" />\n <line x1=\"140\" y1=\"90\" x2=\"160\" y2=\"110\" class=\"hangman-part\" id=\"right-arm\" />\n <line x1=\"140\" y1=\"120\" x2=\"120\" y2=\"140\" class=\"hangman-part\" id=\"left-leg\" />\n <line x1=\"140\" y1=\"120\" x2=\"160\" y2=\"140\" class=\"hangman-part\" id=\"right-leg\" />\n </svg>\n </div>\n\n <div class=\"word-display\" id=\"word-display\"></div>\n\n <div class=\"keyboard\" id=\"keyboard\"></div>\n\n <div class=\"game-status\">\n <p>Guesses left: <span id=\"guesses-left\">6</span></p>\n <p id=\"game-message\"></p>\n </div>\n\n <button id=\"reset-button\" class=\"reset-button\">New Game</button>\n </div>\n</main>\n\n<footer>\n <p>Enjoy the classic word guessing game!</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --secondary-color: #34495e;\n --accent-color: #e74c3c;\n --text-color: #ecf0f1;\n --background-color: #1a1a1a;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n background-color: var(--background-color);\n color: var(--text-color);\n margin: 0;\n padding: 20px;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\nheader {\n text-align: center;\n margin-bottom: 2rem;\n}\n\nh1 {\n color: var(--primary-color);\n font-size: 2.5rem;\n margin: 0;\n}\n\n.game-container {\n max-width: 800px;\n width: 100%;\n background: var(--secondary-color);\n padding: 2rem;\n border-radius: 15px;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);\n}\n\n.hangman-display {\n text-align: center;\n margin-bottom: 2rem;\n}\n\n.hangman-svg {\n width: 200px;\n height: 200px;\n}\n\n.scaffold {\n stroke: var(--primary-color);\n stroke-width: 4;\n}\n\n.hangman-part {\n stroke: var(--accent-color);\n stroke-width: 4;\n fill: none;\n display: none;\n}\n\n.word-display {\n font-size: 2rem;\n letter-spacing: 0.5rem;\n text-align: center;\n margin: 2rem 0;\n font-weight: bold;\n}\n\n.keyboard {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(40px, 1fr));\n gap: 10px;\n max-width: 600px;\n margin: 0 auto;\n}\n\n.keyboard button {\n padding: 15px;\n font-size: 1.2rem;\n background: var(--primary-color);\n color: var(--text-color);\n border: none;\n border-radius: 5px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.keyboard button:hover {\n background: var(--accent-color);\n transform: translateY(-2px);\n}\n\n.keyboard button:disabled {\n background: #7f8c8d;\n cursor: not-allowed;\n}\n\n.game-status {\n text-align: center;\n margin: 2rem 0;\n}\n\n.reset-button {\n display: block;\n margin: 2rem auto 0;\n padding: 1rem 2rem;\n font-size: 1.2rem;\n background: var(--accent-color);\n color: var(--text-color);\n border: none;\n border-radius: 5px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.reset-button:hover {\n background: #c0392b;\n transform: translateY(-2px);\n}\n\nfooter {\n margin-top: 3rem;\n text-align: center;\n color: #7f8c8d;\n}\n\n@media (max-width: 600px) {\n h1 {\n font-size: 2rem;\n }\n \n .word-display {\n font-size: 1.5rem;\n }\n \n .keyboard button {\n padding: 10px;\n font-size: 1rem;\n }\n}\n---script.js---\nconst words = [\n 'javascript', 'programming', 'algorithm', \n 'developer', 'interface', 'database',\n 'function', 'variable', 'iteration',\n 'framework', 'responsive', 'asynchronous'\n];\n\nlet selectedWord = '';\nlet guessedLetters = [];\nlet remainingGuesses = 6;\nlet gameActive = true;\n\nconst wordDisplay = document.getElementById('word-display');\nconst keyboard = document.getElementById('keyboard');\nconst guessesLeft = document.getElementById('guesses-left');\nconst gameMessage = document.getElementById('game-message');\nconst resetButton = document.getElementById('reset-button');\nconst hangmanParts = document.querySelectorAll('.hangman-part');\n\nfunction initializeGame() {\n selectedWord = words[Math.floor(Math.random() * words.length)];\n guessedLetters = [];\n remainingGuesses = 6;\n gameActive = true;\n \n // Reset display\n wordDisplay.textContent = '_ '.repeat(selectedWord.length);\n guessesLeft.textContent = remainingGuesses;\n gameMessage.textContent = '';\n \n // Reset keyboard\n keyboard.innerHTML = 'abcdefghijklmnopqrstuvwxyz'\n .split('')\n .map(letter => `<button>${letter}</button>`)\n .join('');\n \n // Reset hangman\n hangmanParts.forEach(part => part.style.display = 'none');\n \n // Add event listeners\n keyboard.addEventListener('click', handleLetterClick);\n resetButton.addEventListener('click', initializeGame);\n}\n\nfunction handleLetterClick(e) {\n if (!gameActive || !e.target.matches('button')) return;\n \n const letter = e.target.textContent.toLowerCase();\n e.target.disabled = true;\n \n if (selectedWord.includes(letter)) {\n guessedLetters.push(letter);\n updateWordDisplay();\n checkWin();\n } else {\n remainingGuesses--;\n updateHangman();\n checkLose();\n }\n \n guessesLeft.textContent = remainingGuesses;\n}\n\nfunction updateWordDisplay() {\n wordDisplay.textContent = selectedWord\n .split('')\n .map(letter => guessedLetters.includes(letter) ? letter : '_')\n .join(' ');\n}\n\nfunction updateHangman() {\n const partIndex = 6 - remainingGuesses - 1;\n if (partIndex >= 0 && partIndex < hangmanParts.length) {\n hangmanParts[partIndex].style.display = 'block';\n }\n}\n\nfunction checkWin() {\n if (selectedWord.split('').every(letter => guessedLetters.includes(letter))) {\n gameMessage.textContent = 'Congratulations! You won!';\n gameActive = false;\n }\n}\n\nfunction checkLose() {\n if (remainingGuesses === 0) {\n gameMessage.textContent = `Game over! The word was \"${selectedWord}\".`;\n gameActive = false;\n }\n}\n\n// Initialize game on page load\ninitializeGame();\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 243, + "completion_tokens": 2004, + "total_tokens": 2247, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 243 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..545ad2d --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# hangman.scroll.pub +Website generated by DeepSeek from prompt: a web page can play game like hugman \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..5c78156 --- /dev/null +++ b/script.js @@ -0,0 +1,93 @@ +const words = [ + 'javascript', 'programming', 'algorithm', + 'developer', 'interface', 'database', + 'function', 'variable', 'iteration', + 'framework', 'responsive', 'asynchronous' +]; + +let selectedWord = ''; +let guessedLetters = []; +let remainingGuesses = 6; +let gameActive = true; + +const wordDisplay = document.getElementById('word-display'); +const keyboard = document.getElementById('keyboard'); +const guessesLeft = document.getElementById('guesses-left'); +const gameMessage = document.getElementById('game-message'); +const resetButton = document.getElementById('reset-button'); +const hangmanParts = document.querySelectorAll('.hangman-part'); + +function initializeGame() { + selectedWord = words[Math.floor(Math.random() * words.length)]; + guessedLetters = []; + remainingGuesses = 6; + gameActive = true; + + // Reset display + wordDisplay.textContent = '_ '.repeat(selectedWord.length); + guessesLeft.textContent = remainingGuesses; + gameMessage.textContent = ''; + + // Reset keyboard + keyboard.innerHTML = 'abcdefghijklmnopqrstuvwxyz' + .split('') + .map(letter => `<button>${letter}</button>`) + .join(''); + + // Reset hangman + hangmanParts.forEach(part => part.style.display = 'none'); + + // Add event listeners + keyboard.addEventListener('click', handleLetterClick); + resetButton.addEventListener('click', initializeGame); +} + +function handleLetterClick(e) { + if (!gameActive || !e.target.matches('button')) return; + + const letter = e.target.textContent.toLowerCase(); + e.target.disabled = true; + + if (selectedWord.includes(letter)) { + guessedLetters.push(letter); + updateWordDisplay(); + checkWin(); + } else { + remainingGuesses--; + updateHangman(); + checkLose(); + } + + guessesLeft.textContent = remainingGuesses; +} + +function updateWordDisplay() { + wordDisplay.textContent = selectedWord + .split('') + .map(letter => guessedLetters.includes(letter) ? letter : '_') + .join(' '); +} + +function updateHangman() { + const partIndex = 6 - remainingGuesses - 1; + if (partIndex >= 0 && partIndex < hangmanParts.length) { + hangmanParts[partIndex].style.display = 'block'; + } +} + +function checkWin() { + if (selectedWord.split('').every(letter => guessedLetters.includes(letter))) { + gameMessage.textContent = 'Congratulations! You won!'; + gameActive = false; + } +} + +function checkLose() { + if (remainingGuesses === 0) { + gameMessage.textContent = `Game over! The word was "${selectedWord}".`; + gameActive = false; + } +} + +// Initialize game on page load +initializeGame(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..01ab8b7 --- /dev/null +++ b/style.css @@ -0,0 +1,142 @@ +:root { + --primary-color: #2c3e50; + --secondary-color: #34495e; + --accent-color: #e74c3c; + --text-color: #ecf0f1; + --background-color: #1a1a1a; +} + +body { + font-family: 'Segoe UI', system-ui, sans-serif; + background-color: var(--background-color); + color: var(--text-color); + margin: 0; + padding: 20px; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; +} + +header { + text-align: center; + margin-bottom: 2rem; +} + +h1 { + color: var(--primary-color); + font-size: 2.5rem; + margin: 0; +} + +.game-container { + max-width: 800px; + width: 100%; + background: var(--secondary-color); + padding: 2rem; + border-radius: 15px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); +} + +.hangman-display { + text-align: center; + margin-bottom: 2rem; +} + +.hangman-svg { + width: 200px; + height: 200px; +} + +.scaffold { + stroke: var(--primary-color); + stroke-width: 4; +} + +.hangman-part { + stroke: var(--accent-color); + stroke-width: 4; + fill: none; + display: none; +} + +.word-display { + font-size: 2rem; + letter-spacing: 0.5rem; + text-align: center; + margin: 2rem 0; + font-weight: bold; +} + +.keyboard { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(40px, 1fr)); + gap: 10px; + max-width: 600px; + margin: 0 auto; +} + +.keyboard button { + padding: 15px; + font-size: 1.2rem; + background: var(--primary-color); + color: var(--text-color); + border: none; + border-radius: 5px; + cursor: pointer; + transition: all 0.3s ease; +} + +.keyboard button:hover { + background: var(--accent-color); + transform: translateY(-2px); +} + +.keyboard button:disabled { + background: #7f8c8d; + cursor: not-allowed; +} + +.game-status { + text-align: center; + margin: 2rem 0; +} + +.reset-button { + display: block; + margin: 2rem auto 0; + padding: 1rem 2rem; + font-size: 1.2rem; + background: var(--accent-color); + color: var(--text-color); + border: none; + border-radius: 5px; + cursor: pointer; + transition: all 0.3s ease; +} + +.reset-button:hover { + background: #c0392b; + transform: translateY(-2px); +} + +footer { + margin-top: 3rem; + text-align: center; + color: #7f8c8d; +} + +@media (max-width: 600px) { + h1 { + font-size: 2rem; + } + + .word-display { + font-size: 1.5rem; + } + + .keyboard button { + padding: 10px; + font-size: 1rem; + } +} \ No newline at end of file