Update app.py

app.py

@@ -1,54 +1,103 @@
 """
 🎨 Basic Image Adjustments - App 2 do Photoshop AI Ecosystem
-Versão otimizada para Hugging Face Spaces com Gradio 6.2.0
+Versão definitiva para Hugging Face Spaces com Gradio 6.2.0
 """
 
 import gradio as gr
 from PIL import Image, ImageEnhance, ImageOps
 import tempfile
 import numpy as np
+import traceback
+import sys
+import os
+
+print("=" * 50)
+print("🚀 INICIANDO APP BASIC ADJUSTMENTS")
+print(f"Python version: {sys.version}")
+print(f"Gradio version: {gr.__version__}")
+print(f"PIL version: {Image.__version__}")
+print("=" * 50)
 
 # ========== FUNÇÕES DE PROCESSAMENTO ==========
 
+def log_function_call(func_name, *args):
+    """Registra chamadas de função para debug"""
+    print(f"📝 [{func_name}] Chamada com {len(args)} argumentos")
+    return True
+
 def process_image(image, brightness=1.0, contrast=1.0, saturation=1.0, sharpness=1.0, auto_contrast=False):
     """Aplica ajustes básicos à imagem"""
-    if image is None:
-        return None
+    log_function_call("process_image", brightness, contrast, saturation, sharpness, auto_contrast)
     
     try:
+        if image is None:
+            print("⚠️ process_image: imagem é None")
+            return None
+        
+        print(f"📊 process_image: tipo da entrada: {type(image)}")
+        
         # Converter para PIL Image se necessário
         if isinstance(image, np.ndarray):
-            img = Image.fromarray(image)
-        elif not isinstance(image, Image.Image):
-            return None
+            print("🔧 Convertendo numpy array para PIL Image")
+            img = Image.fromarray(image.astype('uint8'))
+        elif isinstance(image, dict):
+            # Gradio 6+ pode retornar dict
+            print("🔧 Convertendo dict para PIL Image")
+            if 'image' in image:
+                img = Image.fromarray(image['image'])
+            else:
+                print("❌ Dict não contém 'image' key")
+                return None
         else:
-            img = image.copy()
+            print("🔧 Usando imagem como está")
+            img = image
+        
+        print(f"📏 process_image: tamanho da imagem: {img.size}")
+        print(f"🎨 process_image: modo da imagem: {img.mode}")
         
         # Aplicar contraste automático
         if auto_contrast:
+            print("⚡ Aplicando contraste automático")
             img = ImageOps.autocontrast(img, cutoff=2)
         
         # Aplicar ajustes na ordem correta
+        adjustments_applied = []
+        
         if brightness != 1.0:
+            print(f"☀️ Aplicando brilho: {brightness}")
             img = ImageEnhance.Brightness(img).enhance(brightness)
+            adjustments_applied.append(f"brilho={brightness}")
         
         if contrast != 1.0:
+            print(f"🎭 Aplicando contraste: {contrast}")
             img = ImageEnhance.Contrast(img).enhance(contrast)
+            adjustments_applied.append(f"contraste={contrast}")
         
         if saturation != 1.0:
+            print(f"🌈 Aplicando saturação: {saturation}")
             img = ImageEnhance.Color(img).enhance(saturation)
+            adjustments_applied.append(f"saturação={saturation}")
         
         if sharpness != 1.0:
+            print(f"🔍 Aplicando nitidez: {sharpness}")
             img = ImageEnhance.Sharpness(img).enhance(sharpness)
+            adjustments_applied.append(f"nitidez={sharpness}")
+        
+        if adjustments_applied:
+            print(f"✅ Ajustes aplicados: {', '.join(adjustments_applied)}")
+        else:
+            print("ℹ️ Nenhum ajuste aplicado (valores padrão)")
         
         return img
     
     except Exception as e:
-        print(f"Erro no processamento: {e}")
-        return image
+        print(f"❌ ERRO em process_image: {str(e)}")
+        print(traceback.format_exc())
+        return None
 
 def get_preset(preset_name):
     """Retorna valores para os presets"""
