Update app.py

app.py

@@ -1,7 +1,42 @@
 import gradio as gr
+import logging
+import traceback
 
-css = """
-/* Base styles */
+# Logging configuration
+logging.basicConfig(
+    level=logging.INFO, 
+    format='%(asctime)s - %(levelname)s: %(message)s',
+    handlers=[
+        logging.FileHandler('centurion_platform.log'),
+        logging.StreamHandler()
+    ]
+)
+logger = logging.getLogger(__name__)
+
+# CSS with validation
+def validate_css(css):
+    """
+    Basic CSS validation
+    """
+    required_selectors = [
+        '.header', 
+        '.logo', 
+        '.header-title', 
+        '.container', 
+        '.main-content', 
+        '.iframe-container', 
+        '.nav-grid', 
+        '.nav-card'
+    ]
+    
+    for selector in required_selectors:
+        if selector not in css:
+            logger.warning(f"Missing CSS selector: {selector}")
+    
+    return css
+
+# CSS with enhanced validation
+css = validate_css("""
 * {
     margin: 0;
     padding: 0;
@@ -14,7 +49,6 @@ body {
     font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
 }
 
-/* Header styles */
 .header {
     background: #ffffff;
     border-bottom: 1px solid #e5e5e5;
@@ -31,17 +65,12 @@ body {
     transition: transform 0.3s ease;
 }
 
-.logo:hover {
-    transform: scale(1.05);
-}
-
 .header-title {
     color: #000000;
     font-size: 24px;
     font-weight: 600;
 }
 
-/* Main container */
 .container {
     max-width: 1400px;
     margin: 0 auto;
@@ -49,7 +78,6 @@ body {
     background: #ffffff;
 }
 
-/* Iframe container */
 .main-content {
     background: #ffffff;
     border-radius: 12px;
@@ -57,12 +85,6 @@ body {
     margin: 2rem 0;
     overflow: hidden;
     border: 1px solid #e5e5e5;
-    transition: transform 0.3s ease, box-shadow 0.3s ease;
-}
-
-.main-content:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
 }
 
 .iframe-container {
@@ -82,7 +104,6 @@ body {
     border: none;
 }
 
-/* Navigation grid */
 .nav-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
@@ -90,124 +111,153 @@ body {
     margin-top: 2rem;
 }
 
-/* Navigation cards */
 .nav-card {
     background: #ffffff;
     border: 1px solid #e5e5e5;
     border-radius: 10px;
     padding: 1.5rem;
     transition: all 0.3s ease;
-    position: relative;
-    overflow: hidden;
-}
-
-.nav-card:hover {
-    transform: translateY(-5px);
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
-    border-color: #000000;
-}
-
-.nav-card a {
-    color: #000000;
-    text-decoration: none;
-    font-weight: 500;
-    font-size: 1.1rem;
-    display: flex;
-    align-items: center;
-    gap: 0.8rem;
-}
-
-.nav-card a::after {
-    content: '→';
-    opacity: 0;
-    margin-left: auto;
-    transition: opacity 0.3s ease;
-}
-
-.nav-card:hover a::after {
-    opacity: 1;
-}
-
-/* Hide Gradio elements */
-footer {
-    display: none !important;
 }
 
-.gradio-container {
-    margin: 0 !important;
-    padding: 0 !important;
+@media (max-width: 768px) {
+    .nav-grid {
+        grid-template-columns: 1fr;
+    }
 }
+""")
 
-/* Custom scrollbar */
-::-webkit-scrollbar {
-    width: 8px;
-}
-
-::-webkit-scrollbar-track {
-    background: #f1f1f1;
-}
+# Configuration validation
+def validate_configuration(demo_config):
+    """
+    Validate Gradio configuration
+    """
+    required_attributes = [
+        'title', 
+        'css', 
+        'show_error', 
+        'show_api', 
+        'show_tips', 
+        'height', 
+        'analytics_enabled', 
+        'enable_queue'
+    ]
+    
+    validation_results = {}
+    for attr in required_attributes:
+        try:
+            value = getattr(demo_config, attr, None)
+            validation_results[attr] = value is not None
+        except Exception as e:
+            logger.error(f"Error validating {attr}: {e}")
+            validation_results[attr] = False
+    
+    return validation_results
 
-::-webkit-scrollbar-thumb {
-    background: #888;
-    border-radius: 4px;
-}
+# Navigation cards validation
+def validate_navigation_cards(cards):
+    """
+    Validate navigation card configuration
+    """
+    required_keys = ['icon', 'title', 'url']
+    invalid_cards = []
+    
+    for card in cards:
+        missing_keys = [key for key in required_keys if key not in card]
+        if missing_keys:
+            invalid_cards.append({
+                'card': card, 
+                'missing_keys': missing_keys
+            })
+    
+    return invalid_cards
 
-::-webkit-scrollbar-thumb:hover {
-    background: #555;
-}
-"""
-
-with gr.Blocks(css=css, title="Centurion Analysis Platform") as demo:
-    # Header
-    with gr.Row(elem_classes=["header"]):
-        gr.Image(
-            "https://raw.githubusercontent.com/noumanjavaid96/ai-as-an-api/refs/heads/master/image%20(39).png",
-            elem_classes=["logo"],
-            show_label=False,
-            container=False
+def create_demo():
+    """
+    Create Gradio demo with comprehensive validation
+    """
+    try:
+        cards = [
+            {"icon": "🔍", "title": "DeepFake Detection", "url": "https://noumanjavaid-new-space.hf.space"},
+            {"icon": "📄", "title": "Document Analysis", "url": "https://noumanjavaid-centurionv2.hf.space"},
+            {"icon": "🎥", "title": "Video Watermarking", "url": "https://noumanjavaid-watermark-demo-video.hf.space"},
+            {"icon": "🔐", "title": "Image Authentication", "url": "https://noumanjavaid-centii.hf.space"},
+        ]
+        
+        # Validate navigation cards
+        invalid_cards = validate_navigation_cards(cards)
+        if invalid_cards:
+            logger.warning(f"Invalid navigation cards: {invalid_cards}")
+        
+        # Generate HTML for navigation cards
+        html_cards = "".join(
+            f'''
+            <div class="nav-card" role="navigation" aria-label="{card['title']}">
+                <a href="{card['url']}" target="_blank">
+                    {card['icon']} {card['title']}
+                </a>
+            </div>
+            ''' for card in cards
         )
-        gr.Markdown("Centurion Analysis", elem_classes=["header-title"])
-    
-    # Main content
-    with gr.Row(elem_classes=["container"]):
-        with gr.Column(elem_classes=["main-content"]):
-            gr.HTML('''
-                <div class="iframe-container">
-                    <iframe src="https://noumanjavaid-centii.hf.space"></iframe>
-                </div>
-            ''')
         
-        # Navigation cards
-        with gr.Row(elem_classes=["nav-grid"]):
-            gr.HTML('''
-                <div class="nav-card">
-                    <a href="https://noumanjavaid-new-space.hf.space" target="_blank">
-                        🔍 DeepFake Detection
-                    </a>
-                </div>
-                
-                <div class="nav-card">
-                    <a href="https://noumanjavaid-centurionv2.hf.space" target="_blank">
-                        📄 Document Analysis
-                    </a>
-                </div>
-                
-                <div class="nav-card">
-                    <a href="https://noumanjavaid-watermark-demo-video.hf.space" target="_blank">
-                        🎥 Video Watermarking
-                    </a>
-                </div>
+        # Create Gradio block
+        with gr.Blocks(css=css, title="Centurion Analysis Platform") as demo:
+            # Header
+            with gr.Row(elem_classes=["header"]):
+                gr.Image(
+                    "https://raw.githubusercontent.com/noumanjavaid96/ai-as-an-api/refs/heads/master/image%20(39).png",
+                    elem_classes=["logo"],
+                    show_label=False,
+                    container=False
+                )
+                gr.Markdown("Centurion Analysis", elem_classes=["header-title"])
+            
+            # Main content
+            with gr.Row(elem_classes=["container"]):
+                with gr.Column(elem_classes=["main-content"]):
+                    gr.HTML('''
+                        <div class="iframe-container">
+                            <iframe 
+                                src="https://noumanjavaid-centii.hf.space" 
+                                loading="lazy"
+                                title="Centurion Main Platform"
+                            ></iframe>
+                        </div>
+                    ''')
                 
-                <div class="nav-card">
-                    <a href="https://noumanjavaid-centii.hf.space" target="_blank">
-                        🔐 Image Authentication
-                    </a>
-                </div>
-            ''')
-
-if __name__ == "__main__":
-    demo.launch(
-        show_error=True,
-        show_api=False,
-        height=800,    
-    )
+                # Navigation grid
+                with gr.Row(elem_classes=["nav-grid"]):
+                    gr.HTML(html_cards)
+        
+        # Validate configuration
+        config_validation = validate_configuration(demo)
+        logger.info(f"Configuration Validation: {config_validation}")
+        
+        return demo
+    
+    except Exception as e:
+        logger.error(f"Demo creation error: {e}")
+        logger.error(traceback.format_exc())
+        return None
+
+def main():
+    """
+    Main application launch with comprehensive error handling
+    """
+    try:
+        demo = create_demo()
+        
+        if demo is None:
+            logger.critical("Failed to create Gradio demo")
+            return
+        
+        demo.launch(
+            show_error=True,
+            show_api=False,
+            show_tips=False,
+            height=800,
+            analytics_enabled=False,
+            enable_queue=False
+        )
+    
+    except Exception as e:
+        logger