Files
dualshock-tools.github.io/templates/range-modal.html
2025-12-21 10:58:55 +01:00

43 lines
2.3 KiB
HTML

<!-- Modal -->
<div class="modal fade" id="rangeModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5 ds-i18n" id="staticBackdropLabel">Range calibration</h1>
</div>
<div class="modal-body">
<p class="ds-i18n"><b class="pulsing-text">The controller is now sampling data!</b></p>
<p class="ds-i18n">Rotate the sticks slowly at least 2 times in one direction and 2 times in the other direction to cover the whole range.</p>
<div style="display: flex; justify-content: center; gap: 0px;">
<div style="text-align: center; margin-right: 0px;">
<canvas id="range-left-stick-canvas" width="150" height="150"></canvas>
</div>
<div style="text-align: center; margin-left: 0px;">
<canvas id="range-right-stick-canvas" width="150" height="150"></canvas>
</div>
</div>
<div class="progress mt-2" id="range-progress-container" role="progressbar" aria-label="Range calibration progress" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
<div id="range-progress-bar" class="progress-bar" style="width:0%"></div>
</div>
<div class="mt-2" id="range-progress-text-container">
<small class="text-muted">
<span class="ds-i18n">Progress</span>: <span id="range-progress-text">0%</span>
</small>
</div>
<div class="alert alert-info mt-3" id="range-calibration-alert" role="alert">
<span id="keep-rotating-alert" ><i class="fas fa-info-circle"></i>
<small class="ds-i18n">Keep rotating the sticks even if you see no progress!</small>
</span>
<br><br>
<small class="ds-i18n">The <b>Done</b> button will unlock after at most 15 seconds. If you press <b>Done</b> without rotating the sticks, the calibration will be incomplete and you will need to repeat it.</small>
</div>
</div>
<div class="modal-footer">
<button type="button" id="range-done-btn" class="btn btn-outline-primary ds-i18n" onclick="calibrate_range_on_close()">Done</button>
</div>
</div>
</div>
</div>