Tobias/CreativeBots
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

ui update

Browse Source
This commit is contained in:
Tobias Weise 2024-05-26 18:20:51 +02:00
parent 7656f6aefb
commit e65253055c
2 changed files with 105 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
backend/app.py
View File

@ -79,18 +79,6 @@ def sockcon(data):
socket.emit('backend response', {'msg': f'Connected to room {room} !', "room": room}) # looks like iOS needs an answer
class StreamingCallback(BaseCallbackHandler):
def __init__(self, key: str, sid: str):
pass
def on_llm_new_token(self, token: str, **kwargs):
pass
def on_llm_end(self, response, **kwargs):
pass
@socket.on('client message')
def handle_message(message):
@ -99,12 +87,19 @@ def handle_message(message):
llm = Ollama(
model="llama3",
#callback_manager=CallbackManager([StreamingCallback(stream_key, room)]),
base_url="http://ollama:11434"
)
system_prompt = "Answer in the language of the question. Give a short answer. Answer all questions without reservations or advice."
#system_prompt = "Answer in the language of the question. Give a short answer. Answer all questions without reservations or advice."
#system_prompt = "Answer in the language of the question. Give a short answer."
#system_prompt = "Always answer in English and give a short answer."
#system_prompt = "Always answer in English and give a short answer. If the answer is a list give it only as a JSON array."
#system_prompt = "Write the answer as Prolog assertions."
#system_prompt = "Write the answer in Japanese."
#system_prompt = "Write the answer in Japanese."
system_prompt = ""
#Write the answer as JSON only.
#If the answer is a geographic position return a JSON-object with the longitude and latitude as attributes.
query = system_prompt + " " + message["data"]
@ -144,17 +139,3 @@ if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0')
#app.run(debug=True)
"""
llm = Ollama(
model="llama2",
callback_manager=CallbackManager([StreamingStdOutCallbackHandler()]),
base_url="http://ollama:11434"
)
assume = "Answer the next question with either true or false and name an example."
question = "Can cats use guns?"
print(question)
s = llm.invoke(assume + " " + question)
"""

68
backend/index.html
View File

@ -3,22 +3,51 @@
<head>
<title>Ollama Chatbot</title>
<meta charset="utf-8">
<script src="viz.js"></script>
<script src="viz_widget.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="w3.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js" integrity="sha512-q/dWJ3kcmjBLU4Qc47E4A9kTB4m3wuTY7vkFJDTZKjTs8jhyGQnaUrxa0Ytd0ssMZhbNua9hE+E7Qv1j+DyZwA==" crossorigin="anonymous"></script>
</head>
<body>
<table id="log" class="w3-table-all" style="width: 100%;">
<tr>
<th></th>
<th>Message</th>
</tr>
</table>
<textarea style="width: 100%; height: 50px;" id="user_input"></textarea>
<button id="submit_btn">Submit</button>
<div class="w3-container">
<script type="text/javascript" charset="utf-8">
window.onload = ()=>{
<div class="w3-container w3-teal">
<h1>Ollama Chatbot</h1>
</div>
<br>
<details>
<summary class="w3-button w3-round w3-teal">Settings...</summary>
<div class="w3-panel w3-pale-green">
<h2>System prompt:</h2>
<textarea class="w3-input w3-border" type="text" style="width: 98%; height: 50px;" id="system_prompt" >Write the answer as JSON only.</textarea>
</div>
</details>
<br>
<div id="scroll_div" class="w3-container" style="overflow:scroll; height: 400px;">
<table id="log" class="w3-table-all" style="width: 100%;"></table>
</div>
<textarea class="w3-input w3-border" style="height: 50px;" id="user_input"></textarea>
<button class="w3-button w3-teal" id="submit_btn">Send   ❯</button>
<br>
<div class="w3-container w3-teal">
<p>tobiasweise.dev</p>
</div>
</div>
<script type="text/javascript" charset="utf-8">
window.onload = ()=>{
let tA = document.getElementById("user_input");
let log = document.getElementById("log");
let btn = document.getElementById("submit_btn");
@ -28,6 +57,12 @@ window.onload = ()=>{
log.innerHTML += "<tr><td><b>" + nick + "</b>:</td><td>" + msg + "</td></tr>";
}
function scroll_down(){
let div = document.getElementById("scroll_div");
div.scrollTop = div.scrollHeight;
}
log_msg("Bot", "Ask a question!");
const socket = io();
@ -53,12 +88,16 @@ window.onload = ()=>{
acc_text += "" + obj.data;
first_token = false;
document.getElementById(answer_count).innerHTML += obj.data;
scroll_down();
}
else{
//log_msg("Bot", acc_text);
acc_text = "";
first_token = true;
answer_count += 1;
scroll_down();
}
});
@ -67,11 +106,14 @@ window.onload = ()=>{
if(s.trim() != '' && room){
tA.value = "";
log_msg('User', s);
socket.emit('client message', {data: s, room: room});
let tA2 = document.getElementById("system_prompt");
socket.emit('client message', {data: tA2.value + " " + s, room: room});
}
scroll_down();
};
};
</script>
};
</script>
</body>
</html>