Spaces:
Runtime error
Runtime error
| <html lang="en"> | |
| <head> | |
| <title>GPT2 Persona Chatbot</title> | |
| <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'> | |
| <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v6.0.0-beta1/css/all.css"> | |
| <link rel="stylesheet" href="css/chatbot.css"> | |
| </head> | |
| <body onload="pageSetup();"> | |
| <div id="chatbox"> | |
| <div id="friendslist"> | |
| <div id="topmenu"> | |
| <span class="friends"></span> | |
| <span class="chats"></span> | |
| <span class="history"></span> | |
| </div> | |
| <div id="friends"> | |
| </div> | |
| <div id="search"> | |
| <input type="text" id="searchfield" value="Search contacts..." /> | |
| </div> | |
| </div> | |
| <div id="chatview" class="p1"> | |
| <div id="profile"> | |
| <ul class="social-icons icon-circle icon-rotate list-unstyled list-inline"> | |
| <li id="close"><i class="fas fa-solid fa-house-chimney"></i></li> | |
| <li id="personalities"><i class="fas fa-solid fa-address-card"></i></li> | |
| <li id="parameters"><i class="fas fa-solid fa-sliders"></i></li> | |
| <li id="about"><i class="fas fa-solid fa-info"></i></li> | |
| </ul> | |
| <p>Miro Badev</p> | |
| <span>miro@badev@gmail.com</span> | |
| </div> | |
| <div id="chat-block"> | |
| <div></div> | |
| <div id="sendmessage"> | |
| <input type="text" value="Send message..." class="user-input"/> | |
| <button id="send" class="user-input-button"></button> | |
| </div> | |
| </div> | |
| <div id="config-block"> | |
| <div id="personalities_view" class="bot-personality"> | |
| <h3>Personalities</h3> | |
| <div> | |
| <label for="inputPersonality1" class="col-form-label"></label> | |
| <input type="text" class="effect-10" id="inputPersonality1"> | |
| <span class="focus-bg"></span> | |
| </div> | |
| <div> | |
| <label for="inputPersonality2" class="col-form-label"></label> | |
| <input type="text" class="form-control" id="inputPersonality2"> | |
| </div> | |
| <div> | |
| <label for="inputPersonality3" class="col-form-label"></label> | |
| <input type="text" class="form-control" id="inputPersonality3"> | |
| </div> | |
| <div> | |
| <label for="inputPersonality4" class="col-form-label"></label> | |
| <input type="text" class="form-control" id="inputPersonality4"> | |
| </div> | |
| <div> | |
| <label for="inputPersonality5" class="col-form-label"></label> | |
| <input type="text" class="form-control" id="inputPersonality5"> | |
| </div> | |
| <div id="personalities_button"> | |
| <button id="personalities_cancel">Cancel</button> | |
| <button id="personalities_update">Update</button> | |
| </div> | |
| </div> | |
| <div id="parameters_view" class=""> | |
| <h3>Parameters</h3> | |
| <div class="form-check"> | |
| <label class="form-check-label" for="doSample"> | |
| Do Sample | |
| </label> | |
| <input class="form-check-input" type="checkbox" value="" id="doSample" checked> | |
| </div> | |
| <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);"> | |
| </div> | |
| <div> | |
| <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);"> | |
| </div> | |
| <div> | |
| <label for="temperature" class="form-label">Temperature: <span id="temperatureValue">0.7</span></label> | |
| <input type="range" class="form-range" min="0.1" max="1.0" value="0.7" step="0.1" id="temperature" onmousemove="updateValue('temperatureValue', this.value);"> | |
| </div> | |
| <div> | |
| <label for="topK" class="form-label">Top k: <span id="topKValue">20</span></label> | |
| <input type="range" class="form-range" min="0" max="50" value="20" id="topK" onmousemove="updateValue('topKValue', this.value);"> | |
| </div> | |
| <div> | |
| <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 id="parameters_button"> | |
| <button id="parameters_ok">Ok</button> | |
| </div> | |
| </div> | |
| <div id="about_view" class=""> | |
| <div class=""> | |
| <h3>Persona Chatbot</h3> | |
| <div> | |
| <span>Created by <a href="https://www.linkedin.com/in/cahyawirawan/">Cahya Wirawan</a></span> | |
| </div> | |
| <div> | |
| <span>The Model is based on Huggingface's</span> | |
| <span><a href="https://medium.com/huggingface/how-to-build-a-state-of-the-art-conversational-ai-with-transfer-learning-2d818ac26313">Conversational AI with Transfer Learning</a></span> | |
| </div> | |
| <div> | |
| <span>UI Design is based on</span> | |
| <span><a href="https://codepen.io/virgilpana/pen/ZYZXgP">"A Pen by Virgin Pana"</a></span> | |
| </div> | |
| <div> | |
| <span>The personal photos were generated by </span> | |
| <span><a href="https://generated.photos/">Generated Photos</a></span> | |
| </div> | |
| <div id="about_button"> | |
| <button id="about_close">Close</button> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="server_view"> | |
| <span class="server-message-value">Server</span> | |
| </div> | |
| </div> | |
| <div id="photo-block"> | |
| <img src=""/> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> | |
| <script src="js/chatbot.js"></script> | |
| </body> |