import gradio as gr import base64 import io from PIL import Image as PILImage from models.data_manager import DataManager from models.image_processor import ( image_search_performers, find_faces_in_sprite ) class WebInterface: def __init__(self, data_manager: DataManager, default_threshold: float = 0.5): """ Initialize the web interface. Parameters: data_manager: DataManager instance default_threshold: Default confidence threshold """ self.data_manager = data_manager self.default_threshold = default_threshold def get_country_flag(self, country_code): """ Convert country code to flag emoji Parameters: country_code: ISO 2-letter country code (e.g., 'US', 'GB', 'FR') Returns: str: Flag emoji or empty string if not found """ if not country_code or len(country_code) != 2: return "" # Common country code to flag emoji mapping flag_map = { 'AD': '🇦🇩', 'AE': '🇦🇪', 'AF': '🇦🇫', 'AG': '🇦🇬', 'AI': '🇦🇮', 'AL': '🇦🇱', 'AM': '🇦🇲', 'AO': '🇦🇴', 'AQ': '🇦🇶', 'AR': '🇦🇷', 'AS': '🇦🇸', 'AT': '🇦🇹', 'AU': '🇦🇺', 'AW': '🇦🇼', 'AX': '🇦🇽', 'AZ': '🇦🇿', 'BA': '🇧🇦', 'BB': '🇧🇧', 'BD': '🇧🇩', 'BE': '🇧🇪', 'BF': '🇧🇫', 'BG': '🇧🇬', 'BH': '🇧🇭', 'BI': '🇧🇮', 'BJ': '🇧🇯', 'BL': '🇧🇱', 'BM': '🇧🇲', 'BN': '🇧🇳', 'BO': '🇧🇴', 'BQ': '🇧🇶', 'BR': '🇧🇷', 'BS': '🇧🇸', 'BT': '🇧🇹', 'BV': '🇧🇻', 'BW': '🇧🇼', 'BY': '🇧🇾', 'BZ': '🇧🇿', 'CA': '🇨🇦', 'CC': '🇨🇨', 'CD': '🇨🇩', 'CF': '🇨🇫', 'CG': '🇨🇬', 'CH': '🇨🇭', 'CI': '🇨🇮', 'CK': '🇨🇰', 'CL': '🇨🇱', 'CM': '🇨🇲', 'CN': '🇨🇳', 'CO': '🇨🇴', 'CR': '🇨🇷', 'CU': '🇨🇺', 'CV': '🇨🇻', 'CW': '🇨🇼', 'CX': '🇨🇽', 'CY': '🇨🇾', 'CZ': '🇨🇿', 'DE': '🇩🇪', 'DJ': '🇩🇯', 'DK': '🇩🇰', 'DM': '🇩🇲', 'DO': '🇩🇴', 'DZ': '🇩🇿', 'EC': '🇪🇨', 'EE': '🇪🇪', 'EG': '🇪🇬', 'EH': '🇪🇭', 'ER': '🇪🇷', 'ES': '🇪🇸', 'ET': '🇪🇹', 'FI': '🇫🇮', 'FJ': '🇫🇯', 'FK': '🇫🇰', 'FM': '🇫🇲', 'FO': '🇫🇴', 'FR': '🇫🇷', 'GA': '🇬🇦', 'GB': '🇬🇧', 'GD': '🇬🇩', 'GE': '🇬🇪', 'GF': '🇬🇫', 'GG': '🇬🇬', 'GH': '🇬🇭', 'GI': '🇬🇮', 'GL': '🇬🇱', 'GM': '🇬🇲', 'GN': '🇬🇳', 'GP': '🇬🇵', 'GQ': '🇬🇶', 'GR': '🇬🇷', 'GS': '🇬🇸', 'GT': '🇬🇹', 'GU': '🇬🇺', 'GW': '🇬🇼', 'GY': '🇬🇾', 'HK': '🇭🇰', 'HM': '🇭🇲', 'HN': '🇭🇳', 'HR': '🇭🇷', 'HT': '🇭🇹', 'HU': '🇭🇺', 'ID': '🇮🇩', 'IE': '🇮🇪', 'IL': '🇮🇱', 'IM': '🇮🇲', 'IN': '🇮🇳', 'IO': '🇮🇴', 'IQ': '🇮🇶', 'IR': '🇮🇷', 'IS': '🇮🇸', 'IT': '🇮🇹', 'JE': '🇯🇪', 'JM': '🇯🇲', 'JO': '🇯🇴', 'JP': '🇯🇵', 'KE': '🇰🇪', 'KG': '🇰🇬', 'KH': '🇰🇭', 'KI': '🇰🇮', 'KM': '🇰🇲', 'KN': '🇰🇳', 'KP': '🇰🇵', 'KR': '🇰🇷', 'KW': '🇰🇼', 'KY': '🇰🇾', 'KZ': '🇰🇿', 'LA': '🇱🇦', 'LB': '🇱🇧', 'LC': '🇱🇨', 'LI': '🇱🇮', 'LK': '🇱🇰', 'LR': '🇱🇷', 'LS': '🇱🇸', 'LT': '🇱🇹', 'LU': '🇱🇺', 'LV': '🇱🇻', 'LY': '🇱🇾', 'MA': '🇲🇦', 'MC': '🇲🇨', 'MD': '🇲🇩', 'ME': '🇲🇪', 'MF': '🇲🇫', 'MG': '🇲🇬', 'MH': '🇲🇭', 'MK': '🇲🇰', 'ML': '🇲🇱', 'MM': '🇲🇲', 'MN': '🇲🇳', 'MO': '🇲🇴', 'MP': '🇲🇵', 'MQ': '🇲🇶', 'MR': '🇲🇷', 'MS': '🇲🇸', 'MT': '🇲🇹', 'MU': '🇲🇺', 'MV': '🇲🇻', 'MW': '🇲🇼', 'MX': '🇲🇽', 'MY': '🇲🇾', 'MZ': '🇲🇿', 'NA': '🇳🇦', 'NC': '🇳🇨', 'NE': '🇳🇪', 'NF': '🇳🇫', 'NG': '🇳🇬', 'NI': '🇳🇮', 'NL': '🇳🇱', 'NO': '🇳🇴', 'NP': '🇳🇵', 'NR': '🇳🇷', 'NU': '🇳🇺', 'NZ': '🇳🇿', 'OM': '🇴🇲', 'PA': '🇵🇦', 'PE': '🇵🇪', 'PF': '🇵🇫', 'PG': '🇵🇬', 'PH': '🇵🇭', 'PK': '🇵🇰', 'PL': '🇵🇱', 'PM': '🇵🇲', 'PN': '🇵🇳', 'PR': '🇵🇷', 'PS': '🇵🇸', 'PT': '🇵🇹', 'PW': '🇵🇼', 'PY': '🇵🇾', 'QA': '🇶🇦', 'RE': '🇷🇪', 'RO': '🇷🇴', 'RS': '🇷🇸', 'RU': '🇷🇺', 'RW': '🇷🇼', 'SA': '🇸🇦', 'SB': '🇸🇧', 'SC': '🇸🇨', 'SD': '🇸🇩', 'SE': '🇸🇪', 'SG': '🇸🇬', 'SH': '🇸🇭', 'SI': '🇸🇮', 'SJ': '🇸🇯', 'SK': '🇸🇰', 'SL': '🇸🇱', 'SM': '🇸🇲', 'SN': '🇸🇳', 'SO': '🇸🇴', 'SR': '🇸🇷', 'SS': '🇸🇸', 'ST': '🇸🇹', 'SV': '🇸🇻', 'SX': '🇸🇽', 'SY': '🇸🇾', 'SZ': '🇸🇿', 'TC': '🇹🇨', 'TD': '🇹🇩', 'TF': '🇹🇫', 'TG': '🇹🇬', 'TH': '🇹🇭', 'TJ': '🇹🇯', 'TK': '🇹🇰', 'TL': '🇹🇱', 'TM': '🇹🇲', 'TN': '🇹🇳', 'TO': '🇹🇴', 'TR': '🇹🇷', 'TT': '🇹🇹', 'TV': '🇹🇻', 'TW': '🇹🇼', 'TZ': '🇹🇿', 'UA': '🇺🇦', 'UG': '🇺🇬', 'UM': '🇺🇲', 'US': '🇺🇸', 'UY': '🇺🇾', 'UZ': '🇺🇿', 'VA': '🇻🇦', 'VC': '🇻🇨', 'VE': '🇻🇪', 'VG': '🇻🇬', 'VI': '🇻🇮', 'VN': '🇻🇳', 'VU': '🇻🇺', 'WF': '🇼🇫', 'WS': '🇼🇸', 'YE': '🇾🇪', 'YT': '🇾🇹', 'ZA': '🇿🇦', 'ZM': '🇿🇲', 'ZW': '🇿🇼' } return flag_map.get(country_code.upper(), "") def multiple_image_search(self, img, threshold, results): """Wrapper for the multiple image search function""" try: return image_search_performers(img, self.data_manager, threshold, results) except ValueError as e: if "No faces found" in str(e): return {"error": "No faces detected in the uploaded image. Please try uploading an image with visible faces."} else: raise e def format_results_for_visual_display(self, json_results): """ Convert JSON results to visual components for better UX Parameters: json_results: List of face detection results from image_search_performers Returns: tuple: (gallery_images, html_content) """ if not json_results: return [], "

