From 10f9b720e781703ae56a6d5eddae0cbe7de7d61d Mon Sep 17 00:00:00 2001
From: Katarine Melo <katarinelucas1@gmail.com>
Date: Mon, 18 Nov 2024 18:11:44 +0000
Subject: [PATCH] Front API Test

---
 appy.py              |  59 ++++++++++++++++++++++++
 static/style.css     |  32 +++++++++++++
 static/styleappy.css |  87 +++++++++++++++++++++++++++++++++++
 templates/appy.html  | 105 +++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 283 insertions(+)
 create mode 100644 appy.py
 create mode 100644 static/style.css
 create mode 100644 static/styleappy.css
 create mode 100644 templates/appy.html

diff --git a/appy.py b/appy.py
new file mode 100644
index 0000000..6f05559
--- /dev/null
+++ b/appy.py
@@ -0,0 +1,59 @@
+from flask import Flask, request, send_file, jsonify,render_template
+import requests
+from io import BytesIO
+
+app = Flask(__name__)
+
+@app.route('/', methods=['GET'])
+def index():
+    return render_template('appy.html')
+
+@app.route('/list_faces', methods=['POST'])
+def list_faces():
+    url = request.json.get('url')
+    try:
+        response = requests.get(url)
+        return jsonify(response.json())
+    except Exception as e:
+        return jsonify({'error': str(e)})
+
+@app.route('/get_image', methods=['POST'])
+def get_image():
+    base_url = request.json.get('base_url')
+    bucket = request.json.get('bucket')
+    image_path = request.json.get('image_path')
+    
+    try:
+        # Construir a URL completa
+        full_url = f"{base_url}/{bucket}/{image_path}"
+        
+        # Fazer a requisição GET para obter a imagem
+        response = requests.get(full_url, stream=True)
+        response.raise_for_status()  # Lança exceção se o status for 4xx ou 5xx
+        
+        # Retornar a imagem como um arquivo para o front-end
+        return send_file(
+            BytesIO(response.content), 
+            mimetype='image/jpeg',  # Ajuste o mimetype conforme o formato da imagem (jpeg, png, etc.)
+            download_name='image.jpg'  # Nome sugerido do arquivo, opcional
+        )
+    except requests.exceptions.RequestException as e:
+        return jsonify({'error': str(e)}), 400
+@app.route('/update_name', methods=['POST'])
+def update_name():
+    url = request.json.get('url')
+    userID = request.json.get('userID')
+    new_name = request.json.get('new_name')
+    
+    try:
+        
+        full_url = f"{url}/{userID}/{new_name}"
+        
+        response = requests.post(full_url)
+        response.raise_for_status() 
+    
+        return jsonify(response.json())
+    except requests.exceptions.RequestException as e:
+        return jsonify({'error': str(e)}), 400
+if __name__ == '__main__':
+    app.run(debug=True)
diff --git a/static/style.css b/static/style.css
new file mode 100644
index 0000000..c2207d6
--- /dev/null
+++ b/static/style.css
@@ -0,0 +1,32 @@
+body {
+    font-family: Arial, sans-serif;
+    margin: 20px;
+}
+
+h1 {
+    text-align: center;
+    margin-bottom: 20px;
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+th, td {
+    padding: 10px;
+    text-align: left;
+}
+
+th {
+    background-color: #f4f4f4;
+}
+
+tr:nth-child(even) {
+    background-color: #f9f9f9;
+}
+
+p {
+    text-align: center;
+    font-size: 18px;
+}
diff --git a/static/styleappy.css b/static/styleappy.css
new file mode 100644
index 0000000..0c8669b
--- /dev/null
+++ b/static/styleappy.css
@@ -0,0 +1,87 @@
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f0f8ff;
+    color: #333;
+    margin: 0;
+    padding: 0;
+    line-height: 1.6;
+}
+.title {
+font-size: 2.5em;
+font-weight: bold;
+color: #1e90ff;
+text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);
+margin: 20px 0;
+text-align: center;
+}
+label {
+    font-weight: bold;
+    margin-bottom: 5px;
+    display: block;
+    color: #1e90ff;
+}
+
+input {
+    padding: 8px;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+}
+
+.container {
+    display: flex;
+    gap: 20px;
+    justify-content: center;
+    align-items: flex-start;
+    padding: 20px;
+}
+
+.form-container {
+    background: linear-gradient(135deg, #e6f7ff, #cce7ff);
+    border: 1px solid #a3d8ff;
+    padding: 20px;
+    border-radius: 8px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    width: 45%;
+}
+
+pre {
+    background-color: #e6f7ff;
+    padding: 15px;
+    border: 1px solid #a3d8ff;
+    border-radius: 8px;
+    overflow-x: auto;
+    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin-top: 10px;
+    border: 2px solid #a3d8ff;
+    border-radius: 8px;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+}
+h2{
+   color: #1e90ff;
+}
+
+button {
+    background-color: #4da6ff;
+    color: #fff;
+    border: none;
+    padding: 10px 15px;
+    cursor: pointer;
+    border-radius: 5px;
+    transition: background-color 0.3s ease;
+    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
+}
+
+button:hover {
+    background-color: #1e90ff;
+}
+
+button:active {
+    background-color: #0d6efd;
+    box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.2);
+}
\ No newline at end of file
diff --git a/templates/appy.html b/templates/appy.html
new file mode 100644
index 0000000..2a62fcd
--- /dev/null
+++ b/templates/appy.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="static/styleappy.css">
+    <script>
+        async function fetchListFaces() {
+            const url = document.getElementById('list_faces_url').value;
+            const response = await fetch('/list_faces', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ url: url })
+            });
+            const result = await response.json();
+            document.getElementById('list_faces_result').textContent = JSON.stringify(result, null, 2);
+        }
+
+        async function fetchGetImage() {
+            const base_url = document.getElementById('get_image_url').value;
+            const bucket = document.getElementById('bucket').value;
+            const image_path = document.getElementById('image_path').value;
+            
+            const response = await fetch('/get_image', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ base_url: base_url, bucket: bucket, image_path: image_path })
+            });
+
+            if (response.ok) {
+                const blob = await response.blob();
+                const imgUrl = URL.createObjectURL(blob);
+                const imageElement = document.getElementById('get_image_result');
+                imageElement.src = imgUrl;
+                imageElement.style.display = 'block'; // Exibe a imagem
+            } else {
+                document.getElementById('get_image_result').textContent = 'Erro ao buscar a imagem.';
+                document.getElementById('get_image_result').style.display = 'none';
+            }
+        }
+        async function fetchUpdateName() {
+            const url = document.getElementById('update_name_url').value;
+            const userID = document.getElementById('userID').value;
+            const new_name = document.getElementById('new_name').value;
+            
+            const response = await fetch('/update_name', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ url: url,userID:userID,new_name:new_name })
+            });
+            const result = await response.json();
+            document.getElementById('update_name_result').textContent = JSON.stringify(result, null, 2);
+            
+        }
+    </script>
+</head>
+<body>
+    <div class="title">API Test Interface</div>
+    <div class="container">
+        <div class="form-container">
+            <form onsubmit="event.preventDefault(); fetchListFaces();">
+                <h2>Test /manager/list/faces</h2>
+                <label for="list_faces_url">List Faces URL:</label>
+                <input type="text" id="list_faces_url" placeholder="http://172.17.0.5:5001/manager/list/faces" required>
+                <button type="submit">Submit</button>
+            </form>
+            <pre id="list_faces_result"></pre>
+        </div>
+
+        <div class="form-container">
+            <form onsubmit="event.preventDefault(); fetchGetImage();">
+                <h2>Test /manager/get/image</h2>
+                <label for="get_image_url">Base URL:</label>
+                <input type="text" id="get_image_url" placeholder="http://172.17.0.5:5001/manager/get/image" required>
+
+                <label for="bucket">Bucket:</label>
+                <input type="text" id="bucket" required>
+
+                <label for="image_path">Image Path:</label>
+                <input type="text" id="image_path" required>
+
+                <button type="submit">Submit</button>
+            </form>
+            <img id="get_image_result" style="display:none;" alt="Image Result">
+        </div>
+        <div class="form-container">
+            <form onsubmit="event.preventDefault(); fetchUpdateName();">
+                <h2>Test /manager/update_name</h2>
+
+                <label for="update_name">Change Name URL:</label>
+                <input type="text" id="update_name_url" placeholder="http://172.17.0.5:5001/manager/update_name" required>
+                
+                <label for="userID">userID:</label>
+                <input type="text" id="userID" required>
+
+                <label for="new_name">new_name:</label>
+                <input type="text" id="new_name" required>
+                
+                <button type="submit">Submit</button>
+            </form>
+            <pre id="update_name_result"></pre>
+        </div>
+    </div>
+</body>
+</html>