Spaces:

vagrillo
/

stikkapp

Sleeping

App Files Files Community

vagrillo commited on Jul 30, 2025

Commit

7e839e7

verified ·

1 Parent(s): e96d68d

Update app.py

Browse files

Files changed (1) hide show

app.py +130 -79

app.py CHANGED Viewed

@@ -1,11 +1,21 @@
-from flask import Flask, render_template_string, request, jsonify
 import uuid
 import os
 app = Flask(__name__)
-app.config['UPLOAD_FOLDER'] = 'static/uploads'
 os.makedirs(app.config['UPLOAD_FOLDER'], exist_ok=True)
 @app.route('/')
 def home():
     return render_template_string('''
@@ -14,23 +24,13 @@ def home():
     <head>
         <title>StikkApp</title>
         <style>
-            .option {
-                padding: 15px;
-                margin: 10px;
-                background: #4285f4;
-                color: white;
-                text-align: center;
-                border-radius: 5px;
-                cursor: pointer;
-            }
-            #camera-container { display: none; position: relative; }
-            #camera-preview { width: 100%; }
-            #capture-btn {
-                position: absolute; bottom: 20px; left: 50%;
-                transform: translateX(-50%); padding: 10px 20px;
-                background: red; color: white; border: none;
-                border-radius: 50%; width: 60px; height: 60px;
-            }
             #file-input { display: none; }
         </style>
     </head>
@@ -43,24 +43,24 @@ def home():
         <div id="camera-container">
             <video id="camera-preview" autoplay playsinline></video>
-            <button id="capture-btn" onclick="capturePhoto()">●</button>
         </div>
         <input type="file" id="file-input" accept="image/*">
         <script>
-            // Fotocamera
             let cameraStream;
             async function startCamera() {
-                document.getElementById('camera-container').style.display = 'block';
                 try {
                     cameraStream = await navigator.mediaDevices.getUserMedia({
                         video: { facingMode: 'environment' }
                     });
                     document.getElementById('camera-preview').srcObject = cameraStream;
                 } catch (err) {
-                    alert("Errore accesso fotocamera: " + err.message);
                 }
             }
@@ -69,21 +69,31 @@ def home():
                 const canvas = document.createElement('canvas');
                 canvas.width = video.videoWidth;
                 canvas.height = video.videoHeight;
-                canvas.getContext('2d').drawImage(video, 0, 0);
-                sendImage(canvas.toDataURL('image/jpeg'));
-                cameraStream.getTracks().forEach(track => track.stop());
             }
-            // Galleria
             document.getElementById('file-input').addEventListener('change', function(e) {
-                if (e.target.files.length > 0) {
                     const reader = new FileReader();
                     reader.onload = (event) => sendImage(event.target.result);
                     reader.readAsDataURL(e.target.files[0]);
                 }
             });
-            // Clipboard
             async function pasteFromClipboard() {
                 try {
                     const items = await navigator.clipboard.read();
@@ -98,57 +108,57 @@ def home():
                             }
                         }
                     }
-                    alert("Nessuna immagine trovata negli appunti");
                 } catch (err) {
-                    alert("Errore accesso clipboard: " + err.message);
                 }
             }
-function sendImage(imageData) {
-    fetch('/upload', {
-        method: 'POST',
-        body: JSON.stringify({ image: imageData.split(',')[1] }),
-        headers: { 'Content-Type': 'application/json' }
-    })
-    .then(response => response.json())
-    .then(data => {
-        // Aggiungi un timestamp per evitare cache
-        const timestamp = new Date().getTime();
-        window.location.href = `/preview?img=${encodeURIComponent(data.image_url)}?t=${timestamp}`;
-    })
-    .catch(error => {
-        console.error('Upload error:', error);
-        alert('Errore durante l\'upload');
-    });
-}
         </script>
     </body>
     </html>
     ''')
-@app.route('/uploads/<filename>')
-def uploaded_file(filename):
-    return send_file(os.path.join(app.config['UPLOAD_FOLDER'], filename))
 @app.route('/upload', methods=['POST'])
 def upload_image():
-    if not request.json or 'image' not in request.json:
-        return jsonify({'error': 'No image data'}), 400
     try:
-        # Decodifica l'immagine base64
-        image_data = base64.b64decode(request.json['image'])
-        unique_id = str(uuid.uuid4())
         filename = f"{unique_id}.jpg"
         filepath = os.path.join(app.config['UPLOAD_FOLDER'], filename)
         with open(filepath, 'wb') as f:
-            f.write(image_data)
         return jsonify({
-            'image_url': f'/uploads/{filename}'  # Modificato da '/static/uploads/'
         })
     except Exception as e:
         return jsonify({'error': str(e)}), 500
@@ -158,14 +168,24 @@ def preview():
     return render_template_string('''
     <!DOCTYPE html>
     <html>
-    <head><title>Anteprima</title></head>
     <body>
-        <img src="{{ img_url }}" style="max-width:100%;">
-        <button onclick="analyze()">Analizza</button>
-        <button onclick="window.location.href='/'">Annulla</button>
         <script>
             function analyze() {
-                window.location.href = `/analyze?img=${encodeURIComponent("{{ img_url }}")}`;
             }
         </script>
     </body>
@@ -178,19 +198,37 @@ def analyze():
     return render_template_string('''
     <!DOCTYPE html>
     <html>
-    <head><title>Analisi</title></head>
     <body>
-        <img src="{{ img_url }}" id="target-image" style="max-width:100%;">
-        <div id="selection-box" style="position:absolute;border:2px solid red;display:none;"></div>
         <script>
-            const img = document.getElementById('target-image');
             img.addEventListener('click', (e) => {
-                const box = document.getElementById('selection-box');
-                const x = e.offsetX - 25;
-                const y = e.offsetY - 25;
-                box.style.left = `${x + img.offsetLeft}px`;
-                box.style.top = `${y + img.offsetTop}px`;
                 box.style.width = '50px';
                 box.style.height = '50px';
                 box.style.display = 'block';
@@ -201,15 +239,28 @@ def analyze():
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({
                         img_url: "{{ img_url }}",
-                        x: e.offsetX,
-                        y: e.offsetY
                     })
-                }).then(/* gestisci risposta */);
             });
         </script>
     </body>
     </html>
     ''', img_url=img_url)
 if __name__ == '__main__':
-    app.run(host='0.0.0.0', port=7860)

+from flask import Flask, request, jsonify, send_from_directory, render_template_string
 import uuid
 import os
+import base64
+from datetime import datetime
 app = Flask(__name__)
+app.config['UPLOAD_FOLDER'] = 'uploads'
 os.makedirs(app.config['UPLOAD_FOLDER'], exist_ok=True)
+# Servizio file uploadati
+@app.route('/uploads/<filename>')
+def serve_uploaded_file(filename):
+    try:
+        return send_from_directory(app.config['UPLOAD_FOLDER'], filename)
+    except FileNotFoundError:
+        return "File not found", 404
 @app.route('/')
 def home():
     return render_template_string('''
     <head>
         <title>StikkApp</title>
         <style>
+            .option { padding: 15px; margin: 10px; background: #4285f4;
+                     color: white; text-align: center; border-radius: 5px; }
+            #camera-container { display: none; position: relative; max-width: 100%; }
+            #camera-preview { width: 100%; transform: scaleX(-1); }
+            #capture-btn { position: absolute; bottom: 20px; left: 50%;
+                          transform: translateX(-50%); background: red;
+                          width: 60px; height: 60px; border-radius: 50%; }
             #file-input { display: none; }
         </style>
     </head>
         <div id="camera-container">
             <video id="camera-preview" autoplay playsinline></video>
+            <button id="capture-btn" onclick="capturePhoto()"></button>
         </div>
         <input type="file" id="file-input" accept="image/*">
         <script>
+            // Gestione fotocamera
             let cameraStream;
             async function startCamera() {
                 try {
                     cameraStream = await navigator.mediaDevices.getUserMedia({
                         video: { facingMode: 'environment' }
                     });
+                    document.getElementById('camera-container').style.display = 'block';
                     document.getElementById('camera-preview').srcObject = cameraStream;
                 } catch (err) {
+                    alert("Errore fotocamera: " + err.message);
                 }
             }
                 const canvas = document.createElement('canvas');
                 canvas.width = video.videoWidth;
                 canvas.height = video.videoHeight;
+                const ctx = canvas.getContext('2d');
+                // Corregge l'orientamento per fotocamera posteriore
+                ctx.translate(canvas.width, 0);
+                ctx.scale(-1, 1);
+                ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
+                // Converti in JPG di qualità
+                canvas.toBlob(blob => {
+                    const reader = new FileReader();
+                    reader.onload = () => sendImage(reader.result);
+                    reader.readAsDataURL(blob);
+                }, 'image/jpeg', 0.85);
             }
