File size: 4,779 Bytes
9309109
907e68e
3fc5824
 
 
39591e8
6c514fd
39591e8
3fc5824
 
 
9309109
 
3fc5824
9309109
 
3fc5824
 
be82676
3fc5824
550c744
22c6cd8
 
 
d2bbaf7
 
 
 
 
22c6cd8
3fc5824
 
 
 
 
907e68e
9309109
907e68e
 
 
 
 
d2bbaf7
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
22c6cd8
d2bbaf7
 
 
 
 
 
 
 
 
907e68e
 
 
 
 
 
 
 
22c6cd8
907e68e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
22c6cd8
 
907e68e
22c6cd8
 
907e68e
 
22c6cd8
907e68e
 
 
 
 
 
 
3fc5824
9309109
 
907e68e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
from fastapi import FastAPI, File, UploadFile, HTTPException
from fastapi.responses import HTMLResponse
from transformers import pipeline
from PIL import Image
import io

app = FastAPI()

# Load the image classification pipeline
pipe = pipeline("image-classification", model="mateoluksenberg/dit-base-Classifier_CM05")

@app.post("/classify/")
async def classify_image(file: UploadFile = File(...)):
    try:
        # Read the file contents into a PIL image
        image = Image.open(file.file).convert('RGB')

        # Perform image classification
        result = pipe(image)

        # Overall result summary
        overall_result = str(result)

        # Add overall result as comment to the top result
        result_with_comment = {
            "label": result[0]['label'],
            "score": result[0]['score'],
        }

        return {"classification_result": result_with_comment, "overall_result": overall_result}  # Return the top prediction with comment and overall summary

    except Exception as e:
        # Handle exceptions, for example: file not found, image format issues, etc.
        raise HTTPException(status_code=500, detail=f"Error processing image: {str(e)}")

@app.get("/", response_class=HTMLResponse)
async def home():
    html_content = """
    <!DOCTYPE html>
    <html>
    <head>
        <title>Image Classification</title>
        <style>
            body {
                font-family: Arial, sans-serif;
                background-color: #f0f0f0;
                margin: 0;
                padding: 0;
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
                flex-direction: column;
            }
            h1 {
                color: #333;
            }
            form {
                margin: 20px 0;
                padding: 20px;
                background: #fff;
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
                border-radius: 8px;
            }
            input[type="file"] {
                margin-bottom: 10px;
            }
            button {
                background-color: #4CAF50;
                color: white;
                border: none;
                padding: 10px 20px;
                text-align: center;
                text-decoration: none;
                display: inline-block;
                font-size: 16px;
                border-radius: 5px;
                cursor: pointer;
            }
            button:hover {
                background-color: #45a049;
            }
            #result, #overall-results {
                margin-top: 20px;
                padding: 20px;
                background: #fff;
                box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
                border-radius: 8px;
                max-width: 500px;
                word-wrap: break-word;
            }
        </style>
    </head>
    <body>
        <h1>Upload an Image for Classification</h1>
        <form id="upload-form" enctype="multipart/form-data">
            <input type="file" id="file" name="file" accept="image/*" required />
            <button type="submit">Upload</button>
        </form>
        <div id="result"></div>
        <div id="overall-results"></div>
        <script>
            const form = document.getElementById('upload-form');
            form.addEventListener('submit', async (e) => {
                e.preventDefault();
                const fileInput = document.getElementById('file');
                const formData = new FormData();
                formData.append('file', fileInput.files[0]);
                
                const response = await fetch('/classify/', {
                    method: 'POST',
                    body: formData
                });
                
                const result = await response.json();
                
                const resultDiv = document.getElementById('result');
                const overallResultsDiv = document.getElementById('overall-results');
                
                if (response.ok) {
                    resultDiv.innerHTML = `<h2>Top Classification Result:</h2><p>${JSON.stringify(result.classification_result)}</p>`;
                    overallResultsDiv.innerHTML = `<h2>All Results:</h2><p>${result.overall_result}</p>`;
                } else {
                    resultDiv.innerHTML = `<h2>Error:</h2><p>${result.detail}</p>`;
                    overallResultsDiv.innerHTML = '';
                }
            });
        </script>
    </body>
    </html>
    """
    return HTMLResponse(content=html_content)

# Sample usage:
# 1. Start the FastAPI server
# 2. Open the browser and navigate to the root URL to upload an image and see the classification result