diff options
| author | Heiner Lohaus <hlohaus@users.noreply.github.com> | 2024-03-16 10:48:37 +0100 |
|---|---|---|
| committer | Heiner Lohaus <hlohaus@users.noreply.github.com> | 2024-03-16 10:48:37 +0100 |
| commit | 905ced06bd27d4a252791c2316d0bb00b8326d35 (patch) | |
| tree | 223c46b0c1902ec73ea55d401eebbf01078c082d | |
| parent | Move raise_for_status, Create FormData wrapper (diff) | |
| download | gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar.gz gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar.bz2 gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar.lz gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar.xz gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.tar.zst gpt4free-905ced06bd27d4a252791c2316d0bb00b8326d35.zip | |
| -rw-r--r-- | g4f/gui/client/index.html (renamed from g4f/gui/client/html/index.html) | 26 | ||||
| -rw-r--r-- | g4f/gui/client/static/css/style.css (renamed from g4f/gui/client/css/style.css) | 0 | ||||
| -rw-r--r-- | g4f/gui/client/static/img/android-chrome-192x192.png (renamed from g4f/gui/client/img/android-chrome-192x192.png) | bin | 8908 -> 8908 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/android-chrome-512x512.png (renamed from g4f/gui/client/img/android-chrome-512x512.png) | bin | 17626 -> 17626 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/apple-touch-icon.png (renamed from g4f/gui/client/img/apple-touch-icon.png) | bin | 7984 -> 7984 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/favicon-16x16.png (renamed from g4f/gui/client/img/favicon-16x16.png) | bin | 499 -> 499 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/favicon-32x32.png (renamed from g4f/gui/client/img/favicon-32x32.png) | bin | 1041 -> 1041 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/gpt.png (renamed from g4f/gui/client/img/gpt.png) | bin | 2885 -> 2885 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/img/site.webmanifest (renamed from g4f/gui/client/img/site.webmanifest) | 0 | ||||
| -rw-r--r-- | g4f/gui/client/static/img/user.png (renamed from g4f/gui/client/img/user.png) | bin | 17004 -> 17004 bytes | |||
| -rw-r--r-- | g4f/gui/client/static/js/chat.v1.js (renamed from g4f/gui/client/js/chat.v1.js) | 420 | ||||
| -rw-r--r-- | g4f/gui/client/static/js/highlight.min.js (renamed from g4f/gui/client/js/highlight.min.js) | 0 | ||||
| -rw-r--r-- | g4f/gui/client/static/js/highlightjs-copy.min.js (renamed from g4f/gui/client/js/highlightjs-copy.min.js) | 0 | ||||
| -rw-r--r-- | g4f/gui/client/static/js/icons.js (renamed from g4f/gui/client/js/icons.js) | 0 | ||||
| -rw-r--r-- | g4f/gui/server/api.py | 172 | ||||
| -rw-r--r-- | g4f/gui/server/app.py | 6 | ||||
| -rw-r--r-- | g4f/gui/server/backend.py | 174 | ||||
| -rw-r--r-- | g4f/gui/server/website.py | 26 | ||||
| -rw-r--r-- | g4f/gui/webview.py | 16 |
19 files changed, 436 insertions, 404 deletions
diff --git a/g4f/gui/client/html/index.html b/g4f/gui/client/index.html index d70f87a1..9ce6b66a 100644 --- a/g4f/gui/client/html/index.html +++ b/g4f/gui/client/index.html @@ -1,5 +1,5 @@ <!DOCTYPE html> -<html lang="en"> +<html lang="en" data-framework="javascript"> <head> <meta charset="UTF-8"> @@ -10,14 +10,14 @@ <meta property="og:image" content="https://openai.com/content/images/2022/11/ChatGPT.jpg"> <meta property="og:description" content="A conversational AI system that listens, learns, and challenges"> <meta property="og:url" content="https://g4f.ai"> - <link rel="stylesheet" href="/assets/css/style.css"> - <link rel="apple-touch-icon" sizes="180x180" href="/assets/img/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon-16x16.png"> - <link rel="manifest" href="/assets/img/site.webmanifest"> - <script src="/assets/js/icons.js"></script> - <script src="/assets/js/highlightjs-copy.min.js"></script> - <script src="/assets/js/chat.v1.js" defer></script> + <link rel="stylesheet" href="/static/css/style.css"> + <link rel="apple-touch-icon" sizes="180x180" href="/static/img/apple-touch-icon.png"> + <link rel="icon" type="image/png" sizes="32x32" href="/static/img/favicon-32x32.png"> + <link rel="icon" type="image/png" sizes="16x16" href="/static/img/favicon-16x16.png"> + <link rel="manifest" href="/static/img/site.webmanifest"> + <script src="/static/js/icons.js"></script> + <script src="/static/js/highlightjs-copy.min.js"></script> + <script src="/static/js/chat.v1.js" defer></script> <script src="https://cdn.jsdelivr.net/npm/markdown-it@13.0.1/dist/markdown-it.min.js"></script> <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.7.0/build/styles/base16/dracula.min.css"> @@ -38,8 +38,8 @@ </script> <script src="https://unpkg.com/gpt-tokenizer/dist/cl100k_base.js" async></script> <script> - const user_image = '<img src="/assets/img/user.png" alt="your avatar">'; - const gpt_image = '<img src="/assets/img/gpt.png" alt="your avatar">'; + const user_image = '<img src="/static/img/user.png" alt="your avatar">'; + const gpt_image = '<img src="/static/img/gpt.png" alt="your avatar">'; </script> <style> .hljs { @@ -74,8 +74,8 @@ background: #8b3dff; } </style> - <script src="/assets/js/highlight.min.js"></script> - <script>window.conversation_id = `{{chat_id}}`</script> + <script src="/static/js/highlight.min.js"></script> + <script>window.conversation_id = "{{chat_id}}"</script> <title>g4f - gui</title> </head> diff --git a/g4f/gui/client/css/style.css b/g4f/gui/client/static/css/style.css index ba3f1187..ba3f1187 100644 --- a/g4f/gui/client/css/style.css +++ b/g4f/gui/client/static/css/style.css diff --git a/g4f/gui/client/img/android-chrome-192x192.png b/g4f/gui/client/static/img/android-chrome-192x192.png Binary files differindex 3c32aceb..3c32aceb 100644 --- a/g4f/gui/client/img/android-chrome-192x192.png +++ b/g4f/gui/client/static/img/android-chrome-192x192.png diff --git a/g4f/gui/client/img/android-chrome-512x512.png b/g4f/gui/client/static/img/android-chrome-512x512.png Binary files differindex ae601c93..ae601c93 100644 --- a/g4f/gui/client/img/android-chrome-512x512.png +++ b/g4f/gui/client/static/img/android-chrome-512x512.png diff --git a/g4f/gui/client/img/apple-touch-icon.png b/g4f/gui/client/static/img/apple-touch-icon.png Binary files differindex 1143d19a..1143d19a 100644 --- a/g4f/gui/client/img/apple-touch-icon.png +++ b/g4f/gui/client/static/img/apple-touch-icon.png diff --git a/g4f/gui/client/img/favicon-16x16.png b/g4f/gui/client/static/img/favicon-16x16.png Binary files differindex 6e934fb8..6e934fb8 100644 --- a/g4f/gui/client/img/favicon-16x16.png +++ b/g4f/gui/client/static/img/favicon-16x16.png diff --git a/g4f/gui/client/img/favicon-32x32.png b/g4f/gui/client/static/img/favicon-32x32.png Binary files differindex efc095b5..efc095b5 100644 --- a/g4f/gui/client/img/favicon-32x32.png +++ b/g4f/gui/client/static/img/favicon-32x32.png diff --git a/g4f/gui/client/img/gpt.png b/g4f/gui/client/static/img/gpt.png Binary files differindex 60e24da0..60e24da0 100644 --- a/g4f/gui/client/img/gpt.png +++ b/g4f/gui/client/static/img/gpt.png diff --git a/g4f/gui/client/img/site.webmanifest b/g4f/gui/client/static/img/site.webmanifest index f8eab4d7..f8eab4d7 100644 --- a/g4f/gui/client/img/site.webmanifest +++ b/g4f/gui/client/static/img/site.webmanifest diff --git a/g4f/gui/client/img/user.png b/g4f/gui/client/static/img/user.png Binary files differindex d1908e1d..d1908e1d 100644 --- a/g4f/gui/client/img/user.png +++ b/g4f/gui/client/static/img/user.png diff --git a/g4f/gui/client/js/chat.v1.js b/g4f/gui/client/static/js/chat.v1.js index c0d0cb6d..bfe641d5 100644 --- a/g4f/gui/client/js/chat.v1.js +++ b/g4f/gui/client/static/js/chat.v1.js @@ -1,5 +1,4 @@ const colorThemes = document.querySelectorAll('[name="theme"]'); -const markdown = window.markdownit(); const message_box = document.getElementById(`messages`); const messageInput = document.getElementById(`message-input`); const box_conversations = document.querySelector(`.top`); @@ -22,8 +21,6 @@ let prompt_lock = false; const options = ["switch", "model", "model2", "jailbreak", "patch", "provider", "history"]; -hljs.addPlugin(new CopyButtonPlugin()); - messageInput.addEventListener("blur", () => { window.scrollTo(0, 0); }); @@ -39,31 +36,29 @@ appStorage = window.localStorage || { length: 0 } +const markdown = window.markdownit(); const markdown_render = (content) => { return markdown.render(content - .replaceAll(/<!--.+-->/gm, "") + .replaceAll(/<!-- generated images start -->[\s\S]+<!-- generated images end -->/gm, "") .replaceAll(/<img data-prompt="[^>]+">/gm, "") ) .replaceAll("<a href=", '<a target="_blank" href=') .replaceAll('<code>', '<code class="language-plaintext">') } +hljs.addPlugin(new CopyButtonPlugin()); let typesetPromise = Promise.resolve(); -let timeoutHighlightId; const highlight = (container) => { - if (timeoutHighlightId) clearTimeout(timeoutHighlightId); - timeoutHighlightId = setTimeout(() => { - container.querySelectorAll('code:not(.hljs').forEach((el) => { - if (el.className != "hljs") { - hljs.highlightElement(el); - } - }); - typesetPromise = typesetPromise.then( - () => MathJax.typesetPromise([container]) - ).catch( - (err) => console.log('Typeset failed: ' + err.message) - ); - }, 100); + container.querySelectorAll('code:not(.hljs').forEach((el) => { + if (el.className != "hljs") { + hljs.highlightElement(el); + } + }); + typesetPromise = typesetPromise.then( + () => MathJax.typesetPromise([container]) + ).catch( + (err) => console.log('Typeset failed: ' + err.message) + ); } const register_remove_message = async () => { @@ -99,47 +94,48 @@ const handle_ask = async () => { window.scrollTo(0, 0); message = messageInput.value - if (message.length > 0) { - messageInput.value = ""; - prompt_lock = true; - count_input() - await add_conversation(window.conversation_id, message); - if ("text" in fileInput.dataset) { - message += '\n```' + fileInput.dataset.type + '\n'; - message += fileInput.dataset.text; - message += '\n```' - } - let message_index = await add_message(window.conversation_id, "user", message); - window.token = message_id(); - - if (imageInput.dataset.src) URL.revokeObjectURL(imageInput.dataset.src); - const input = imageInput && imageInput.files.length > 0 ? imageInput : cameraInput - if (input.files.length > 0) imageInput.dataset.src = URL.createObjectURL(input.files[0]); - else delete imageInput.dataset.src - - message_box.innerHTML += ` - <div class="message" data-index="${message_index}"> - <div class="user"> - ${user_image} - <i class="fa-solid fa-xmark"></i> - <i class="fa-regular fa-phone-arrow-up-right"></i> - </div> - <div class="content" id="user_${token}"> - <div class="content_inner"> - ${markdown_render(message)} - ${imageInput.dataset.src - ? '<img src="' + imageInput.dataset.src + '" alt="Image upload">' - : '' - } - </div> - <div class="count">${count_words_and_tokens(message, get_selected_model())}</div> + if (message.length <= 0) { + return; + } + messageInput.value = ""; + prompt_lock = true; + count_input() + await add_conversation(window.conversation_id, message); + + if ("text" in fileInput.dataset) { + message += '\n```' + fileInput.dataset.type + '\n'; + message += fileInput.dataset.text; + message += '\n```' + } + let message_index = await add_message(window.conversation_id, "user", message); + window.token = message_id(); + + if (imageInput.dataset.src) URL.revokeObjectURL(imageInput.dataset.src); + const input = imageInput && imageInput.files.length > 0 ? imageInput : cameraInput + if (input.files.length > 0) imageInput.dataset.src = URL.createObjectURL(input.files[0]); + else delete imageInput.dataset.src + + message_box.innerHTML += ` + <div class="message" data-index="${message_index}"> + <div class="user"> + ${user_image} + <i class="fa-solid fa-xmark"></i> + <i class="fa-regular fa-phone-arrow-up-right"></i> + </div> + <div class="content" id="user_${token}"> + <div class="content_inner"> + ${markdown_render(message)} + ${imageInput.dataset.src + ? '<img src="' + imageInput.dataset.src + '" alt="Image upload">' + : '' + } </div> + <div class="count">${count_words_and_tokens(message, get_selected_model())}</div> </div> - `; - await register_remove_message(); - highlight(message_box); - await ask_gpt(); - } + </div> + `; + highlight(message_box); + await ask_gpt(); }; const remove_cancel_button = async () => { @@ -151,7 +147,7 @@ const remove_cancel_button = async () => { }, 300); }; -const prepare_messages = (messages, filter_last_message = true) => { +const prepare_messages = (messages, filter_last_message=true) => { // Removes none user messages at end if (filter_last_message) { let last_message; @@ -201,17 +197,52 @@ const prepare_messages = (messages, filter_last_message = true) => { return new_messages; } +async function add_message_chunk(message) { + if (message.type == "provider") { + window.provider_result = message.provider; + window.content.querySelector('.provider').innerHTML = ` + <a href="${message.provider.url}" target="_blank"> + ${message.provider.name} + </a> + ${message.provider.model ? ' with ' + message.provider.model : ''} + ` + } else if (message.type == "message") { + console.error(messag.message) + return; + } else if (message.type == "error") { + console.error(message.error); + window.content_inner.innerHTML += `<p><strong>An error occured:</strong> ${message.error}</p>`; + } else if (message.type == "content") { + window.text += message.content; + html = markdown_render(window.text); + let lastElement, lastIndex = null; + for (element of ['</p>', '</code></pre>', '</p>\n</li>\n</ol>', '</li>\n</ol>', '</li>\n</ul>']) { + const index = html.lastIndexOf(element) + if (index - element.length > lastIndex) { + lastElement = element; + lastIndex = index; + } + } + if (lastIndex) { + html = html.substring(0, lastIndex) + '<span id="cursor"></span>' + lastElement; + } + window.content_inner.innerHTML = html; + window.content_count.innerText = count_words_and_tokens(text, window.provider_result?.model); + highlight(window.content_inner); + } + + window.scrollTo(0, 0); + if (message_box.scrollTop >= message_box.scrollHeight - message_box.clientHeight - 100) { + message_box.scrollTo({ top: message_box.scrollHeight, behavior: "auto" }); + } +} + const ask_gpt = async () => { regenerate.classList.add(`regenerate-hidden`); messages = await get_messages(window.conversation_id); total_messages = messages.length; - messages = prepare_messages(messages); - window.scrollTo(0, 0); - window.controller = new AbortController(); - window.text = ""; - stop_generating.classList.remove(`stop_generating-hidden`); message_box.scrollTop = message_box.scrollHeight; @@ -234,103 +265,31 @@ const ask_gpt = async () => { </div> </div> `; - content = document.getElementById(`gpt_${window.token}`); - content_inner = content.querySelector('.content_inner'); - content_count = content.querySelector('.count'); + + window.controller = new AbortController(); + window.text = ""; + window.error = null; + window.provider_result = null; + + window.content = document.getElementById(`gpt_${window.token}`); + window.content_inner = content.querySelector('.content_inner'); + window.content_count = content.querySelector('.count'); message_box.scrollTop = message_box.scrollHeight; window.scrollTo(0, 0); - - error = provider_result = null; try { - let body = JSON.stringify({ + const input = imageInput && imageInput.files.length > 0 ? imageInput : cameraInput; + const file = input && input.files.length > 0 ? input.files[0] : null; + 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, + web_search: document.getElementById("switch").checked, provider: providerSelect.options[providerSelect.selectedIndex].value, - patch_provider: document.getElementById('patch')?.checked, + patch_provider: document.getElementById("patch")?.checked, messages: messages - }); - const headers = { - accept: 'text/event-stream' - } - const input = imageInput && imageInput.files.length > 0 ? imageInput : cameraInput - if (input && input.files.length > 0) { - const formData = new FormData(); - formData.append('image', input.files[0]); - formData.append('json', body); - body = formData; - } else { - headers['content-type'] = 'application/json'; - } - - const response = await fetch(`/backend-api/v2/conversation`, { - method: 'POST', - signal: window.controller.signal, - headers: headers, - body: body - }); - const reader = response.body.pipeThrough(new TextDecoderStream()).getReader(); - let buffer = "" - while (true) { - const { value, done } = await reader.read(); - if (done) break; - for (const line of value.split("\n")) { - if (!line) { - continue; - } - let message; - try { - message = JSON.parse(buffer + line); - buffer = ""; - } catch { - buffer += line - continue; - } - if (message.type == "content") { - text += message.content; - } else if (message.type == "provider") { - provider_result = message.provider - content.querySelector('.provider').innerHTML = ` - <a href="${provider_result.url}" target="_blank"> - ${provider_result.name} - </a> - ${provider_result.model ? ' with ' + provider_result.model : ''} - ` - } else if (message.type == "error") { - error = message.error; - } else if (messag.type == "message") { - console.error(messag.message) - } - } - if (error) { - console.error(error); - content_inner.innerHTML += `<p><strong>An error occured:</strong> ${error}</p>`; - } else { - html = markdown_render(text); - let lastElement, lastIndex = null; - for (element of ['</p>', '</code></pre>', '</p>\n</li>\n</ol>', '</li>\n</ol>', '</li>\n</ul>']) { - const index = html.lastIndexOf(element) - if (index - element.length > lastIndex) { - lastElement = element; - lastIndex = index; - } - } - if (lastIndex) { - html = html.substring(0, lastIndex) + '<span id="cursor"></span>' + lastElement; - } - content_inner.innerHTML = html; - content_count.innerText = count_words_and_tokens(text, provider_result?.model); - highlight(content_inner); - } - - window.scrollTo(0, 0); - if (message_box.scrollTop >= message_box.scrollHeight - message_box.clientHeight - 100) { - message_box.scrollTo({ top: message_box.scrollHeight, behavior: "auto" }); - } - } + }, file); if (!error) { html = markdown_render(text); content_inner.innerHTML = html; @@ -355,7 +314,7 @@ const ask_gpt = async () => { await add_message(window.conversation_id, "assistant", text, provider_result); await load_conversation(window.conversation_id); } else { - let cursorDiv = document.getElementById(`cursor`); + let cursorDiv = document.getElementById("cursor"); if (cursorDiv) cursorDiv.parentNode.removeChild(cursorDiv); } window.scrollTo(0, 0); @@ -444,7 +403,7 @@ const new_conversation = async () => { say_hello(); }; -const load_conversation = async (conversation_id, scroll = true) => { +const load_conversation = async (conversation_id, scroll=true) => { let conversation = await get_conversation(conversation_id); let messages = conversation?.items || []; @@ -459,7 +418,6 @@ const load_conversation = async (conversation_id, scroll = true) => { last_model = item.provider?.model; let next_i = parseInt(i) + 1; let next_provider = item.provider ? item.provider : (messages.length > next_i ? messages[next_i].provider : null); - let provider_link = item.provider?.name ? `<a href="${item.provider.url}" target="_blank">${item.provider.name}</a>` : ""; let provider = provider_link ? ` <div class="provider"> @@ -496,7 +454,6 @@ const load_conversation = async (conversation_id, scroll = true) => { } message_box.innerHTML = elements; - register_remove_message(); highlight(message_box); @@ -548,7 +505,9 @@ async function add_conversation(conversation_id, content) { } async function save_system_message() { - if (!window.conversation_id) return; + if (!window.conversation_id) { + return; + } const conversation = await get_conversation(window.conversation_id); conversation.system = systemPrompt?.value; await save_conversation(window.conversation_id, conversation); @@ -585,7 +544,6 @@ const remove_message = async (conversation_id, index) => { const add_message = async (conversation_id, role, content, provider) => { const conversation = await get_conversation(conversation_id); - conversation.items.push({ role: role, content: content, @@ -667,11 +625,10 @@ sidebar_button.addEventListener("click", (event) => { sidebar.classList.add("shown"); sidebar_button.classList.add("rotated"); } - window.scrollTo(0, 0); }); -const register_settings_localstorage = async () => { +const register_settings_storage = async () => { options.forEach((id) => { element = document.getElementById(id); if (!element) { @@ -692,10 +649,10 @@ const register_settings_localstorage = async () => { }); } -const load_settings_localstorage = async () => { +const load_settings_storage = async () => { options.forEach((id) => { element = document.getElementById(id); - if (!element || !(value = appStorage.getItem(element.id))) { + if (!element || !(value = appStorage.getItem(id))) { return; } if (value) { @@ -807,9 +764,21 @@ systemPrompt.addEventListener("blur", function() { count_input(); }); -window.onload = async () => { - setTheme(); +window.addEventListener('load', async function() { + await on_load(); + if (window.conversation_id == "{{chat_id}}") { + window.conversation_id = uuid(); + } else { + await on_api(); + } +}); +window.addEventListener('pywebviewready', async function() { + await on_api(); +}); + +async function on_load() { + setTheme(); count_input(); if (/\/chat\/.+/.test(window.location.href)) { @@ -817,9 +786,10 @@ window.onload = async () => { } else { say_hello() } - load_conversations(); +} +async function on_api() { messageInput.addEventListener("keydown", async (evt) => { if (prompt_lock) return; @@ -832,58 +802,44 @@ window.onload = async () => { messageInput.style.height = messageInput.scrollHeight + "px"; } }); - sendButton.addEventListener(`click`, async () => { console.log("clicked send"); if (prompt_lock) return; await handle_ask(); }); - messageInput.focus(); - register_settings_localstorage(); -}; + register_settings_storage(); -(async () => { - response = await fetch('/backend-api/v2/models') - models = await response.json() + versions = await api('version') + document.title = 'g4f - ' + versions["version"]; + let text = "version ~ " + if (versions["version"] != versions["latest_version"]) { + let release_url = 'https://github.com/xtekky/gpt4free/releases/tag/' + versions["latest_version"]; + let title = `New version: ${versions["latest_version"]}`; + text += `<a href="${release_url}" target="_blank" title="${title}">${versions["version"]} 🆕</a>`; + } else { + text += versions["version"]; + } + document.getElementById("version_text").innerHTML = text - for (model of models) { + models = await api("models"); + models.forEach((model) => { let option = document.createElement('option'); option.value = option.text = model; modelSelect.appendChild(option); - } - - response = await fetch('/backend-api/v2/providers') - providers = await response.json() - select = document.getElementById('provider'); + }); + providers = await api('providers') providers.forEach((provider) => { let option = document.createElement('option'); option.value = option.text = provider; - select.appendChild(option); + providerSelect.appendChild(option); }) - await load_provider_models(); - - await load_settings_localstorage() -})(); - -(async () => { - response = await fetch('/backend-api/v2/version') - versions = await response.json() - - document.title = 'g4f - gui - ' + versions["version"]; - let text = "version ~ " - if (versions["version"] != versions["latest_version"]) { - let release_url = 'https://github.com/xtekky/gpt4free/releases/tag/' + versions["latest_version"]; - let title = `New version: ${versions["latest_version"]}`; - text += `<a href="${release_url}" target="_blank" title="${title}">${versions["version"]} 🆕</a>`; - } else { - text += versions["version"]; - } - document.getElementById("version_text").innerHTML = text -})() + load_provider_models(); + load_settings_storage() +} for (const el of [imageInput, cameraInput]) { el.addEventListener('click', async () => { @@ -899,6 +855,7 @@ fileInput.addEventListener('click', async (event) => { fileInput.value = ''; delete fileInput.dataset.text; }); + fileInput.addEventListener('change', async (event) => { if (fileInput.files.length) { type = fileInput.files[0].type; @@ -947,10 +904,73 @@ function get_selected_model() { } } +async function api(ressource, args=null, file=null) { + if (window?.pywebview) { + if (args) { + if (ressource == "models") { + ressource = "provider_models"; + } + return pywebview.api["get_" + ressource](args); + } + return pywebview.api["get_" + ressource](); + } + if (ressource == "models" && args) { + ressource = `${ressource}/${args}`; + } + const url = `/backend-api/v2/${ressource}`; + if (ressource == "conversation") { + const body = JSON.stringify(args); + const headers = { + accept: 'text/event-stream' + } + if (file) { + const formData = new FormData(); + formData.append('file', file); + formData.append('json', body); + body = formData; + } else { + headers['content-type'] = 'application/json'; + } + response = await fetch(url, { + method: 'POST', + signal: window.controller.signal, + headers: headers, + body: body + }); + return read_response(response); + } + response = await fetch(url); + return await response.json(); +} + +async function read_response(response) { + const reader = response.body.pipeThrough(new TextDecoderStream()).getReader(); + let buffer = "" + while (true) { + const { value, done } = await reader.read(); + if (done) { + break; + } + for (const line of value.split("\n")) { + if (!line) { + continue; + } + try { + add_message_chunk(JSON.parse(buffer + line)) + buffer = ""; + } catch { + buffer += line + } + } + } +} + async function load_provider_models() { - provider = providerSelect.options[providerSelect.selectedIndex].value; - response = await fetch('/backend-api/v2/models/' + provider); - models = await response.json(); + const provider = providerSelect.options[providerSelect.selectedIndex].value; + if (!provider) { + return; + } + const models = await api('models', provider); modelProvider.innerHTML = ''; if (models.length > 0) { modelSelect.classList.add("hidden"); diff --git a/g4f/gui/client/js/highlight.min.js b/g4f/gui/client/static/js/highlight.min.js index d410b45b..d410b45b 100644 --- a/g4f/gui/client/js/highlight.min.js +++ b/g4f/gui/client/static/js/highlight.min.js diff --git a/g4f/gui/client/js/highlightjs-copy.min.js b/g4f/gui/client/static/js/highlightjs-copy.min.js index ac11d33e..ac11d33e 100644 --- a/g4f/gui/client/js/highlightjs-copy.min.js +++ b/g4f/gui/client/static/js/highlightjs-copy.min.js diff --git a/g4f/gui/client/js/icons.js b/g4f/gui/client/static/js/icons.js index 84fed38d..84fed38d 100644 --- a/g4f/gui/client/js/icons.js +++ b/g4f/gui/client/static/js/icons.js diff --git a/g4f/gui/server/api.py b/g4f/gui/server/api.py new file mode 100644 index 00000000..df7b487d --- /dev/null +++ b/g4f/gui/server/api.py @@ -0,0 +1,172 @@ +import logging +import json +from typing import Iterator + +try: + import webview +except ImportError: + ... + +from g4f import version, models +from g4f import get_last_provider, ChatCompletion +from g4f.errors import VersionNotFoundError +from g4f.Provider import ProviderType, __providers__, __map__ +from g4f.providers.base_provider import ProviderModelMixin +from g4f.Provider.bing.create_images import patch_provider + +class Api(): + def get_models(self) -> list[str]: + """ + Return a list of all models. + + Fetches and returns a list of all available models in the system. + + Returns: + List[str]: A list of model names. + """ + return models._all_models + + def get_provider_models(self, provider: str) -> list[dict]: + if provider in __map__: + provider: ProviderType = __map__[provider] + if issubclass(provider, ProviderModelMixin): + return [{"model": model, "default": model == provider.default_model} for model in provider.get_models()] + elif provider.supports_gpt_35_turbo or provider.supports_gpt_4: + return [ + *([{"model": "gpt-4", "default": not provider.supports_gpt_4}] if provider.supports_gpt_4 else []), + *([{"model": "gpt-3.5-turbo", "default": not provider.supports_gpt_4}] if provider.supports_gpt_35_turbo else []) + ] + else: + return []; + + def get_providers(self) -> list[str]: + """ + Return a list of all working providers. + """ + return [provider.__name__ for provider in __providers__ if provider.working] + + def get_version(self): + """ + Returns the current and latest version of the application. + + Returns: + dict: A dictionary containing the current and latest version. + """ + try: + current_version = version.utils.current_version + except VersionNotFoundError: + current_version = None + return { + "version": current_version, + "latest_version": version.utils.latest_version, + } + + def generate_title(self): + """ + Generates and returns a title based on the request data. + + Returns: + dict: A dictionary with the generated title. + """ + return {'title': ''} + + def get_conversation(self, options: dict, **kwargs) -> Iterator: + window = webview.active_window() + for message in self._create_response_stream( + self._prepare_conversation_kwargs(options, kwargs) + ): + window.evaluate_js(f"this.add_message_chunk({json.dumps(message)})") + + def _prepare_conversation_kwargs(self, json_data: dict, kwargs: dict): + """ + Prepares arguments for chat completion based on the request data. + + Reads the request and prepares the necessary arguments for handling + a chat completion request. + + Returns: + dict: Arguments prepared for chat completion. + """ + provider = json_data.get('provider', None) + if "image" in kwargs and provider is None: + provider = "Bing" + if provider == 'OpenaiChat': + kwargs['auto_continue'] = True + + messages = json_data['messages'] + if json_data.get('web_search'): + if provider == "Bing": + kwargs['web_search'] = True + else: + from .internet import get_search_message + messages[-1]["content"] = get_search_message(messages[-1]["content"]) + + model = json_data.get('model') + model = model if model else models.default + patch = patch_provider if json_data.get('patch_provider') else None + + return { + "model": model, + "provider": provider, + "messages": messages, + "stream": True, + "ignore_stream": True, + "patch_provider": patch, + **kwargs + } + + def _create_response_stream(self, kwargs) -> Iterator: + """ + Creates and returns a streaming response for the conversation. + + Args: + kwargs (dict): Arguments for creating the chat completion. + + Yields: + str: JSON formatted response chunks for the stream. + + Raises: + Exception: If an error occurs during the streaming process. + """ + try: + first = True + for chunk in ChatCompletion.create(**kwargs): + if first: + first = False + yield self._format_json('provider', get_last_provider(True)) + if isinstance(chunk, Exception): + logging.exception(chunk) + yield self._format_json('message', get_error_message(chunk)) + else: + yield self._format_json('content', chunk) + except Exception as e: + logging.exception(e) + yield self._format_json('error', get_error_message(e)) + + def _format_json(self, response_type: str, content): + """ + Formats and returns a JSON response. + + Args: + response_type (str): The type of the response. + content: The content to be included in the response. + + Returns: + str: A JSON formatted string. + """ + return { + 'type': response_type, + response_type: content + } + +def get_error_message(exception: Exception) -> str: + """ + Generates a formatted error message from an exception. + + Args: + exception (Exception): The exception to format. + + Returns: + str: A formatted error message string. + """ + return f"{get_last_provider().__name__}: {type(exception).__name__}: {exception}"
\ No newline at end of file diff --git a/g4f/gui/server/app.py b/g4f/gui/server/app.py index d9e25ca1..869d3880 100644 --- a/g4f/gui/server/app.py +++ b/g4f/gui/server/app.py @@ -2,8 +2,8 @@ import sys, os from flask import Flask if getattr(sys, 'frozen', False): - template_folder = os.path.join(sys._MEIPASS, "client/html") + template_folder = os.path.join(sys._MEIPASS, "client") else: - template_folder = "./../client/html" + template_folder = "../client" -app = Flask(__name__, template_folder=template_folder)
\ No newline at end of file +app = Flask(__name__, template_folder=template_folder, static_folder=f"{template_folder}/static")
\ No newline at end of file diff --git a/g4f/gui/server/backend.py b/g4f/gui/server/backend.py index e9617c07..8d388708 100644 --- a/g4f/gui/server/backend.py +++ b/g4f/gui/server/backend.py @@ -1,16 +1,9 @@ -import logging import json from flask import request, Flask -from typing import Generator -from g4f import version, models -from g4f import get_last_provider, ChatCompletion from g4f.image import is_allowed_extension, to_image -from g4f.errors import VersionNotFoundError -from g4f.Provider import ProviderType, __providers__, __map__ -from g4f.providers.base_provider import ProviderModelMixin -from g4f.Provider.bing.create_images import patch_provider +from .api import Api -class Backend_Api: +class Backend_Api(Api): """ Handles various endpoints in a Flask application for backend operations. @@ -59,7 +52,7 @@ class Backend_Api: 'methods': ['POST'] } } - + def handle_error(self): """ Initialize the backend API with the given Flask application. @@ -69,63 +62,7 @@ class Backend_Api: """ print(request.json) return 'ok', 200 - - def get_models(self): - """ - Return a list of all models. - - Fetches and returns a list of all available models in the system. - - Returns: - List[str]: A list of model names. - """ - return models._all_models - - def get_provider_models(self, provider: str): - if provider in __map__: - provider: ProviderType = __map__[provider] - if issubclass(provider, ProviderModelMixin): - return [{"model": model, "default": model == provider.default_model} for model in provider.get_models()] - elif provider.supports_gpt_35_turbo or provider.supports_gpt_4: - return [ - *([{"model": "gpt-3.5-turbo", "default": not provider.supports_gpt_4}] if provider.supports_gpt_35_turbo else []), - *([{"model": "gpt-4", "default": not provider.supports_gpt_4}] if provider.supports_gpt_4 else []) - ] - else: - return []; - return 404, "Provider not found" - - def get_providers(self): - """ - Return a list of all working providers. - """ - return [provider.__name__ for provider in __providers__ if provider.working] - - def get_version(self): - """ - Returns the current and latest version of the application. - - Returns: - dict: A dictionary containing the current and latest version. - """ - try: - current_version = version.utils.current_version - except VersionNotFoundError: - current_version = None - return { - "version": current_version, - "latest_version": version.utils.latest_version, - } - - def generate_title(self): - """ - Generates and returns a title based on the request data. - Returns: - dict: A dictionary with the generated title. - """ - return {'title': ''} - def handle_conversation(self): """ Handles conversation requests and streams responses back. @@ -133,26 +70,10 @@ class Backend_Api: Returns: Response: A Flask response object for streaming. """ - kwargs = self._prepare_conversation_kwargs() - - return self.app.response_class( - self._create_response_stream(kwargs), - mimetype='text/event-stream' - ) - - def _prepare_conversation_kwargs(self): - """ - Prepares arguments for chat completion based on the request data. - - Reads the request and prepares the necessary arguments for handling - a chat completion request. - - Returns: - dict: Arguments prepared for chat completion. - """ + kwargs = {} - if "image" in request.files: - file = request.files['image'] + if "file" in request.files: + file = request.files['file'] if file.filename != '' and is_allowed_extension(file.filename): kwargs['image'] = to_image(file.stream, file.filename.endswith('.svg')) kwargs['image_name'] = file.filename @@ -160,66 +81,20 @@ class Backend_Api: json_data = json.loads(request.form['json']) else: json_data = request.json - - provider = json_data.get('provider', '').replace('g4f.Provider.', '') - provider = provider if provider and provider != "Auto" else None - - if "image" in kwargs and not provider: - provider = "Bing" - if provider == 'OpenaiChat': - kwargs['auto_continue'] = True - - messages = json_data['messages'] - if json_data.get('web_search'): - if provider == "Bing": - kwargs['web_search'] = True - else: - # ResourceWarning: unclosed event loop - from .internet import get_search_message - messages[-1]["content"] = get_search_message(messages[-1]["content"]) - - model = json_data.get('model') - model = model if model else models.default - patch = patch_provider if json_data.get('patch_provider') else None - - return { - "model": model, - "provider": provider, - "messages": messages, - "stream": True, - "ignore_stream": True, - "patch_provider": patch, - **kwargs - } - def _create_response_stream(self, kwargs) -> Generator[str, None, None]: - """ - Creates and returns a streaming response for the conversation. + kwargs = self._prepare_conversation_kwargs(json_data, kwargs) - Args: - kwargs (dict): Arguments for creating the chat completion. + return self.app.response_class( + self._create_response_stream(kwargs), + mimetype='text/event-stream' + ) - Yields: - str: JSON formatted response chunks for the stream. + def get_provider_models(self, provider: str): + models = super().get_provider_models(provider) + if models is None: + return 404, "Provider not found" + return models - Raises: - Exception: If an error occurs during the streaming process. - """ - try: - first = True - for chunk in ChatCompletion.create(**kwargs): - if first: - first = False - yield self._format_json('provider', get_last_provider(True)) - if isinstance(chunk, Exception): - logging.exception(chunk) - yield self._format_json('message', get_error_message(chunk)) - else: - yield self._format_json('content', str(chunk)) - except Exception as e: - logging.exception(e) - yield self._format_json('error', get_error_message(e)) - def _format_json(self, response_type: str, content) -> str: """ Formats and returns a JSON response. @@ -231,19 +106,4 @@ class Backend_Api: Returns: str: A JSON formatted string. """ - return json.dumps({ - 'type': response_type, - response_type: content - }) + "\n" - -def get_error_message(exception: Exception) -> str: - """ - Generates a formatted error message from an exception. - - Args: - exception (Exception): The exception to format. - - Returns: - str: A formatted error message string. - """ - return f"{get_last_provider().__name__}: {type(exception).__name__}: {exception}"
\ No newline at end of file + return json.dumps(super()._format_json(response_type, content)) + "\n"
\ No newline at end of file diff --git a/g4f/gui/server/website.py b/g4f/gui/server/website.py index 9aa98b76..4e611177 100644 --- a/g4f/gui/server/website.py +++ b/g4f/gui/server/website.py @@ -1,12 +1,5 @@ -from flask import render_template, send_file, redirect -from time import time -from os import urandom -import sys, os - -if getattr(sys, 'frozen', False): - assets_folder = os.path.join(sys._MEIPASS, "client") -else: - assets_folder = "./../client" +import uuid +from flask import render_template, redirect class Website: def __init__(self, app) -> None: @@ -24,23 +17,12 @@ class Website: 'function': self._chat, 'methods': ['GET', 'POST'] }, - '/assets/<folder>/<file>': { - 'function': self._assets, - 'methods': ['GET', 'POST'] - } } def _chat(self, conversation_id): if '-' not in conversation_id: return redirect('/chat') - - return render_template('index.html', chat_id = conversation_id) + return render_template('index.html', chat_id=conversation_id) def _index(self): - return render_template('index.html', chat_id = f'{urandom(4).hex()}-{urandom(2).hex()}-{urandom(2).hex()}-{urandom(2).hex()}-{hex(int(time() * 1000))[2:]}') - - def _assets(self, folder: str, file: str): - try: - return send_file(f"{assets_folder}/{folder}/{file}", as_attachment=False) - except: - return "File not found", 404
\ No newline at end of file + return render_template('index.html', chat_id=str(uuid.uuid4()))
\ No newline at end of file diff --git a/g4f/gui/webview.py b/g4f/gui/webview.py index 16f143c4..a8e745f3 100644 --- a/g4f/gui/webview.py +++ b/g4f/gui/webview.py @@ -1,34 +1,32 @@ import webview -from functools import partial try: from platformdirs import user_config_dir has_platformdirs = True except ImportError: has_platformdirs = False -from g4f.gui import run_gui from g4f.gui.run import gui_parser +from g4f.gui.server.api import Api import g4f.version import g4f.debug def run_webview( - host: str = "0.0.0.0", - port: int = 8080, debug: bool = False, storage_path: str = None ): webview.create_window( f"g4f - {g4f.version.utils.current_version}", - f"http://{host}:{port}/", - text_select=True + "client/index.html", + text_select=True, + js_api=Api(), ) if has_platformdirs and storage_path is None: storage_path = user_config_dir("g4f-webview") webview.start( - partial(run_gui, host, port), private_mode=False, storage_path=storage_path, - debug=debug + debug=debug, + ssl=True ) if __name__ == "__main__": @@ -36,4 +34,4 @@ if __name__ == "__main__": args = parser.parse_args() if args.debug: g4f.debug.logging = True - run_webview(args.host, args.port, args.debug)
\ No newline at end of file + run_webview(args.debug)
\ No newline at end of file |
