<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>OntoGPT SPIRES: Enter text</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
        }

        form {
            margin: 20px;
        }

        select, textarea {
            width: 100%;
            padding: 5px;
            margin-bottom: 10px;
        }

        input[type="submit"] {
            padding: 10px 20px;
            background-color: #4CAF50;
            color: white;
            border: none;
            cursor: pointer;
        }

        .footer {
            background-color: #f1f1f1;
            padding: 20px;
            text-align: center;
        }
    </style>
</head>
<body>
<div>
    <form method="post">
        <h1>Information Extraction with SPIRES</h1>
        <div>
            Select Schema:
            <select name="datamodel" id="datamodel">
            {% for key, value in datamodels.items() %}
              <option value="{{ key }}">{{ key }} - {{ value }}</option>
            {% endfor %}
            </select>
        </div>
        <div>
            Select LLM:
            <select name="llm_model" id="llm_model">
                {% for llm_model in llm_models %}
                  <option value="{{ llm_model }}">{{ llm_model }}</option>
                {% endfor %}
            </select>
        </div>
        <div>
            <textarea name="text" rows="20" cols="80">Enter text here (e.g. PubMed abstract)
            </textarea>
        </div>
        <input type="submit" onclick="this.style.backgroundColor='#FFA500'; this.value='Processing...';">
        <div>
            This process currently uses the OpenAI API.
        </div>
        <div>
            <i>Please be patient, can take up to 10s, or longer if ontology resources need to be retrieved.</i>
        </div>
    </form>
</div>
<div class="footer">
    <p>Powered by <a href="https://github.com/monarch-initiative/ontogpt">OntoGPT</a></p>
</div>
</body>
</html>
