add web demo

README.md

@@ -1,13 +1,12 @@
 ---
-title: Visualglm 6b
-emoji: 🦀
-colorFrom: indigo
-colorTo: red
+title: Visualglm-6b
+emoji: 💻
+colorFrom: purple
+colorTo: pink
 sdk: gradio
-sdk_version: 3.29.0
+sdk_version: 3.27.0
 app_file: app.py
 pinned: false
-license: mit
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -0,0 +1,166 @@
+#!/usr/bin/env python
+
+import gradio as gr
+import os
+import re
+from PIL import Image
+import base64
+import time
+
+DESCRIPTION = '''# <a href="https://github.com/THUDM/VisualGLM">VisualGLM</a>'''
+
+MAINTENANCE_NOTICE='Hint 1: If the app report "Something went wrong, connection error out", please turn off your proxy and retry.\nHint 2: If you upload a large size of image like 10MB, it may take some time to upload and process. Please be patient and wait.'
+
+NOTES = 'This app is adapted from <a href="https://github.com/THUDM/VisualGLM">https://github.com/THUDM/VisualGLM</a>. It would be recommended to check out the repo if you want to see the detail of our model and training process.'
+
+import json
+import requests
+import base64
+
+
+URL = os.environ.get("URL")
+
+def process_image(image_prompt):
+    image = Image.open(image_prompt)
+    print(f"height:{image.height}, width:{image.width}")
+    resized_image = image.resize((224, 224), )
+    timestamp = int(time.time())
+    file_ext = os.path.splitext(image_prompt)[1]
+    filename = f"examples/{timestamp}{file_ext}"
+    resized_image.save(filename)
+    print(f"temporal filename {filename}")
+    with open(filename, "rb") as image_file:
+        encoded_img = str(base64.b64encode(image_file.read()), encoding='utf-8')
+        os.remove(filename)
+        return encoded_img
+
+
+def is_chinese(text):
+    zh_pattern = re.compile(u'[\u4e00-\u9fa5]+')
+    return zh_pattern.search(text)
+
+
+def post(
+        input_text,
+        temperature,
+        top_p,
+        image_prompt,
+        result_previous        
+        ):
+    result_text = [(ele[0], ele[1]) for ele in result_previous]
+    for i in range(len(result_text)-1, -1, -1):
+        if result_text[i][0] == "":
+            del result_text[i]
+    print(f"history {result_text}")
+
+    is_zh = is_chinese(input_text)
+
+    if image_prompt is None:
+        print("Image empty")
+        if is_zh:
+            result_text.append((input_text, '图片为空！请上传图片并重试。'))
+        else:
+            result_text.append((input_text, 'Image empty! Please upload a image and retry.'))
+        return input_text, result_text
+    elif input_text == "":
+        print("Text empty")
+        result_text.append((input_text, 'Text empty! Please enter text and retry.'))
+        return "", result_text                
+
+    headers = {
+            "Content-Type": "application/json; charset=UTF-8",
+            "User-Agent": "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.87 Safari/537.36",
+        }
+    if image_prompt:
+        encoded_img = process_image(image_prompt)
+    else:
+        encoded_img = None
+
+    print('开始请求...')
+    data = json.dumps({
+        'text': input_text,
+        'image_prompt': encoded_img,
+        'temperature': temperature,
+        'top_p': top_p,
+        'history': result_text
+    })
+    try:
+        response = requests.request("POST", URL, headers=headers, data=data, timeout=(60, 100)).json()
+    except Exception as e:
+        print("error message", e)
+        if is_zh:
+            result_text.append((input_text, '超时！请稍等几分钟再重试。'))
+        else:
+            result_text.append((input_text, 'Timeout! Please wait a few minutes and retry.'))
+        return "", result_text
+    print('请求完毕...')
+
+    answer = str(response['result'])
+    result_text.append((input_text, answer))
+    print(result_text)
+    print('finished')
+    return "", result_text
+
+
+def clear_fn(value):
+    return "", [("", "Hi, What do you want to know about this image?")], None
+
+def clear_fn2(value):
+    return [("", "Hi, What do you want to know about this image?")]
+
+
+def main():
+    gr.close_all()
+    examples = []
+    with open("./examples/example_inputs.jsonl") as f:
+        for line in f:
+            data = json.loads(line)
+            examples.append(data)
+
+
+    with gr.Blocks(css='style.css') as demo:
+        
+        gr.Markdown(DESCRIPTION)
+        gr.Markdown(MAINTENANCE_NOTICE)
+
+
+        with gr.Row():
+            with gr.Column():
+                with gr.Group():
+                    input_text = gr.Textbox(label='Input Text', placeholder='Please enter text prompt below and press ENTER.')
+                    with gr.Row():
+                        run_button = gr.Button('Generate')
+                        clear_button = gr.Button('Clear')
+
+                    image_prompt = gr.Image(type="filepath", label="Image Prompt", value=None)
+                with gr.Row():
+                    temperature = gr.Slider(maximum=1, value=0.95, minimum=0, label='Temperature')
+                    top_p = gr.Slider(maximum=1, value=0.7, minimum=0, label='Top P')
+
+            result_text = gr.components.Chatbot(label='Multi-round conversation History', value=[("", "Hi, What do you want to know about this image?")])
+
+
+        gr_examples = gr.Examples(examples=[[example["text"], example["image"]] for example in examples], 
+                                  inputs=[input_text, image_prompt],
+                                  label="Example Inputs (Click to insert an examplet into the input box)",
+                                  examples_per_page=3)
+
+        gr.Markdown(NOTES)
+
+        print(gr.__version__)
+        run_button.click(fn=post,inputs=[input_text, temperature, top_p, image_prompt, result_text],
+                         outputs=[input_text, result_text])
+        input_text.submit(fn=post,inputs=[input_text, temperature, top_p, image_prompt, result_text],
+                         outputs=[input_text, result_text])
+        clear_button.click(fn=clear_fn, inputs=clear_button, outputs=[input_text, result_text, image_prompt])
+        image_prompt.change(fn=clear_fn2, inputs=clear_button, outputs=[result_text])
+
+        print(gr.__version__)
+
+
+    demo.queue(concurrency_count=10)
+    demo.launch()
+
+
+if __name__ == '__main__':
+    main()

examples/example_inputs.jsonl

@@ -0,0 +1,3 @@
+{"id":1, "text": "描述这张图片", "image": "examples/1.jpg"}
+{"id":2, "text": "描述这张图片中的场景", "image": "examples/2.jpg"}
+{"id":3, "text": "Describe the image", "image": "examples/3.jpg"}

style.css

@@ -0,0 +1,7 @@
+h1 {
+  text-align: center;
+}
+img#visitor-badge {
+  display: block;
+  margin: auto;
+}