Code viewer [Ancient Brain]

Code viewer for World: New World
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Interactive API Demo</title>
    <style>
        body {
            margin: 20px;
            padding: 20px;
        }

        .container {
            width: 60vw;
            margin: 20px;
            padding: 20px;
        }

        button {
            margin-top: 10px;
        }
    </style>
</head>
<body>

<h1>Interact with Another API</h1>

<div id="response-container" class="container" style="background-color: #ffffcc; border: 1px solid black;">
    <h3>API Response</h3>
    <div id="api-response"></div>
</div>

<div class="container" style="background-color: white; border: 1px solid black;">
    <h3>Make an API Request</h3>
    <label for="user-input">Enter a query:</label>
    <input id="user-input" style="width: 50vw;" value="What's 2 plus 5?">
    <button onclick="makeApiRequest()" class="ab-normbutton">Send Request</button>
</div>

<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script>
    function makeApiRequest() {
        const userInput = $('#user-input').val();

        const settings = {
            async: true,
            crossDomain: true,
            url: 'https://robomatic-ai.p.rapidapi.com/api',
            method: 'POST',
            headers: {
                'content-type': 'application/x-www-form-urlencoded',
                'X-RapidAPI-Key': '3835be4181msha063475a102fcc8p1250bajsnfaa48379b019',
                'X-RapidAPI-Host': 'robomatic-ai.p.rapidapi.com'
            },
            data: {
                in: userInput,
                op: 'in',
                cbot: '1',
                SessionID: 'RapidAPI1',
                cbid: '1',
                key: 'RHMN5hnQ4wTYZBGCF3dfxzypt68rVP',
                ChatSource: 'RapidAPI',
                duration: '1'
            }
        };

        $.ajax(settings)
            .done(function (response) {
                displayApiResponse(response);
            })
            .fail(function () {
                displayError();
            });
    }

    function displayApiResponse(response) {
        const formattedResponse = JSON.stringify(response, null, 2);
        $('#api-response').html(`<pre>${formattedResponse}</pre>`);
    }

    function displayError() {
        $('#api-response').html('<font color="red"><b>Error in API request.</b></font>');
    }
</script>

</body>
</html>