AI game creator

Click here for free DL of the app version that can save data.

No:9017

174

←

Prev Next

→

Games like Misskey
Developer User4246｜Date and time 23/7/20 15:13:38
Build time 28.802 sec｜Game capacity 4.09KB｜

Script

了解です。Misskey風のゲームを作成します。以下のコードは、1枚のHTMLファイルとして実装され、JavaScriptがscriptタグで囲まれています。ゲームの処理は実行開始されており、スマートフォンで操作できるようになっています。

このコードは、9つのキーを持つゲーム画面を表示し、キーを押すことでスコアを増やしていくゲームです。制限時間内にできるだけ多くのキーを押し、スコアを上げることが目標です。制限時間が経過するとゲームオーバーとなり、得点が表示されます。このゲームはスマートフォンでもプレイ可能であり、キーをタップすることでゲームを進めることができます。ゲーム画面はリアルタイムに更新され、スコアと残り時間が表示されます。以上がMisskey風のゲームの実装例です。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

Click here for free DL of the app version that can save data.

```html
<!DOCTYPE html>
<html>
<head>
  <title>MissKey Game</title>
  <meta charset="UTF-8">
</head>
<body>
  <div id="gameContainer">
    <div id="gameArea"></div>
  </div>

let keys = []; // キーの状態を保持する配列
    let score = 0; // ゲームのスコア
    let timeLeft = INITIAL_TIME; // 残り時間
    let timerId; // タイマーのID

// キーの初期化
    function initializeKeys() {
      keys = Array.from({length: NUM_OF_KEYS}, () => ({pressed: false}));
    }

// キーが押されたときの処理
    function onKeyPress(index) {
      if (!keys[index].pressed) {
        keys[index].pressed = true;
        score += SCORE_INCREASE;
        updateGameArea();
      }
    }

// ゲームエリアの更新
    function updateGameArea() {
      const gameArea = document.getElementById('gameArea');
      gameArea.innerHTML = '';

keys.forEach((key, index) => {
        const keyElement = document.createElement('span');
        keyElement.textContent = key.pressed ? '✅' : '🔑';
        keyElement.classList.add(key.pressed ? 'pressed' : 'not-pressed');
        keyElement.onclick = () => onKeyPress(index);
        gameArea.appendChild(keyElement);
      });

const scoreElement = document.createElement('p');
      scoreElement.textContent = 'Score: ' + score;
      gameArea.appendChild(scoreElement);
    }

// 残り時間の更新
    function updateTimer() {
      const timerElement = document.getElementById('timer');
      timerElement.textContent = 'Time Left: ' + timeLeft;

if (timeLeft <= 0) {
        gameOver();
      } else {
        timeLeft--;
      }
    }

// ゲームオーバー処理
    function gameOver() {
      clearInterval(timerId);
      updateGameArea();

const gameArea = document.getElementById('gameArea');
      const gameOverElement = document.createElement('p');
      gameOverElement.textContent = GAME_OVER_MESSAGE;
      gameArea.appendChild(gameOverElement);
    }

// ゲーム開始
    function startGame() {
      initializeKeys();
      updateGameArea();
      timerId = setInterval(updateTimer, 1000);
    }

// ゲームの初期化
    function init() {
      startGame();
    }

window.addEventListener('load', init);
  </script>

#gameArea {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 10px;
    }

span {
      font-size: 30px;
      cursor: pointer;
    }

span.pressed {
      color: green;
    }

span.not-pressed {
      color: red;
    }

p {
      font-size: 20px;
      margin-right: 10px;
    }
  </style>
</body>
</html>
```

このコードは、9つのキーを持つゲーム画面を表示し、キーを押すことでスコアを増やしていくゲームです。制限時間内にできるだけ多くのキーを押し、スコアを上げることが目標です。制限時間が経過するとゲームオーバーとなり、得点が表示されます。

このゲームはスマートフォンでもプレイ可能であり、キーをタップすることでゲームを進めることができます。ゲーム画面はリアルタイムに更新され、スコアと残り時間が表示されます。

以上がMisskey風のゲームの実装例です。