+    print(f"🎯 get_preset: {preset_name}")
     presets = {
         'vibrant': (1.2, 1.3, 1.4, 1.1, False),
         'soft': (1.05, 0.9, 0.8, 0.9, False),
@@ -57,136 +106,216 @@ def get_preset(preset_name):
         'bw': (1.0, 1.2, 0.0, 1.1, False),
         'reset': (1.0, 1.0, 1.0, 1.0, False)
     }
-    return presets.get(preset_name, presets['reset'])
+    result = presets.get(preset_name, presets['reset'])
+    print(f"📋 Preset {preset_name}: {result}")
+    return result
 
 def save_image(image):
     """Salva imagem para download"""
-    if image is None:
-        return None
+    log_function_call("save_image")
     
     try:
+        if image is None:
+            print("❌ save_image: imagem é None")
+            return None
+        
+        print(f"💾 Salvando imagem para download")
         temp_file = tempfile.NamedTemporaryFile(delete=False, suffix=".png", prefix="adjusted_")
-        image.save(temp_file.name, "PNG")
+        image.save(temp_file.name, "PNG", optimize=True)
+        print(f"✅ Imagem salva em: {temp_file.name}")
         return temp_file.name
+    
     except Exception as e:
-        print(f"Erro ao salvar: {e}")
+        print(f"❌ ERRO em save_image: {str(e)}")
+        print(traceback.format_exc())
         return None
 
-# ========== INTERFACE GRADIO 6.2.0 ==========
+def update_on_load(image):
+    """Atualiza displays quando imagem é carregada"""
+    print("🔄 update_on_load chamado")
+    log_function_call("update_on_load")
+    
+    try:
+        if image is None:
+            print("⚠️ update_on_load: imagem é None")
+            return None, None
+        
+        print(f"📥 Imagem carregada, tipo: {type(image)}")
+        processed = process_image(image)
+        print("✅ update_on_load concluído")
+        return image, processed
+    
+    except Exception as e:
+        print(f"❌ ERRO em update_on_load: {str(e)}")
+        return None, None
 
-# CSS customizado
-css = """
-.header {
-    text-align: center;
-    padding: 20px;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    border-radius: 10px;
-    color: white;
-    margin-bottom: 20px;
-}
-.slider-container {
-    padding: 15px;
-    background: #f8f9fa;
-    border-radius: 8px;
-    margin-bottom: 10px;
-}
-.preset-btn {
-    margin: 5px;
-}
-.image-container {
-    border: 2px solid #e0e0e0;
-    border-radius: 10px;
-    padding: 10px;
-    background: white;
-}
-.download-btn {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    color: white;
-    border: none;
-    padding: 12px 24px;
-    border-radius: 8px;
-    font-weight: bold;
-}
-.control-label {
-    font-weight: bold;
-    color: #333;
-    margin-bottom: 5px;
-}
-"""
+def update_on_change(image, b, c, s, sh, ac):
+    """Atualiza imagem quando controles mudam"""
+    log_function_call("update_on_change", b, c, s, sh, ac)
+    
+    try:
+        if image is None:
+            print("⚠️ update_on_change: imagem é None")
+            return None
+        
+        print(f"🔄 Atualizando com parâmetros: brilho={b}, contraste={c}, saturação={s}, nitidez={sh}, auto={ac}")
+        result = process_image(image, b, c, s, sh, ac)
+        print("✅ update_on_change concluído")
+        return result
+    
+    except Exception as e:
+        print(f"❌ ERRO em update_on_change: {str(e)}")
+        return None
+
+# ========== INTERFACE GRADIO ==========
 
