Spaces:
Build error
Build error
| <html lang="en"> | |
| <head> | |
| <!-- Required meta tags --> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <!-- Bootstrap CSS --> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous"> | |
| <title>Indonesian GPT2 Chatbot</title> | |
| <link rel="stylesheet" href="css/main.css"> | |
| <script src="js/main.js"></script> | |
| </head> | |
| <body onload="pageSetup();"> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script> | |
| <div class="buttons" style="display: none"> | |
| <div class="minus button">-</div> | |
| <div class="value">?</div> | |
| <div class="plus button">+</div> | |
| </div> | |
| <div class="state" style="display: none"> | |
| <span class="users"></span> | |
| </div> | |
| <div class="container"> | |
| <div class="chat-container"> | |
| <div class="chat-messages"> | |
| <div class="messages"> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="chat-input input-group mb-3"> | |
| <input type="text" class="form-control user-input" placeholder="Type a message..." aria-label="User message" aria-describedby="basic-addon2"> | |
| <span class="input-group-text btn btn-primary user-input-button" id="basic-addon2">Send</span> | |
| </div> | |
| <!-- | |
| <div class="chat-suggestion"> | |
| Suggestion: <span class="js-loading">Loading…</span> <a class="js-suggestion hide">Kenapa kamu sedih?</a> | |
| </div> | |
| --> | |
| <div class="server-message"> | |
| <span class="server-message-value"></span> | |
| </div> | |
| <div class="accordion" id="accordionExample"> | |
| <div class="accordion-item"> | |
| <h2 class="accordion-header" id="headingOne"> | |
| <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> | |
| Bots Personalities | |
| </button> | |
| </h2> | |
| <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample"> | |
| <form class="bot-personality"> | |
| <div class="mb-3"> | |
| <div class="row g-2 align-items-center"> | |
| <div class="col-auto"> | |
| <label for="inputPersonality1" class="col-form-label">Personality 1:</label> | |
| </div> | |
| <div class="col-auto"> | |
| <input type="text" class="form-control" id="inputPersonality1"> | |
| </div> | |
| </div> | |
| <div class="row g-2 align-items-center"> | |
| <div class="col-auto"> | |
| <label for="inputPersonality2" class="col-form-label">Personality 2:</label> | |
| </div> | |
| <div class="col-auto"> | |
| <input type="text" class="form-control" id="inputPersonality2"> | |
| </div> | |
| </div> | |
| <div class="row g-2 align-items-center"> | |
| <div class="col-auto"> | |
| <label for="inputPersonality3" class="col-form-label">Personality 3:</label> | |
| </div> | |
| <div class="col-auto"> | |
| <input type="text" class="form-control" id="inputPersonality3"> | |
| </div> | |
| </div> | |
| <div class="row g-2 align-items-center"> | |
| <div class="col-auto"> | |
| <label for="inputPersonality4" class="col-form-label">Personality 4:</label> | |
| </div> | |
| <div class="col-auto"> | |
| <input type="text" class="form-control" id="inputPersonality4"> | |
| </div> | |
| </div> | |
| <div class="row g-2 align-items-center"> | |
| <div class="col-auto"> | |
| <label for="inputPersonality5" class="col-form-label">Personality 5:</label> | |
| </div> | |
| <div class="col-auto"> | |
| <input type="text" class="form-control" id="inputPersonality5"> | |
| </div> | |
| </div> | |
| </div> | |
| <button id="updatePersonality" class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> | |
| Update Personality | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| <div class="accordion-item"> | |
| <h2 class="accordion-header" id="headingThree"> | |
| <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> | |
| Parameters | |
| </button> | |
| </h2> | |
| <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample"> | |
| <div class="chat-parameter card card-body"> | |
| <div class="form-check"> | |
| <input class="form-check-input" type="checkbox" value="" id="doSample" checked> | |
| <label class="form-check-label" for="doSample"> | |
| Do Sample | |
| </label> | |
| </div> | |
| <label for="minLength" class="form-label">Minimal Length: <span id="minLengthValue">1</span></label> | |
| <input type="range" class="form-range" min="1" max="10" value="1" id="minLength" onmousemove="updateValue('minLengthValue', this.value);"> | |
| <label for="maxLength" class="form-label">Maximal Length: <span id="maxLengthValue">20</span></label> | |
| <input type="range" class="form-range" min="20" max="50" value="20" id="maxLength" onmousemove="updateValue('maxLengthValue', this.value);"> | |
| <label for="temperature" class="form-label">Temperature: <span id="temperatureValue">0.7</span></label> | |
| <input type="range" class="form-range" min="0.5" max="10" value="0.7" step="0.1" id="temperature" onmousemove="updateValue('temperatureValue', this.value);"> | |
| <label for="topK" class="form-label">Top k: <span id="topKValue">0</span></label> | |
| <input type="range" class="form-range" min="0" max="50" value="0" id="topK" onmousemove="updateValue('topKValue', this.value);"> | |
| <label for="topP" class="form-label">Top p: <span id="topPValue">0.9</span></label> | |
| <input type="range" class="form-range" min="0.1" max="1.0" value="0.9" step="0.01" id="topP" onmousemove="updateValue('topPValue', this.value);"> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </body> | |
| </html> | |