+            // Gestione galleria
             document.getElementById('file-input').addEventListener('change', function(e) {
+                if (e.target.files[0]) {
                     const reader = new FileReader();
                     reader.onload = (event) => sendImage(event.target.result);
                     reader.readAsDataURL(e.target.files[0]);
                 }
             });
+            // Gestione clipboard
             async function pasteFromClipboard() {
                 try {
                     const items = await navigator.clipboard.read();
                             }
                         }
                     }
+                    alert("Nessuna immagine trovata");
                 } catch (err) {
+                    alert("Errore clipboard: " + err.message);
                 }
             }
+            // Invio immagine al server
+            function sendImage(dataUrl) {
+                fetch('/upload', {
+                    method: 'POST',
+                    body: JSON.stringify({ image: dataUrl }),
+                    headers: { 'Content-Type': 'application/json' }
+                })
+                .then(response => {
+                    if (!response.ok) throw new Error('Upload failed');
+                    return response.json();
+                })
+                .then(data => {
+                    window.location.href = `/preview?img=${encodeURIComponent(data.image_url)}&t=${Date.now()}`;
+                })
+                .catch(error => {
+                    console.error('Upload error:', error);
+                    alert('Errore durante l\'upload');
+                });
+            }
         </script>
     </body>
     </html>
     ''')
 @app.route('/upload', methods=['POST'])
 def upload_image():
     try:
+        # Estrai i dati base64 dall'URL (rimuovi il prefisso)
+        image_data = request.json['image'].split(',')[1]
+        binary_data = base64.b64decode(image_data)
+        # Genera nome file univoco
+        unique_id = uuid.uuid4().hex
         filename = f"{unique_id}.jpg"
         filepath = os.path.join(app.config['UPLOAD_FOLDER'], filename)
+        # Salva il file
         with open(filepath, 'wb') as f:
+            f.write(binary_data)
         return jsonify({
+            'image_url': f'/uploads/{filename}',
+            'unique_id': unique_id
         })
     except Exception as e:
         return jsonify({'error': str(e)}), 500
     return render_template_string('''
     <!DOCTYPE html>
     <html>
+    <head>
+        <title>Anteprima</title>
+        <style>
+            img { max-width: 100%; height: auto; }
+            button { padding: 10px 20px; margin: 10px; font-size: 16px; }
+        </style>
+    </head>
     <body>
+        <img src="{{ img_url }}" id="preview-img">
+        <div>
+            <button onclick="analyze()">Analizza</button>
+            <button onclick="window.location.href='/'">Annulla</button>
+        </div>
         <script>
             function analyze() {
+                const img = document.getElementById('preview-img');
+                const timestamp = new Date().getTime();
+                window.location.href = `/analyze?img=${encodeURIComponent("{{ img_url }}")}&t=${timestamp}`;
             }
         </script>
     </body>
     return render_template_string('''
     <!DOCTYPE html>
     <html>
+    <head>
+        <title>Analisi</title>
+        <style>
+            #container { position: relative; }
+            #target-img { max-width: 100%; }
+            #selection-box {
+                position: absolute;
+                border: 2px solid red;
+                display: none;
+                pointer-events: none;
+            }
+        </style>
+    </head>
     <body>
+        <div id="container">
+            <img src="{{ img_url }}" id="target-img">
+            <div id="selection-box"></div>
+        </div>
         <script>
+            const img = document.getElementById('target-img');
+            const box = document.getElementById('selection-box');
             img.addEventListener('click', (e) => {
+                const rect = img.getBoundingClientRect();
+                const x = e.clientX - rect.left;
+                const y = e.clientY - rect.top;
+                // Mostra il quadrato di selezione
+                box.style.left = `${x - 25}px`;
+                box.style.top = `${y - 25}px`;
                 box.style.width = '50px';
                 box.style.height = '50px';
                 box.style.display = 'block';
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({
                         img_url: "{{ img_url }}",
+                        x: x,
+                        y: y
                     })
+                }).then(response => response.json())
+                  .then(data => {
+                      // Gestisci la risposta qui
+                      console.log(data);
+                  });
             });
         </script>
     </body>
     </html>
     ''', img_url=img_url)
+@app.route('/search', methods=['POST'])
+def search():
+    data = request.json
+    # Qui implementa la logica di ricerca
+    return jsonify({
+        'result': 'success',
+        'data': data
+    })
 if __name__ == '__main__':
+    app.run(host='0.0.0.0', port=7860, debug=True)