-# Criar interface
-with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
+print("🎨 Criando interface Gradio...")
+
+# Criar interface SEM css no construtor (corrige warning do Gradio 6+)
+with gr.Blocks(title="🎨 Basic Image Adjustments") as demo:
+    
+    # Aplicar CSS depois
+    demo.css = """
+    .header-box {
+        text-align: center;
+        padding: 20px;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        border-radius: 10px;
+        color: white;
+        margin-bottom: 20px;
+    }
+    .control-box {
+        padding: 15px;
+        background: #f8f9fa;
+        border-radius: 8px;
+        margin-bottom: 10px;
+        border: 1px solid #dee2e6;
+    }
+    .preset-btn {
+        margin: 5px;
+        transition: all 0.3s;
+    }
+    .preset-btn:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+    }
+    .image-box {
+        border: 2px solid #e0e0e0;
+        border-radius: 10px;
+        padding: 10px;
+        background: white;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
+    }
+    .download-btn {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        border: none;
+        padding: 12px 24px;
+        border-radius: 8px;
+        font-weight: bold;
+        transition: all 0.3s;
+    }
+    .download-btn:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
+    }
+    .slider-label {
+        font-weight: bold;
+        color: #333;
+        margin-bottom: 5px;
+        display: block;
+    }
+    """
+    
+    print("✅ CSS aplicado")
     
     # Cabeçalho
     gr.HTML("""
-    <div class="header">
-        <h1 style="margin: 0;">🎨 Basic Image Adjustments</h1>
-        <p style="margin: 5px 0 0 0; opacity: 0.9;">App 2 do Photoshop AI Ecosystem</p>
-        <p style="margin: 5px 0 0 0; font-size: 0.9em;">Ajuste brilho, contraste, saturação e nitidez</p>
+    <div class="header-box">
+        <h1 style="margin: 0; font-size: 2.2em;">🎨 Basic Image Adjustments</h1>
+        <p style="margin: 5px 0 0 0; opacity: 0.9; font-size: 1.1em;">App 2 do Photoshop AI Ecosystem</p>
+        <p style="margin: 5px 0 0 0; font-size: 0.95em;">Ajuste brilho, contraste, saturação e nitidez em tempo real</p>
     </div>
     """)
     
+    print("✅ Cabeçalho criado")
+    
     with gr.Row():
-        # Coluna 1: Upload
+        # Coluna 1: Upload e Controles
         with gr.Column(scale=1):
             gr.Markdown("### 📤 Upload da Imagem")
+            
             image_input = gr.Image(
                 type="pil",
-                label="Clique ou arraste uma imagem",
-                height=150,
-                elem_classes="image-container"
+                label="Clique ou arraste uma imagem aqui",
+                height=180,
+                elem_classes="image-box"
             )
             
+            print("✅ Componente de upload criado")
+            
             gr.Markdown("### ⚙️ Controles de Ajuste")
             
-            with gr.Column(elem_classes="slider-container"):
+            with gr.Column(elem_classes="control-box"):
                 brightness = gr.Slider(
-                    0.0, 2.0, 1.0,
+                    minimum=0.0,
+                    maximum=2.0,
+                    value=1.0,
                     step=0.1,
                     label="☀️ Brilho",
-                    info="0 = Escuro | 1 = Normal | 2 = Brilhante"
+                    info="Controla a luminosidade geral (0=escuro, 1=normal, 2=brilhante)"
                 )
                 
                 contrast = gr.Slider(
-                    0.0, 2.0, 1.0,
+                    minimum=0.0,
+                    maximum=2.0,
+                    value=1.0,
                     step=0.1,
                     label="🎭 Contraste",
-                    info="0 = Baixo | 1 = Normal | 2 = Alto"
+                    info="Controla a diferença entre cores claras e escuras"
                 )
                 
                 saturation = gr.Slider(
-                    0.0, 2.0, 1.0,
+                    minimum=0.0,
+                    maximum=2.0,
+                    value=1.0,
                     step=0.1,
                     label="🌈 Saturação",
-                    info="0 = P&B | 1 = Normal | 2 = Intenso"
+                    info="Controla a intensidade das cores (0=preto e branco)"
                 )
                 
                 sharpness = gr.Slider(
-                    0.0, 2.0, 1.0,
+                    minimum=0.0,
+                    maximum=2.0,
+                    value=1.0,
                     step=0.1,
                     label="🔍 Nitidez",
-                    info="0 = Borrado | 1 = Normal | 2 = Nítido"
+                    info="Controla a definição dos detalhes"
                 )
             
             auto_contrast = gr.Checkbox(
-                label="⚡ Aplicar Contraste Automático",
+                label="⚡ Contraste Automático",
                 value=False,
                 info="Otimiza automaticamente o contraste da imagem"
             )
+            
+            print("✅ Controles criados")
         
         # Coluna 2: Presets e Visualização
         with gr.Column(scale=1):
             gr.Markdown("### 🎨 Presets Rápidos")
             
             with gr.Row():
