This commit is contained in:
Saifeddine ALOUI 2024-07-07 19:14:18 +02:00
parent 2c39a0cfc5
commit 6900bf2a47
10 changed files with 253 additions and 223 deletions

@ -1 +1 @@
Subproject commit 328b960a0de2097e13654ac752253e9541521ddd
Subproject commit 21245434942a8342a1e27fac2474925e8afd816a

View File

@ -891,6 +891,8 @@ class LOLLMSWebUI(LOLLMSElfServer):
client.discussion.current_message.finished_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
client.discussion.current_message.nb_tokens = self.nb_received_tokens
mtdt = json.dumps(metadata, indent=4) if metadata is not None and type(metadata)== list else metadata
if self.nb_received_tokens==1:
client.discussion.current_message.started_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
@ -899,7 +901,7 @@ class LOLLMSWebUI(LOLLMSElfServer):
"sender": self.personality.name,
'id':client.discussion.current_message.id,
'content': "✍ warming up ...",
'ui': ui,
'ui': client.discussion.current_message.ui if ui is None else ui,
'discussion_id':client.discussion.discussion_id,
'message_type': MSG_TYPE.MSG_TYPE_STEP_END.value,
'created_at':client.discussion.current_message.created_at,
@ -917,7 +919,7 @@ class LOLLMSWebUI(LOLLMSElfServer):
"sender": self.personality.name,
'id':client.discussion.current_message.id,
'content': chunk,
'ui': ui,
'ui': client.discussion.current_message.ui if ui is None else ui,
'discussion_id':client.discussion.discussion_id,
'message_type': msg_type.value if msg_type is not None else MSG_TYPE.MSG_TYPE_CHUNK.value if self.nb_received_tokens>1 else MSG_TYPE.MSG_TYPE_FULL.value,
'created_at':client.discussion.current_message.created_at,

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

4
web/dist/index.html vendored
View File

@ -6,8 +6,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LoLLMS WebUI - Welcome</title>
<script type="module" crossorigin src="/assets/index-3f1ec744.js"></script>
<link rel="stylesheet" href="/assets/index-9ddd7a4e.css">
<script type="module" crossorigin src="/assets/index-332e0297.js"></script>
<link rel="stylesheet" href="/assets/index-49793894.css">
</head>
<body>
<div id="app"></div>

View File

