Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Logistica - Shipping Company Website Template</title> | |
| <meta content="width=device-width, initial-scale=1.0" name="viewport"> | |
| <meta content="" name="keywords"> | |
| <meta content="" name="description"> | |
| <!-- Favicon --> | |
| <link href="img/favicon.ico" rel="icon"> | |
| <!-- Google Web Fonts --> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&family=Roboto:wght@500;700&display=swap" rel="stylesheet"> | |
| <!-- Icon Font Stylesheet --> | |
| <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet"> | |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet"> | |
| <!-- Libraries Stylesheet --> | |
| <link href="{{ url_for('static', filename='lib/animate/animate.min.css') }}" rel="stylesheet"> | |
| <link href="{{ url_for('static', filename='lib/owlcarousel/assets/owl.carousel.min.css') }}" rel="stylesheet"> | |
| <!-- Customized Bootstrap Stylesheet --> | |
| <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet"> | |
| <!-- Template Stylesheet --> | |
| <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <!-- Spinner Start --> | |
| <div id="spinner" class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center"> | |
| <div class="spinner-grow text-primary" style="width: 3rem; height: 3rem;" role="status"> | |
| <span class="sr-only">Loading...</span> | |
| </div> | |
| </div> | |
| <!-- Spinner End --> | |
| <!-- Navbar Start --> | |
| <nav class="navbar navbar-expand-lg bg-white navbar-light shadow border-top border-5 border-primary sticky-top p-0"> | |
| <a href="{{ url_for('index') }}" class="navbar-brand bg-primary d-flex align-items-center px-4 px-lg-5"> | |
| <img src="{{ url_for('static', filename='img/a.png') }}" alt="Your Company Logo" width="60px" height="60px" padding-right: 15px> <h2 class="mb-2 text-white">SHIP CLASSIFICATION</h2> | |
| </a> | |
| <button type="button" class="navbar-toggler me-4" data-bs-toggle="collapse" data-bs-target="#navbarCollapse"> | |
| <span class="navbar-toggler-icon"></span> | |
| </button> | |
| <div class="collapse navbar-collapse" id="navbarCollapse"> | |
| <div class="navbar-nav ms-auto p-4 p-lg-0"> | |
| <a href="{{ url_for('index') }}" class="nav-item nav-link">Home</a> | |
| <a href="{{ url_for('about') }}" class="nav-item nav-link">About</a> | |
| <a href="{{ url_for('service') }}" class="nav-item nav-link active">Services</a> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Navbar End --> | |
| <!-- Page Header Start --> | |
| <div class="container-fluid page-header py-5" style="margin-bottom: 1rem;"> | |
| <div class="container py-5"> | |
| <h1 class="display-3 text-white mb-3 animated slideInDown">Services</h1> | |
| <nav aria-label="breadcrumb animated slideInDown"> | |
| <ol class="breadcrumb"> | |
| <li class="breadcrumb-item"><a class="text-white" href="{{ url_for('index') }}">Home</a></li> | |
| <li class="breadcrumb-item text-white active" aria-current="page">Services</li> | |
| </ol> | |
| </nav> | |
| </div> | |
| </div> | |
| <!-- Page Header End --> | |
| <!-- Service Start --> | |
| <div class="container-xxl py-5"> | |
| <div class="container py-5"> | |
| <div class="text-center wow fadeInUp" data-wow-delay="0.1s"> | |
| <h4>Please upload an Ship image</h4> | |
| <form action = "http://localhost:5000/predict" id="upload-file" method="post" enctype="multipart/form-data"> | |
| <label for="imageUpload" class="upload-label"> | |
| Choose... | |
| </label> | |
| <input type="file" name="image" id="imageUpload" accept=".png, .jpg, .jpeg"> | |
| </form> | |
| <center> | |
| <div class="image-section" style="display:none;"> | |
| <div class="img-preview"> | |
| <div id="imagePreview"> | |
| </div> | |
| </div> | |
| <div> | |
| <button type="button" class="btn btn-primary py-md-3 px-md-5 me-3 " id="btn-predict">click here to see result</button> | |
| </div> | |
| </div> | |
| <div class="loader" style="display:none;"></div> | |
| <h3> | |
| <span id="result"> </span> | |
| </h3> | |
| </center> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Service End --> | |
| <!-- JavaScript Libraries --> | |
| <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/js/bootstrap.bundle.min.js"></script> | |
| <script src="{{ url_for('static', filename='lib/wow/wow.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='lib/easing/easing.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='lib/waypoints/waypoints.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='lib/counterup/counterup.min.js') }}"></script> | |
| <script src="{{ url_for('static', filename='lib/owlcarousel/owl.carousel.min.js') }}"></script> | |
| <!-- Template Javascript --> | |
| <script src="{{ url_for('static', filename='js/main.js') }}"></script> | |
| </body> | |
| </html> |