Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Flask Camera App</title> | |
| <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}"> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h1>Camera Capture App</h1> | |
| <button id="openCamera" class="btn"> | |
| <img src="https://img.icons8.com/ios-filled/50/ffffff/camera.png" alt="Camera Icon"> | |
| Open Camera | |
| </button> | |
| <div id="cameraContainer" style="display: none;"> | |
| <select id="cameraSelect"> | |
| <option value="user">Front Camera</option> | |
| <option value="environment">Back Camera</option> | |
| </select> | |
| <video id="videoElement" autoplay playsinline></video> | |
| <button id="captureButton" class="btn">Capture Image</button> | |
| </div> | |
| <canvas id="canvas" style="display: none;"></canvas> | |
| <div id="result"> | |
| <img id="capturedImage" style="display: none; max-width: 100%;"> | |
| <pre id="hfResult"></pre> | |
| </div> | |
| </div> | |
| <script src="{{ url_for('static', filename='js/script.js') }}"></script> | |
| </body> | |
| </html> |