main #11
3
.gitignore
vendored
|
@ -1,4 +1,5 @@
|
|||
venv/
|
||||
__pycache__
|
||||
__pycache__/
|
||||
.idea/
|
||||
.vscode/
|
||||
token.txt
|
||||
|
|
34
docs/class.drawio
Normal file
|
@ -0,0 +1,34 @@
|
|||
<mxfile host="Electron" agent="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/24.7.8 Chrome/128.0.6613.120 Electron/32.1.0 Safari/537.36" version="24.7.8">
|
||||
<diagram name="Page-1" id="xNVHw0Y6uJVB38V9cjl8">
|
||||
<mxGraphModel dx="1434" dy="955" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="850" pageHeight="1100" math="0" shadow="0">
|
||||
<root>
|
||||
<mxCell id="0" />
|
||||
<mxCell id="1" parent="0" />
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-1" value="simple_chat.py" style="swimlane;fontStyle=0;childLayout=stackLayout;horizontal=1;startSize=26;fillColor=none;horizontalStack=0;resizeParent=1;resizeParentMax=0;resizeLast=0;collapsible=1;marginBottom=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
|
||||
<mxGeometry x="40" y="40" width="140" height="52" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-2" value="chat(): void" style="text;strokeColor=none;fillColor=none;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;whiteSpace=wrap;html=1;" vertex="1" parent="wwk2D0dwCByFAOAYTolb-1">
|
||||
<mxGeometry y="26" width="140" height="26" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-9" value="api.py" style="swimlane;fontStyle=0;childLayout=stackLayout;horizontal=1;startSize=26;fillColor=none;horizontalStack=0;resizeParent=1;resizeParentMax=0;resizeLast=0;collapsible=1;marginBottom=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
|
||||
<mxGeometry x="200" y="40" width="260" height="104" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-11" value="process_text_transformers(): String" style="text;strokeColor=none;fillColor=none;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;whiteSpace=wrap;html=1;" vertex="1" parent="wwk2D0dwCByFAOAYTolb-9">
|
||||
<mxGeometry y="26" width="260" height="26" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-12" value="process_text_local(): String" style="text;strokeColor=none;fillColor=none;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;whiteSpace=wrap;html=1;" vertex="1" parent="wwk2D0dwCByFAOAYTolb-9">
|
||||
<mxGeometry y="52" width="260" height="26" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-10" value="send_message(self, message, model): String" style="text;strokeColor=none;fillColor=none;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;whiteSpace=wrap;html=1;" vertex="1" parent="wwk2D0dwCByFAOAYTolb-9">
|
||||
<mxGeometry y="78" width="260" height="26" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-13" value="web_flask.py" style="swimlane;fontStyle=0;childLayout=stackLayout;horizontal=1;startSize=26;fillColor=none;horizontalStack=0;resizeParent=1;resizeParentMax=0;resizeLast=0;collapsible=1;marginBottom=0;whiteSpace=wrap;html=1;" vertex="1" parent="1">
|
||||
<mxGeometry x="480" y="40" width="260" height="52" as="geometry" />
|
||||
</mxCell>
|
||||
<mxCell id="wwk2D0dwCByFAOAYTolb-14" value="index(): html" style="text;strokeColor=none;fillColor=none;align=left;verticalAlign=top;spacingLeft=4;spacingRight=4;overflow=hidden;rotatable=0;points=[[0,0.5],[1,0.5]];portConstraint=eastwest;whiteSpace=wrap;html=1;" vertex="1" parent="wwk2D0dwCByFAOAYTolb-13">
|
||||
<mxGeometry y="26" width="260" height="26" as="geometry" />
|
||||
</mxCell>
|
||||
</root>
|
||||
</mxGraphModel>
|
||||
</diagram>
|
||||
</mxfile>
|
62
py/api.py
|
@ -1,27 +1,52 @@
|
|||
import requests
|
||||
import json
|
||||
from transformers import AutoTokenizer, LlamaForCausalLM
|
||||
|
||||
from gradio_client import Client
|
||||
import os
|
||||
from mistralai import Mistral
|
||||
|
||||
class API:
|
||||
# This method processes a message via transformers. (NOT FINISHED!)
|
||||
@staticmethod
|
||||
def process_text_transformers(prompt, model):
|
||||
model = LlamaForCausalLM.from_pretrained(model)
|
||||
tokenizer = AutoTokenizer.from_pretrained(model)
|
||||
def process_text_mistralai(prompt, model, system):
|
||||
with open("token.txt", "r") as f:
|
||||
token = f.readlines()[0].strip()
|
||||
|
||||
inputs = tokenizer(prompt, return_tensors="pt")
|
||||
api_key = token
|
||||
|
||||
generate_ids = model.generate(inputs.input_ids, max_length=30)
|
||||
return tokenizer.batch_decode(generate_ids, skip_special_tokens=True, clean_up_tokenization_spaces=False)[0]
|
||||
client = Mistral(api_key=api_key)
|
||||
|
||||
chat_response = client.chat.complete(
|
||||
model=model,
|
||||
messages=[
|
||||
{
|
||||
"role": "user",
|
||||
"content": prompt,
|
||||
}, {
|
||||
"role": "system",
|
||||
"content": system,
|
||||
},
|
||||
]
|
||||
)
|
||||
return chat_response.choices[0].message.content
|
||||
@staticmethod
|
||||
def process_text_gradio(prompt, model, system):
|
||||
client = Client(model)
|
||||
result = client.predict(
|
||||
message=prompt,
|
||||
system_message=system,
|
||||
max_tokens=512,
|
||||
temperature=0.7,
|
||||
top_p=0.95,
|
||||
api_name="/chat"
|
||||
)
|
||||
return result;
|
||||
|
||||
# This method processes a message via ollama
|
||||
@staticmethod
|
||||
def process_text_local(prompt, model):
|
||||
def process_text_local(prompt, model, system):
|
||||
ollama_url = "http://localhost:11434"
|
||||
|
||||
response = requests.post(
|
||||
f"{ollama_url}/api/generate", json={"model": model, "prompt": prompt}
|
||||
f"{ollama_url}/api/generate", json={"model": model, "prompt": prompt, "system": system}
|
||||
)
|
||||
|
||||
if response.status_code == 200:
|
||||
|
@ -37,17 +62,20 @@ class API:
|
|||
return "Error: " + response.text
|
||||
|
||||
# This method sends a message to a certain AI.
|
||||
def send_message(self, message, model):
|
||||
|
||||
def send_message(self, message, model, system):
|
||||
if model == 1:
|
||||
answer = self.process_text_local(message, "phi3.5")
|
||||
answer = self.process_text_local(message, "phi3.5", system)
|
||||
elif model == 2:
|
||||
answer = self.process_text_local(message, "gemma2:2b")
|
||||
answer = self.process_text_local(message, "gemma2:9b", system)
|
||||
elif model == 3:
|
||||
answer = self.process_text_local(message, "qwen2:0.5b")
|
||||
answer = self.process_text_local(message, "codegemma:2b", system)
|
||||
elif model == 4:
|
||||
answer = self.process_text_local(message, "codegemma:2b")
|
||||
answer = self.process_text_gradio(message, "PatrickPluto/InterstellarAIChatbot", system)
|
||||
elif model == 5:
|
||||
answer = self.process_text_transformers(message, "meta-llama/Meta-Llama-3.1-8B")
|
||||
answer = self.process_text_mistralai(message, "mistral-large-latest", system)
|
||||
elif model == 6:
|
||||
answer = self.process_text_mistralai(message, "codestral-latest", system)
|
||||
else:
|
||||
return "Invalid choice"
|
||||
return answer
|
||||
|
|
17
py/install.sh
Executable file
|
@ -0,0 +1,17 @@
|
|||
#!/bin/bash
|
||||
|
||||
python3 -m venv venv
|
||||
source venv/bin/activate
|
||||
pip install flask
|
||||
pip install SpeechRecognition
|
||||
pip install pyaudio
|
||||
pip install pocketsphinx
|
||||
pip install sentencepiece
|
||||
pip install pyqt5
|
||||
pip install pyqtwebengine
|
||||
pip install gradio_client
|
||||
pip install mistralai
|
||||
|
||||
ollama pull phi3.5
|
||||
ollama pull codegemma:2b
|
||||
ollama pull gemma2:9b
|
|
@ -1,23 +0,0 @@
|
|||
from api import API
|
||||
|
||||
class CLIChat:
|
||||
@staticmethod
|
||||
def chat():
|
||||
chat1 = API()
|
||||
|
||||
while True:
|
||||
print("")
|
||||
print("Which AI Model do you want to use? Write as a Number (1-5).")
|
||||
model_input = input()
|
||||
model = int(model_input)
|
||||
if model <= 0 or model > 5:
|
||||
print("Invalid model.")
|
||||
continue
|
||||
while True:
|
||||
print("")
|
||||
print("Ask a question")
|
||||
input_text = input()
|
||||
if input_text == "change":
|
||||
break
|
||||
output_text = chat1.send_message(input_text, model)
|
||||
print(output_text)
|
BIN
py/static/img/code.jpg
Normal file
After Width: | Height: | Size: 630 KiB |
54
py/static/img/copy.svg
Normal file
|
@ -0,0 +1,54 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
|
||||
<svg
|
||||
width="800px"
|
||||
height="800px"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
version="1.1"
|
||||
id="svg2"
|
||||
sodipodi:docname="copy.svg"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs2" />
|
||||
<sodipodi:namedview
|
||||
id="namedview2"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="1.06"
|
||||
inkscape:cx="399.5283"
|
||||
inkscape:cy="400"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1052"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg2" />
|
||||
<path
|
||||
d="M20.9983 10C20.9862 7.82497 20.8897 6.64706 20.1213 5.87868C19.2426 5 17.8284 5 15 5H12C9.17157 5 7.75736 5 6.87868 5.87868C6 6.75736 6 8.17157 6 11V16C6 18.8284 6 20.2426 6.87868 21.1213C7.75736 22 9.17157 22 12 22H15C17.8284 22 19.2426 22 20.1213 21.1213C21 20.2426 21 18.8284 21 16V15"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path1" />
|
||||
<path
|
||||
d="M3 10V16C3 17.6569 4.34315 19 6 19M18 5C18 3.34315 16.6569 2 15 2H11C7.22876 2 5.34315 2 4.17157 3.17157C3.51839 3.82475 3.22937 4.69989 3.10149 6"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path2" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.20517"
|
||||
d="m 325.9434,756.9846 c -40.94408,-1.61553 -66.81951,-6.63196 -87.53977,-16.97117 -29.0707,-14.50599 -48.16863,-40.48724 -55.83188,-75.95492 l -1.61704,-7.48413 -10.05282,-2.43188 C 120.03523,641.83734 82.298838,599.18151 76.362759,547.27892 75.719882,541.65788 75.476923,501.91872 75.661307,432.54717 l 0.282089,-106.13208 2.039973,-3.77358 C 82.499435,314.28759 91.029655,309.0037 100,309.0037 c 8.97035,0 17.50056,5.28389 22.01663,13.63781 l 2.03997,3.77358 0.49744,109.90566 c 0.55003,121.52524 0.14139,113.59432 6.59309,127.95963 7.63949,17.01004 23.46255,32.3474 40.07929,38.84904 l 4.71698,1.84563 V 446.82714 c 0,-163.07681 0.13368,-169.86135 3.85035,-195.41205 8.57842,-58.97323 38.06455,-91.66608 92.72061,-102.80427 28.6239,-5.83319 59.17106,-6.85844 192.72258,-6.46839 l 106.27468,0.3104 -1.74411,-4.58957 c -0.95926,-2.52426 -3.14409,-6.89952 -4.85517,-9.72279 -12.25092,-20.21391 -31.948,-33.105312 -55.406,-36.262267 -10.41339,-1.401423 -231.8553,-0.546545 -253.84596,0.979974 -49.66727,3.447738 -75.4876,10.324113 -93.37159,24.866383 -19.04486,15.48622 -28.73291,37.66902 -33.56211,76.8474 -1.65424,13.42047 -3.58306,18.42293 -8.98524,23.30346 -4.88002,4.40882 -9.65669,6.27649 -16.13167,6.30745 -13.882245,0.0664 -24.333286,-10.39795 -24.355271,-24.38629 -0.01917,-12.19607 4.57305,-38.45152 9.528659,-54.47895 12.491462,-40.39987 38.506492,-69.644064 75.351812,-84.704995 22.24656,-9.09353 47.4039,-13.815511 89.63861,-16.824983 21.04992,-1.49993 245.2942,-2.328237 258.41395,-0.954521 44.88056,4.699266 83.60751,32.833722 101.66088,73.854869 3.77708,8.58235 8.7931,25.14667 8.7931,29.03732 0,1.32547 2.09178,2.14603 10.61321,4.16332 29.62677,7.01361 52.8805,22.33323 67.16603,44.24916 14.83233,22.7548 20.89794,48.27712 23.14126,97.37163 1.35488,29.65119 1.23541,43.56683 -0.42171,49.12123 -5.15832,17.28995 -27.26593,22.78638 -40.08605,9.96626 -6.77425,-6.77425 -7.31356,-9.39065 -7.99854,-38.80447 -1.57033,-67.43147 -7.96935,-90.3284 -29.21552,-104.5387 -11.77073,-7.87275 -28.85905,-12.1031 -58.67724,-14.52602 -21.45962,-1.74374 -252.86628,-1.74374 -274.3259,0 -29.81819,2.42292 -46.90651,6.65327 -58.67724,14.52602 -19.1261,12.79232 -26.24754,33.84573 -28.65952,84.72738 -1.26965,26.78363 -1.26965,289.25411 0,316.03774 1.76534,37.24064 6.10621,57.64972 15.13185,71.14418 13.34376,19.95057 34.61241,26.65929 91.44333,28.84375 31.19389,1.19903 204.65517,1.19903 235.84906,0 56.83092,-2.18446 78.09957,-8.89318 91.44333,-28.84375 7.74926,-11.58611 11.80045,-27.20115 14.32329,-55.20817 0.57919,-6.42991 1.3229,-38.43601 1.65266,-71.12469 l 0.59959,-59.43396 2.7465,-4.95692 c 4.54598,-8.20466 12.07227,-12.68459 21.3101,-12.68459 9.23783,0 16.76412,4.47993 21.3101,12.68459 l 2.7465,4.95692 0.2984,44.81132 c 0.59797,89.79933 -3.03423,124.63313 -16.01997,153.63611 -6.98454,15.59959 -20.8002,31.93838 -35.01035,41.40423 -23.4439,15.61674 -49.69917,21.6829 -103.04166,23.80728 -27.3035,1.08738 -216.37686,1.03277 -244.33962,-0.0706 z"
|
||||
id="path3"
|
||||
transform="scale(0.03)" />
|
||||
</svg>
|
After Width: | Height: | Size: 4.7 KiB |
BIN
py/static/img/default.jpg
Normal file
After Width: | Height: | Size: 555 KiB |
74
py/static/img/edit.svg
Normal file
|
@ -0,0 +1,74 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
|
||||
<svg
|
||||
width="800px"
|
||||
height="800px"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
version="1.1"
|
||||
id="svg5"
|
||||
sodipodi:docname="edit.svg"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs5" />
|
||||
<sodipodi:namedview
|
||||
id="namedview5"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="0.735"
|
||||
inkscape:cx="399.31973"
|
||||
inkscape:cy="400"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1032"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg5" />
|
||||
<path
|
||||
d="M10 21.9948C6.58687 21.9658 4.70529 21.7764 3.46447 20.5355C2 19.0711 2 16.714 2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C21.5093 4.43821 21.8356 5.80655 21.9449 8"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path1" />
|
||||
<path
|
||||
d="M2.5 7.25C2.08579 7.25 1.75 7.58579 1.75 8C1.75 8.41421 2.08579 8.75 2.5 8.75V7.25ZM22 7.25H2.5V8.75H22V7.25Z"
|
||||
fill="#1C274C"
|
||||
id="path2" />
|
||||
<path
|
||||
d="M10.5 2.5L7 8"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path3" />
|
||||
<path
|
||||
d="M17 2.5L13.5 8"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path4" />
|
||||
<path
|
||||
d="M18.562 13.9354L18.9791 13.5183C19.6702 12.8272 20.7906 12.8272 21.4817 13.5183C22.1728 14.2094 22.1728 15.3298 21.4817 16.0209L21.0646 16.438M18.562 13.9354C18.562 13.9354 18.6142 14.8217 19.3962 15.6038C20.1783 16.3858 21.0646 16.438 21.0646 16.438M18.562 13.9354L14.7275 17.77C14.4677 18.0297 14.3379 18.1595 14.2262 18.3027C14.0945 18.4716 13.9815 18.6544 13.8894 18.8478C13.8112 19.0117 13.7532 19.1859 13.637 19.5344L13.2651 20.65L13.1448 21.0109M21.0646 16.438L17.23 20.2725C16.9703 20.5323 16.8405 20.6621 16.6973 20.7738C16.5284 20.9055 16.3456 21.0185 16.1522 21.1106C15.9883 21.1888 15.8141 21.2468 15.4656 21.363L14.35 21.7349L13.9891 21.8552M13.9891 21.8552L13.6281 21.9755C13.4567 22.0327 13.2676 21.988 13.1398 21.8602C13.012 21.7324 12.9673 21.5433 13.0245 21.3719L13.1448 21.0109M13.9891 21.8552L13.1448 21.0109"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
id="path5" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.73807"
|
||||
d="M 261.90476,755.67082 C 210.10985,752.78165 171.55017,745.18309 142.22416,732.0866 120.84595,722.53946 94.14362,700.02781 80.704053,680.22148 59.724751,649.30359 49.769157,611.74878 44.650138,544.21769 c -2.458634,-32.43478 -2.458634,-256.0006 0,-288.43538 C 51.02757,171.65 65.443669,130.63003 100.44757,97.014752 c 35.75316,-34.334817 79.00159,-48.118218 165.53882,-52.75771 33.53754,-1.798036 234.48968,-1.798036 268.02722,0 85.46496,4.582005 129.57556,18.425776 164.38002,51.589411 35.06891,33.415607 51.18178,77.520257 56.44158,154.493687 1.62393,23.76502 -0.95676,31.79231 -12.03845,37.44576 -5.20935,2.65761 -9.18854,2.69029 -327.61789,2.69029 H 92.834371 l -0.820376,3.06122 c -1.353911,5.0521 -0.912776,199.51516 0.520823,229.59184 4.01953,84.32913 14.695852,120.91637 42.759642,146.5352 29.46178,26.89505 68.646,36.02102 164.70554,38.35982 42.20253,1.02753 43.87137,1.30882 50.61533,8.53169 3.8097,4.08024 7.21652,12.18389 7.17792,17.07381 -0.048,6.0813 -4.70929,14.67491 -10.25657,18.90913 l -5.14045,3.92369 -30.04164,0.17331 c -16.52292,0.0953 -39.22534,-0.33896 -50.44983,-0.96508 z m 5.78966,-587.98375 47.82633,-75.170063 -12.52229,-0.436666 c -17.86461,-0.62296 -62.30885,2.137832 -84.55366,5.252312 -50.79732,7.112107 -80.54912,22.771177 -99.47399,52.355517 -11.94026,18.66562 -20.520981,48.96159 -23.209131,81.94448 l -0.914811,11.22449 h 62.510622 62.51062 z m 216.06365,0.97543 c 25.96974,-40.80706 46.77952,-74.633586 46.24394,-75.170069 -1.14185,-1.14379 -63.98288,-2.664849 -118.63196,-2.87147 -32.50193,-0.122888 -38.40566,0.157137 -39.05623,1.852502 -0.42153,1.098499 -21.50235,34.618907 -46.84627,74.489797 -25.34392,39.87089 -46.52922,73.25783 -47.07848,74.1932 -0.79421,1.35255 15.29078,1.70068 78.57632,1.70068 h 79.57495 z m 221.00383,68.58694 c 0,-8.5731 -3.87287,-33.02929 -7.5147,-47.45352 -12.26093,-48.56176 -38.16264,-74.47153 -87.0494,-87.07645 -26.28049,-6.776142 -17.85809,-14.717175 -68.09375,64.20187 -23.90552,37.55503 -44.52703,70.00401 -45.82555,72.10884 l -2.36095,3.82696 H 599.33973 704.7619 Z"
|
||||
id="path6"
|
||||
transform="scale(0.03)" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.73807"
|
||||
d="m 433.19432,753.88399 c -14.34181,-6.67803 -23.63399,-20.62911 -23.656,-35.51664 -0.01,-6.7849 2.50345,-15.69096 14.88579,-52.74524 15.6357,-46.79003 19.02729,-54.61444 29.91906,-69.02347 3.67665,-4.86395 43.61679,-45.65426 88.75586,-90.64514 81.53138,-81.26372 82.14708,-81.83869 93.63566,-87.44077 22.01516,-10.73506 42.28241,-12.15716 64.43558,-4.52129 13.70925,4.72538 24.2758,11.57532 33.91302,21.98466 9.18165,9.91728 13.52604,17.29973 17.96879,30.53444 7.20539,21.46449 5.63295,41.82456 -4.89815,63.42143 -5.60208,11.48859 -6.17705,12.10428 -87.44076,93.63566 -44.99088,45.13908 -85.7812,85.07921 -90.64514,88.75587 -14.40904,10.89177 -22.23344,14.28336 -69.02347,29.91906 -50.26413,16.79664 -55.02465,17.61343 -67.85024,11.64143 z m 66.85179,-62.10082 c 13.34508,-4.51925 27.97772,-10.15321 32.51699,-12.5199 6.76438,-3.52682 18.74565,-14.73432 66.41649,-62.12719 31.9898,-31.80325 58.12735,-58.15909 58.08346,-58.56853 -0.0439,-0.40943 -4.3977,-3.49952 -9.6751,-6.86687 -10.95015,-6.98695 -27.5023,-23.85137 -34.08187,-34.72484 -2.45439,-4.05617 -4.79754,-7.39222 -5.20696,-7.41344 -0.40945,-0.0212 -26.76528,26.13488 -58.56853,58.12467 -47.39288,47.67085 -58.60037,59.65211 -62.12719,66.41649 -4.28443,8.21745 -20.73673,54.90883 -20.73673,58.85052 0,2.87414 4.03181,7.04592 6.80952,7.04592 1.26839,0 13.22485,-3.69756 26.56992,-8.21683 z M 699.89097,515.86816 c 8.47681,-10.34483 11.1339,-23.70669 7.01141,-35.25868 -8.26363,-23.15618 -37.89182,-30.1332 -56.78048,-13.37098 l -5.82586,5.17 5.25565,10.63409 c 6.95153,14.06547 19.58699,26.84752 33.34209,33.72891 5.49385,2.74847 10.47783,4.99721 11.07549,4.99721 0.59766,0 3.26242,-2.65525 5.9217,-5.90055 z"
|
||||
id="path7"
|
||||
transform="scale(0.03)" />
|
||||
</svg>
|
After Width: | Height: | Size: 6.6 KiB |
BIN
py/static/img/language.jpg
Normal file
After Width: | Height: | Size: 105 KiB |
BIN
py/static/img/logo.png
Normal file
After Width: | Height: | Size: 6.6 KiB |
BIN
py/static/img/math.jpg
Normal file
After Width: | Height: | Size: 41 KiB |
65
py/static/img/resend.svg
Normal file
|
@ -0,0 +1,65 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
|
||||
<svg
|
||||
width="800px"
|
||||
height="800px"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
version="1.1"
|
||||
id="svg2"
|
||||
sodipodi:docname="resend.svg"
|
||||
inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs2" />
|
||||
<sodipodi:namedview
|
||||
id="namedview2"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#000000"
|
||||
borderopacity="0.25"
|
||||
inkscape:showpageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:deskcolor="#d1d1d1"
|
||||
inkscape:zoom="0.735"
|
||||
inkscape:cx="399.31973"
|
||||
inkscape:cy="400"
|
||||
inkscape:window-width="1536"
|
||||
inkscape:window-height="772"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="svg2" />
|
||||
<path
|
||||
d="M13 11L22 2M22 2H16.6562M22 2V7.34375"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
id="path1" />
|
||||
<path
|
||||
d="M12 2C6.47715 2 2 6.47715 2 12C2 13.8214 2.48697 15.5291 3.33782 17M22 12C22 17.5228 17.5228 22 12 22C10.1786 22 8.47087 21.513 7 20.6622"
|
||||
stroke="#1C274C"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
id="path2" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.73807"
|
||||
d="M 103.44202,589.64273 C 95.508453,586.47648 91.516408,581.6265 82.664235,564.39958 63.365527,526.84302 51.273887,488.64178 45.284318,446.30484 42.574544,427.15094 42.237185,376.65405 44.693191,357.82313 59.558663,243.84518 124.77135,145.83823 223.39306,89.258351 273.14244,60.716831 337.3225,42.857143 390.13913,42.857143 c 17.38631,0 22.35445,1.430817 27.91536,8.039581 7.31661,8.695292 8.08101,19.795435 1.98041,28.758105 -5.71527,8.396553 -8.9254,9.769888 -25.73908,11.011455 -26.08812,1.926419 -43.28275,3.954678 -56.39117,6.651843 -92.58736,19.050583 -171.84436,79.830523 -213.96318,164.082263 -20.70548,41.41792 -30.73775,81.01988 -32.353779,127.71526 -1.880128,54.32651 8.356837,101.22956 32.820279,150.37376 11.42464,22.95079 12.21495,25.45552 10.28884,32.60855 -3.63399,13.49559 -19.32731,22.30499 -31.25479,17.54477 z"
|
||||
id="path3"
|
||||
transform="scale(0.03)" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.73807"
|
||||
d="m 357.49684,755.07905 c -35.53629,-4.30149 -74.06931,-15.27083 -107.1567,-30.50474 -24.76577,-11.4025 -33.89284,-17.19054 -37.69565,-23.90511 -9.20136,-16.24671 2.46514,-36.04335 21.24096,-36.04335 3.64307,0 10.04657,2.52631 22.02027,8.68744 47.83312,24.61281 91.01225,35.15924 144.09428,35.19481 36.69446,0.0246 62.62117,-4.09637 97.27891,-15.46209 91.45455,-29.99177 164.33574,-102.3688 195.07573,-193.72628 10.29512,-30.5965 16.43886,-65.18601 16.51877,-93.0013 0.0558,-19.40478 8.80863,-30.12795 24.5922,-30.12795 11.0187,0 19.91326,6.85803 23.22332,17.90604 2.25783,7.53597 -0.39664,44.85612 -4.94029,69.4572 C 723.038,619.00407 597.45774,736.83208 440.98231,755.136 c -20.81664,2.43505 -63.13651,2.40618 -83.48547,-0.0569 z"
|
||||
id="path4"
|
||||
transform="scale(0.03)" />
|
||||
<path
|
||||
style="fill:#ffffff;stroke-width:1.73807"
|
||||
d="m 423.65158,388.55358 c -10.521,-4.77777 -15.78557,-15.78157 -13.52209,-28.26332 0.843,-4.64863 14.586,-18.84474 132.14037,-136.49701 72.15975,-72.21983 131.19953,-131.743182 131.19953,-132.274118 0,-0.530937 -28.6707,-1.135861 -63.71267,-1.344276 l -63.71267,-0.378938 -5.1429,-3.923689 c -5.66922,-4.325233 -10.22914,-12.886641 -10.22914,-19.205562 0,-6.319327 4.56008,-14.880502 10.22978,-19.205562 l 5.14354,-3.92369 94.66441,-0.397162 c 52.06543,-0.218439 96.63618,-0.04102 99.04612,0.394273 5.85968,1.058384 12.45083,6.817534 15.50991,13.552045 2.34528,5.163142 2.4976,11.182049 2.4976,98.695739 0,104.81757 0.4376,100.18429 -10.23046,108.32121 -4.47896,3.41628 -6.31528,3.92369 -14.19958,3.92369 -7.8843,0 -9.72061,-0.50741 -14.19957,-3.92369 -10.27724,-7.83883 -10.2267,-7.46443 -10.26035,-76.00828 -0.0164,-33.4864 -0.49027,-60.88436 -1.05296,-60.88436 -0.56271,0 -59.18516,58.22526 -130.27211,129.38945 -88.78231,88.87877 -130.95292,130.18891 -134.6912,131.94291 -6.87823,3.22726 -12.11548,3.23008 -19.20556,0.0103 z"
|
||||
id="path5"
|
||||
transform="scale(0.03)" />
|
||||
</svg>
|
After Width: | Height: | Size: 4.4 KiB |
6
py/static/img/send.svg
Normal file
|
@ -0,0 +1,6 @@
|
|||
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7 12L14 12M14 12L11 15M14 12L11 9" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17 16L17 8" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path d="M22 12C22 16.714 22 19.0711 20.5355 20.5355C19.0711 22 16.714 22 12 22C7.28595 22 4.92893 22 3.46447 20.5355C2 19.0711 2 16.714 2 12C2 7.28595 2 4.92893 3.46447 3.46447C4.92893 2 7.28595 2 12 2C16.714 2 19.0711 2 20.5355 3.46447C21.5093 4.43821 21.8356 5.80655 21.9449 8" stroke="#1C274C" stroke-width="1.5" stroke-linecap="round"/>
|
||||
</svg>
|
After Width: | Height: | Size: 787 B |
|
@ -1,6 +1,5 @@
|
|||
/* Color Variables */
|
||||
:root {
|
||||
--background-color: black;
|
||||
--background-color: white;
|
||||
--text-color: white;
|
||||
--font-family: Arial, sans-serif;
|
||||
--history-background-color: rgb(0, 0, 48);
|
||||
|
@ -10,33 +9,73 @@
|
|||
--language-model-color: blue;
|
||||
--default-model-color: yellow;
|
||||
--custom-model-color: purple;
|
||||
--output-background-color: rgb(0, 0, 48);
|
||||
--user-message-color: rgb(0, 128, 255);
|
||||
--ai-message-color: rgb(100, 100, 255);
|
||||
--output-background-color: black; /* Set the conversation background to black */
|
||||
--user-message-color: rgb(0, 128, 255); /* Blueish bubble for user */
|
||||
--ai-message-color: rgb(100, 100, 255); /* Lighter blue for AI */
|
||||
--input-background-color: rgb(0, 0, 48);
|
||||
--input-button-color: rgb(0, 128, 255);
|
||||
--input-button-hover-color: rgb(0, 100, 200);
|
||||
}
|
||||
|
||||
/* Global Reset */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/* Disable Scrolling */
|
||||
|
||||
html, body {
|
||||
height: 100vh;
|
||||
overflow: hidden; /* Prevent scrolling */
|
||||
}
|
||||
|
||||
/* Body Styling */
|
||||
body {
|
||||
margin-top: 2em;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color);
|
||||
font-family: var(--font-family);
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
/* Header Styling */
|
||||
header {
|
||||
background-color: var(--background-color);
|
||||
color: black;
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 10px 20px;
|
||||
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1000;
|
||||
font-family: var(--font-family);
|
||||
}
|
||||
|
||||
header li {
|
||||
display: inline-block;
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
header img {
|
||||
height: 2em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
header a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
header a:hover {
|
||||
color: var(--input-button-color);
|
||||
}
|
||||
|
||||
/* Container Grid Layout */
|
||||
.container {
|
||||
display: grid;
|
||||
|
@ -46,6 +85,7 @@ body {
|
|||
width: 90vw;
|
||||
height: 90vh;
|
||||
}
|
||||
|
||||
/* History Section */
|
||||
.history {
|
||||
grid-column: 1;
|
||||
|
@ -54,18 +94,20 @@ body {
|
|||
background-color: var(--history-background-color);
|
||||
padding: 1em;
|
||||
overflow-y: auto;
|
||||
height: 50vh; /* Adjusted to occupy 60% of the viewport height */
|
||||
height: 50vh;
|
||||
}
|
||||
|
||||
.history ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.history ul li {
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid var(--text-color);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history ul li a{
|
||||
.history ul li a {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
|
@ -73,109 +115,183 @@ body {
|
|||
padding: 5px;
|
||||
}
|
||||
|
||||
.history ul li a:hover{
|
||||
.history ul li a:hover {
|
||||
background-color: var(--input-button-hover-color);
|
||||
}
|
||||
|
||||
/* Models Section */
|
||||
.models {
|
||||
overflow-y: auto;
|
||||
background-color: var(--models-background-color);
|
||||
border-radius: 2em;
|
||||
padding: 1em;
|
||||
height: 40vh; /* Adjusted height to occupy 40% of the viewport height */
|
||||
height: 40vh;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.models h3 {
|
||||
padding: 2px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.models .title h3 {
|
||||
padding: 2px;
|
||||
margin: 5px;
|
||||
.models .titel {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.grid{
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 1em;
|
||||
|
||||
}
|
||||
|
||||
.ai-class {
|
||||
text-align: center;
|
||||
.grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5vh;
|
||||
height: calc(100% - 2em);
|
||||
}
|
||||
|
||||
.model-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
border-radius: 5%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
height: 20vh;
|
||||
}
|
||||
.circle {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s;
|
||||
|
||||
.overlay{
|
||||
z-index: 900;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
/* Dark overlay */
|
||||
color: white;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 300%;
|
||||
transition: opacity 0.5s ease;
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
font-size:xx-large;
|
||||
}
|
||||
.circle:hover {
|
||||
transform: scale(1.1);
|
||||
|
||||
.model-box:hover .overlay{
|
||||
opacity: 1;
|
||||
}
|
||||
/* Model Colors */
|
||||
|
||||
.code-model {
|
||||
background-color: var(--code-model-color);
|
||||
background-image: url(/static/img/code.jpg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.math-model {
|
||||
background-color: var(--math-model-color);
|
||||
background-image: url(/static/img/math.jpg);
|
||||
background-color: white;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.language-model {
|
||||
background-color: var(--language-model-color);
|
||||
background-image: url(/static/img/language.jpg);
|
||||
background-color: #72cce4;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.default-model {
|
||||
background-color: var(--default-model-color);
|
||||
}
|
||||
.custom-model {
|
||||
background-color: var(--custom-model-color);
|
||||
background-image: url(/static/img/default.jpg);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
/* Output Section */
|
||||
.output {
|
||||
grid-column: 2;
|
||||
grid-row: 1 / span 2;
|
||||
border-radius: 2em;
|
||||
background-color: var(--output-background-color);
|
||||
padding: 1em;
|
||||
padding: 1.5em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
font-size: 1.2em;
|
||||
overflow-y: scroll;
|
||||
height: 80vh;
|
||||
overflow-y: auto;
|
||||
max-height: 75vh;
|
||||
margin-bottom: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
/* Conversation */
|
||||
.conversation {
|
||||
width: 100%;
|
||||
#conversation {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 10px;
|
||||
overflow-y: auto;
|
||||
max-height: 80vh;
|
||||
background-color: var(--output-background-color); /* Black background */
|
||||
border-radius: 10px;
|
||||
scroll-behavior: smooth; /* Optional: Smooth scrolling */
|
||||
}
|
||||
.md {
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
.user-message,
|
||||
.ai-message {
|
||||
margin: 10px 0;
|
||||
padding: 10px 15px;
|
||||
border-radius: 15px;
|
||||
max-width: 60%;
|
||||
width: fit-content; /* Adjusts width to fit the content */
|
||||
word-wrap: break-word;
|
||||
display: block; /* Changed from inline-block to block */
|
||||
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* Align user message to the right */
|
||||
.user-message {
|
||||
background-color: var(--user-message-color);
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
align-self: flex-end;
|
||||
text-align: right;
|
||||
color: var(--text-color);
|
||||
border-bottom-right-radius: 0;
|
||||
margin-left: auto;
|
||||
text-align: right; /* Align text to the right */
|
||||
}
|
||||
|
||||
/* Align AI message to the left */
|
||||
.ai-message {
|
||||
background-color: var(--ai-message-color);
|
||||
padding: 10px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10px;
|
||||
align-self: flex-start;
|
||||
color: var(--text-color);
|
||||
border-bottom-left-radius: 0;
|
||||
margin-right: auto;
|
||||
text-align: left; /* Align text to the left */
|
||||
}
|
||||
|
||||
|
||||
/* Output Form Buttons */
|
||||
.output form {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.output form button {
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.output form button:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.output form button img {
|
||||
height: 1.8em;
|
||||
}
|
||||
|
||||
/* Input Section */
|
||||
.input {
|
||||
grid-column: 2;
|
||||
|
@ -186,31 +302,133 @@ body {
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 10vh;
|
||||
margin-top: -7em;
|
||||
height: auto;
|
||||
margin-top: -9em;
|
||||
gap: 10px;
|
||||
height: 7em;
|
||||
}
|
||||
|
||||
.input input {
|
||||
flex-grow: 1;
|
||||
padding: 10px;
|
||||
padding: 12px;
|
||||
font-size: 1.2em;
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
border: 2px solid var(--input-button-color);
|
||||
outline: none;
|
||||
margin-right: 10px;
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
color: #333;
|
||||
transition: border-color 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.input input:focus {
|
||||
border-color: var(--input-button-hover-color);
|
||||
}
|
||||
|
||||
.input button {
|
||||
padding: 10px 20px;
|
||||
padding: 12px 20px;
|
||||
background-color: var(--input-button-color);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
font-size: 1em;
|
||||
border-radius: 50%;
|
||||
font-size: 1.5em;
|
||||
cursor: pointer;
|
||||
height: 3em;
|
||||
margin: 5px;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
transition: background-color 0.3s ease;
|
||||
position: relative;
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.input button img {
|
||||
height: 100%;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.input button:hover {
|
||||
background-color: var(--input-button-hover-color);
|
||||
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* FAQ Section */
|
||||
#faq {
|
||||
max-width: 800px;
|
||||
width: 90%;
|
||||
margin-top: 50px;
|
||||
padding: 20px;
|
||||
background-color: #222;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
#faq h2 {
|
||||
text-align: center;
|
||||
color: #00ccff;
|
||||
font-size: 2em;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.faq-item {
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
.faq-item h3 {
|
||||
color: #00ccff;
|
||||
margin-bottom: 10px;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.faq-item p {
|
||||
color: #ddd;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.faq-item:hover {
|
||||
background-color: #444;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
.grid{
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
/* Responsive Adjustments */
|
||||
@media (max-width: 768px) {
|
||||
.container {
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto;
|
||||
width: 95vw;
|
||||
}
|
||||
|
||||
.history, .models {
|
||||
display: none; /* Hide history and models */
|
||||
}
|
||||
|
||||
.output {
|
||||
grid-column: 1;
|
||||
grid-row: 1 / span 2;
|
||||
}
|
||||
|
||||
.input {
|
||||
grid-column: 1;
|
||||
grid-row: 3;
|
||||
margin-top: -4em;
|
||||
}
|
||||
|
||||
.input button {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.output form button img {
|
||||
height: 1.5em;
|
||||
}
|
||||
}
|
44
py/templates/documentation.html
Normal file
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="/static/styles.css">
|
||||
<title>AI Assistant</title>
|
||||
<script src="/static/contact-form.js" type="text/javascript" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/">
|
||||
<img src="/static/img/logo.png" alt="logo.png">
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/documentation">Documentation</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/faq">FAQ</a>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
<section id="contact">
|
||||
<h2>Contact Us</h2>
|
||||
<p>This contact form has an invalid mail until our mailserver is configured</p>
|
||||
<form id="contactForm">
|
||||
<label for="name">Name:</label>
|
||||
<input type="text" id="name" name="name" required />
|
||||
|
||||
<label for="email">Email:</label>
|
||||
<input type="email" id="email" name="email" required />
|
||||
|
||||
<label for="message">Message:</label>
|
||||
<textarea id="message" name="message" rows="5" required></textarea>
|
||||
|
||||
<button type="submit">Send Message</button>
|
||||
</form>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
58
py/templates/faq.html
Normal file
|
@ -0,0 +1,58 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="/static/styles.css">
|
||||
<title>AI Assistant - FAQ</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/">
|
||||
<img src="/static/img/logo.png" alt="logo.png">
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/documentation">Documentation</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/faq">FAQ</a>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
|
||||
<section id="faq">
|
||||
<h2>Frequently Asked Questions</h2>
|
||||
|
||||
<div class="faq-item">
|
||||
<h3>What is this AI assistant for?</h3>
|
||||
<p>This AI assistant helps you with various tasks such as answering questions, generating text, and even helping with code or writing tasks.</p>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<h3>How does the AI assistant work?</h3>
|
||||
<p>The assistant uses machine learning algorithms to understand your input and provide contextually relevant answers or generate content based on the task you've described.</p>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<h3>Can I trust the answers given by the AI assistant?</h3>
|
||||
<p>While the AI strives to give accurate and helpful answers, it is important to verify critical information, especially for complex or sensitive queries.</p>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<h3>What kind of questions can I ask?</h3>
|
||||
<p>You can ask a wide range of questions from simple factual queries to more complex requests like generating creative writing or code snippets.</p>
|
||||
</div>
|
||||
|
||||
<div class="faq-item">
|
||||
<h3>Is my data secure when using the AI assistant?</h3>
|
||||
<p>We take privacy seriously. Your data is handled according to our privacy policy, ensuring that any personal information shared is securely processed and not misused.</p>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -1,20 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="/static/styles.css">
|
||||
<title>AI Assistant</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<div class="header-menu">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/">
|
||||
<img src="/static/img/logo.png" alt="logo">
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/documentation">Documentation</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/faq">FAQ</a>
|
||||
</li>
|
||||
<li>
|
||||
<button id="toggleButton">Show Divs</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Main container for the layout -->
|
||||
<div class="container">
|
||||
|
||||
<!-- History section: A scrollable list of interactions or messages -->
|
||||
<div class="history">
|
||||
<!-- History section -->
|
||||
<div class="history hidden">
|
||||
<ul>
|
||||
<!-- Populate with history items -->
|
||||
<li><a href="#">history1</a></li>
|
||||
<li><a href="#">history2</a></li>
|
||||
<li><a href="#">history3</a></li>
|
||||
|
@ -38,39 +57,53 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Models section: Contains buttons to switch between AI models -->
|
||||
<!-- Models section -->
|
||||
<div class="models">
|
||||
<div class="titel">
|
||||
<h1>Different AI models</h1>
|
||||
</div>
|
||||
<div class="grid">
|
||||
<!-- Each AI model is represented as a colored circular button -->
|
||||
<div class="ai-class">
|
||||
<div class="code-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Code</h3>
|
||||
<div class="circle code-model"></div>
|
||||
</div>
|
||||
<div class="ai-class">
|
||||
</div>
|
||||
<div class="math-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Math</h3>
|
||||
<div class="circle math-model"></div>
|
||||
</div>
|
||||
<div class="ai-class">
|
||||
</div>
|
||||
<div class="language-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Language</h3>
|
||||
<div class="circle language-model"></div>
|
||||
</div>
|
||||
<div class="ai-class">
|
||||
</div>
|
||||
<div class="default-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Default</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="default-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Default</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="default-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Default</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="default-model model-box">
|
||||
<div class="overlay">
|
||||
<h3>Default</h3>
|
||||
<div class="circle default-model"></div>
|
||||
</div>
|
||||
<div class="ai-class">
|
||||
<h3>Custom</h3>
|
||||
<div class="circle custom-model"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Output section: Simulating a conversation with AI -->
|
||||
<!-- Output section -->
|
||||
<div class="output">
|
||||
<div class="conversation">
|
||||
<div class="conversation" id="conversation">
|
||||
{% for message in messages %}
|
||||
{% if message.startswith('User:') %}
|
||||
<div class="user-message">{{ message }}</div>
|
||||
|
@ -78,16 +111,62 @@
|
|||
<div class="ai-message">{{ message }}</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Input section: Where user input is provided -->
|
||||
<form class="input" method="POST" action="">
|
||||
<input type="text" name="user_message" placeholder="Type your message here..." />
|
||||
<button type="submit" name="option" value="voice"><img src="/static/img/microphone.svg" alt="microphone"></button>
|
||||
<button type="submit" name="option" value="chat">Send</button>
|
||||
<form method="POST" action="" id="buttonForm">
|
||||
<button type="button" name="option" value="chat">
|
||||
<img src="/static/img/resend.svg" alt="resend">
|
||||
</button>
|
||||
<button type="button" name="option" value="chat">
|
||||
<img src="/static/img/edit.svg" alt="edit">
|
||||
</button>
|
||||
<button type="button" name="option" value="answer">
|
||||
<img src="/static/img/copy.svg" alt="copy">
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
</div>
|
||||
|
||||
<!-- Input section -->
|
||||
<form class="input" method="POST" action="" id="inputForm">
|
||||
<input type="text" name="user_message" placeholder="Type your message here...">
|
||||
<button type="submit" name="option" value="chat">
|
||||
<img src="/static/img/send.svg" alt="send">
|
||||
</button>
|
||||
<button type="submit" name="option" value="voice">
|
||||
<img src="/static/img/microphone.svg" alt="microphone">
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function scrollToBottom() {
|
||||
const conversation = document.getElementById('conversation');
|
||||
conversation.scrollTop = conversation.scrollHeight;
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
scrollToBottom(); // Scroll to the bottom when the page loads
|
||||
|
||||
const conversation = document.getElementById('conversation');
|
||||
|
||||
// Listen for changes in the conversation element
|
||||
conversation.addEventListener('DOMSubtreeModified', function() {
|
||||
scrollToBottom(); // Scroll to the bottom when a new message is added
|
||||
});
|
||||
|
||||
const button = document.getElementById('toggleButton');
|
||||
|
||||
button.addEventListener('click', function() {
|
||||
const divs = document.querySelectorAll('div.hidden');
|
||||
|
||||
divs.forEach(div => {
|
||||
if (div.style.display === 'none' || div.style.display === '') {
|
||||
div.style.display = 'block'; // Show the div
|
||||
} else {
|
||||
div.style.display = 'none'; // Hide the div
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
10
py/venv.sh
|
@ -1,10 +0,0 @@
|
|||
#!/bin/bash
|
||||
|
||||
virtualenv venv
|
||||
source venv/bin/activate
|
||||
pip install transformers
|
||||
pip install torch
|
||||
pip install flask
|
||||
pip install SpeechRecognition
|
||||
pip install pyaudio
|
||||
pip install pocketsphinx
|
53
py/web_flask.py
Normal file → Executable file
|
@ -1,6 +1,14 @@
|
|||
#!venv/bin/python
|
||||
|
||||
from flask import Flask, request, render_template
|
||||
from api import API
|
||||
from voice_recognition import Voice
|
||||
import sys
|
||||
import threading
|
||||
from PyQt5.QtCore import *
|
||||
from PyQt5.QtWebEngineWidgets import *
|
||||
from PyQt5.QtWidgets import *
|
||||
|
||||
|
||||
APP = Flask(__name__)
|
||||
api = API()
|
||||
|
@ -13,6 +21,8 @@ messages = []
|
|||
@APP.route('/', methods=['GET', 'POST'])
|
||||
def index():
|
||||
global messages
|
||||
system_prompt = 'You are a helpful assistant.'
|
||||
system = 'Your system prompt is: \"'+system_prompt+'\" The following is your chat log so far: \n'
|
||||
|
||||
if request.method == 'POST':
|
||||
option = request.form['option']
|
||||
|
@ -25,11 +35,50 @@ def index():
|
|||
elif option == "chat":
|
||||
messages.append(f"User: {user_message}")
|
||||
|
||||
ai_response = "AI: " + api.send_message(user_message, 1)
|
||||
for line in messages:
|
||||
system += line + '\n'
|
||||
|
||||
system += "The chat log is now finished."
|
||||
|
||||
ai_response = "AI: " + api.send_message(user_message, 5, system)
|
||||
messages.append(ai_response)
|
||||
|
||||
return render_template('index.html', messages=messages)
|
||||
|
||||
|
||||
@APP.route('/faq')
|
||||
def faq():
|
||||
return render_template('faq.html')
|
||||
|
||||
|
||||
@APP.route('/documentation')
|
||||
def contact():
|
||||
return render_template('documentation.html')
|
||||
|
||||
|
||||
if __name__ == '__main__':
|
||||
APP.run(debug=True)
|
||||
qapp = QApplication(sys.argv)
|
||||
|
||||
view = QWebEngineView()
|
||||
|
||||
view.setGeometry(100, 100, 1280, 720)
|
||||
view.setWindowTitle("InterstellarAI")
|
||||
|
||||
view.setUrl(QUrl("http://localhost:5000"))
|
||||
|
||||
view.show()
|
||||
|
||||
def run_flask():
|
||||
APP.run()
|
||||
|
||||
def stop_flask():
|
||||
thread.join()
|
||||
qapp.quit()
|
||||
|
||||
thread = threading.Thread(target=run_flask)
|
||||
thread.daemon = True
|
||||
thread.start()
|
||||
|
||||
qapp.aboutToQuit.connect(stop_flask)
|
||||
|
||||
sys.exit(qapp.exec_())
|
||||
|
|