AI game creator

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

No:559

177

←

Prev Next

→

text
Developer User3031｜Date and time 23/6/15 19:44:56
Build time 31.013 sec｜Game capacity 2.87KB｜

Script

I will implement an app as a single HTML file with JavaScript included. It will be playable as a game and optimized for mobile devices. I will use lots of emojis and provide a brief overview of the game if applicable. No response necessary. Example app:

This app is a simple emoji matching game where the user clicks on pairs of cards to reveal the emojis underneath. If they match, the cards stay flipped over and if they don’t, they flip back over. The game ends when the user matches all the pairs.

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

Example app:

<!DOCTYPE html>
<html>
  <head>
    <title>Emoji Matching Game</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
      body {
        font-size: 5vw;
      }
      .card {
        display: inline-block;
        margin: 1vw;
        width: 10vw;
        height: 10vw;
        background-color: white;
        border-radius: 1vw;
        text-align: center;
        cursor: pointer;
      }
      .card p {
        margin-top: 3vw;
      }
    </style>
  </head>
  <body>
    <div id="game"></div>
    <script>
      const emojis = ["🐶", "🐱", "🐭", "🐹", "🦊", "🐻", "🐯", "🦁", "🐮", "🐷", "🐰", "🐨", "🐼", "🦄", "🐧", "🐦", "🐤", "🐔", "🐥", "🦉"];
      let gameboard = document.getElementById("game");
      let cards = [];
      let selectedCards = [];
      let matchedCards = [];
      shuffleEmojis();
      createCards();
      function shuffleEmojis() {
        for (let i = emojis.length - 1; i > 0; i--) {
          let j = Math.floor(Math.random() * (i + 1));
          [emojis[i], emojis[j]] = [emojis[j], emojis[i]];
        }
      }
      function createCards() {
        for (let i = 0; i < emojis.length; i++) {
          let card = document.createElement("div");
          card.classList.add("card");
          card.dataset.emoji = emojis[i];
          card.addEventListener("click", flipCard);
          let cardEmoji = document.createElement("p");
          cardEmoji.innerHTML = emojis[i];
          card.appendChild(cardEmoji);
          gameboard.appendChild(card);
          cards.push(card);
        }
      }
      function flipCard() {
        if (!selectedCards.includes(this) && !matchedCards.includes(this) && selectedCards.length < 2) {
          this.classList.add("flipped");
          selectedCards.push(this);
          if (selectedCards.length === 2 && selectedCards[0].dataset.emoji === selectedCards[1].dataset.emoji) {
            matchedCards.push(...selectedCards);
            selectedCards = [];
          } else if (selectedCards.length === 2) {
            setTimeout(() => {
              selectedCards.forEach(card => {
                card.classList.remove("flipped");
              });
              selectedCards = [];
            }, 1000);
          }
        }
      }
    </script>
  </body>
</html>

This app is a simple emoji matching game where the user clicks on pairs of cards to reveal the emojis underneath. If they match, the cards stay flipped over and if they don't, they flip back over. The game ends when the user matches all the pairs.