initial commit

static/v2.js

@@ -0,0 +1,132 @@
+//var stmd = require('stmd');
+
+
+const messagesContainer = document.getElementById('messages');
+const systemInput = document.getElementById('systemMessage');
+const messageInput = document.getElementById('messageInput');
+var parser = new stmd.DocParser();
+var renderer = new stmd.HtmlRenderer();
+var cur_idx = 0;
+const questions = [];
+const answers = [];
+var selected_msg = [];
+
+messageInput.addEventListener('keydown', (event) => {
+    if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+        sendMessage();
+    } else if (event.key === "Escape" && (event.metaKey || event.ctrlKey)) {
+        sendAbort();
+    }
+});
+
+function messageListener(elem, idx, type) {
+    return () => {
+        elem.classList.toggle('selected');
+        const e = { id: idx, type: type };
+        const i = selected_msg.indexOf(e);
+        if (i === -1)
+            selected_msg.push(e);
+        else selected_msg.splice(i, 1);
+    }
+}
+
+async function sendAbort() {
+    fetch('/rkllm_abort', {
+        method: 'POST',
+        body: true
+    }).catch(error => alert(error))
+}
+
+function _try_highlightAll() {
+    try {
+        hljs.highlightAll();
+    } catch { /*e*/ }
+}
+
+async function sendMessage() {
+    const messageText = messageInput.value.trim();
+    if (!messageText) return;
+    messageHTML = renderer.render(parser.parse(`**You:**\n\n${messageText}`))
+    mess = document.createElement('div');
+    mess.classList.add('message', 'clearfix');
+    mess.style.float = "right"
+    mess.innerHTML = messageHTML
+    mess.addEventListener('click', messageListener(mess, cur_idx, 'q'));
+    questions.push(messageText);
+    messagesContainer.appendChild(mess);
+    Array.from(mess.getElementsByTagName('code')).forEach(e => hljs.highlightElement(e));
+    messageInput.value = '';
+    messagesContainer.scrollTop = messagesContainer.scrollHeight; // Auto-scroll to bottom
+
+    const messagesToSend = selected_msg.sort((a,b) => {
+        const sub = a.id-b.id;
+        if (sub === 0) return b.type === 'q' ? 1 : -1;
+        return sub;
+    }).map(m => {
+        const q = m.type === 'q';
+        return {
+            role: q ? 'user' : 'assistant',
+            content: (q ? questions : answers)[m.id]
+    }});
+    messagesToSend.push({role:'user', content: messageText})
+    const sysText = systemInput.value.trim();
+
+    const withSysMsg = (sysText ? [{role: 'system', 'content': sysText}] : []).concat(messagesToSend);
+
+    const response = await fetch('/rkllm_chat', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+            model: "some model",
+            messages: withSysMsg,
+            stream: true
+        }),
+    });
+    if (!response.ok) {
+        throw new Error('Failed to connect to chat server');
+    }
+
+    const reader = response.body.getReader();
+    let decoder = new TextDecoder('utf-8');
+    //const name = (Math.random() + 1).toString(36).substring(7);
+    const message = document.createElement('div');
+    message.classList.add('message', 'clearfix');
+    message.style.float = 'left';
+    messagesContainer.appendChild(message);
+    let chunks = '';
+    function double_try() {
+        function display(n) {
+            const ccs = chunks.split(/\n/).filter(e => e !== "");
+            const json = JSON.parse(ccs[ccs.length - n]);
+            const text = `${json.choices.map((c) => c.delta.content).join('')}`;
+            while (cur_idx >= answers.length) answers.push("");
+            answers[cur_idx] = text;
+            message.innerHTML = renderer.render(parser.parse(`**RKLLM**:\n\n${text}`));
+            Array.from(message.getElementsByTagName('code')).forEach(e => hljs.highlightElement(e));
+        }
+        const at_bottom = Math.abs(messagesContainer.scrollHeight - messagesContainer.clientHeight - messagesContainer.scrollTop) <= 1;;
+        console.log(messagesContainer.scrollHeight, messagesContainer.scrollTop, messagesContainer.clientHeight);
+        try {
+            display(1);
+        } catch {
+            try {
+                display(2);
+            } catch (e) { console.error(e, chunks); }
+        } finally {
+            if (at_bottom) messagesContainer.scrollTop = messagesContainer.scrollHeight;
+        }
+    }
+    while (true) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        const chunk = decoder.decode(value, { stream: true });
+        chunks += chunk.replace('\r', '');
+        double_try();
+    }
+    double_try();
+
+    message.addEventListener('click', messageListener(message, cur_idx++, 'a'));
+
+}