Update app.py

app.py

@@ -1,13 +1,10 @@
 import urllib.parse
 import gradio as gr
 
-# ----------------------------------------------------
-# 1. 배지 URL 생성 함수 정의
-# ----------------------------------------------------
 def generate_static_badge(label, message, color, style, label_color, logo, logo_color):
     base = "https://img.shields.io/static/v1"
     params = []
-    if label:  # Label이 빈 문자열이 아닌 경우에만 추가
+    if label:
         params.append(f"label={urllib.parse.quote(label, safe='')}")
     if message:
         params.append(f"message={urllib.parse.quote(message, safe='')}")
@@ -21,195 +18,43 @@ def generate_static_badge(label, message, color, style, label_color, logo, logo_
         params.append(f"logo={urllib.parse.quote(logo, safe='')}")
     if logo_color:
         params.append(f"logoColor={urllib.parse.quote(logo_color, safe='')}")
-    url = base + ("?" + "&".join(params) if params else "")
-    html_code = f'<img src="{url}" alt="{label or message} badge">'
-    return html_code, url  # (HTML 코드 스니펫, 이미지 URL)을 반환
 
-def generate_dynamic_json_badge(json_url, json_path, label, prefix, suffix, color, style, label_color, logo, logo_color):
-    base = "https://img.shields.io/badge/dynamic/json"
-    params = []
-    if json_url:
-        params.append(f"url={urllib.parse.quote(json_url, safe='')}")
-    if json_path:
-        params.append(f"query={urllib.parse.quote(json_path, safe='')}")
-    if label:
-        params.append(f"label={urllib.parse.quote(label, safe='')}")
-    if prefix:
-        params.append(f"prefix={urllib.parse.quote(prefix, safe='')}")
-    if suffix:
-        params.append(f"suffix={urllib.parse.quote(suffix, safe='')}")
-    if color:
-        params.append(f"color={urllib.parse.quote(color, safe='')}")
-    if style:
-        params.append(f"style={urllib.parse.quote(style, safe='')}")
-    if label_color:
-        params.append(f"labelColor={urllib.parse.quote(label_color, safe='')}")
-    if logo:
-        params.append(f"logo={urllib.parse.quote(logo, safe='')}")
-    if logo_color:
-        params.append(f"logoColor={urllib.parse.quote(logo_color, safe='')}")
     url = base + ("?" + "&".join(params) if params else "")
-    html_code = f'<img src="{url}" alt="Dynamic JSON badge">'
-    return html_code, url
-
-def generate_endpoint_badge(endpoint_url, label, color, style, label_color, logo, logo_color):
-    base = "https://img.shields.io/endpoint"
-    params = []
-    if endpoint_url:
-        params.append(f"url={urllib.parse.quote(endpoint_url, safe='')}")
-    if label:
-        params.append(f"label={urllib.parse.quote(label, safe='')}")
-    if color:
-        params.append(f"color={urllib.parse.quote(color, safe='')}")
-    if style:
-        params.append(f"style={urllib.parse.quote(style, safe='')}")
-    if label_color:
-        params.append(f"labelColor={urllib.parse.quote(label_color, safe='')}")
-    if logo:
-        params.append(f"logo={urllib.parse.quote(logo, safe='')}")
-    if logo_color:
-        params.append(f"logoColor={urllib.parse.quote(logo_color, safe='')}")
-    url = base + ("?" + "&".join(params) if params else "")
-    html_code = f'<img src="{url}" alt="Endpoint badge">'
-    return html_code, url
-
-# ----------------------------------------------------
-# 2. Gradio UI 구성
-# ----------------------------------------------------
-with gr.Blocks(theme=gr.themes.Default()) as app:
-    gr.Markdown("""
-    # Shields.io Badge Generator 🛠  
-    이 앱은 [Shields.io](https://shields.io/)에서 제공하는 배지를 **GUI**로 간편하게 생성하도록 도와줍니다.<br>
-    아래 탭에서 배지 유형을 선택하고 원하는 옵션을 입력해보세요. 자동으로 HTML 코드 스니펫과 미리보기 이미지를 확인하실 수 있습니다.
-    """)
-
-    with gr.Tabs():
-        # ------------------------------------------------
-        # --- Tab 1: Static Badge ---
-        # ------------------------------------------------
-        with gr.Tab("Static Badge"):
-            gr.Markdown("""
-            **정적(Static) 배지**를 생성합니다.  
-            예: 좌측 텍스트(label), 우측 텍스트(message), 색상(color) 등을 입력하세요.
-            """)
-            with gr.Row():
-                lbl = gr.Textbox(label="Label (좌측 텍스트)", placeholder="예: build")
-                msg = gr.Textbox(label="Message (우측 텍스트)", placeholder="예: passing")
-            
-            with gr.Row():
-                col = gr.Textbox(label="Color (색상)", value="blue", placeholder="예: brightgreen, #4c1 등")
-                lbl_col = gr.Textbox(label="Label Color (레이블 배경색)", placeholder="(선택 사항)")
-            
-            with gr.Row():
-                logo_in = gr.Textbox(label="Logo (아이콘)", placeholder="예: github (선택 사항)")
-                logo_col = gr.Textbox(label="Logo Color (아이콘 색상)", placeholder="(선택 사항)")
-            
-            style_in = gr.Dropdown(
-                label="Style (스타일)",
-                choices=["flat", "flat-square", "plastic", "for-the-badge", "social"],
-                value="flat"
-            )
-
-            # 출력: 코드 스니펫 & 이미지 미리보기
-            out_code = gr.Code(label="HTML Snippet", language="html")
-            out_img = gr.Image(label="Badge Preview", type="auto")
-
-            # 입력 변화 -> 출력 갱신
-            inputs = [lbl, msg, col, style_in, lbl_col, logo_in, logo_col]
-            for inp in inputs:
-                inp.change(
-                    fn=generate_static_badge,
-                    inputs=inputs,
-                    outputs=[out_code, out_img]
-                )
-        
-        # ------------------------------------------------
-        # --- Tab 2: Dynamic JSON Badge ---
-        # ------------------------------------------------
-        with gr.Tab("Dynamic JSON Badge"):
-            gr.Markdown("""
-            **동적(JSON) 배지**를 생성합니다.  
-            URL로부터 JSON 데이터를 읽어와 특정 필드를 추출하여 표시합니다.
-            """)
-            with gr.Row():
-                json_url = gr.Textbox(label="JSON URL", placeholder="예: https://example.com/data.json")
-                json_path = gr.Textbox(label="JSONPath Query", placeholder="예: $.version")
-            
-            with gr.Row():
-                label_dyn = gr.Textbox(label="Label (좌측 텍스트)", placeholder="(선택 사항)")
-                prefix_dyn = gr.Textbox(label="Prefix (접두사)", placeholder="값 앞에 붙일 문자열 (선택)")
-                suffix_dyn = gr.Textbox(label="Suffix (접미사)", placeholder="값 뒤에 붙일 문자열 (선택)")
-            
-            with gr.Row():
-                color_dyn = gr.Textbox(label="Color (색상)", value="blue", placeholder="예: blue, #4183c4 등")
-                lbl_color_dyn = gr.Textbox(label="Label Color (레이블 배경색)", placeholder="(선택 사항)")
-            
-            with gr.Row():
-                logo_dyn = gr.Textbox(label="Logo (아이콘)", placeholder="예: google (선택 사항)")
-                logo_color_dyn = gr.Textbox(label="Logo Color (아이콘 색상)", placeholder="(선택 사항)")
-
-            style_dyn = gr.Dropdown(
-                label="Style (스타일)",
-                choices=["flat", "flat-square", "plastic", "for-the-badge", "social"],
-                value="flat"
-            )
-
-            out_code2 = gr.Code(label="HTML Snippet", language="html")
-            out_img2 = gr.Image(label="Badge Preview", type="auto")
+    # HTML snippet
+    html_code = f'<img src="{url}" alt="{label or message} badge">'
 
-            inputs_dyn = [
-                json_url, json_path, label_dyn, prefix_dyn, suffix_dyn,
-                color_dyn, style_dyn, lbl_color_dyn, logo_dyn, logo_color_dyn
-            ]
-            for inp in inputs_dyn:
-                inp.change(
-                    fn=generate_dynamic_json_badge,
-                    inputs=inputs_dyn,
-                    outputs=[out_code2, out_img2]
-                )
-        
-        # ------------------------------------------------
-        # --- Tab 3: Endpoint Badge ---
-        # ------------------------------------------------
-        with gr.Tab("Endpoint Badge"):
-            gr.Markdown("""
-            **Endpoint 배지**를 생성합니다.  
-            엔드포인트(Endpoint)에서 미리 정의된 JSON 구조(`schemaVersion`, `label`, `message`, `color` 등)를 반환하고,  
-            Shields.io가 이를 읽어와 배지를 렌더링합니다.
-            """)
-            with gr.Row():
-                endpoint = gr.Textbox(label="Endpoint URL", placeholder="배지 JSON을 제공하는 엔드포인트 URL")
-                label_ep = gr.Textbox(label="Override Label", placeholder="엔드포인트 JSON의 label 대신 (선택)")
-            
-            with gr.Row():
-                color_ep = gr.Textbox(label="Override Color", placeholder="엔드포인트 JSON의 color 대신 (선택)")
-                lbl_color_ep = gr.Textbox(label="Label Color", placeholder="(선택 사항)")
-            
-            with gr.Row():
-                logo_ep = gr.Textbox(label="Logo (아이콘)", placeholder="예: custom (선택 사항)")
-                logo_color_ep = gr.Textbox(label="Logo Color", placeholder="(선택 사항)")
-            
-            style_ep = gr.Dropdown(
-                label="Style (스타일)",
-                choices=["flat", "flat-square", "plastic", "for-the-badge", "social"],
-                value="flat"
-            )
+    # HTML 컴포넌트로 그대로 보여줄 미리보기(크기 지정 가능)
+    preview_html = f"""
+    <div style="display:inline-block; padding:10px; border:1px solid #ccc;">
+        <img src="{url}" alt="Badge Preview">
+    </div>
+    """
+    return html_code, preview_html
 
-            out_code3 = gr.Code(label="HTML Snippet", language="html")
-            out_img3 = gr.Image(label="Badge Preview", type="auto")
 
-            inputs_ep = [
-                endpoint, label_ep, color_ep, style_ep,
-                lbl_color_ep, logo_ep, logo_color_ep
-            ]
-            for inp in inputs_ep:
-                inp.change(
-                    fn=generate_endpoint_badge,
-                    inputs=inputs_ep,
-                    outputs=[out_code3, out_img3]
-                )
+with gr.Blocks() as demo:
+    gr.Markdown("## Shields.io Badge Generator 🛠")
     
-    # 전체 Blocks 종료
-
-# 실제 실행 시 아래 주석을 해제하여 사용하세요.
-app.launch()
+    with gr.Row():
+        lbl = gr.Textbox(label="Label")
+        msg = gr.Textbox(label="Message")
+    with gr.Row():
+        col = gr.Textbox(label="Color", value="blue")
+        lbl_col = gr.Textbox(label="Label Color")
+    with gr.Row():
+        logo_in = gr.Textbox(label="Logo")
+        logo_col = gr.Textbox(label="Logo Color")
+    style_in = gr.Dropdown(
+        label="Style",
+        choices=["flat", "flat-square", "plastic", "for-the-badge", "social"],
+        value="flat"
+    )
+
+    out_code = gr.Code(label="HTML Snippet", language="html")
+    out_html = gr.HTML(label="Preview")
+
+    inputs = [lbl, msg, col, style_in, lbl_col, logo_in, logo_col]
+    for inp in inputs:
+        inp.change(fn=generate_static_badge, inputs=inputs, outputs=[out_code, out_html])
+
+demo.launch()