-                vibrant_btn = gr.Button("✨ Vibrante", variant="secondary", size="sm", min_width=100)
-                soft_btn = gr.Button("🌸 Suave", variant="secondary", size="sm", min_width=100)
-                dramatic_btn = gr.Button("🌑 Dramático", variant="secondary", size="sm", min_width=100)
+                vibrant_btn = gr.Button("✨ Vibrante", variant="secondary", size="sm", elem_classes="preset-btn")
+                soft_btn = gr.Button("🌸 Suave", variant="secondary", size="sm", elem_classes="preset-btn")
+                dramatic_btn = gr.Button("🌑 Dramático", variant="secondary", size="sm", elem_classes="preset-btn")
             
             with gr.Row():
-                retro_btn = gr.Button("📻 Retrô", variant="secondary", size="sm", min_width=100)
-                bw_btn = gr.Button("⚫ P&B", variant="secondary", size="sm", min_width=100)
-                reset_btn = gr.Button("🔄 Resetar", variant="stop", size="sm", min_width=100)
+                retro_btn = gr.Button("📻 Retrô", variant="secondary", size="sm", elem_classes="preset-btn")
+                bw_btn = gr.Button("⚫ Preto & Branco", variant="secondary", size="sm", elem_classes="preset-btn")
+                reset_btn = gr.Button("🔄 Resetar", variant="stop", size="sm", elem_classes="preset-btn")
+            
+            print("✅ Botões de preset criados")
             
             # Visualização
             gr.Markdown("### 👁️ Visualização")
@@ -197,8 +326,9 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
                     original_display = gr.Image(
                         type="pil",
                         interactive=False,
-                        height=200,
-                        elem_classes="image-container"
+                        height=220,
+                        elem_classes="image-box",
+                        show_label=False
                     )
                 
                 with gr.Column():
@@ -206,36 +336,37 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
                     processed_display = gr.Image(
                         type="pil",
                         interactive=False,
-                        height=200,
-                        elem_classes="image-container"
+                        height=220,
+                        elem_classes="image-box",
+                        show_label=False
                     )
+            
+            print("✅ Displays de imagem criados")
     
     # Download
     with gr.Row():
         with gr.Column():
-            gr.Markdown("### 💾 Exportação")
+            gr.Markdown("### 💾 Exportar Imagem")
             
-            with gr.Row():
-                download_btn = gr.Button(
-                    "📥 Baixar Imagem Ajustada",
-                    variant="primary",
-                    size="lg",
-                    elem_classes="download-btn"
-                )
+            download_btn = gr.Button(
+                "📥 Baixar Imagem Ajustada",
+                variant="primary",
+                size="lg",
+                elem_classes="download-btn"
+            )
             
             download_file = gr.File(
                 label="Arquivo para download",
                 interactive=False
             )
+            
+            print("✅ Botão de download criado")
     
-    # ========== EVENT HANDLERS ==========
+    # ========== CONECTAR EVENTOS ==========
     
-    # Quando imagem é carregada
-    def update_on_load(image):
-        if image is None:
-            return None, None
-        return image, process_image(image)
+    print("🔗 Conectando eventos...")
     
+    # Quando imagem é carregada
     image_input.change(
         fn=update_on_load,
         inputs=[image_input],
@@ -243,13 +374,9 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
     )
     
     # Quando controles mudam
-    def update_on_change(image, b, c, s, sh, ac):
-        if image is None:
-            return None
-        return process_image(image, b, c, s, sh, ac)
+    controls_list = [brightness, contrast, saturation, sharpness, auto_contrast]
     
-    # Conectar todos os controles
-    for control in [brightness, contrast, saturation, sharpness, auto_contrast]:
+    for control in controls_list:
         control.change(
             fn=update_on_change,
             inputs=[image_input, brightness, contrast, saturation, sharpness, auto_contrast],
@@ -257,36 +384,37 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
         )
     
     # Presets
