Spaces:
Running
Running
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0 maximum-scale=1.0" /> | |
<meta name="description" content="A conversational AI system that listens, learns, and challenges" /> | |
<meta property="og:title" content="ChatGPT" /> | |
<meta property="og:image" content="https://openai.com/content/images/2022/11/ChatGPT.jpg" /> | |
<meta | |
property="og:description" | |
content="A conversational AI system that listens, learns, and challenges" /> | |
<meta property="og:url" content="https://chat.acy.dev" /> | |
<link rel="stylesheet" href="{{ url_for('bp.static', filename='css/style.css') }}" /> | |
<link | |
rel="apple-touch-icon" | |
sizes="180x180" | |
href="{{ url_for('bp.static', filename='img/apple-touch-icon.png') }}" /> | |
<link | |
rel="icon" | |
type="image/png" | |
sizes="32x32" | |
href="{{ url_for('bp.static', filename='img/favicon-32x32.png') }}" /> | |
<link | |
rel="icon" | |
type="image/png" | |
sizes="16x16" | |
href="{{ url_for('bp.static', filename='img/favicon-16x16.png') }}" /> | |
<link rel="manifest" href="{{ url_for('bp.static', filename='img/site.webmanifest') }}" /> | |
<link | |
rel="stylesheet" | |
href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@latest/build/styles/base16/dracula.min.css" /> | |
<title>Ollama WebUI</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Toggle API Key</title> | |
<style> | |
.hidden { | |
display: none; | |
} | |
.fade-in { | |
animation: fadeIn 0.5s; | |
} | |
@keyframes fadeIn { | |
from { opacity: 0; } | |
to { opacity: 1; } | |
} | |
</style> | |
</head> | |
<body data-urlprefix="{{ url_prefix}}"> | |
<div class="main-container"> | |
<div class="box sidebar"> | |
<div class="top"> | |
<button class="button" onclick="new_conversation()"> | |
<i class="fa-regular fa-plus"></i> | |
<span>{{_('New Conversation')}}</span> | |
</button> | |
<div class="spinner"></div> | |
</div> | |
<div class="sidebar-footer"> | |
<button class="button" onclick="delete_conversations()"> | |
<i class="fa-regular fa-trash"></i> | |
<span>{{_('Clear Conversations')}}</span> | |
</button> | |
<div class="api-key-container hidden" id="api-key-container"> | |
<button id="show-api-key-button" class="button"> | |
<i class="fa-regular fa-key"></i> | |
<span>{{_('API Key')}}</span> | |
</button> | |
<input type="password" id="API-key" class="hidden fade-in" /> | |
<button id="api-key-ok-button" class="button hidden fade-in">{{_('Ok')}}</button> | |
</div> | |
<div class="settings-container"> | |
<div class="checkbox field"> | |
<span>{{_('Dark Mode')}}</span> | |
<input type="checkbox" id="theme-toggler" /> | |
<label for="theme-toggler"></label> | |
</div> | |
<div class="field"> | |
<span>{{_('Language')}}</span> | |
<select | |
class="dropdown" | |
id="language" | |
onchange="changeLanguage(this.value)"></select> | |
</div> | |
</div> | |
<a | |
class="info" | |
href="https://github.com/ruslanmv/ollama-webui/" | |
target="_blank"> | |
<i class="fa-brands fa-github"></i> | |
<span class="conversation-title">ollama-webui</span> | |
</a> | |
<a class="info" href="https://discord.gg/kaNQeswa" target="_blank"> | |
<i class="fa-brands fa-discord"></i> | |
<span class="conversation-title">ruslanmv</span> | |
</a> | |
</div> | |
</div> | |
<div class="conversation"> | |
<div class="stop-generating stop-generating-hidden"> | |
<button class="button" id="cancelButton"> | |
<span>{{_('Stop Generating')}}</span> | |
</button> | |
</div> | |
<div class="box" id="messages"></div> | |
<div class="user-input"> | |
<div class="box input-box"> | |
<textarea | |
id="message-input" | |
placeholder="{{_('Ask a question')}}" | |
cols="30" | |
rows="10" | |
style="white-space: pre-wrap"></textarea> | |
<div id="send-button"> | |
<i class="fa-regular fa-paper-plane-top"></i> | |
</div> | |
</div> | |
</div> | |
<div> | |
<div class="options-container"> | |
<div class="buttons"> | |
<div class="field"> | |
<select class="dropdown" name="model" id="model"> | |
<optgroup label="Ollama"> | |
<option value="llama3">llama3</option> | |
<option value='llama3:70b'>llama3:70b </option> | |
<option value='phi3'>phi3 </option> | |
<option value='mistral'>mistral </option> | |
<option value='neural-chat'>neural-chat </option> | |
<option value='starling-lm'>starling-lm </option> | |
<option value='codellama'>codellama </option> | |
<option value='llama2-uncensored'>llama2-uncensored </option> | |
<option value='llava'>llava </option> | |
<option value='gemma:2b'> gemma:2b</option> | |
<option value='gemma:7b'>gemma:7b </option> | |
<option value='solar'>solar </option> | |
<option value='terminal'>terminal </option> | |
</optgroup> | |
<!-- | |
<optgroup label="GPT"> | |
<option value="gpt-3.5-turbo">GPT-3.5-turbo</option> | |
<option value="gpt-3.5-turbo-0301">GPT-3.5-turbo-0301</option> | |
<option value="gpt-3.5-turbo-16k">GPT-3.5-turbo-16k</option> | |
<option value="gpt-4">GPT-4</option> | |
<option value="gpt-4-0314">GPT-4-0314</option> | |
<option value="gpt-4-32k">GPT-4-32k</option> | |
</optgroup> | |
<optgroup label="OPEN LLM"> | |
<option value="oasst-sft-6-llama-30b">LLaMa-30B-sft-6</option> | |
<option value="llama-2-70b-chat">LLaMa-2-70B-chat</option> | |
<option value="falcon-180b-chat">Falcon-180b-chat</option> | |
</optgroup> | |
<optgroup label="CLAUDE"> | |
<option value="claude-instant">Claude-instant</option> | |
<option value="claude-2">Claude-2</option> | |
</optgroup> | |
<optgroup label="{{_('IMAGE')}}"> | |
<option value="" disabled>Kandinsky (soon)</option> | |
</optgroup> | |
--> | |
</select> | |
</div> | |
<div class="field"> | |
<select class="dropdown" name="jailbreak" id="jailbreak"> | |
<option value="default" selected>{{_('Default')}}</option> | |
<option value="gpt-dan-11.0">{{_('DAN')}}</option> | |
<option value="gpt-evil">{{_('Evil')}}</option> | |
</select> | |
</div> | |
</div> | |
<div class="field checkbox"> | |
<input type="checkbox" id="switch" /> | |
<label for="switch"></label> | |
<span>{{_('online')}}</span> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="menu-button"> | |
<i class="fa-solid fa-bars"></i> | |
</div> | |
<!-- scripts --> | |
<script> | |
</script> | |
<script src="{{ url_for('bp.static', filename='js/api-key.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/icons.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/chat.js') }}" defer></script> | |
<script src="https://cdn.jsdelivr.net/npm/markdown-it@latest/dist/markdown-it.min.js"></script> | |
<script src="{{ url_for('bp.static', filename='js/highlight.min.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/highlightjs-copy.min.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/theme-toggler.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/sidebar-toggler.js') }}"></script> | |
<script src="{{ url_for('bp.static', filename='js/change-language.js') }}"></script> | |
<script> | |
document.getElementById('switch').addEventListener('change', function() { | |
var apiKeyContainer = document.getElementById('api-key-container'); | |
if (this.checked) { | |
apiKeyContainer.classList.remove('hidden'); | |
} else { | |
apiKeyContainer.classList.add('hidden'); | |
} | |
}); | |
document.getElementById('show-api-key-button').addEventListener('click', function() { | |
var apiKeyInput = document.getElementById('API-key'); | |
var okButton = document.getElementById('api-key-ok-button'); | |
apiKeyInput.classList.remove('hidden'); | |
okButton.classList.remove('hidden'); | |
}); | |
</script> | |
</body> | |
</html> | |