<!-------------------------------------------------------------------------------------
* Project : Chest X-Ray Pathology Detection and Localization using Deep Learning
* Author Name : Rammuni Ravidu Suien Silva
* UoW No : 16267097
* IIT No : 2016134
* Module : Final Year Project 20/21
* Supervisor : Mr Pumudu Fernando
* Prototype : Web Interface - FrontEnd - HTML
* File : UI elements
* University of Westminster, UK || IIT Sri Lanka
-------------------------------------------------------------------------------------->
{% extends "base.html" %} {% block content %}
<h4 style="text-align:center">Upload CXR Below</h4>
<!--Main body div of the web app-->
<div id="main-app-body">
<!--Input form-->
<form id="upload-cxr-form" method="post" enctype="multipart/form-data">
<label for="imageUpload" class="upload-label btn btn-primary btn-lg btn-block">
SELECT Chest X-Ray IMAGE
</label>
<div class="form-group">
<label for="modelSelect">Model Selection</label>
<select class="form-control" id="modelSelect">
<option>0</option>
<option>1</option>
<option>2</option>
</select>
</div>
<input type="file" name="files" class="cxrImgUpload" id="imageUpload" accept="image/png, image/jpeg"
multiple/>
</form>
<!---CXR Image Preview Section-->
<div class="image-section" style="display:none;">
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-0"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-1"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-2"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-3"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-4"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-5"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-6"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-7"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-8"></div>
</div>
<div class="img-preview" style="display:none;">
<div class="cxr-preview" id="cxr-preview-9"></div>
</div>
<div>
<button type="button" class="btn btn-primary btn-lg" id="btn-detect">Run Scan</button>
<button type="button" class="btn btn-primary btn-lg" id="btn-localize" style="display:none;">Run
Localization
</button>
</div>
</div>
<button id="loader_ani" class="btn btn-primary btn-lg" type="button" style="display:none;" disabled>
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
Scanning...
</button>
<button id="loader_ani_localize" class="btn btn-primary btn-lg" type="button" style="display:none;" disabled>
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
Localizing...
</button>
<button id="loader_localized" class="btn btn-primary btn-lg" type="button" style="display:none;" disabled>
Localized
</button>
<button id="btn-save" class="btn btn-primary btn-lg" type="button" style="display:none;">
Save
</button>
<!-- Displaying Results -->
<div id="result"></div>
<!---CXR result printing section-->
<div class="loc-result-print"><h2 align="center"><u>LOCALIZATIONS</u></h2></div>
<!---CXR Info Modal-->
<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">LAB CXR Info</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
Below pathologies can be detected through each model
<ol>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="font-weight-bold">Model-0</div>
Enlarged Cardiomediastinum, Cardiomegaly, Lung Lesion, Lung Opacity,
Edema, Consolidation, Pneumonia, Atelectasis, Pneumothorax, Pleural Effusion,
Pleural Other, Fracture
</div>
<span class="badge bg-primary rounded-pill">12 Pathologies</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="ms-2 me-auto">
<div class="font-weight-bold">Model-1</div>
Nodule, Cardiomegaly, Emphysema, Fibrosis, Edema, Consolidation, Pneumonia,
Atelectasis, Pneumothorax, Pleural Effusion, Mass, Infiltration, Hernia,
Plueral Thickening
</div>
<span class="badge bg-primary rounded-pill">14 Pathologies</span>
</li>
</ol>
<ul>
<li>
<small class="author">Author : Rammuni Silva Ravidu Suien</small>
</li>
<li>
<small class="author">Contact : ravidu.2016134@iit.ac.lk |
w1626709@my.westminster.ac.uk</small>
</li>
<li>
<small class="author">Final Year Project Prototype - Web App</small>
</li>
<li>
<a href="http://bit.ly/LABCXR_SAMPLE_XRAYS">Download Sample CXRs</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
Datasets
Models
