Update app.py

app.py

@@ -8,18 +8,29 @@ import tempfile
 TRANSLATIONS = {
     'en': {
         'title': 'Convert Image to SVG Vectors',
-        'description': 'Upload an image and customize the conversion parameters as needed.'
+        'description': 'Upload an image and customize the conversion parameters as needed.',
+        'upload_label': 'Upload Image',
+        'convert_btn': 'Convert to SVG',
+        'svg_output': 'SVG Output',
+        'download_svg': 'Download SVG'
     },
     'de': {
         'title': 'Bild in SVG-Vektoren umwandeln',
-        'description': 'Laden Sie ein Bild hoch und passen Sie die Konvertierungsparameter nach Bedarf an.'
+        'description': 'Laden Sie ein Bild hoch und passen Sie die Konvertierungsparameter nach Bedarf an.',
+        'upload_label': 'Bild hochladen',
+        'convert_btn': 'In SVG umwandeln',
+        'svg_output': 'SVG-Ausgabe',
+        'download_svg': 'SVG herunterladen'
     }
 }
 
 def convert_image(image, color_mode, hierarchical, mode, filter_speckle,
- color_precision, layer_difference, corner_threshold,
- length_threshold, max_iterations, splice_threshold, path_precision):
+                 color_precision, layer_difference, corner_threshold,
+                 length_threshold, max_iterations, splice_threshold, path_precision):
     """Converts an image to SVG using vtracer with customizable parameters."""
+    if image is None:
+        return None, None
+        
     # Convert Gradio image to bytes for vtracer compatibility
     img_byte_array = io.BytesIO()
     image.save(img_byte_array, format='PNG')
@@ -48,77 +59,49 @@ def convert_image(image, color_mode, hierarchical, mode, filter_speckle,
     temp_file.close()
 
     return (
-        gr.HTML(f'<svg viewBox="0 0 {image.width} {image.height}">{svg_str}</svg>'), 
+        f'<svg viewBox="0 0 {image.width} {image.height}" style="max-width: 100%; height: auto;">{svg_str}</svg>', 
         temp_file.name
     )
 
-# Create Gradio interface
-with gr.Blocks() as vector_converter_interface:
-    # Language selector at the top
-    language_dropdown = gr.Dropdown(
-        choices=['en', 'de'], 
-        value='en', 
-        label='Language / Sprache'
-    )
-    
-    # Title and description that will be updated
-    title_display = gr.Markdown(f"# {TRANSLATIONS['en']['title']}")
-    description_display = gr.Markdown(TRANSLATIONS['en']['description'])
-    
-    # Main interface components
-    with gr.Row():
-        with gr.Column():
-            image_input = gr.Image(type="pil", label="Upload Image")
-            
-        with gr.Column():
-            color_mode = gr.Radio(choices=["Color", "Binary"], value="Color", label="Color Mode")
-            hierarchical = gr.Radio(choices=["Stacked", "Cutout"], value="Stacked", label="Hierarchical")
-            mode = gr.Radio(choices=["Spline", "Polygon", "None"], value="Spline", label="Mode")
-    
-    with gr.Row():
-        with gr.Column():
-            filter_speckle = gr.Slider(minimum=1, maximum=10, value=4, step=1, label="Filter Speckle")
-            color_precision = gr.Slider(minimum=1, maximum=8, value=6, step=1, label="Color Precision")
-            layer_difference = gr.Slider(minimum=1, maximum=32, value=16, step=1, label="Layer Difference")
-            corner_threshold = gr.Slider(minimum=10, maximum=90, value=60, step=1, label="Corner Threshold")
-            
-        with gr.Column():
-            length_threshold = gr.Slider(minimum=3.5, maximum=10, value=4.0, step=0.5, label="Length Threshold")
-            max_iterations = gr.Slider(minimum=1, maximum=20, value=10, step=1, label="Max Iterations")
-            splice_threshold = gr.Slider(minimum=10, maximum=90, value=45, step=1, label="Splice Threshold")
-            path_precision = gr.Slider(minimum=1, maximum=10, value=8, step=1, label="Path Precision")
-    
-    # Convert button
-    convert_btn = gr.Button("Convert to SVG", variant="primary")
-    
-    # Output components
-    with gr.Row():
-        svg_output = gr.HTML(label="SVG Output")
-        file_output = gr.File(label="Download SVG")
-    
-    # Function to update language
-    def update_language(language):
-        new_title = f"# {TRANSLATIONS[language]['title']}"
-        new_description = TRANSLATIONS[language]['description']
-        return new_title, new_description
-    
-    # Connect the language dropdown to update title and description
-    language_dropdown.change(
-        fn=update_language,
-        inputs=[language_dropdown],
-        outputs=[title_display, description_display]
+def update_interface(language):
+    """Update interface language"""
+    return (
+        f"# {TRANSLATIONS[language]['title']}",
+        TRANSLATIONS[language]['description'],
+        TRANSLATIONS[language]['upload_label'],
+        TRANSLATIONS[language]['convert_btn'],
+        TRANSLATIONS[language]['svg_output'],
+        TRANSLATIONS[language]['download_svg']
     )
-    
-    # Connect the convert button to the conversion function
-    convert_btn.click(
+
+# Create the interface using gr.Interface instead of gr.Blocks
+def create_interface():
+    return gr.Interface(
         fn=convert_image,
         inputs=[
-            image_input, color_mode, hierarchical, mode, filter_speckle,
-            color_precision, layer_difference, corner_threshold,
-            length_threshold, max_iterations, splice_threshold, path_precision
+            gr.Image(type="pil", label="Upload Image"),
+            gr.Radio(choices=["Color", "Binary"], value="Color", label="Color Mode"),
+            gr.Radio(choices=["Stacked", "Cutout"], value="Stacked", label="Hierarchical"),
+            gr.Radio(choices=["Spline", "Polygon", "None"], value="Spline", label="Mode"),
+            gr.Slider(minimum=1, maximum=10, value=4, step=1, label="Filter Speckle"),
+            gr.Slider(minimum=1, maximum=8, value=6, step=1, label="Color Precision"),
+            gr.Slider(minimum=1, maximum=32, value=16, step=1, label="Layer Difference"),
+            gr.Slider(minimum=10, maximum=90, value=60, step=1, label="Corner Threshold"),
+            gr.Slider(minimum=3.5, maximum=10, value=4.0, step=0.5, label="Length Threshold"),
+            gr.Slider(minimum=1, maximum=20, value=10, step=1, label="Max Iterations"),
+            gr.Slider(minimum=10, maximum=90, value=45, step=1, label="Splice Threshold"),
+            gr.Slider(minimum=1, maximum=10, value=8, step=1, label="Path Precision")
         ],
-        outputs=[svg_output, file_output]
+        outputs=[
+            gr.HTML(label="SVG Output"),
+            gr.File(label="Download SVG")
+        ],
+        title="Convert Image to SVG Vectors / Bild in SVG-Vektoren umwandeln",
+        description="Upload an image and customize the conversion parameters as needed. / Laden Sie ein Bild hoch und passen Sie die Konvertierungsparameter nach Bedarf an."
     )
 
+# Create and launch the interface
+vector_converter_interface = create_interface()
+
 if __name__ == "__main__":
-    vector_converter_interface.launch(enable_api=False)
+    vector_converter_interface.launch()