No faces detected or no matches found.

" # Handle error case if isinstance(json_results, dict) and "error" in json_results: error_html = f"""

Error

{json_results['error']}

""" return [], error_html gallery_images = [] html_parts = [] html_parts.append(""" """) for i, face_result in enumerate(json_results): # Convert base64 face image to PIL for gallery try: face_image_data = base64.b64decode(face_result['image']) face_pil = PILImage.open(io.BytesIO(face_image_data)) gallery_images.append(face_pil) except Exception as e: print(f"Error decoding face image: {e}") continue # Create HTML for this face face_confidence = face_result['confidence'] performers = face_result['performers'] # Create base64 data URL for the detected face image face_image_b64 = f"data:image/jpeg;base64,{face_result['image']}" html_parts.append(f"""
Detected Face {i+1}

Face {i+1}

Detection Confidence: {face_confidence:.1%}

Matches Found: {len(performers)}

""") if performers: html_parts.append('
') for performer in performers: confidence_class = "high-confidence" if performer['confidence'] >= 80 else "medium-confidence" if performer['confidence'] >= 60 else "low-confidence" country_code = performer.get('country', '') country_flag = self.get_country_flag(country_code) country_display = f"{country_flag} {country_code}" if country_flag else (country_code if country_code else 'Unknown') html_parts.append(f"""
{performer['name']}