@ -1,38 +1,43 @@
<template>
<div :id="`ui_${componentKey}`" class="w-full h-auto overflow-y-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary" v-html="evaluatedCode" :key="componentKey">
<div class="w-full h-auto overflow-y-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary"
ref="ui">
</div>
</template>
<script>
export default {
props: {
code: {
ui: {
type: String,
required: true,
default: "",
},
},
data() {
return {
evaluatedCode: '', // Store the evaluated code
componentKey: 0,
};
},
watch: {
code: {
handler(newCode) {
console.log("Code changed");
this.evaluateScriptTags(newCode);
this.componentKey++;
},
immediate: true, // Trigger the handler immediately when the component is mounted
ui(newVal, oldVal) {
console.log(`ui changed from ${oldVal} to ${newVal}`);
// Add your custom logic here
this.$nextTick(() => {
this.evaluateScriptTags();
});
},
},
data() {
return {
};
},
mounted(){
this.$nextTick(() => {
this.evaluateScriptTags();
});
},
methods: {
evaluateScriptTags(code) {
evaluateScriptTags() {
console.log("evaluateScriptTags")
// Create a temporary div element to execute scripts
const tempDiv = document.createElement('div');
tempDiv.innerHTML = code;
tempDiv.innerHTML = this.ui;
// Get all script elements within the div
const scriptElements = tempDiv.querySelectorAll('script');
@ -45,13 +50,10 @@ export default {
document.body.removeChild(newScript);
});
// Set the evaluated code to the modified HTML
this.evaluatedCode = tempDiv.innerHTML;
// Force a re-render by updating the component key
this.$nextTick(() => {
this.componentKey++;
});
// Set the evaluated ui to the modified HTML
this.$refs.ui.innerHTML = tempDiv.innerHTML;
console.log("this.$refs.ui.innerHTML")
console.log(this.$refs.ui.innerHTML)
},
},
};

View File

@ -213,8 +213,10 @@
<JsonViewer :jsonFormText="metadata.title" :jsonData="metadata.content" />
</div>
</div>
<DynamicUIRenderer class="w-full" :key="'ui-' + ui_componentKey" :code="message.ui"></DynamicUIRenderer>
<div v-if="message.ui !== null">
<DynamicUIRenderer ref="ui" class="w-full" :ui="message.ui"></DynamicUIRenderer>
</div>
<audio controls v-if="audio_url!=null" :key="audio_url">
<source :src="audio_url" type="audio/wav" ref="audio_player" >
Your browser does not support the audio element.

View File

@ -570,15 +570,11 @@ export default {
},
methods: {
extractHtml() {
console.log("Extracting html")
if (this.discussionArr.length > 0) {
const lastMessage = this.discussionArr[this.discussionArr.length - 1].content;
const startTag = '```html';
const endTag = '```';
console.log("lastMessage")
console.log(lastMessage)
let startIndex = lastMessage.indexOf(startTag);
console.log(startIndex)
if (startIndex === -1) {
this.lastMessageHtml = this.defaultMessageHtml;
this.renderIsolatedContent();
@ -587,7 +583,6 @@ export default {
startIndex += startTag.length;
let endIndex = lastMessage.indexOf(endTag, startIndex);
console.log(endIndex)
if (endIndex === -1) {
this.lastMessageHtml = lastMessage.slice(startIndex).trim();
@ -597,8 +592,6 @@ export default {
} else {
this.lastMessageHtml = this.defaultMessageHtml;
}
console.log("this.lastMessageHtml")
console.log(this.lastMessageHtml)
this.renderIsolatedContent()
},
renderIsolatedContent() {
@ -606,8 +599,6 @@ export default {
iframe.style.border = 'none';
iframe.style.width = '100%';
iframe.style.height = '100%'; // Adjust as needed
console.log("this.$refs.isolatedContent")
console.log(this.$refs.isolatedContent)
if (this.$refs.isolatedContent){
this.$refs.isolatedContent.innerHTML = '';
this.$refs.isolatedContent.appendChild(iframe);
@ -1556,8 +1547,7 @@ export default {
messageItem.metadata = msgObj.metadata
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_UI) {
console.log("UI message")
messageItem.ui = msgObj.ui
console.log(messageItem.ui)
messageItem.ui = msgObj.ui
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_EXCEPTION) {
this.$store.state.toast.showToast(msgObj.content, 5, false)
}

View File

@ -2828,7 +2828,27 @@
<i data-feather="help-circle" class="w-5 h-5 "></i>
</div>
</td>
</tr>
</tr>
<tr>
<td style="min-width: 200px;">
<label for="comfyui_model" class="text-sm font-bold" style="margin-right: 1rem;">Available models (only if local):</label>
</td>
<td>
<div class="flex flex-row">
<select
id="comfyui_model"
required
v-model="configFile.comfyui_model"
@change="settingsChanged=true"
class="w-full mt-1 px-2 py-1 border border-gray-300 rounded dark:bg-gray-600"
>
<option v-for="(comfyui_model, index) in comfyui_models" :key="comfyui_model" :value="comfyui_model">
{{ comfyui_model }}
</option>
</select>
</div>
</td>
</tr>
<tr>
<td style="min-width: 200px;">
<label for="comfyui_model" class="text-sm font-bold" style="margin-right: 1rem;">Enable comfyui model:</label>
@ -4102,6 +4122,8 @@ export default {
{ label: 'Sort by Maker', value: 3 },
{ label: 'Sort by Quantizer', value: 4 },
],
// Comfyui models
comfyui_models:[],
show_only_installed_models:false,
// Local model reference path
reference_path:"",
@ -6144,6 +6166,18 @@ export default {
console.log("Couldin't list output devices")
}
try{
console.log("Getting comfyui models")
const res = await axios.get("/list_comfyui_models")
console.log("res is ",res)
if(res.data.status){
this.comfyui_models= res.data.models
}
}
catch{
console.log("Couldin't list output devices")
}
},
activated() {

@ -1 +1 @@
Subproject commit 784d8463363a608844c28d872b0a56d3fb1743f7
Subproject commit d9a98a2b7d8fd3ce473fc5a68383eb7b13e3b598