Updated project files

GUIDE.md

@@ -0,0 +1,48 @@
+# Hướng dẫn sử dụng Template HuggingFace Space
+Template này được thiết kế để nhanh chóng xây dựng và triển khai một AIO Gradio demo trên HuggingFace Space.
+
+## Cấu trúc thư mục
+```
+Folder/
+├── .gitattributes (HuggingFace tự tạo khi tạo Space)
+├── app.py
+├── README.md (HuggingFace tự tạo khi tạo Space)
+├── requirements.txt
+├── ui_template.py
+├── src/
+└── static/
+```
+
+- `app.py`: Đây là file chính để chạy Gradio demo.
+- `requirements.txt`: Liệt kê các thư viện Python cần thiết cho demo.
+- `ui_template.py`: Chứa các hàm và CSS tùy chỉnh để tạo UI cho demo.
+- `src/`: Chứa các code như mô hình.
+- `static/`: Chứa các tài nguyên tĩnh như hình ảnh logo.
+
+## Hướng dẫn sử dụng
+1.  **Cập nhật `src`**:
+    *   Xây dựng các hàm khởi tạo, định nghĩa mô hình hoặc các hàm liên quan khác.
+
+2.  **Cập nhật `app.py`**:
+    *   Thêm các hàm cần thiết như khởi tạo/gọi mô hình, xử lý đầu vào, ... tại vùng Functions.
+    *   Có thể thêm các thành phần UI khác vào phần `gr.Blocks` nếu cần.
+    *   **Quan trọng**: Không thay đổi các dòng liên quan đến `ui_template.create_header()`, `ui_template.create_footer()`, và `demo.launch()`.
+
+3.  **Cập nhật `ui_template.py`**:
+    *   Thay đổi giá trị của biến `PROJECT_NAME` thành tên dự án của bạn.
+    *   Thay đổi giá trị của biến `AIO_YEAR` và `AIO_MODULE` cho phù hợp với thời điểm hiện tại.
+
+4.  **Cập nhật `requirements.txt` và thêm `.gitignore`**:
+    *   Thêm tất cả các thư viện Python cần thiết cho demo, mỗi thư viện trên một dòng và nên kèm theo phiên bản cụ thể. Ví dụ: `torch==1.0.0`.
+    *   Tạo thêm file `.gitignore` nếu cần.
+
+5.  **Linh hoạt với các file còn lại**
+
+6.  **Chạy thử ở local trước khi deploy**
+    *   Chạy lệnh sau trong Terminal:
+    ```
+    python Folder/app.py
+    ```
+
+Hết,
+Koi (last edited: 22/7/2025)

app.py

@@ -0,0 +1,38 @@
+import gradio as gr
+
+import vlai_template  # must import
+
+# ────────────────────────────  Functions  ─────────────────────────    
+def inference(*arg):
+    return "It worked 🎉🎊"
+
+# ... your functions ...
+
+
+# ────────────────────────────  Main  ─────────────────────────
+with gr.Blocks(theme='gstaff/sketch', css=vlai_template.custom_css) as demo:  # don't change
+    vlai_template.create_header()  # don't change
+
+    with gr.Row(equal_height=True, variant="panel"):
+        with gr.Column(scale=3):
+            upload_image = gr.Image(label="Upload image", type="pil")
+            prompt_input = gr.Textbox(label="Optional prompt", placeholder="e.g. Detect cats only")
+            task_choice  = gr.Radio(["Auto", "Detection", "Segmentation"],
+                                     value="Auto", label="Task")
+            temp_slider  = gr.Slider(minimum=0.1, maximum=1.5, step=0.1,
+                                     value=0.7, label="Temperature (sampling)")
+            submit_btn   = gr.Button("Run 🔧", elem_classes="full-width-btn")
+
+        with gr.Column(scale=4):
+            output_text = gr.Markdown(label="Result")
+
+        submit_btn.click(
+            inference,
+            inputs=[upload_image, prompt_input, task_choice, temp_slider],
+            outputs=output_text,
+        )
+
+    vlai_template.create_footer()  # don't change
+
+if __name__ == "__main__":
+    demo.launch(allowed_paths=["static/aivn_logo.png", "static/vlai_logo.png", "static"])  # don't change

requirements.txt

@@ -0,0 +1 @@
+gradio==5.38.0

vlai_template.py

@@ -0,0 +1,70 @@
+import os, base64
+import gradio as gr
+
+
+# JUST CHANGE THESE VALUES IN THIS FILE
+PROJECT_NAME = "PROJECT NAME"
+AIO_YEAR = "2025"
+AIO_MODULE = "2"
+# END
+
+
+def image_to_base64(image_path: str):
+    # Construct the absolute path to the image
+    current_dir = os.path.dirname(os.path.abspath(__file__))
+    full_image_path = os.path.join(current_dir, image_path)
+    with open(full_image_path, "rb") as f:
+        return base64.b64encode(f.read()).decode("utf-8")
+    
+def create_header():
+    with gr.Row():
+        with gr.Column(scale=2):
+            logo_base64 = image_to_base64("static/aivn_logo.png")
+            gr.HTML(
+                f"""<img src="data:image/png;base64,{logo_base64}"
+                        alt="Logo"
+                        style="height:120px;width:auto;margin:0 auto;margin-bottom:16px; display:block;">"""
+            )
+        with gr.Column(scale=2):
+            gr.HTML(f"""
+<div style="display:flex;justify-content:flex-start;align-items:center;gap:30px;">
+    <div>
+        <h1 style="margin-bottom:0; color: #4f47e6; font-size: 2.5em; font-weight: bold;"> {PROJECT_NAME} </h1>
+        <h3 style="color: #888; font-style: italic"> AIO{AIO_YEAR}: Module {AIO_MODULE} </h3>
+    </div>
+</div>
+""")
+            
+def create_footer():
+    logo_base64_vlai = image_to_base64("static/vlai_logo.png")
+    footer_html = """
+<style>
+  .sticky-footer{position:fixed;bottom:0px;left:0;width:100%;background:#F4EBD3;
+                 padding:10px;box-shadow:0 -2px 10px rgba(0,0,0,0.1);z-index:1000;}
+  .content-wrap{padding-bottom:60px;}
+</style>""" + f"""
+<div class="sticky-footer">
+  <div style="text-align:center;font-size:18px; color: #888">
+    Created by 
+    <a href="https://vlai.work" target="_blank" style="color:#465C88;text-decoration:none;font-weight:bold; display:inline-flex; align-items:center;"> 
+    <img src="data:image/png;base64,{logo_base64_vlai}" alt="Logo" style="height:20px; width:auto;"> VLAI 
+    </a> from <a href="https://aivietnam.edu.vn/" target="_blank" style="color:#355724;text-decoration:none;font-weight:bold">AI VIET NAM</a>
+  </div>
+</div>
+"""
+    return gr.HTML(footer_html)
+
+custom_css = """
+.gradio-container {
+    min-height:64vh; 
+    background: linear-gradient(135deg, #F5EFE6 0%, #E8DFCA 50%, #AEBDCA 100%);
+    background-size: 400% 400%;
+    animation: gradientBG 10s ease infinite;
+}
+@keyframes gradientBG {
+    0% {background-position: 0% 50%;}
+    50% {background-position: 100% 50%;}
+    100% {background-position: 0% 50%;}
+}
+.content-wrap {padding-bottom:8px;}
+"""