vbatts/llama.cpp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

examples/server/webui/src/main.js: populate textarea from query string

Browse source 
Allow pre-filling the msg-input textarea with a message supplied via
a query parameter ?m=... and auto-focus the textarea. Example:
	http://localhost:8080/?m=What%20is%20your%20name?
Alternatively, allow pre-filling the msg-input textarea via a query
parameter ?q=... and automatically start generating a response, e.g.:
	http://localhost:8080/?q=What%20is%20your%20name?

* main.js: fill inputMsg from ?q or ?m
* main.js: once the App is mounted, call sendMessage() on ?q
* main.js: once the App is mounted, focus(msg-input) on ?m

Signed-off-by: Tim Janik <timj@gnu.org>
This commit is contained in:
Tim Janik 2024-12-10 17:32:40 +01:00
parent ea489cba8c
commit 65be99eee5
1 changed files with 13 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
examples/server/webui/src/main.js
View file

@ -1,5 +1,5 @@
import './styles.scss';
import { createApp, defineComponent, shallowRef, computed, h } from 'vue/dist/vue.esm-bundler.js';
import { createApp, defineComponent, shallowRef, computed, h, nextTick } from 'vue/dist/vue.esm-bundler.js';
import MarkdownIt from 'markdown-it';
import TextLineStream from 'textlinestream';
@ -373,6 +373,10 @@ async function* sendSSEPostRequest(url, fetchOptions) {
}
};
const usp = new URLSearchParams (window.location.search);
const initial_query = usp.get ('q');
const initial_msg = initial_query || usp.get ('m') || '';
const mainApp = createApp({
components: {
VueMarkdown,
@ -385,7 +389,7 @@ const mainApp = createApp({
/** @type {Array<Message>} */
messages: [],
viewingConvId: StorageUtils.getNewConvId(),
inputMsg: '',
inputMsg: initial_msg,
isGenerating: false,
/** @type {Array<Message> | null} */
pendingMsg: null, // the on-going message from assistant
@ -660,7 +664,13 @@ const mainApp = createApp({
});
mainApp.config.errorHandler = alert;
try {
mainApp.mount('#app');
const appInstance = mainApp.mount('#app');
nextTick().then(() => {
if (initial_query)
appInstance.sendMessage();
else if (initial_msg)
setTimeout(() => document.getElementById('msg-input').focus(), 1);
});
} catch (err) {
console.error(err);
document.getElementById('app').innerHTML = `<div style="margin:2em auto">