| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>NPC Chat Interface</title> |
| </head> |
| <body> |
| <div id="npc-chat-container"> |
| <p id="npc-response">NPC is waiting...</p> |
| <input type="text" id="player-input" placeholder="Type your message here..." /> |
| <button id="send-button">Send</button> |
| </div> |
|
|
| <script> |
| document.getElementById('send-button').addEventListener('click', async function () { |
| const playerInput = document.getElementById('player-input').value; |
| const npcResponseElement = document.getElementById('npc-response'); |
| |
| |
| const response = await fetch('https://api.your-llm.com/inference', { |
| method: 'POST', |
| headers: { |
| 'Content-Type': 'application/json', |
| }, |
| body: JSON.stringify({ prompt: playerInput }), |
| }); |
| |
| const data = await response.json(); |
| npcResponseElement.textContent = data.response; |
| }); |
| </script> |
| </body> |
| </html> |
|
|
