Spaces:

rein0421
/

AIdentify

Running

App Files Files

rein0421 commited on Nov 10, 2024

Commit

0e7b3e6

verified ·

1 Parent(s): 47c0165

Update app.py

Browse files

Files changed (1) hide show

app.py +52 -68

app.py CHANGED Viewed

@@ -778,7 +778,39 @@ async def create_mask_sum(image: UploadFile = File(...), risk_level: int = Form(
     return FileResponse(output_path)
 @app.get("/", response_class=HTMLResponse)
 async def read_root():
@@ -807,16 +839,15 @@ async def read_root():
         .form-control-file { font-size: 1rem; }
         .form-group { margin-bottom: 25px; }
         .btn-success { padding: 10px 20px; border-radius: 50px; }
-#loadingSpinner {
-    position: fixed;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    color: #007bff;
-    text-align: center;
-    z-index: 9999;
-}
     </style>
 </head>
 <body>
@@ -824,7 +855,6 @@ async def read_root():
     <i class="fas fa-spinner fa-spin fa-3x"></i>
     <p>画像を処理中です。少々お待ちください...</p>
 </div>
     <div class="container">
         <h1><i class="fas fa-image"></i> 画像処理アプリ - モザイクとインペイント</h1>
         <div class="form-group">
@@ -854,7 +884,7 @@ async def read_root():
     <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
     <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
-   <script>
     $(function() {
         $("#slider").slider({
             range: "min",
@@ -915,8 +945,10 @@ async def read_root():
             alert("画像を選択して縮小してください。");
             return;
         }
         const formData = new FormData();
-        formData.append('image', resizedImageBlob, 'resized_image.jpg'); // 縮小画像を送信
         formData.append('risk_level', riskLevel);
         let apiEndpoint;
         if (processingType === "opencv") {
@@ -948,64 +980,16 @@ async def read_root():
         .catch(error => {
             console.error("画像処理に失敗しました。", error);
             alert("画像処理に失敗しました。");
         });
     }
-function processImage() {
-    const processingType = document.getElementById('processingType').value;
-    const riskLevel = $("#slider").slider("value");
-    const resultDiv = document.getElementById('result');
-    const processedImage = document.getElementById('processedImage');
-    const downloadLink = document.getElementById('downloadLink');
-    if (!resizedImageBlob) {
-        alert("画像を選択して縮小してください。");
-        return;
-    }
-    // ローディングスピナーを表示
-    document.getElementById('loadingSpinner').style.display = 'block';
-    const formData = new FormData();
-    formData.append('image', resizedImageBlob, 'resized_image.jpg');
-    formData.append('risk_level', riskLevel);
-    let apiEndpoint;
-    if (processingType === "opencv") {
-        apiEndpoint = "/create-mask-and-inpaint-opencv";
-    } else if (processingType === "simple_lama") {
-        apiEndpoint = "/create-mask-and-inpaint-simple-lama";
-    } else if (processingType === "stamp") {
-        apiEndpoint = "/create-mask-and-inpaint-stamp";
-    } else if (processingType == "mosaic") {
-        apiEndpoint = "/create-mask-and-inpaint-mosaic";
-    }
-    const url = "https://rein0421-aidentify.hf.space" + apiEndpoint;
-    fetch(url, {
-        method: 'POST',
-        body: formData
-    })
-    .then(response => {
-        if (!response.ok) {
-            throw new Error("Network response was not ok");
-        }
-        return response.blob();
-    })
-    .then(blob => {
-        const objectURL = URL.createObjectURL(blob);
-        processedImage.src = objectURL;
-        downloadLink.href = objectURL;
-        resultDiv.style.display = "block";
-    })
-    .catch(error => {
-        console.error("画像処理に失敗しました。", error);
-        alert("画像処理に失敗しました。");
-    })
-    .finally(() => {
-        // ローディングスピナーを非表示にする
-        document.getElementById('loadingSpinner').style.display = 'none';
-    });
-}
-</script>
 </body>
 </html>
     """
     return HTMLResponse(content=html_content)
 if __name__ == "__main__":

     return FileResponse(output_path)
+# カスケードファイルの読み込み (顔検出)
+face_cascade = cv2.CascadeClassifier(cv2.data.haarcascades + 'haarcascade_frontalface_default.xml')
+def apply_mosaic(image, x, y, w, h, mosaic_level=15):
+    """ 指定範囲にモザイク処理を適用 """
+    face = image[y:y+h, x:x+w]
+    face = cv2.resize(face, (w // mosaic_level, h // mosaic_level))
+    face = cv2.resize(face, (w, h), interpolation=cv2.INTER_NEAREST)
+    image[y:y+h, x:x+w] = face
+    return image
+@app.post("/mosaic_face")
+async def mosaic_face(file: UploadFile = File(...)):
+    # 画像ファイルを読み込み
+    image_data = await file.read()
+    np_array = np.frombuffer(image_data, np.uint8)
+    img = cv2.imdecode(np_array, cv2.IMREAD_COLOR)
+    # グレースケール変換と顔検出
+    gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)
+    faces = face_cascade.detectMultiScale(gray, scaleFactor=1.1, minNeighbors=4, minSize=(30, 30))
+    # 検出した顔にモザイクを適用
+    for (x, y, w, h) in faces:
+        img = apply_mosaic(img, x, y, w, h)
+    # 一時ファイルに保存
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".jpg") as temp_file:
+        temp_file_path = Path(temp_file.name)
+        cv2.imwrite(str(temp_file_path), img)
+    # 一時ファイルをレスポンスとして返す
+    return FileResponse(path=temp_file_path, media_type="image/jpeg", filename="mosaic_image.jpg")
 @app.get("/", response_class=HTMLResponse)
 async def read_root():
         .form-control-file { font-size: 1rem; }
         .form-group { margin-bottom: 25px; }
         .btn-success { padding: 10px 20px; border-radius: 50px; }
+        #loadingSpinner {
+            position: fixed;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            color: #007bff;
+            text-align: center;
+            z-index: 9999;
+        }
     </style>
 </head>
 <body>
     <i class="fas fa-spinner fa-spin fa-3x"></i>
     <p>画像を処理中です。少々お待ちください...</p>
 </div>
     <div class="container">
         <h1><i class="fas fa-image"></i> 画像処理アプリ - モザイクとインペイント</h1>
         <div class="form-group">
     <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
     <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
+    <script>
     $(function() {
         $("#slider").slider({
             range: "min",
             alert("画像を選択して縮小してください。");
             return;
         }
+        // ローディングスピナーを表示
+        document.getElementById('loadingSpinner').style.display = 'block';
         const formData = new FormData();
+        formData.append('image', resizedImageBlob, 'resized_image.jpg');
         formData.append('risk_level', riskLevel);
         let apiEndpoint;
         if (processingType === "opencv") {
         .catch(error => {
             console.error("画像処理に失敗しました。", error);
             alert("画像処理に失敗しました。");
+        })
+        .finally(() => {
+            // ローディングスピナーを非表示にする
+            document.getElementById('loadingSpinner').style.display = 'none';
         });
     }
+    </script>
 </body>
 </html>
     """
     return HTMLResponse(content=html_content)
 if __name__ == "__main__":