From a28bab938704a15c825c1b45a8983c72e8c90ace Mon Sep 17 00:00:00 2001
From: Heiner Lohaus <hlohaus@users.noreply.github.com>
Date: Mon, 29 Jan 2024 18:14:46 +0100
Subject: Add aiohttp_socks to requirements Fix preview for uploaded and
 generated images in gui Improve typing, readme

---
 g4f/gui/client/js/chat.v1.js | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

(limited to 'g4f/gui')

diff --git a/g4f/gui/client/js/chat.v1.js b/g4f/gui/client/js/chat.v1.js
index 99a75569..86eef8c9 100644
--- a/g4f/gui/client/js/chat.v1.js
+++ b/g4f/gui/client/js/chat.v1.js
@@ -59,6 +59,10 @@ const handle_ask = async () => {
                 </div>
                 <div class="content" id="user_${token}"> 
                     ${markdown_render(message)}
+                    ${imageInput.dataset.src
+                        ? '<img src="' + imageInput.dataset.src + '" alt="Image upload">'
+                        : ''
+                    }
                 </div>
             </div>
         `;
@@ -666,6 +670,18 @@ observer.observe(message_input, { attributes: true });
 })()
 imageInput.addEventListener('click', async (event) => {
     imageInput.value = '';
+    delete imageInput.dataset.src;
+});
+imageInput.addEventListener('change', async (event) => {
+    if (imageInput.files.length) {
+        const reader = new FileReader();
+        reader.addEventListener('load', (event) => {
+            imageInput.dataset.src = event.target.result;
+        });
+        reader.readAsDataURL(imageInput.files[0]);
+    } else {
+        delete imageInput.dataset.src;
+    }
 });
 fileInput.addEventListener('click', async (event) => {
     fileInput.value = '';
-- 
cgit v1.2.3