feat: gradio png download and api docs jp ko (#96)

* add light gray * init * add gr image png * Update title.md
Zeyi-Lin · Sep 10, 2024 · a956814 · a956814
1 parent a4bb4ce
commit a956814
Show file tree

Hide file tree

Showing 11 changed files with 1,073 additions and 38 deletions.
diff --git a/app.py b/app.py
@@ -52,7 +52,7 @@
     demo.launch(
         server_name=args.host,
         server_port=args.port,
-        show_api=False,
         favicon_path=os.path.join(root_dir, "assets/hivision_logo.png"),
         root_path=args.root_path,
+        show_api=False,
     )
diff --git a/assets/title.md b/assets/title.md
@@ -1,11 +1,10 @@
-<div style="display: flex; justify-content: center; align-items: center; text-align: center; font-size: 40px;">
-  <div>
+<div style="display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; font-size: 40px;">
+  <div style="display: flex; align-items: center;">
     <b>HivisionIDPhotos</b>
-    <br>
-    <div style="display: flex; justify-content: center; align-items: center; text-align: center;">
-        <a href="https://github.com/xiaolin199912/HivisionIDPhotos"><img alt="Github" src="https://img.shields.io/static/v1?label=GitHub&message=GitHub&color=black"></a> &ensp;
-        <a href="https://docs.qq.com/doc/DUkpBdk90eWZFS2JW" target="_blank"><img alt="Static Badge" src="https://img.shields.io/badge/WeChat-微信-4cb55e"></a> &ensp;
-        <a href="https://github.com/Zeyi-Lin/HivisionIDPhotos/blob/master/docs/api_EN.md" target="_blank"><img alt="Static Badge" src="https://img.shields.io/badge/API_Docs-API文档-315bce"></a>
-    </div>
   </div>
-</div>
+  <div style="display: flex; justify-content: center; align-items: center; text-align: center;">
+      <a href="https://github.com/xiaolin199912/HivisionIDPhotos"><img alt="Github" src="https://img.shields.io/static/v1?label=GitHub&message=GitHub&color=black"></a> &ensp;
+      <a href="https://docs.qq.com/doc/DUkpBdk90eWZFS2JW" target="_blank"><img alt="Static Badge" src="https://img.shields.io/badge/WeChat-微信-4cb55e"></a> &ensp;
+      <a href="https://github.com/Zeyi-Lin/HivisionIDPhotos/blob/master/docs/api_EN.md" target="_blank"><img alt="Static Badge" src="https://img.shields.io/badge/API_Docs-API文档-315bce"></a>
+  </div>
+</div>
diff --git a/demo/assets/color_list_CN.csv b/demo/assets/color_list_CN.csv
@@ -3,4 +3,5 @@ Name,Hex
 白色,ffffff
 红色,d74532
 黑色,000000
-深蓝色,4b6190
+深蓝色,4b6190
+浅灰色,f2f0f0
diff --git a/demo/assets/color_list_EN.csv b/demo/assets/color_list_EN.csv
@@ -3,4 +3,5 @@ Blue,628bce
 White,ffffff  
 Red,d74532  
 Black,000000  
-Dark Blue,4b6190
+Dark Blue,4b6190
+Light Gray,f2f0f0
diff --git a/demo/locals.py b/demo/locals.py
@@ -252,6 +252,14 @@
             "label": "高清照",
         },
     },