-    def apply_preset(preset_name):
+    def apply_preset_wrapper(preset_name):
+        print(f"🎯 Aplicando preset: {preset_name}")
         return get_preset(preset_name)
     
     vibrant_btn.click(
-        fn=lambda: apply_preset('vibrant'),
+        fn=lambda: apply_preset_wrapper('vibrant'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
     soft_btn.click(
-        fn=lambda: apply_preset('soft'),
+        fn=lambda: apply_preset_wrapper('soft'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
     dramatic_btn.click(
-        fn=lambda: apply_preset('dramatic'),
+        fn=lambda: apply_preset_wrapper('dramatic'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
     retro_btn.click(
-        fn=lambda: apply_preset('retro'),
+        fn=lambda: apply_preset_wrapper('retro'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
     bw_btn.click(
-        fn=lambda: apply_preset('bw'),
+        fn=lambda: apply_preset_wrapper('bw'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
     reset_btn.click(
-        fn=lambda: apply_preset('reset'),
+        fn=lambda: apply_preset_wrapper('reset'),
         outputs=[brightness, contrast, saturation, sharpness, auto_contrast]
     )
     
@@ -297,10 +425,12 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
         outputs=[download_file]
     )
     
-    # Guia de uso
+    print("✅ Todos os eventos conectados")
+    
+    # Informações
     with gr.Accordion("📖 Guia de Uso & Dicas", open=False):
         gr.Markdown("""
-        ## 🚀 Como usar:
+        ## 🚀 Como usar este app:
         
         1. **Faça upload** de uma imagem clicando na área acima
         2. **Ajuste os controles** deslizantes para modificar a imagem
@@ -328,13 +458,6 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
         - Saturação: 1.0
         - Nitidez: 1.2
         
-        ## ⚙️ Sobre os controles:
-        - **Brilho**: Controla a luminosidade geral da imagem
-        - **Contraste**: Aumenta ou diminui a diferença entre cores claras e escuras
-        - **Saturação**: Controla a intensidade das cores (0 = Preto e Branco)
-        - **Nitidez**: Melhora a definição dos detalhes da imagem
-        - **Contraste Automático**: Ajusta automaticamente o contraste para melhor visualização
-        
         ## 🎨 Sobre os presets:
         - **Vibrante**: Realça cores para fotos de natureza e paisagens
         - **Suave**: Tons sutis e delicados, ideal para retratos
@@ -342,14 +465,14 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
         - **Retrô**: Efeito vintage com cores desbotadas
         - **Preto & Branco**: Converte para escala de cinza
         
-        ## 💾 Formato de exportação:
-        - As imagens são exportadas em formato **PNG**
-        - Qualidade máxima preservada
-        - Transparência mantida (se aplicável)
+        ## ⚠️ Problemas comuns:
+        - **Imagem não aparece**: Verifique se o formato é suportado (JPG, PNG, WEBP)
+        - **Download não funciona**: Tente usar outra imagem
+        - **Ajustes lentos**: Imagens muito grandes podem processar mais devagar
         """)
     
     # Rodapé
-    gr.HTML("""
+    gr.HTML(f"""
     <div style="
         text-align: center;
         margin-top: 30px;
@@ -362,10 +485,26 @@ with gr.Blocks(css=css, title="🎨 Basic Image Adjustments") as demo:
             🎨 Basic Image Adjustments - App 2 do Photoshop AI Ecosystem
         </p>
         <p style="margin: 5px 0 0 0; font-size: 0.9em; color: #666;">
+            Gradio {gr.__version__} • Python {sys.version.split()[0]} • PIL {Image.__version__}
+        </p>
+        <p style="margin: 5px 0 0 0; font-size: 0.85em; color: #888;">
             Cada app tem uma função específica • Este app apenas ajusta brilho, contraste, saturação e nitidez
         </p>
     </div>
     """)
+    
+    print("✅ Interface completa criada")
+
+print("=" * 50)
+print("✅ APLICATIVO PRONTO PARA EXECUÇÃO")
+print("=" * 50)
+
+# ========== INICIALIZAÇÃO PARA HUGGING FACE ==========
+# O Hugging Face Spaces detecta automaticamente a variável 'demo'
+# e chama demo.launch() por conta própria
+# NÃO chame demo.launch() manualmente aqui
 
-# ========== FIM DO APLICATIVO ==========
-# Nota: Não chame demo.launch() - O Hugging Face Spaces cuida disso automaticamente
+# Para debug: verificar se o app está pronto
+print("🎯 App inicializado com sucesso!")
+print("📊 Estado da interface:", "OK" if demo else "ERRO")
+print("🏁 Aguardando conexões do Hugging Face Spaces...")