mmarch/text-generation-webui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add --cai-chat option that mimics Character.AI's interface

Browse source
This commit is contained in:
oobabooga 2023-01-15 12:20:04 -03:00
parent d0af274185
commit 6136da419c
3 changed files with 136 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

104
html_generator.py
View file

@ -5,6 +5,7 @@ This is a library for formatting gpt4chan outputs as nice HTML.
'''
import re
from pathlib import Path
def process_post(post, c):
t = post.split('\n')
@ -153,3 +154,106 @@ def generate_4chan_html(f):
output = '\n'.join(output)
return output
def generate_chat_html(history, name1, name2):
css = """
.chat {
margin-left: auto;
margin-right: auto;
max-width: 800px;
height: 50vh;
overflow-y: auto;
padding-right: 20px;
display: flex;
flex-direction: column-reverse;
}
.message {
display: grid;
grid-template-columns: 50px 1fr;
padding-bottom: 20px;
font-size: 15px;
font-family: helvetica;
}
.circle-you {
width: 45px;
height: 45px;
background-color: rgb(244, 78, 59);
border-radius: 50%;
}
.circle-bot {
width: 45px;
height: 45px;
background-color: rgb(59, 78, 244);
border-radius: 50%;
}
.circle-bot img {
border-radius: 50%;
width: 100%;
height: 100%;
object-fit: cover;
}
.text {
}
.text p {
margin-top: 5px;
}
.username {
font-weight: bold;
}
.body {
}
"""
output = ''
output += f'<style>{css}</style><div class="chat" id="chat">'
if Path("profile.png").exists():
img = '<img src="file/profile.png">'
else:
img = ''
for row in history[::-1]:
p = '\n'.join([f"<p>{x}</p>" for x in row[1].split('\n')])
output += f"""
<div class="message">
<div class="circle-bot">
{img}
</div>
<div class="text">
<div class="username">
{name2}
</div>
<div class="body">
{p}
</div>
</div>
</div>
"""
p = '\n'.join([f"<p>{x}</p>" for x in row[0].split('\n')])
output += f"""
<div class="message">
<div class="circle-you">
</div>
<div class="text">
<div class="username">
{name1}
</div>
<div class="body">
{p}
</div>
</div>
</div>
"""
output += '<script>document.getElementById("chat").scrollTo(0, document.getElementById("chat").scrollHeight);</script>'
output += "</div>"
return output