enhanced ui

This commit is contained in:
Saifeddine ALOUI 2024-07-10 02:18:00 +02:00
parent 64e306acfe
commit a1690843ec
2 changed files with 58 additions and 19 deletions

@ -1 +1 @@
Subproject commit 488229b9128126f5f5d99d4ac301eec214fb0ff9 Subproject commit 223fbefb9cfaf683067e8f80bd9f2344bf504c35

View File

@ -1320,36 +1320,75 @@ class LOLLMSWebUI(LOLLMSElfServer):
<div class="source-item"> <div class="source-item">
<button onclick="var details = document.getElementById('source-details-{title}'); details.style.display = details.style.display === 'none' ? 'block' : 'none';" style="text-align: left; font-weight: bold;"><strong>{title}</strong></button> <button onclick="var details = document.getElementById('source-details-{title}'); details.style.display = details.style.display === 'none' ? 'block' : 'none';" style="text-align: left; font-weight: bold;"><strong>{title}</strong></button>
<div id="source-details-{title}" style="display:none;"> <div id="source-details-{title}" style="display:none;">
<div style="max-height: 200px; overflow-y: auto;">
<p><strong>Path:</strong> {path}</p> <p><strong>Path:</strong> {path}</p>
<p><strong>Content:</strong> {content}</p> <p><strong>Content:</strong> {content}</p>
<p><strong>Size:</strong> {size}</p> <p><strong>Size:</strong> {size}</p>
<p><strong>Distance:</strong> {distance}</p> <p><strong>Distance:</strong> {distance}</p>
</div> </div>
</div> </div>
</div>
''' '''
sources_text += '</div>' sources_text += '</div>'
self.personality.ui(sources_text) self.personality.ui(sources_text)
if len(context_details["skills"]) > 0:
sources_text += '<div class="text-gray-400 mr-10px">Memories:</div>'
sources_text += '<div class="mt-4 flex flex-col items-start gap-x-2 gap-y-1.5 text-sm" style="max-height: 500px; overflow-y: auto;">'
ind = 0
for skill in context_details["skills"]:
sources_text += f'''
<div class="source-item">
<button onclick="var details = document.getElementById('source-details-{ind}'); details.style.display = details.style.display === 'none' ? 'block' : 'none';" style="text-align: left; font-weight: bold;"><strong>Memory {ind}</strong></button>
<div id="source-details-{ind}" style="display:none;">
<div style="max-height: 200px; overflow-y: auto;">
<pre>{skill}</pre>
</div>
</div>
</div>
'''
ind += 1
sources_text += '</div>'
self.personality.ui(sources_text)
# Send final message # Send final message
if self.config.activate_internet_search or force_using_internet or generation_type == "full_context_with_internet": if self.config.activate_internet_search or force_using_internet or generation_type == "full_context_with_internet":
from lollms.internet import get_favicon_url, get_root_url from lollms.internet import get_favicon_url, get_root_url
sources_text += '<div class="mt-4 flex flex-wrap items-center gap-x-2 gap-y-1.5 text-sm ">' sources_text += '''
sources_text += '<div class="text-gray-400 mr-10px">Sources:</div>' <div class="mt-4 text-sm">
<div class="text-gray-500 font-semibold mb-2">Sources:</div>
<div class="flex flex-wrap items-center gap-2">
'''
for source in internet_search_infos: for source in internet_search_infos:
url = source["url"] url = source["url"]
title = source["title"] title = source["title"]
brief = source["brief"] brief = source["brief"]
favicon_url = get_favicon_url(url) favicon_url = get_favicon_url(url) or "/personalities/generic/lollms/assets/logo.png"
if favicon_url is None:
favicon_url ="/personalities/internet/loi/assets/logo.png"
root_url = get_root_url(url) root_url = get_root_url(url)
sources_text += "\n".join([
f'<a class="relative flex items-center gap-2 whitespace-nowrap rounded-lg border bg-white px-2 py-1.5 leading-none hover:border-gray-300 dark:border-gray-800 dark:bg-gray-900 dark:hover:border-gray-700" target="_blank" href="{url}" title="{brief}">', sources_text += f'''
f' <img class="h-3.5 w-3.5 rounded" src="{favicon_url}">', <a class="relative flex items-center gap-2 whitespace-nowrap rounded-lg border border-gray-200 bg-white px-3 py-2 shadow-sm transition duration-200 ease-in-out transform hover:scale-105 hover:border-gray-300 hover:shadow-md dark:border-gray-700 dark:bg-gray-800 dark:hover:border-gray-600 dark:hover:shadow-lg animate-fade-in" target="_blank" href="{url}" title="{brief}">
f' <div>{root_url}</div>', <img class="h-4 w-4 rounded-full" src="{favicon_url}" alt="{title}" onerror="this.onerror=null;this.src='/personalities/generic/lollms/assets/logo.png';">
f'</a>', <div class="text-gray-700 dark:text-gray-300">{root_url}</div>
]) </a>
sources_text += '</div>' '''
sources_text += '''
</div>
</div>
'''
# Add CSS for animations
sources_text += '''
<style>
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
animation: fadeIn 0.5s ease-in-out;
}
</style>
'''
self.personality.ui(sources_text) self.personality.ui(sources_text)
except Exception as ex: except Exception as ex:
trace_exception(ex) trace_exception(ex)