Spaces:
Running
Running
File size: 1,859 Bytes
1ccf66a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
{% extends "base.html" %}
{% block content %}
<div class="card shadow fade-in">
<div class="card-header">
<h3 class="mb-0">Image Translation</h3>
</div>
<div class="card-body">
<form method="POST" action="/translate" enctype="multipart/form-data" id="translation-form">
<div class="mb-4">
<label class="form-label">Select Translation Direction:(Download Sample Images from Sample Section)</label>
<label class="form-label">Add Only Valid Brain Images</label>
<select class="form-select" name="direction" required>
<option value="ct_to_mri">CT Scan to MRI</option>
<option value="mri_to_ct">MRI to CT Scan</option>
</select>
</div>
<div class="mb-4">
<div id="drop-zone" class="border-2 border-dashed p-5 text-center rounded">
<i class="fas fa-cloud-upload-alt fa-3x mb-3" style="color: var(--primary-color)"></i>
<h4>Drag & Drop Image Here</h4>
<p>or</p>
<input class="form-control" type="file" name="file" accept=".png,.jpg,.jpeg" required>
</div>
</div>
<div id="preview-container" class="mb-4" style="display: none;">
<h5>Preview:</h5>
<img id="preview-image" class="img-fluid rounded" alt="Preview">
</div>
<div class="text-center">
<button type="submit" class="btn btn-primary">
<i class="fas fa-magic me-2"></i>
Translate Image
</button>
<div class="loading-spinner mx-auto mt-3" style="display: none;"></div>
</div>
</form>
</div>
</div>
{% endblock %} |