SimpleChat: Diff user/assistant msgs, Make input wider

Also show a default message to user

Also add some metas
This commit is contained in:
HanishKVC 2024-05-17 22:12:40 +05:30
parent 7d772f6b9a
commit 9942851273
2 changed files with 20 additions and 2 deletions

View file

@ -1,10 +1,25 @@
<html> <html>
<head> <head>
<title>Simple LlamaCPP Chat</title> <title>Simple LlamaCPP Chat</title>
<meta name="message" content="Save Nature Save Earth" />
<meta name="description" content="Simple chat / test LLM web service endpoints /completions and /chat/completions" />
<meta name="author" content="by Humans for All" />
<script src="simplechat.js"></script> <script src="simplechat.js"></script>
<style>
.role-user {
background-color: lightgray;
}
#user {
width: 90vh;
}
</style>
</head> </head>
<body> <body>
<div id="chat"></div> <p> SimpleChat </p>
<hr>
<div id="chat">
<p> Enter your text to the ai assistant below</p>
</div>
<hr> <hr>
<input type="text" id="user"/> <input type="text" id="user"/>
<button id="submit">submit</button> <button id="submit">submit</button>

View file

@ -1,4 +1,6 @@
// @ts-check // @ts-check
// A simple completions and chat/completions test related web front end logic
// by Humans for All
class Roles { class Roles {
static System = "system"; static System = "system";
@ -39,6 +41,7 @@ class SimpleChat {
} }
for(const x of this.xchat) { for(const x of this.xchat) {
let entry = document.createElement("p"); let entry = document.createElement("p");
entry.className = `role-${x.role}`;
entry.innerText = `${x.role}: ${x.content}`; entry.innerText = `${x.role}: ${x.content}`;
div.appendChild(entry); div.appendChild(entry);
} }