44 lines
2.3 KiB
HTML
44 lines
2.3 KiB
HTML
<div id="uni_collection"
|
|
class="uni-collection uk-section uk-section-large@m uk-panel uk-overflow-hidden uk-padding-2xlarge-bottom@m swiper-parent">
|
|
<div class="uk-container">
|
|
<header class="uk-grid-xsmall uk-flex-center uk-flex-middle uk-text-center uk-child-width-auto@m uk-grid"
|
|
data-uk-grid data-anime="opacity:[0, 1]; translateY:[-24, 0]; onview: true; delay: 200;">
|
|
<div class="uk-panel">
|
|
<h2 class="uk-h3 uk-h1@m">Klasifikasi Gambar</h2>
|
|
</div>
|
|
</header>
|
|
<div class="uk-panel uk-margin-top uk-margin-xlarge-top@m">
|
|
<div class="main">
|
|
<div class="title">
|
|
<img src="" width="300" style="margin-top: 40px; margin-bottom: 24px">
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<input id="file-upload" class="hidden" type="file" accept="image/x-png,image/gif,image/jpeg" />
|
|
<label for="file-upload" id="file-drag" class="upload-box">
|
|
<div id="upload-caption">Drop/load gambar disini</div>
|
|
<img id="image-preview" class="hidden" />
|
|
</label>
|
|
</div>
|
|
<div style="margin-bottom: 2rem;">
|
|
<input type="button" value="Prediksi" class="button" onclick="submitImage();" />
|
|
<span style="margin: 0px 4px"></span>
|
|
<input type="button" value="Hapus" class="button" onclick="clearImage();" />
|
|
</div>
|
|
|
|
<div id="image-box">
|
|
<img id="image-display" />
|
|
<div id="pred-result" class="hidden"></div>
|
|
<div id="pred-probability" class="hidden" style="visibility: visible;"></div>
|
|
<svg id="loader" class="hidden" viewBox="0 0 32 32" width="32" height="32">
|
|
<circle id="spinner" cx="16" cy="16" r="14" fill="none"></circle>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<img class="uk-width-2xsmall uk-flex-center uk-margin-auto uk-margin-medium uk-margin-large@m"
|
|
src="../static/assets/images/divider-01.svg" alt="Divider"
|
|
data-anime="opacity:[0, 1]; translateY:[-24, 0]; onview: true; delay: 100;"> |