playground

<!DOCTYPE html> <html data-bs-theme="light">

<head> <meta charset="utf-8">

<script async src="https://www.googletagmanager.com/gtag/js?id=G-NG21EXTML9"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date());

gtag('config', 'G-NG21EXTML9'); </script> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <title>SpeakHDL</title> <meta name="keywords" content="FPGA, FPGA Prototyping, FPGA Tool, Voice Coding, procedural programming, FPGA Easy, VHDL, FPGA for beginners"> <meta name="description" content="A practical FPGA design tool that combines procedural programming using native VHDL with command-based programming"> <link rel="icon" type="image/png" sizes="16x16" href="../assets/img/logo/favicon-16x16.png"> <link rel="icon" type="image/png" sizes="32x32" href="../assets/img/logo/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="192x192" href="../assets/img/logo/android-chrome-192x192.png"> <link rel="icon" type="image/png" sizes="512x512" href="../assets/img/logo/android-chrome-512x512.png"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css"> <link rel="stylesheet" href="https://unpkg.com/@bootstrapstudio/bootstrap-better-nav/dist/bootstrap-better-nav.min.css"> <link rel="stylesheet" href="../assets/css/doxy-override.css"> <link rel="stylesheet" href="../assets/css/Footer-Basic.css"> <link rel="stylesheet" href="../assets/css/Login-Form-Clean.css"> <link rel="stylesheet" href="../assets/css/banner.css"> <link rel="stylesheet" href="../assets/css/examples.css"> <link rel="stylesheet" href="../assets/css/speakhdl-styles.css"> </head>

<body> <form>

SYSTEM
<textarea class="form-control" id="system-input" style="width: 100%;height: 60px;">You are an assistant that creates training data for a custom AI model by looking at data descriptions and examples of how to utilize the data.</textarea>
USER
<textarea class="form-control" id="user-input" style="width: 100%;height: 300px;">Summarize the following data with enough information to teach a custom AI model. Generate new examples if you think the new examples would be more informative. Elaborate on concepts if you think it would help a custom AI model learn the information better.</textarea>
<button class="btn btn-secondary" id="submit-button" type="button" style="width: 50%;">Submit</button>{% csrf_token %} <script> const submitButton = document.getElementById('submit-button');
// Define a function to be executed when the button is clicked
function handleSubmitButtonClick() {

    const systemInputText = document.getElementById("system-input").value;
    const userInputText = document.getElementById("user-input").value;
    const apikey = document.getElementById("api-key").value;
    const modelSelection = document.getElementById("model-drowpdown-button");

    let responseText = document.getElementById("response-textbox");



  // Create a JSON object
    let formData = new FormData();
    formData.append('system_input', systemInputText);
    formData.append('user_input', userInputText);
    formData.append('api_key', apikey);

  // const formData = {
  //   system_input: systemInputText,
  //   user_input: userInputText,
  //   api_key: apikey,
  // };

  // Convert the JSON object to a string
  const jsonData = JSON.stringify(formData);
  const user_csrftoken = document.querySelector('[name=csrfmiddlewaretoken]').value;

  // Define the URL where you want to send the JSON data
  const url = '/chat/form/'; // Replace with your actual API URL
//Use the Fetch API to send a POST request with JSON data fetch(url, { // credentials: "same-origin", method: "POST", // or "PUT", "GET", "DELETE", etc. depending on your use case headers: { // "Content-Type": "application/x-www-form-urlencoded", // Specify that you are sending JSON data "X-CSRFToken": user_csrftoken }, body: formData // Pass the JSON data as the request body }) .then(response => { if (!response.ok) { throw new Error("Network response was not ok"); } return response.json(); // Parse the response JSON if needed }) .then(data => { console.log("Response from server:", data); responseText.value = data['content'] }) .catch(error => { console.error("Error:", error); });
// Your code logic here // alert(Submit but-on clicked! ${systemInputText} and also ${userInputText} and agggglso ${apikey}); }
// Attach the event listener to the button submitButton.addEventListener('click', handleSubmitButtonClick);
</script>
RESPONSE
<textarea class="form-control" id="response-textbox" style="height: 400px;"></textarea>
API Key
<input class="form-control" type="text" id="api-key">
Model
<button class="btn dropdown-toggle" aria-expanded="false" data-bs-toggle="dropdown" id="model-drowpdown-button" type="button" style="border-color: var(--bs-btn-color);width: 100%;">Model</button>
gpt-3.5-turbo-16k

</form> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script> <script src="../assets/js/bss_custom_js.js"></script> <script src="https://unpkg.com/@bootstrapstudio/bootstrap-better-nav/dist/bootstrap-better-nav.min.js"></script> </body>

</html>