From 926ddfd5438ca06840bdff9b9bd21ddcd8863aa9 Mon Sep 17 00:00:00 2001 From: Heiner Lohaus Date: Mon, 8 Apr 2024 07:24:00 +0200 Subject: Add WhiteRabbitNeo Provider, Many tiny improvments in the gui --- g4f/gui/client/static/js/chat.v1.js | 102 +++++++++++++++++++++++++++--------- 1 file changed, 77 insertions(+), 25 deletions(-) (limited to 'g4f/gui/client/static/js/chat.v1.js') diff --git a/g4f/gui/client/static/js/chat.v1.js b/g4f/gui/client/static/js/chat.v1.js index a3a1cccf..e0ba020f 100644 --- a/g4f/gui/client/static/js/chat.v1.js +++ b/g4f/gui/client/static/js/chat.v1.js @@ -15,13 +15,13 @@ const providerSelect = document.getElementById("provider"); const modelSelect = document.getElementById("model"); const modelProvider = document.getElementById("model2"); const systemPrompt = document.getElementById("systemPrompt") -const jailbreak = document.getElementById("jailbreak"); +const settings = document.querySelector(".settings") let prompt_lock = false; let content, content_inner, content_count = null; -const options = ["switch", "model", "model2", "jailbreak", "patch", "provider", "history"]; +const optionElements = document.querySelectorAll(".settings input, .settings textarea, #model, #model2, #provider") messageInput.addEventListener("blur", () => { window.scrollTo(0, 0); @@ -63,7 +63,7 @@ const highlight = (container) => { ); } -const register_remove_message = async () => { +const register_message_buttons = async () => { document.querySelectorAll(".message .fa-xmark").forEach(async (el) => { if (!("click" in el.dataset)) { el.dataset.click = "true"; @@ -77,6 +77,18 @@ const register_remove_message = async () => { }) } }); + document.querySelectorAll(".message .fa-clipboard").forEach(async (el) => { + if (!("click" in el.dataset)) { + el.dataset.click = "true"; + el.addEventListener("click", async () => { + const message_el = el.parentElement.parentElement; + const copyText = await get_message(window.conversation_id, message_el.dataset.index); + navigator.clipboard.writeText(copyText); + el.classList.add("clicked"); + setTimeout(() => el.classList.remove("clicked"), 1000); + }) + } + }); } const delete_conversations = async () => { @@ -132,7 +144,7 @@ const handle_ask = async () => { : '' } -
${count_words_and_tokens(message, get_selected_model())}
+
${count_words_and_tokens(message, get_selected_model())}
`; @@ -305,15 +317,22 @@ const ask_gpt = async () => { try { const input = imageInput && imageInput.files.length > 0 ? imageInput : cameraInput; const file = input && input.files.length > 0 ? input.files[0] : null; + const provider = providerSelect.options[providerSelect.selectedIndex].value; + const auto_continue = document.getElementById("auto_continue")?.checked; + if (file && !provider) + provider = "Bing"; + let api_key = null; + if (provider) + api_key = document.getElementById(`${provider}-api_key`)?.value; await api("conversation", { id: window.token, conversation_id: window.conversation_id, model: get_selected_model(), - jailbreak: jailbreak?.options[jailbreak.selectedIndex].value, web_search: document.getElementById("switch").checked, - provider: providerSelect.options[providerSelect.selectedIndex].value, - patch_provider: document.getElementById("patch")?.checked, - messages: messages + provider: provider, + messages: messages, + auto_continue: auto_continue, + api_key: api_key }, file); if (!error) { html = markdown_render(text); @@ -341,7 +360,7 @@ const ask_gpt = async () => { window.scrollTo(0, 0); message_box.scrollTop = message_box.scrollHeight; await remove_cancel_button(); - await register_remove_message(); + await register_message_buttons(); prompt_lock = false; await load_conversations(); regenerate.classList.remove("regenerate-hidden"); @@ -459,7 +478,7 @@ const load_conversation = async (conversation_id, scroll=true) => {
${provider}
${markdown_render(item.content)}
-
${count_words_and_tokens(item.content, next_provider?.model)}
+
${count_words_and_tokens(item.content, next_provider?.model)}
`; @@ -475,8 +494,9 @@ const load_conversation = async (conversation_id, scroll=true) => { } message_box.innerHTML = elements; - register_remove_message(); + register_message_buttons(); highlight(message_box); + regenerate.classList.remove("regenerate-hidden"); if (scroll) { message_box.scrollTo({ top: message_box.scrollHeight, behavior: "smooth" }); @@ -495,6 +515,7 @@ async function get_conversation(conversation_id) { } async function save_conversation(conversation_id, conversation) { + conversation.updated = Date.now(); appStorage.setItem( `conversation:${conversation_id}`, JSON.stringify(conversation) @@ -517,6 +538,7 @@ async function add_conversation(conversation_id, content) { await save_conversation(conversation_id, { id: conversation_id, title: title, + added: Date.now(), system: systemPrompt?.value, items: [], }); @@ -563,6 +585,11 @@ const remove_message = async (conversation_id, index) => { await save_conversation(conversation_id, conversation); }; +const get_message = async (conversation_id, index) => { + const conversation = await get_conversation(conversation_id); + return conversation.items[index]["content"]; +}; + const add_message = async (conversation_id, role, content, provider) => { const conversation = await get_conversation(conversation_id); conversation.items.push({ @@ -586,11 +613,17 @@ const load_conversations = async () => { await clear_conversations(); for (conversation of conversations) { + let updated = ""; + if (conversation.updated) { + const date = new Date(conversation.updated); + updated = date.toLocaleString('en-GB', {dateStyle: 'short', timeStyle: 'short', monthStyle: 'short'}); + updated = updated.replace("/" + date.getFullYear(), "") + } box_conversations.innerHTML += `
- ${conversation.title} + ${updated} ${conversation.title}
-
${count_words_and_tokens(message, get_selected_model())}
+
+ ${count_words_and_tokens(message, get_selected_model())} + + +
`; @@ -479,7 +550,11 @@ const load_conversation = async (conversation_id, scroll=true) => {
${provider}
${markdown_render(item.content)}
-
${count_words_and_tokens(item.content, next_provider?.model)}
+
+ ${count_words_and_tokens(item.content, next_provider?.model)} + + +
`; @@ -1149,10 +1224,12 @@ if (SpeechRecognition) { } let startValue; + let lastValue; let timeoutHandle; recognition.onstart = function() { microLabel.classList.add("recognition"); startValue = messageInput.value; + lastValue = ""; timeoutHandle = window.setTimeout(may_stop, 8000); }; recognition.onend = function() { @@ -1163,25 +1240,22 @@ if (SpeechRecognition) { return; } window.clearTimeout(timeoutHandle); - let notFinal = ""; - event.results.forEach((result) => { - const newText = result[0].transcript; - if (newText) { + let newText; + Array.from(event.results).forEach((result) => { + newText = result[0].transcript; + if (newText && newText != lastValue) { + messageInput.value = `${startValue ? startValue+"\n" : ""}${newText.trim()}`; if (result.isFinal) { - messageInput.value = `${startValue ? startValue+"\n" : ""}${newText.trim()}`; + lastValue = newText; startValue = messageInput.value; - notFinal = ""; messageInput.focus(); - } else { - notFinal += newText; - messageInput.value = `${startValue ? startValue+"\n" : ""}${notFinal.trim()}`; } messageInput.style.height = messageInput.scrollHeight + "px"; messageInput.scrollTop = messageInput.scrollHeight; } }); window.clearTimeout(timeoutHandle); - timeoutHandle = window.setTimeout(may_stop, notFinal ? 5000 : 8000); + timeoutHandle = window.setTimeout(may_stop, newText ? 8000 : 5000); }; microLabel.addEventListener("click", () => { @@ -1189,8 +1263,8 @@ if (SpeechRecognition) { window.clearTimeout(timeoutHandle); recognition.stop(); } else { - const lang = document.getElementById("recognition-language")?.value || navigator.language; - recognition.lang = lang; + const lang = document.getElementById("recognition-language")?.value; + recognition.lang = lang || navigator.language; recognition.start(); } }); -- cgit v1.2.3 From 90715e702bbebcf2c3cfd39628c931bbadda28b0 Mon Sep 17 00:00:00 2001 From: Heiner Lohaus Date: Tue, 9 Apr 2024 19:19:33 +0200 Subject: Add project files --- g4f/gui/client/static/js/chat.v1.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) (limited to 'g4f/gui/client/static/js/chat.v1.js') diff --git a/g4f/gui/client/static/js/chat.v1.js b/g4f/gui/client/static/js/chat.v1.js index 0aa601e8..02437bf7 100644 --- a/g4f/gui/client/static/js/chat.v1.js +++ b/g4f/gui/client/static/js/chat.v1.js @@ -95,10 +95,14 @@ const register_message_buttons = async () => { if (!("click" in el.dataset)) { el.dataset.click = "true"; el.addEventListener("click", async () => { - if ("active" in el.classList || window.doSpeech || stopped) { + if ("active" in el.classList || window.doSpeech) { stopped = true; return; } + if (stopped) { + stopped = false; + return; + } el.classList.add("blink") el.classList.add("active") const message_el = el.parentElement.parentElement.parentElement; @@ -106,7 +110,6 @@ const register_message_buttons = async () => { let speechText = await get_message(window.conversation_id, message_el.dataset.index); speechText = speechText.replaceAll(/\[(.+)\]\(.+\)/gm, "($1)"); - speechText = speechText.replaceAll(/\(http.+\)/gm, ""); speechText = speechText.replaceAll("`", "").replaceAll("#", "") speechText = speechText.replaceAll( /[\s\S]+/gm, @@ -116,6 +119,7 @@ const register_message_buttons = async () => { const lines = speechText.trim().split(/\n|\.|;/); let ended = true; window.onSpeechResponse = (url) => { + el.classList.remove("blink") if (url) { var sound = document.createElement('audio'); sound.controls = 'controls'; @@ -136,7 +140,6 @@ const register_message_buttons = async () => { content_el.appendChild(container); } if (lines.length < 1 || stopped) { - el.classList.remove("blink"); el.classList.remove("active"); return; } @@ -148,7 +151,6 @@ const register_message_buttons = async () => { } } if (!line) { - el.classList.remove("blink") el.classList.remove("active") } } -- cgit v1.2.3