Spaces:

jebin2
/

Tools

Sleeping

App Files Files Community

jebin2 commited on Jun 30

Commit

05ba985

1 Parent(s): c8ef5ef

remove bg added

Browse files

Files changed (6) hide show

image/main.py +0 -15
image/process.json +0 -4
image/remove_background.html +607 -0
image/remove_background.py +3 -3
main.py +43 -14
requirements.txt +3 -1

image/main.py DELETED Viewed

@@ -1,15 +0,0 @@
-from process_exception import ProcessAlreadyRunning
-from .image_base import ImageBase
-from .remove_metadata import RemoveMetadata
-def remove_metadata():
-	with RemoveMetadata() as processor:
-		processor.remove_metadata("test.png")
-def is_process_running():
-	try:
-		ImageBase()
-	except ProcessAlreadyRunning as e:
-		return e.data
-	return None

image/process.json DELETED Viewed

@@ -1,4 +0,0 @@
-{
-    "start_time": "2025-06-29T13:24:50.598935",
-    "feature": "remove_metadata"
-}

image/remove_background.html ADDED Viewed

	@@ -0,0 +1,607 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Remove Background - Tools Collection</title>
+    <script src="/image/javascript/image.js"></script>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+        body {
+            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            min-height: 100vh;
+            padding: 20px;
+        }
+        .container {
+            max-width: 1000px;
+            margin: 0 auto;
+            background: white;
+            border-radius: 20px;
+            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+            overflow: hidden;
+        }
+        .header {
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+            color: white;
+            padding: 40px 30px;
+            text-align: center;
+            position: relative;
+        }
+        .back-button {
+            position: absolute;
+            left: 30px;
+            top: 50%;
+            transform: translateY(-50%);
+            background: rgba(255, 255, 255, 0.2);
+            color: white;
+            border: none;
+            padding: 12px 20px;
+            border-radius: 50px;
+            cursor: pointer;
+            font-size: 1rem;
+            transition: all 0.3s ease;
+            text-decoration: none;
+            display: flex;
+            align-items: center;
+            gap: 8px;
+        }
+        .back-button:hover {
+            background: rgba(255, 255, 255, 0.3);
+            transform: translateY(-50%) translateX(-2px);
+        }
+        .header-content {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 20px;
+            margin-bottom: 20px;
+        }
+        .header-text h1 {
+            font-size: 2.5rem;
+            margin-bottom: 10px;
+            font-weight: 300;
+        }
+        .header-text p {
+            font-size: 1.1rem;
+            opacity: 0.9;
+        }
+        .content {
+            padding: 40px;
+        }
+        .upload-section {
+            background: #f8f9fa;
+            border-radius: 15px;
+            padding: 40px;
+            text-align: center;
+            margin-bottom: 30px;
+            border: 2px dashed #dee2e6;
+            transition: all 0.3s ease;
+            cursor: pointer;
+        }
+        .upload-section:hover {
+            border-color: #667eea;
+            background: #f0f4ff;
+        }
+        .upload-section.dragover {
+            border-color: #667eea;
+            background: #e8f2ff;
+            transform: scale(1.02);
+        }
+        .upload-icon {
+            font-size: 4rem;
+            color: #667eea;
+            margin-bottom: 20px;
+            display: block;
+        }
+        .upload-text h3 {
+            color: #495057;
+            margin-bottom: 10px;
+            font-size: 1.5rem;
+        }
+        .upload-text p {
+            color: #6c757d;
+            margin-bottom: 20px;
+        }
+        .upload-button {
+            background: linear-gradient(135deg, #667eea, #764ba2);
+            color: white;
+            border: none;
+            padding: 15px 30px;
+            border-radius: 50px;
+            font-size: 1.1rem;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
+        }
+        .upload-button:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4);
+        }
+        .file-input {
+            display: none;
+        }
+        .settings-section {
+            background: white;
+            border-radius: 15px;
+            padding: 30px;
+            margin-bottom: 30px;
+            border: 1px solid #e9ecef;
+        }
+        .settings-title {
+            color: #495057;
+            font-size: 1.3rem;
+            margin-bottom: 20px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+        .settings-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+            gap: 20px;
+        }
+        .setting-group {
+            display: flex;
+            flex-direction: column;
+            gap: 8px;
+        }
+        .setting-label {
+            color: #495057;
+            font-weight: 500;
+            font-size: 0.95rem;
+        }
+        .setting-input {
+            padding: 12px 15px;
+            border: 2px solid #e9ecef;
+            border-radius: 10px;
+            font-size: 1rem;
+            transition: all 0.3s ease;
+        }
+        .setting-input:focus {
+            outline: none;
+            border-color: #667eea;
+            box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
+        }
+        .files-preview {
+            margin-top: 30px;
+        }
+        .preview-title {
+            color: #495057;
+            font-size: 1.3rem;
+            margin-bottom: 20px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+        .files-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+            gap: 20px;
+        }
+        .file-card {
+            background: white;
+            border-radius: 12px;
+            padding: 20px;
+            border: 1px solid #e9ecef;
+            transition: all 0.3s ease;
+            position: relative;
+        }
+        .file-card:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+        }
+        .file-preview {
+            width: 100%;
+            height: 120px;
+            background: #f8f9fa;
+            border-radius: 8px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 15px;
+            overflow: hidden;
+        }
+        .file-preview img {
+            max-width: 100%;
+            max-height: 100%;
+            object-fit: cover;
+            border-radius: 8px;
+        }
+        .file-icon {
+            font-size: 2rem;
+            color: #667eea;
+        }
+        .file-info h4 {
+            color: #495057;
+            font-size: 0.9rem;
+            margin-bottom: 5px;
+            word-break: break-all;
+        }
+        .file-info p {
+            color: #6c757d;
+            font-size: 0.8rem;
+            margin-bottom: 10px;
+        }
+        .file-status {
+            display: flex;
+            align-items: center;
+            gap: 8px;
+            margin-bottom: 10px;
+        }
+        .status-indicator {
+            width: 8px;
+            height: 8px;
+            border-radius: 50%;
+            background: #28a745;
+        }
+        .status-indicator.processing {
+            background: #ffc107;
+            animation: pulse 2s infinite;
+        }
+        .status-indicator.error {
+            background: #dc3545;
+        }
+        .remove-button {
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            background: #dc3545;
+            color: white;
+            border: none;
+            width: 24px;
+            height: 24px;
+            border-radius: 50%;
+            cursor: pointer;
+            font-size: 0.8rem;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            transition: all 0.3s ease;
+        }
+        .remove-button:hover {
+            background: #c82333;
+            transform: scale(1.1);
+        }
+        .progress-section {
+            margin-top: 30px;
+            display: none;
+        }
+        .progress-title {
+            color: #495057;
+            font-size: 1.2rem;
+            margin-bottom: 15px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+        .progress-bar-container {
+            background: #e9ecef;
+            border-radius: 10px;
+            height: 12px;
+            overflow: hidden;
+            margin-bottom: 10px;
+        }
+        .progress-bar {
+            background: linear-gradient(135deg, #28a745, #20c997);
+            height: 100%;
+            width: 0%;
+            transition: width 0.3s ease;
+            border-radius: 10px;
+        }
+        .progress-text {
+            color: #6c757d;
+            font-size: 0.9rem;
+            text-align: center;
+        }
+        .action-buttons {
+            display: flex;
+            gap: 15px;
+            justify-content: center;
+            margin-top: 30px;
+        }
+        .action-button {
+            padding: 15px 30px;
+            border: none;
+            border-radius: 50px;
+            font-size: 1.1rem;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+            min-width: 150px;
+            justify-content: center;
+        }
+        .process-button {
+            background: linear-gradient(135deg, #dc3545, #c82333);
+            color: white;
+            box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
+        }
+        .process-button:hover:not(:disabled) {
+            transform: translateY(-2px);
+            box-shadow: 0 8px 25px rgba(220, 53, 69, 0.4);
+        }
+        .process-button:disabled {
+            opacity: 0.6;
+            cursor: not-allowed;
+        }
+        .clear-button {
+            background: #6c757d;
+            color: white;
+        }
+        .clear-button:hover {
+            background: #5a6268;
+            transform: translateY(-2px);
+        }
+        .download-button {
+            background: linear-gradient(135deg, #007bff, #0056b3);
+            color: white;
+            box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3);
+        }
+        .download-button:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 8px 25px rgba(0, 123, 255, 0.4);
+        }
+        .error-message {
+            background: #f8d7da;
+            color: #721c24;
+            padding: 15px;
+            border-radius: 10px;
+            margin-bottom: 20px;
+            border: 1px solid #f5c6cb;
+            display: none;
+        }
+        .success-message {
+            background: #d4edda;
+            color: #155724;
+            padding: 15px;
+            border-radius: 10px;
+            margin-bottom: 20px;
+            border: 1px solid #c3e6cb;
+            display: none;
+        }
+        .info-box {
+            background: #d1ecf1;
+            color: #0c5460;
+            padding: 15px;
+            border-radius: 10px;
+            margin-bottom: 20px;
+            border: 1px solid #bee5eb;
+        }
+        .info-box h4 {
+            margin-bottom: 8px;
+            font-size: 1rem;
+        }
+        .info-box p {
+            font-size: 0.9rem;
+            margin: 0;
+        }
+        .metadata-modal {
+            display: none;
+            position: fixed;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            background: white;
+            padding: 30px;
+            border-radius: 10px;
+            box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
+            z-index: 9999;
+            max-width: 90%;
+            max-height: 80%;
+            overflow: auto;
+            word-wrap: break-word
+        }
+        .metadata-content {
+            white-space: pre-wrap;
+            margin-top: 15px;
+        }
+        .modal-backdrop {
+            display: none;
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: rgba(0, 0, 0, 0.5);
+            z-index: 9998;
+        }
+        @keyframes pulse {
+            0% {
+                transform: scale(1);
+                opacity: 1;
+            }
+            50% {
+                transform: scale(1.05);
+                opacity: 0.8;
+            }
+            100% {
+                transform: scale(1);
+                opacity: 1;
+            }
+        }
+        @media (max-width: 768px) {
+            .header-content {
+                flex-direction: column;
+                gap: 15px;
+            }
+            .header-text h1 {
+                font-size: 2rem;
+            }
+            .back-button {
+                position: static;
+                transform: none;
+                margin-bottom: 20px;
+                align-self: flex-start;
+            }
+            .content {
+                padding: 20px;
+            }
+            .action-buttons {
+                flex-direction: column;
+                align-items: center;
+            }
+        }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="header">
+            <a href="/" class="back-button">
+                ← Back to Tools
+            </a>
+            <div class="header-content">
+                <div class="header-text">
+                    <h1>Remove Background</h1>
+                    <p>Automatically remove backgrounds from your images using AI</p>
+                </div>
+            </div>
+        </div>
+        <div class="content">
+            <div class="error-message" id="error-message"></div>
+            <div class="success-message" id="success-message"></div>
+            <div class="info-box">
+                <h4>🎯 Background Removal Tool</h4>
+                <p>Upload your images and our AI will automatically detect and remove the background, leaving you with a transparent PNG perfect for design work, presentations, or e-commerce.</p>
+            </div>
+            <div class="upload-section" id="upload-section">
+                <span class="upload-icon">🖼️</span>
+                <div class="upload-text">
+                    <h3>Drop your images here</h3>
+                    <button class="upload-button">
+                        Choose Files
+                    </button>
+                </div>
+                <input type="file" id="file-input" class="file-input" multiple accept="image/*">
+            </div>
+            <div class="files-preview" id="files-preview" style="display: none;">
+                <h3 class="preview-title">
+                    📋 Selected Files
+                </h3>
+                <div class="files-grid" id="files-grid">
+                    <!-- File cards will be inserted here -->
+                </div>
+            </div>
+            <div class="progress-section" id="progress-section">
+                <h3 class="progress-title">
+                    🔄 Processing Images...
+                </h3>
+                <div class="progress-bar-container">
+                    <div class="progress-bar" id="progress-bar"></div>
+                </div>
+                <div class="progress-text" id="progress-text">0% complete</div>
+            </div>
+            <div class="action-buttons">
+                <button class="action-button process-button" id="process-button" disabled>
+                    ✂️ Remove Background
+                </button>
+                <button class="action-button clear-button" id="clear-button">
+                    🗑️ Clear All
+                </button>
+                <button class="action-button download-button" id="download-button" style="display: none;">
+                    💾 Download All
+                </button>
+            </div>
+        </div>
+    </div>
+    <script>
+        function secret_sauce_url() {
+            return '/image/remove_background';
+        }
+    </script>
+    <div id="metadata-modal" class="metadata-modal">
+        <button onclick="closeMetadataModal()" class="remove-button">×</button>
+        <h3>Removed Metadata</h3>
+        <pre id="metadata-content" class="metadata-content"></pre>
+    </div>
+    <div id="modal-backdrop" class="modal-backdrop" onclick="closeMetadataModal()"></div>
+</body>
+</html>

image/remove_background.py CHANGED Viewed

@@ -5,11 +5,11 @@ This module provides a high-quality, class-based background remover using rembg.
 """
 from rembg import remove
-from pathlib import Path
 from custom_logger import logger_config
-class RemoveBackground:
 	"""
 	High-quality background remover using the rembg library.
@@ -20,7 +20,7 @@ class RemoveBackground:
 	def __init__(self):
 		super().__init__("remove_background")
-	def remove_background(self, input_file_name: str) -> str:
 		try:
 			self.input_file_name = input_file_name
 			self.input_file_path = f'{self.input_dir}/{self.input_file_name}'

 """
 from rembg import remove
+from .image_base import ImageBase
 from custom_logger import logger_config
+class RemoveBackground(ImageBase):
 	"""
 	High-quality background remover using the rembg library.
 	def __init__(self):
 		super().__init__("remove_background")
+	def process(self, input_file_name: str) -> str:
 		try:
 			self.input_file_name = input_file_name
 			self.input_file_path = f'{self.input_dir}/{self.input_file_name}'

main.py CHANGED Viewed

@@ -3,11 +3,11 @@ from fastapi.responses import HTMLResponse, JSONResponse, FileResponse
 from fastapi.staticfiles import StaticFiles
 from jinja2 import Environment, FileSystemLoader, select_autoescape
 from custom_logger import logger_config
-from image.main import is_process_running as is_image_process_running
 from image.image_base import ImageBase
 from pydantic import BaseModel
 from image.converter import Converter
 from image.remove_metadata import RemoveMetadata
 import mimetypes
 app = FastAPI(title="Tools Collection", description="Collection of utility tools")
@@ -28,10 +28,9 @@ FEATURES = {
         "name": "Image Tools",
         "description": "HEIC to PNG/JPG conversion and metadata removal",
         "icon": "🖼️",
-        "features": ["convert", "remove_metadata"],
         "folder": "image",
-        "tags": ["image", "heic", "png", "jpg", "convert", "metadata"],
-        "is_process_running": is_image_process_running
     },
     "pdf": {
         "name": "PDF Tools",
@@ -40,8 +39,7 @@ FEATURES = {
         "features": ["images_to_pdf"],
         "folder": "pdf",
         "tags": ["pdf", "merge", "convert", "images", "document"],
-        "coming_soon": True,
-        "is_process_running": is_image_process_running
     },
     "audio": {
         "name": "Audio Tools",
@@ -50,8 +48,7 @@ FEATURES = {
         "features": ["convert_audio", "compress_audio"],
         "folder": "audio",
         "tags": ["audio", "music", "convert", "compress", "mp3", "wav"],
-        "coming_soon": True,
-        "is_process_running": is_image_process_running
     },
     "video": {
         "name": "Video Tools",
@@ -60,8 +57,7 @@ FEATURES = {
         "features": ["convert_video", "compress_video"],
         "folder": "video",
         "tags": ["video", "convert", "compress", "mp4", "avi", "editing"],
-        "coming_soon": True,
-        "is_process_running": is_image_process_running
     }
 }
@@ -84,6 +80,12 @@ async def image_tools(request: Request):
     html_content = template.render(request=request)
     return HTMLResponse(content=html_content)
 @app.post("/image/upload")
 async def upload_image(
     id: str = Form(...),
@@ -170,6 +172,34 @@ async def remove_metadata(
             detail=f"Internal server error: {str(e)}"
         )
 @app.get("/image/download")
 async def download_converted_image(
     id: str = Query(...)
@@ -250,11 +280,10 @@ async def get_feature_status():
     """Get feature status"""
     features_status = {}
     for key in FEATURES.keys():
-        process_data = FEATURES[key]["is_process_running"]()
         features_status[key] = {
-            "feature_name": process_data["feature"] if process_data else None,
-            "is_busy": process_data is not None,
-            "process_id": process_data["process_id"] if process_data else None
         }
     return features_status

 from fastapi.staticfiles import StaticFiles
 from jinja2 import Environment, FileSystemLoader, select_autoescape
 from custom_logger import logger_config
 from image.image_base import ImageBase
 from pydantic import BaseModel
 from image.converter import Converter
 from image.remove_metadata import RemoveMetadata
+from image.remove_background import RemoveBackground
 import mimetypes
 app = FastAPI(title="Tools Collection", description="Collection of utility tools")
         "name": "Image Tools",
         "description": "HEIC to PNG/JPG conversion and metadata removal",
         "icon": "🖼️",
+        "features": ["convert", "remove_metadata", "remove_background"],
         "folder": "image",
+        "tags": ["image", "heic", "png", "jpg", "convert", "metadata"]
     },
     "pdf": {
         "name": "PDF Tools",
         "features": ["images_to_pdf"],
         "folder": "pdf",
         "tags": ["pdf", "merge", "convert", "images", "document"],
+        "coming_soon": True
     },
     "audio": {
         "name": "Audio Tools",
         "features": ["convert_audio", "compress_audio"],
         "folder": "audio",
         "tags": ["audio", "music", "convert", "compress", "mp3", "wav"],
+        "coming_soon": True
     },
     "video": {
         "name": "Video Tools",
         "features": ["convert_video", "compress_video"],
         "folder": "video",
         "tags": ["video", "convert", "compress", "mp4", "avi", "editing"],
+        "coming_soon": True
     }
 }
     html_content = template.render(request=request)
     return HTMLResponse(content=html_content)
+@app.get("/image/remove_background", response_class=HTMLResponse)
+async def image_tools(request: Request):
+    template = env.get_template("image/remove_background.html")  # From tool/image/
+    html_content = template.render(request=request)
+    return HTMLResponse(content=html_content)
 @app.post("/image/upload")
 async def upload_image(
     id: str = Form(...),
             detail=f"Internal server error: {str(e)}"
         )
+@app.post("/image/remove_background")
+async def remove_background(
+    id: str = Form(...)
+):
+    try:
+        removeBackground = RemoveBackground()
+        output_path = removeBackground.process(id)
+        # Return success response
+        return JSONResponse({
+            "success": True,
+            "message": "Image uploaded successfully",
+            "new_filename": output_path.split("/")[-1]
+        })
+    except ValueError as ve:
+        logger_config.error(f"Validation error: {str(ve)}")
+        raise HTTPException(
+            status_code=400,
+            detail=str(ve)
+        )
+    except Exception as e:
+        logger_config.error(f"Unexpected error during remove_background: {str(e)}")
+        raise HTTPException(
+            status_code=500,
+            detail=f"Internal server error: {str(e)}"
+        )
 @app.get("/image/download")
 async def download_converted_image(
     id: str = Query(...)
     """Get feature status"""
     features_status = {}
     for key in FEATURES.keys():
         features_status[key] = {
+            "feature_name": None,
+            "is_busy": False,
+            "process_id": None
         }
     return features_status

requirements.txt CHANGED Viewed

@@ -5,4 +5,6 @@ python-multipart==0.0.6
 pillow==10.1.0
 pillow-heif==0.13.0
 aiofiles==23.2.1
-jinja2==3.1.2

 pillow==10.1.0
 pillow-heif==0.13.0
 aiofiles==23.2.1
+jinja2==3.1.2
+rembg
+onnxruntime