61 lines
3.5 KiB
PHP
61 lines
3.5 KiB
PHP
<?php include 'includes/header.php'; ?>
|
|
|
|
<main class="container my-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8 text-center">
|
|
<h1 class="display-5 fw-bold text-primary">MRI Scan Analysis</h1>
|
|
<p class="lead text-muted mb-5">Upload a brain MRI scan to get a prediction for Alzheimer's disease. Our model will analyze the image and provide a result.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="card shadow-sm upload-card">
|
|
<div class="card-body">
|
|
<h5 class="card-title section-title">1. Upload Image</h5>
|
|
<form id="upload-form" action="api/detect.php" method="post" enctype="multipart/form-data">
|
|
<div class="upload-box" id="upload-box">
|
|
<i class="bi bi-cloud-arrow-up-fill upload-icon"></i>
|
|
<p class="upload-text">Drag & drop your MRI scan here, or click to select a file.</p>
|
|
<input type="file" name="mri_image" id="mri_image" class="form-control" accept="image/jpeg, image/png, image/gif" hidden>
|
|
</div>
|
|
<div class="text-center mt-3">
|
|
<button type="button" id="select-file-btn" class="btn btn-outline-primary">Select File</button>
|
|
<button type="submit" id="analyze-btn" class="btn btn-primary" disabled>Analyze Scan</button>
|
|
</div>
|
|
</form>
|
|
<div id="image-preview-container" class="mt-4 text-center" style="display: none;">
|
|
<h6 class="text-muted">Image Preview:</h6>
|
|
<img id="image-preview" src="#" alt="Image Preview" class="img-fluid rounded" style="max-height: 300px;"/>
|
|
<button id="remove-image-btn" class="btn btn-sm btn-outline-danger mt-2">Remove Image</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="card shadow-sm result-card">
|
|
<div class="card-body">
|
|
<h5 class="card-title section-title">2. Analysis Result</h5>
|
|
<div id="result-placeholder" class="text-center text-muted pt-5 pb-5">
|
|
<i class="bi bi-hourglass-split" style="font-size: 3rem;"></i>
|
|
<p class="mt-3">Your analysis results will appear here.</p>
|
|
</div>
|
|
<div id="result-display" style="display: none;">
|
|
<h4 class="mb-3">Prediction: <span id="prediction-result" class="fw-bold"></span></h4>
|
|
<div class="progress mb-3" style="height: 25px;">
|
|
<div id="confidence-bar" class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<p class="text-center text-muted small mb-4">Confidence Score</p>
|
|
|
|
<h5 class="section-title mt-4">Model Performance</h5>
|
|
<div style="width: 100%; height: 250px; background-color: #f0f0f0; border-radius: 8px;" class="text-center pt-5">
|
|
<p class="text-muted">[Sample Chart: Model Accuracy/Loss]</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<?php include 'includes/footer.php'; ?>
|