{performer['name']}

Country: {country_display}

{performer['confidence']}%

Distance: {performer.get('distance', 'N/A')}

""") html_parts.append('
') else: html_parts.append('

No performer matches found for this face.

') html_parts.append('
') return gallery_images, ''.join(html_parts) def multiple_image_search_with_visual(self, img, threshold, results): """ Enhanced search function that returns both JSON and visual components Returns: tuple: (json_results, gallery_images, html_content) """ try: json_results = self.multiple_image_search(img, threshold, results) gallery_images, html_content = self.format_results_for_visual_display(json_results) return json_results, gallery_images, html_content except Exception as e: error_msg = f"

Error

{str(e)}

" return [], [], error_msg def _create_json_search_interface(self): """Create the JSON API search interface""" with gr.Blocks() as interface: gr.Markdown("# Face Recognition API") gr.Markdown("Upload an image and get JSON results - perfect for API integration.") with gr.Row(): with gr.Column(): img_input = gr.Image(type="pil") threshold = gr.Slider( label="threshold", minimum=0.0, maximum=1.0, value=self.default_threshold ) results_count = gr.Slider( label="results", minimum=0, maximum=50, value=3, step=1 ) search_btn = gr.Button("Search") with gr.Column(): json_output = gr.JSON(label="JSON Results") search_btn.click( fn=self.multiple_image_search, inputs=[img_input, threshold, results_count], outputs=json_output, api_name="multiple_image_search" ) return interface def _create_visual_search_interface(self): """Create the visual search interface""" with gr.Blocks() as interface: gr.Markdown("# Who is in the photo?") gr.Markdown("Upload an image of a person(s) and we'll show you who it is with photos and details.") with gr.Row(): with gr.Column(): img_input = gr.Image(type="pil") threshold = gr.Slider( label="threshold", minimum=0.0, maximum=1.0, value=self.default_threshold ) results_count = gr.Slider( label="results", minimum=0, maximum=50, value=3, step=1 ) search_btn = gr.Button("Search") with gr.Column(): performer_info = gr.HTML( label="Performer Information", value="

Upload an image and click search to see results.

" ) def visual_search_wrapper(img, threshold, results): """Wrapper that returns only visual components""" json_results, gallery_images, html_content = self.multiple_image_search_with_visual(img, threshold, results) return html_content search_btn.click( fn=visual_search_wrapper, inputs=[img_input, threshold, results_count], outputs=[performer_info], api_name="multiple_image_search_with_visual" ) return interface def _create_faces_in_sprite_interface(self): """Create the faces in sprite interface""" with gr.Blocks() as interface: gr.Markdown("# Find Faces in Sprite") with gr.Row(): with gr.Column(): img_input = gr.Image() vtt_input = gr.File(label="VTT file") search_btn = gr.Button("Process") with gr.Column(): output = gr.JSON(label="Results") search_btn.click( fn=find_faces_in_sprite, inputs=[img_input, vtt_input], outputs=output ) return interface def launch(self, server_name="0.0.0.0", server_port=7860, share=True): """Launch the web interface""" with gr.Blocks( css=""" .gradio-container { background-color: #1e1e1e !important; color: #d4d4d4 !important; } .dark { --background-fill-primary: #2d2d2d; --background-fill-secondary: #3c3c3c; --border-color-primary: #404040; --block-title-text-color: #ffffff; --body-text-color: #d4d4d4; } """ ) as demo: with gr.Tabs(): with gr.TabItem("Visual Search"): self._create_visual_search_interface() with gr.TabItem("JSON API"): self._create_json_search_interface() with gr.TabItem("Faces in Sprite"): self._create_faces_in_sprite_interface() demo.queue().launch(server_name=server_name, server_port=server_port, share=share, ssr_mode=False)