From 59fcf9d2d3be66c5988731f8e8ffa707d01c6539 Mon Sep 17 00:00:00 2001 From: Heiner Lohaus Date: Wed, 15 May 2024 02:27:51 +0200 Subject: Update chatgpt url, uvloop support --- g4f/gui/client/index.html | 6 +--- g4f/gui/client/static/css/dracula.min.css | 7 +++++ g4f/gui/client/static/css/style.css | 3 +- g4f/gui/client/static/js/chat.v1.js | 46 +++++++++++++++++++++---------- 4 files changed, 42 insertions(+), 20 deletions(-) create mode 100644 g4f/gui/client/static/css/dracula.min.css (limited to 'g4f/gui/client') diff --git a/g4f/gui/client/index.html b/g4f/gui/client/index.html index 66bcaaab..064e4594 100644 --- a/g4f/gui/client/index.html +++ b/g4f/gui/client/index.html @@ -19,8 +19,7 @@ - + - diff --git a/g4f/gui/client/static/css/dracula.min.css b/g4f/gui/client/static/css/dracula.min.css new file mode 100644 index 00000000..729bbbfb --- /dev/null +++ b/g4f/gui/client/static/css/dracula.min.css @@ -0,0 +1,7 @@ +/*! + Theme: Dracula + Author: Mike Barkmin (http://github.com/mikebarkmin) based on Dracula Theme (http://github.com/dracula) + License: ~ MIT (or more permissive) [via base16-schemes-source] + Maintainer: @highlightjs/core-team + Version: 2021.09.0 +*/pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#e9e9f4;background:#282936}.hljs ::selection,.hljs::selection{background-color:#4d4f68;color:#e9e9f4}.hljs-comment{color:#626483}.hljs-tag{color:#62d6e8}.hljs-operator,.hljs-punctuation,.hljs-subst{color:#e9e9f4}.hljs-operator{opacity:.7}.hljs-bullet,.hljs-deletion,.hljs-name,.hljs-selector-tag,.hljs-template-variable,.hljs-variable{color:#ea51b2}.hljs-attr,.hljs-link,.hljs-literal,.hljs-number,.hljs-symbol,.hljs-variable.constant_{color:#b45bcf}.hljs-class .hljs-title,.hljs-title,.hljs-title.class_{color:#00f769}.hljs-strong{font-weight:700;color:#00f769}.hljs-addition,.hljs-code,.hljs-string,.hljs-title.class_.inherited__{color:#ebff87}.hljs-built_in,.hljs-doctag,.hljs-keyword.hljs-atrule,.hljs-quote,.hljs-regexp{color:#a1efe4}.hljs-attribute,.hljs-function .hljs-title,.hljs-section,.hljs-title.function_,.ruby .hljs-property{color:#62d6e8}.diff .hljs-meta,.hljs-keyword,.hljs-template-tag,.hljs-type{color:#b45bcf}.hljs-emphasis{color:#b45bcf;font-style:italic}.hljs-meta,.hljs-meta .hljs-keyword,.hljs-meta .hljs-string{color:#00f769}.hljs-meta .hljs-keyword,.hljs-meta-keyword{font-weight:700} \ No newline at end of file diff --git a/g4f/gui/client/static/css/style.css b/g4f/gui/client/static/css/style.css index 979f9f96..01bc17fa 100644 --- a/g4f/gui/client/static/css/style.css +++ b/g4f/gui/client/static/css/style.css @@ -381,7 +381,8 @@ body { } .message .count .fa-clipboard, -.message .count .fa-volume-high { +.message .count .fa-volume-high, +.message .count .fa-rotate { z-index: 1000; cursor: pointer; } diff --git a/g4f/gui/client/static/js/chat.v1.js b/g4f/gui/client/static/js/chat.v1.js index 23605ed4..a0178e63 100644 --- a/g4f/gui/client/static/js/chat.v1.js +++ b/g4f/gui/client/static/js/chat.v1.js @@ -109,8 +109,9 @@ const register_message_buttons = async () => { let playlist = []; function play_next() { const next = playlist.shift(); - if (next) + if (next && el.dataset.do_play) { next.play(); + } } if (el.dataset.stopped) { el.classList.remove("blink") @@ -179,6 +180,20 @@ const register_message_buttons = async () => { }); } }); + document.querySelectorAll(".message .fa-rotate").forEach(async (el) => { + if (!("click" in el.dataset)) { + el.dataset.click = "true"; + el.addEventListener("click", async () => { + const message_el = el.parentElement.parentElement.parentElement; + el.classList.add("clicked"); + setTimeout(() => el.classList.remove("clicked"), 1000); + prompt_lock = true; + await hide_message(window.conversation_id, message_el.dataset.index); + window.token = message_id(); + await ask_gpt(message_el.dataset.index); + }) + } + }); } const delete_conversations = async () => { @@ -257,9 +272,9 @@ const remove_cancel_button = async () => { }, 300); }; -const prepare_messages = (messages, filter_last_message=true) => { +const prepare_messages = (messages, message_index = -1) => { // Removes none user messages at end - if (filter_last_message) { + if (message_index == -1) { let last_message; while (last_message = messages.pop()) { if (last_message["role"] == "user") { @@ -267,14 +282,16 @@ const prepare_messages = (messages, filter_last_message=true) => { break; } } + } else if (message_index >= 0) { + messages = messages.filter((_, index) => message_index >= index); } // Remove history, if it's selected if (document.getElementById('history')?.checked) { - if (filter_last_message) { - messages = [messages.pop()]; - } else { + if (message_index == null) { messages = [messages.pop(), messages.pop()]; + } else { + messages = [messages.pop()]; } } @@ -361,11 +378,11 @@ imageInput?.addEventListener("click", (e) => { } }); -const ask_gpt = async () => { +const ask_gpt = async (message_index = -1) => { regenerate.classList.add(`regenerate-hidden`); messages = await get_messages(window.conversation_id); total_messages = messages.length; - messages = prepare_messages(messages); + messages = prepare_messages(messages, message_index); stop_generating.classList.remove(`stop_generating-hidden`); @@ -528,6 +545,7 @@ const hide_option = async (conversation_id) => { const span_el = document.createElement("span"); span_el.innerText = input_el.value; span_el.classList.add("convo-title"); + span_el.onclick = () => set_conversation(conversation_id); left_el.removeChild(input_el); left_el.appendChild(span_el); } @@ -616,7 +634,7 @@ const load_conversation = async (conversation_id, scroll=true) => { } if (window.GPTTokenizer_cl100k_base) { - const filtered = prepare_messages(messages, false); + const filtered = prepare_messages(messages, null); if (filtered.length > 0) { last_model = last_model?.startsWith("gpt-4") ? "gpt-4" : "gpt-3.5-turbo" let count_total = GPTTokenizer_cl100k_base?.encodeChat(filtered, last_model).length @@ -683,15 +701,15 @@ async function save_system_message() { await save_conversation(window.conversation_id, conversation); } } - -const hide_last_message = async (conversation_id) => { +const hide_message = async (conversation_id, message_index =- 1) => { const conversation = await get_conversation(conversation_id) - const last_message = conversation.items.pop(); + message_index = message_index == -1 ? conversation.items.length - 1 : message_index + const last_message = message_index in conversation.items ? conversation.items[message_index] : null; if (last_message !== null) { if (last_message["role"] == "assistant") { last_message["regenerate"] = true; } - conversation.items.push(last_message); + conversation.items[message_index] = last_message; } await save_conversation(conversation_id, conversation); }; @@ -790,7 +808,7 @@ document.getElementById("cancelButton").addEventListener("click", async () => { document.getElementById("regenerateButton").addEventListener("click", async () => { prompt_lock = true; - await hide_last_message(window.conversation_id); + await hide_message(window.conversation_id); window.token = message_id(); await ask_gpt(); }); -- cgit v1.2.3