93 lines
3.9 KiB
HTML
93 lines
3.9 KiB
HTML
|
<th:block th:utext="#{title.photograph}"></th:block>
|
||
|
|
<form id="formPhotograph" name="formPhotograph"
|
||
|
|
th:action="@{'/resources/photograph-details'}" autocomplete="off"
|
||
|
|
th:method="post" enctype="multipart/form-data ">
|
||
|
|
<input type="hidden" th:value="${profile?.wrkrRegId}" name="workerRegId" />
|
||
|
|
<input type="hidden" th:value="${profile?.workerProfile?.wrkrProfId}" name="wrkrProfId" />
|
||
|
|
<input type="hidden" th:value="${profile?.wrkrRegNo}" name="wrkrRegNo" />
|
||
|
|
<input type="hidden" th:value="${updateFlag}" name="updateFlag" />
|
||
|
|
<input type="hidden" th:value="${photoUrl}" id="photoUrl" name="photoUrl" />
|
||
|
|
<div class="row mb-2 el-element-overlay">
|
||
|
|
<div class="col-5">
|
||
|
|
<div class="card">
|
||
|
|
<div class="el-card-item ">
|
||
|
|
<div class="el-card-avatar pb-3 text-center">
|
||
|
|
<video id="videoElement" th:poster="@{/images/example/camera.png}" autoplay="autoplay" width="400" height="300"></video>
|
||
|
|
<canvas id="canvas-portrait" style="display:none;" width="400" height="300" >Your browser does not support this function</canvas>
|
||
|
|
</div>
|
||
|
|
<div class="el-card-content">
|
||
|
|
<button class="btn btn-primary btn-round ml-2" type="button"
|
||
|
|
id="btnStart" onclick="startCamera()">Start Camera</button>
|
||
|
|
<button class="btn btn-primary btn-round ml-2" type="button"
|
||
|
|
id="btnCapture" style="display:none;" onclick="captureImage()">Capture Image</button>
|
||
|
|
<button class="btn btn-primary btn-round ml-2" type="button"
|
||
|
|
id="btnCrop" style="display:none;" onclick="cropImage()">Crop Image</button>
|
||
|
|
<button class="btn btn-primary btn-round ml-2" type="button"
|
||
|
|
id="btnReset" style="display:none;" onclick="resetAllFields()">Reset</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-3">
|
||
|
|
<div class="card">
|
||
|
|
<div class="el-card-item m-0 p-0">
|
||
|
|
<div class="el-card-avatar el-overlay-1 m-0">
|
||
|
|
<div id="canvas-preview" style="display:none;background: #fff;" width="200" height="300">Your browser does not support this function</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-4">
|
||
|
|
<div class="table-responsive table-full-width">
|
||
|
|
<table id="tblPhotograph" class="table table-bordered bg-default">
|
||
|
|
<colgroup>
|
||
|
|
<col width="2%">
|
||
|
|
<col width="850%">
|
||
|
|
<col width="2%">
|
||
|
|
</colgroup>
|
||
|
|
<thead class="table-secondary">
|
||
|
|
<tr>
|
||
|
|
<th></th>
|
||
|
|
<th class="text-center">Image Quality Check (<small>ICAO Standard</small>)</th>
|
||
|
|
<th></th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>1</td>
|
||
|
|
<td>Eyes Open</td>
|
||
|
|
<td><div class="text-success"><i class="far fa-lg fa-check-circle"></i></div></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>2</td>
|
||
|
|
<td>Mouth Close</td>
|
||
|
|
<td><div class="text-success"><i class="far fa-lg fa-check-circle"></i></div></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>3</td>
|
||
|
|
<td>No Glasses</td>
|
||
|
|
<td><div class="text-success"><i class="far fa-lg fa-check-circle"></i></div></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>4</td>
|
||
|
|
<td>Face Detected</td>
|
||
|
|
<td><div class="text-success"><i class="far fa-lg fa-check-circle"></i></div></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>5</td>
|
||
|
|
<td>Single Face</td>
|
||
|
|
<td><div class="text-success"><i class="far fa-lg fa-check-circle"></i></div></td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="pb-3 text-right">
|
||
|
|
<div class="ml-auto button-group">
|
||
|
|
<a class="btn waves-effect waves-light btn-secondary" th:href="@{${'/resources/previousTab?previousTab='+previousTab + '&wrkrRegId=' + profile?.wrkrRegId + '&updateFlag=' + updateFlag}}">Previous</a>
|
||
|
|
<button type="submit" class="btn waves-effect waves-light btn-primary btn-check-device" id="btnSavePhoto" disabled="disabled" value="Save and Continue">Save and Continue</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|