AI Co-Pilot: Building with Your Imagination

This is the actual JavaScript function that powers the interactive boxes on this page. When you talk to an NPC, this code packages your message and the personality prompt, then sends it to an AI server. Let's break it down.

        // 'async' tells JavaScript this function will do something that takes time,
        // like waiting for a response from a server.
        async function getAiResponse(personality, message) {
          
          // 'await fetch' sends a request to our AI server's URL.
          // This `fetch` command is sending our prompt to an API—think of it as a special 
          // messenger that lets our website talk to the powerful AI living on another computer.
          // Almost all modern apps are built using APIs!
          const response = await fetch("https://api.tomorrowhub.ai/chat", {
            method: "POST",
            // We package our data into a format called JSON.
            body: JSON.stringify({
              systemPrompt: personality, // The character's "recipe"
              userMessage: message       // What you typed
            })
          });

          // We wait for the server's response and turn it back into data we can use.
          const data = await response.json();
          
          // We return just the AI's reply to be displayed on the page.
          return data.reply;
        }
                  

Connect the dots: When you wrote the pirate's personality in the challenge above, you were writing the systemPrompt. When you talked to him, you were providing the userMessage. This code is what sends your creativity to the AI's brain!