From 5fa96fc94dbcaa086b4bff6a06edd14d9cb0ae58 Mon Sep 17 00:00:00 2001 From: Subarunrun <86033765+subarunrun0812@users.noreply.github.com> Date: Mon, 24 Jun 2024 18:47:28 +0900 Subject: [PATCH 01/55] =?UTF-8?q?=EF=BC=91=E4=BA=BA=E7=94=A8=E3=81=AE?= =?UTF-8?q?=E7=B0=A1=E6=98=93=E7=9A=84=E3=81=AA=E3=82=BF=E3=82=A4=E3=83=94?= =?UTF-8?q?=E3=83=B3=E3=82=B0=E3=82=B2=E3=83=BC=E3=83=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-game/index.html | 29 ++++++++++++++ typing-game/scripts/gameController.js | 57 +++++++++++++++++++++++++++ typing-game/scripts/inputHandler.js | 19 +++++++++ typing-game/scripts/main.js | 4 ++ typing-game/scripts/uiController.js | 49 +++++++++++++++++++++++ typing-game/styles.css | 22 +++++++++++ 6 files changed, 180 insertions(+) create mode 100644 typing-game/index.html create mode 100644 typing-game/scripts/gameController.js create mode 100644 typing-game/scripts/inputHandler.js create mode 100644 typing-game/scripts/main.js create mode 100644 typing-game/scripts/uiController.js create mode 100644 typing-game/styles.css diff --git a/typing-game/index.html b/typing-game/index.html new file mode 100644 index 00000000..f868b7e7 --- /dev/null +++ b/typing-game/index.html @@ -0,0 +1,29 @@ + + + + + + タイピングゲーム + + + +
+ +
+ + + + + + + + diff --git a/typing-game/scripts/gameController.js b/typing-game/scripts/gameController.js new file mode 100644 index 00000000..2802b48b --- /dev/null +++ b/typing-game/scripts/gameController.js @@ -0,0 +1,57 @@ +const gameController = (function() { + let timer; + let timeLeft; + let score; + let currentWord; + const maxTime = 10; // 初期タイマー値 + const words = ["apple", "banana", "cherry", "grape", "elderberry"]; + + function startGame() { + score = 0; + timeLeft = maxTime; + uiController.updateTimer(timeLeft); // 初期値をUIに反映 + uiController.updateScore(score); + nextWord(); + startTimer(); + } + + function nextWord() { + currentWord = words[Math.floor(Math.random() * words.length)]; + console.log("Next word: ", currentWord); // デバッグ用ログ + uiController.displayWord(currentWord); + inputHandler.resetInput(); + } + + function startTimer() { + clearInterval(timer); + timer = setInterval(() => { + timeLeft--; + uiController.updateTimer(timeLeft); // タイマー更新 + if (timeLeft <= 0) { + endGame(); + } + }, 1000); + } + + function endGame() { + clearInterval(timer); + uiController.showResult(score); + } + + function handleCorrectInput() { + score++; + uiController.updateScore(score); + timeLeft = maxTime; + nextWord(); + } + + function getCurrentWord() { + return currentWord; + } + + return { + startGame, + handleCorrectInput, + getCurrentWord + }; +})(); diff --git a/typing-game/scripts/inputHandler.js b/typing-game/scripts/inputHandler.js new file mode 100644 index 00000000..abb41fe6 --- /dev/null +++ b/typing-game/scripts/inputHandler.js @@ -0,0 +1,19 @@ +const inputHandler = (function() { + const inputField = uiController.getInputField(); + + inputField.addEventListener("input", () => { + console.log("Input: ", inputField.value); + if (inputField.value === gameController.getCurrentWord()) { + gameController.handleCorrectInput(); + } + }); + + function resetInput() { + inputField.value = ""; + inputField.focus(); + } + + return { + resetInput + }; +})(); diff --git a/typing-game/scripts/main.js b/typing-game/scripts/main.js new file mode 100644 index 00000000..0a2740af --- /dev/null +++ b/typing-game/scripts/main.js @@ -0,0 +1,4 @@ +// This file initializes the game +document.addEventListener("DOMContentLoaded", () => { + console.log("Game Initialized"); +}); diff --git a/typing-game/scripts/uiController.js b/typing-game/scripts/uiController.js new file mode 100644 index 00000000..83d482fb --- /dev/null +++ b/typing-game/scripts/uiController.js @@ -0,0 +1,49 @@ +const uiController = (function() { + const startButton = document.getElementById("startButton"); + const restartButton = document.getElementById("restartButton"); + const startDiv = document.getElementById("start"); + const gameDiv = document.getElementById("game"); + const resultDiv = document.getElementById("result"); + const wordDiv = document.getElementById("word"); + const inputField = document.getElementById("input"); + const timerDiv = document.getElementById("timer"); + const scoreDiv = document.getElementById("score"); + const finalScoreDiv = document.getElementById("finalScore"); + + startButton.addEventListener("click", () => { + startDiv.classList.add("hidden"); + gameDiv.classList.remove("hidden"); + gameController.startGame(); + }); + + restartButton.addEventListener("click", () => { + resultDiv.classList.add("hidden"); + startDiv.classList.remove("hidden"); + }); + + function displayWord(word) { + wordDiv.textContent = word; + } + + function updateTimer(time) { + timerDiv.textContent = time; // タイマーの表示を更新 + } + + function updateScore(score) { + scoreDiv.textContent = score; + } + + function showResult(score) { + gameDiv.classList.add("hidden"); + resultDiv.classList.remove("hidden"); + finalScoreDiv.textContent = "スコア: " + score; + } + + return { + displayWord, + updateTimer, + updateScore, + showResult, + getInputField: () => inputField + }; +})(); diff --git a/typing-game/styles.css b/typing-game/styles.css new file mode 100644 index 00000000..f712ef6b --- /dev/null +++ b/typing-game/styles.css @@ -0,0 +1,22 @@ +.hidden { + display: none; +} + + +#timer { + font-size: 2em; +} + +#word { + font-size: 1.5em; +} + +#bomb { + font-size: 3em; +} + +#input { + font-size: 1.2em; + width: 100%; + box-sizing: border-box; +} From 1034094d50ccddab9666f2fc5e64bab1278ba13f Mon Sep 17 00:00:00 2001 From: Subarunrun <86033765+subarunrun0812@users.noreply.github.com> Date: Tue, 25 Jun 2024 14:11:54 +0900 Subject: [PATCH 02/55] =?UTF-8?q?=E8=A1=A8=E7=A4=BA=E3=81=95=E3=82=8C?= =?UTF-8?q?=E3=82=8B=E8=A6=81=E7=B4=A0=E3=82=92=E7=94=BB=E9=9D=A2=E4=B8=AD?= =?UTF-8?q?=E5=A4=AE=E3=81=AB=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- typing-game/index.html | 7 ++++--- typing-game/scripts/gameController.js | 1 + typing-game/styles.css | 13 +++++++++++++ 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/typing-game/index.html b/typing-game/index.html index f868b7e7..bf426f5e 100644 --- a/typing-game/index.html +++ b/typing-game/index.html @@ -6,16 +6,17 @@ タイピングゲーム - +