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

No:42693

180

←

Prev Next

→

Automation: AI Generated NPC Chat Animation, type ..ALL
Developer User13970｜Date and time 24/2/12 20:18:30
Build time 15.275 sec｜Game capacity 4.721KB｜

Script

AI Generated NPC Chat Animation

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>AI Generated NPC Chat Animation</title>
    <style>
      body {
        font-family: Arial, sans-serif;
      }
      #conversation {
        width: 300px;
        height: 300px;
        background-color: #f2f2f2;
        overflow-y: scroll;
      }
      #input {
        width: 250px;
      }
      #submitBtn {
        margin-left: 10px;
      }
      .chat-bubble {
        margin: 10px;
        padding: 10px;
        background-color: #d3e0ea;
        border-radius: 10px;
      }
      .user-bubble {
        background-color: #c2e8c2;
        text-align: right;
      }
      p {
        margin-top: 5px;
        margin-bottom: 5px;
      }
    </style>
  </head>
  <body>
    <h1>AI Generated NPC Chat Animation</h1>

<button id="menuBtn">Menu</button>
    
    <div id="menu" style="display: none;">
      <h2>Main Menu</h2>
      <p>Select an option:</p>
      <ul>
        <li><button id="startGameBtn">Start Game</button></li>
        <li><button id="instructionsBtn">Instructions</button></li>
        <li><button id="exitGameBtn">Exit Game</button></li>
      </ul>
    </div>

<div id="instructions" style="display: none;">
      <h2>Instructions</h2>
      <p>Welcome to AI Generated NPC Chat Animation!</p>
      <p>In this game, you will chat with an AI-generated NPC.</p>
      <p>To chat, type your messages in the input box at the bottom and click "Send". The NPC will reply with a generated response.</p>
      <p>To go back to the main menu, click the "Menu" button.</p>
    </div>

// Main menu navigation
      const menuBtn = document.getElementById("menuBtn");
      const startGameBtn = document.getElementById("startGameBtn");
      const instructionsBtn = document.getElementById("instructionsBtn");
      const exitGameBtn = document.getElementById("exitGameBtn");
      const menu = document.getElementById("menu");
      const game = document.getElementById("game");
      const instructions = document.getElementById("instructions");
      menuBtn.addEventListener("click", function() {
        menu.style.display = "block";
        game.style.display = "none";
        instructions.style.display = "none";
      });
      startGameBtn.addEventListener("click", function() {
        menu.style.display = "none";
        game.style.display = "block";
        instructions.style.display = "none";
      });
      instructionsBtn.addEventListener("click", function() {
        menu.style.display = "none";
        game.style.display = "none";
        instructions.style.display = "block";
      });
      exitGameBtn.addEventListener("click", function() {
        menu.style.display = "block";
        game.style.display = "none";
        instructions.style.display = "none";
      });

// AI chat functionality
      const conversation = document.getElementById("conversation");
      const input = document.getElementById("input");
      const submitBtn = document.getElementById("submitBtn");
      submitBtn.addEventListener("click", function() {
        const userMessage = input.value.trim();
        if (userMessage !== "") {
          conversation.appendChild(createChatBubble(userMessage, true));
          input.value = "";

// Generate NPC response (dummy implementation)
          const npcResponse = generateResponse(userMessage);
          setTimeout(function() {
            conversation.appendChild(createChatBubble(npcResponse, false));
            conversation.scrollTop = conversation.scrollHeight;
          }, 1000);
        }
      });

// Dummy implementation of response generation
      function generateResponse(userMessage) {
        // Replace with actual AI-generated response
        const responses = [
          "Hello!",
          "How are you today?",
          "What are your plans for the weekend?",
          "Tell me a joke.",
          "I'm sorry, I don't understand.",
          "That's interesting!"
        ];
        return responses[Math.floor(Math.random() * responses.length)];
      }
    </script>
  </body>
</html>

AI Generated NPC Chat Animation

Main Menu

AI Chat

Instructions