| <!DOCTYPE html> |
|
|
| <html lang="ES"> |
| <head> |
| <title> Chatbot </title> |
| <meta name="viewport" content="width=device-width, interactive-widget=resizes-content"> |
| <link rel="shortcut icon" href="static/favicon.png" type="image/png"> |
| <link rel="stylesheet" href="static/css/app.css?v={{ version }}"> |
| <link rel="stylesheet" href="static/css/tabs.css?v={{ version }}"> |
| <link rel="stylesheet" href="static/css/menu.css?v={{ version }}"> |
| |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> |
| <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism.min.css" rel="stylesheet" /> |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js" integrity="sha512-9khQRAUBYEJDCDVP2yw3LRUQvjJ0Pjx0EShmaQjcHa6AXiOv6qHQu9lCAIR8O+/D8FtaCoJ2c0Tf9Xo7hYH01Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js" integrity="sha512-SkmBfuA2hqjzEVpmnMt/LINrjop3GKWqsuLSSB3e7iBmYK7JuWw4ldmmxwD9mdm2IRTTi0OxSAfEGvgEi0i2Kw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> |
| |
| <script src="static/js/windowHandler.js?v={{ version }}"></script> |
| <script src="static/js/chatHandler.js?v={{ version }}"></script> |
| <script src="static/js/SecurityHandler.js?v={{ version }}"></script> |
| |
| |
| <script async src="https://www.googletagmanager.com/gtag/js?id=G-5TFYJMJZR4"></script> |
| <script> |
| window.dataLayer = window.dataLayer || []; |
| function gtag(){dataLayer.push(arguments);} |
| gtag('js', new Date()); |
| |
| gtag('config', 'G-5TFYJMJZR4'); |
| </script> |
|
|
| </head> |
| <body> |
|
|
| |
| <div class="wrapper"> |
|
|
| |
| <div class="tabs"> |
| <label class="tab-label-add" for="nuevoChat" > |
| + |
| <input type="button" class="tab-add" id="nuevoChat"> |
| </label> |
| </div> |
| |
|
|
| |
| <div class="chats"> |
|
|
| </div> |
| |
| </div> |
| |
|
|
| |
| <template id="template-label"> |
|
|
| |
| <label class="tab-label"> |
| <div class="tab-name">Tab </div> |
| <input type="radio" name="tabs" class="tab-switch" value=0> |
| </label> |
| |
| </template> |
| <template id="template-tab"> |
| |
| <div class="tab"> |
| <div class="chat"></div> |
| <div class='input-box' id="inputBox"> |
| <textarea class='input-text' placeholder="Escribe aquí" type="text" autofocus=""></textarea> |
| <button class='input-send' ></button> |
| <button class='input-menu' ></button> |
| <button class='input-delete' ></button> |
| </div> |
| </div> |
| |
| </template> |
| |
| <template id="template-message"> |
| <div class="message"> |
| <div> |
| <p></p> |
| </div> |
| </div> |
| </template> |
| <dialog class="inserted" id="inserted"> |
| |
| </dialog> |
|
|
| <dialog class="menu" id="menu"> |
| <form method="dialog"> |
| <div class="title"> |
| Configuración |
| </div> |
| <button class="close" value="cancel" > |
| X |
| </button> |
| <div class="item"> |
| <label for="temperature">Temperatura: |
| <span class="tooltip">Si no sabe que hace no toque</span> |
| </label> |
| <div class="range"> |
| <input id="temperature" type="range" min=0 max=1 value=0.5 step=0.05> |
| <span>0.00</span> |
| </div> |
| </div> |
| <div class="item"> |
| <label for="frequency_penalty">Frequency penalty: |
| <span class="tooltip">Si no sabe que hace no toque</span> |
| </label> |
| <div class="range"> |
| <input id="frequency_penalty" type="range" min=-1 max=1 value=0 step=0.05> |
| <span>0.00</span> |
| </div> |
| </div> |
| <div class="item"> |
| <label for="presence_penalty">Presence penalty: |
| <span class="tooltip">Si no sabe que hace no toque</span> |
| </label> |
| <div class="range"> |
| <input id="presence_penalty" type="range" min=-1 max=1 value=0 step=0.05> |
| <span>0.00</span> |
| </div> |
| </div> |
| <hr> |
| <div class="item parent"> |
| <label for="useTool">Usar herramientas: |
| <span class="tooltip">Activar o desactivar la capacidad del chatbot de usar herramientas</span> |
| </label> |
| <label class="switch"> |
| <input id="useTool" type="checkbox" checked> |
| <span class="slider"></span> |
| </label> |
| |
| </div> |
|
|
| {% for tool in tools %} |
| <div class="item useTool"> |
| <label class="indented" for="tool:{{ tool['name'] }}">{{ tool['desc'] }}:</label> |
| <label class="switch"> |
| <input id="tool:{{ tool['name'] }}" type="checkbox" checked> |
| <span class="slider"></span> |
| </label> |
| </div> |
| {% endfor %} |
| |
| <hr> |
| <div class="item"> |
| <label>Tipo Asistente: |
| <span class="tooltip">Modos predefinidos de comportamiento del bot, aplica solo a nuevos chats abiertos</span> |
| </label> |
| <div class="range"> |
| <select id="assistant" > |
| {% for asistant in asistants %} |
| <option value="{{ asistant }}">{{ asistant }}</option> |
| {% endfor %} |
| </select> |
| |
| </div> |
| |
| |
| </div> |
| <hr> |
| <div class="item"> |
| <label>Tokens usados Mes: |
| <span class="tooltip">Que tantas vacaciones le has dado a tu cerebro este mes</span> |
| </label> |
| |
| <span id="tokensUsedMonth">0</span> |
| </div> |
| <div class="item"> |
| <label>Tokens usados Total: |
| <span class="tooltip">Que tantas vacaciones le has dado a tu cerebro desde quien sabe cuando...</span> |
| </label> |
|
|
| <span id="tokensUsedTotal">0</span> |
| </div> |
| <hr> |
| <div class="saveButton"> |
| <button>Guardar</span> |
| </div> |
| </form> |
| </dialog> |
| <script> |
| |
| |
| |
| |
| |
| $(document).ready(async function() { |
| |
| var secHand = new Security() |
| await secHand.start() |
| |
| let versionLocal = localStorage.getItem("version") |
| let versionRemota = "{{ version }}" |
| |
| var cHand = new ChatGPT(secHand); |
| |
| }); |
| |
| |
| |
| </script> |
| </body> |
| </html> |
|
|