+    "hd_photo_png": {
+        "en": {
+            "label": "Matting photo",
+        },
+        "zh": {
+            "label": "透明图",
+        },
+    },
     "layout_photo": {
         "en": {
             "label": "Layout photo",

diff --git a/demo/processor.py b/demo/processor.py
@@ -137,6 +137,7 @@ def process(
             return [
                 gr.update(value=None),  # img_output_standard
                 gr.update(value=None),  # img_output_standard_hd
+                gr.update(value=None),  # img_output_standard_hd_png
                 gr.update(visible=False),  # img_output_layout
                 gr.update(  # notification
                     value=LOCALES["notification"][language]["face_error"],
@@ -147,6 +148,7 @@ def process(
 
         else:
             (result_image_standard, result_image_hd, _, _) = result
+            result_image_hd_png = np.uint8(result_image_hd)
             if (
                 idphoto_json["render_mode"]
                 == LOCALES["render_mode"][language]["choices"][0]
@@ -272,6 +274,7 @@ def process(
                 return [
                     result_image_standard,  # img_output_standard
                     result_image_hd,  # img_output_standard_hd
+                    result_image_hd_png,  # img_output_standard_hd_png
                     result_layout_image,  # img_output_layout
                     gr.update(visible=False),  # notification
                     gr.update(visible=True, value=output_image_path),  # file_download
@@ -280,6 +283,7 @@ def process(
                 return [
                     result_image_standard,  # img_output_standard
                     result_image_hd,  # img_output_standard_hd
+                    result_image_hd_png,  # img_output_standard_hd_png
                     result_layout_image,  # img_output_layout
                     gr.update(visible=False),  # notification
                     gr.update(visible=False),  # file_download

diff --git a/demo/ui.py b/demo/ui.py
@@ -22,29 +22,7 @@ def create_ui(
         human_matting_models.remove(DEFAULT_HUMAN_MATTING_MODEL)
         human_matting_models.insert(0, DEFAULT_HUMAN_MATTING_MODEL)
 
-    css = """
-        #col-left {
-            margin: 0 auto;
-            max-width: 430px;
-        }
-        #col-mid {
-            margin: 0 auto;
-            max-width: 430px;
-        }
-        #col-right {
-            margin: 0 auto;
-            max-width: 430px;
-        }
-        #col-showcase {
-            margin: 0 auto;
-            max-width: 1100px;
-        }
-        #button {
-            color: blue;
-        }
-        """
-
-    demo = gr.Blocks(title="HivisionIDPhotos", css=css)
+    demo = gr.Blocks(title="HivisionIDPhotos")
 
     with demo:
         gr.HTML(load_description(os.path.join(root_dir, "assets/title.md")))
@@ -237,7 +215,9 @@ def update_watermark_text_visibility(choice, language):
                         ],
                     )
 
-                img_but = gr.Button(LOCALES["button"][DEFAULT_LANG]["label"])
+                img_but = gr.Button(
+                    LOCALES["button"][DEFAULT_LANG]["label"], elem_id="btn"
+                )
 
                 example_images = gr.Examples(
                     inputs=[img_input],
@@ -267,6 +247,13 @@ def update_watermark_text_visibility(choice, language):
                         height=350,
                         format="jpeg",
                     )
+                    img_output_standard_hd_png = gr.Image(
+                        label=LOCALES["hd_photo_png"][DEFAULT_LANG]["label"],
+                        height=350,
+                        format="png",
+                        elem_id="hd_photo_png",
+                    )
+
                 img_output_layout = gr.Image(
                     label=LOCALES["layout_photo"][DEFAULT_LANG]["label"],
                     height=350,
@@ -323,6 +310,9 @@ def change_language(language):
                     img_output_standard_hd: gr.update(
                         label=LOCALES["hd_photo"][language]["label"]
                     ),
+                    img_output_standard_hd_png: gr.update(
+                        label=LOCALES["hd_photo_png"][language]["label"]
+                    ),
                     img_output_layout: gr.update(
                         label=LOCALES["layout_photo"][language]["label"]
                     ),
@@ -422,6 +412,7 @@ def change_image_kb(image_kb_option):
                     notification,
                     img_output_standard,
                     img_output_standard_hd,
+                    img_output_standard_hd_png,
                     img_output_layout,
                     file_download,
                     head_measure_ratio_option,
@@ -484,6 +475,7 @@ def change_image_kb(image_kb_option):
                 outputs=[
                     img_output_standard,
                     img_output_standard_hd,
+                    img_output_standard_hd_png,
                     img_output_layout,
                     notification,
                     file_download,

diff --git a/docs/api_CN.md b/docs/api_CN.md
@@ -1,6 +1,7 @@
 # API Docs
 
-中文 | [English](api_EN.md)
+[English](api_EN.md) / 中文 / [日本語](api_JP.md) / [한국어](api_KO.md)
+
 
 ## 目录
 

diff --git a/docs/api_EN.md b/docs/api_EN.md
@@ -1,6 +1,7 @@
 # API Docs
 
-[中文](api_CN.md) | English
+English / [中文](api_CN.md) / [日本語](api_JP.md) / [한국어](api_KO.md)
+
 
 ## Table of Contents