pikvm/pikvm#1418: web: hold/lock key on keypad

This commit is contained in:
Maxim Devaev
2025-05-18 22:07:47 +03:00
parent 70ca478a78
commit c3eed7c497
10 changed files with 207 additions and 170 deletions

View File

@@ -1003,32 +1003,21 @@
<div class="keypad" id="stream-mouse-buttons" align="center">
<div class="keypad-block">
<div class="keypad-row">
<div class="key wide-3 left rounded-left" data-code="left">
<div class="label">Left</div>
<div class="key wide-3 left rounded-left" data-code="left" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Left</div>
</div>
<div class="modifier left small rounded-right" data-code="left">
<div class="label"><b>&bull;</b><br>Hold</div>
<div class="key wide-1 rounded-none" data-code="middle" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Mid</div>
</div>
<div class="empty" style="width: 15px"></div>
<div class="key wide-1 left rounded-left" data-code="middle">
<div class="label">Mid</div>
</div>
<div class="modifier left small rounded-right" data-code="middle">
<div class="label"><b>&bull;</b><br>Hold</div>
</div>
<div class="empty" style="width: 15px"></div>
<div class="modifier right small rounded-left" data-code="right">
<div class="label"><b>&bull;</b><br>Hold</div>
</div>
<div class="key wide-3 right rounded-right" data-code="right">
<div class="label">Right</div>
<div class="key wide-3 right rounded-right" data-code="right" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Right</div>
</div>
<div class="empty" style="width: 30px"></div>
<div class="key small rounded-left" data-code="up">
<div class="label">Up</div>
<div class="key small rounded-left" data-code="up" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Up</div>
</div>
<div class="key small rounded-right" data-code="down">
<div class="label">Down</div>
<div class="key small rounded-right" data-code="down" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Down</div>
</div>
</div>
</div>
@@ -1332,7 +1321,7 @@
</div>
</div>
<div class="keypad-row">
<div class="modifier wide-3 left small" data-code="ShiftLeft">
<div class="key wide-3 left small" data-code="ShiftLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Shift
</div>
</div>
@@ -1387,23 +1376,23 @@
</div>
</div>
<div class="spacer"></div>
<div class="modifier wide-3 right small" data-code="ShiftRight">
<div class="key wide-3 right small" data-code="ShiftRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Shift
</div>
</div>
</div>
<div class="keypad-row">
<div class="modifier wide-1 left small" data-code="ControlLeft">
<div class="key wide-1 left small" data-code="ControlLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Ctrl
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier wide-1 left small" data-code="MetaLeft">
<div class="key wide-1 left small" data-code="MetaLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Win
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier wide-1 left small" data-code="AltLeft">
<div class="key wide-1 left small" data-code="AltLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Alt
</div>
</div>
@@ -1413,12 +1402,12 @@
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier wide-1 right small" data-code="AltRight">
<div class="key wide-1 right small" data-code="AltRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Alt
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier wide-1 right small" data-code="MetaRight">
<div class="key wide-1 right small" data-code="MetaRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Win
</div>
</div>
@@ -1428,7 +1417,7 @@
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier wide-1 right small" data-code="ControlRight">
<div class="key wide-1 right small" data-code="ControlRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Ctrl
</div>
</div>
@@ -1436,7 +1425,7 @@
</div>
<div class="keypad-block">
<div class="keypad-row">
<div class="modifier small" data-code="PrintScreen">
<div class="key small" data-code="PrintScreen" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Pt/Sq
</div>
</div>
@@ -1660,19 +1649,19 @@
</div>
</div>
<div class="keypad-row">
<div class="modifier small" data-code="KanaMode">
<div class="key small" data-code="KanaMode" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Kana
</div>
</div>
</div>
<div class="keypad-row">
<div class="modifier small" data-code="NonConvert">
<div class="key small" data-code="NonConvert" data-allow-autohold>
<div class="label"><b>&bull;</b><br>N/Cnv
</div>
</div>
</div>
<div class="keypad-row">
<div class="modifier small" data-code="Convert">
<div class="key small" data-code="Convert" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Cnv
</div>
</div>
@@ -1738,7 +1727,7 @@
</div>
</div>
<div class="spacer-fixed"></div>
<div class="modifier small" data-code="PrintScreen">
<div class="key small" data-code="PrintScreen" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Pt/Sq
</div>
</div>
@@ -1982,7 +1971,7 @@
</div>
</div>
<div class="keypad-row">
<div class="modifier wide-3 left small" data-code="ShiftLeft">
<div class="key wide-3 left small" data-code="ShiftLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Shift
</div>
</div>
@@ -2053,17 +2042,17 @@
</div>
</div>
<div class="keypad-row">
<div class="modifier wide-1 left small" data-code="ControlLeft">
<div class="key wide-1 left small" data-code="ControlLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Ctrl
</div>
</div>
<div class="spacer"></div>
<div class="modifier wide-1 left small" data-code="MetaLeft">
<div class="key wide-1 left small" data-code="MetaLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Win
</div>
</div>
<div class="spacer"></div>
<div class="modifier wide-1 left small" data-code="AltLeft">
<div class="key wide-1 left small" data-code="AltLeft" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Alt
</div>
</div>
@@ -2073,12 +2062,12 @@
</div>
</div>
<div class="spacer"></div>
<div class="modifier right small" data-code="AltRight">
<div class="key right small" data-code="AltRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Alt
</div>
</div>
<div class="spacer"></div>
<div class="modifier right small" data-code="MetaRight">
<div class="key right small" data-code="MetaRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Win
</div>
</div>
@@ -2088,12 +2077,12 @@
</div>
</div>
<div class="spacer"></div>
<div class="modifier right small" data-code="ShiftRight">
<div class="key right small" data-code="ShiftRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Shift
</div>
</div>
<div class="spacer"></div>
<div class="modifier right small" data-code="ControlRight">
<div class="key right small" data-code="ControlRight" data-allow-autohold>
<div class="label"><b>&bull;</b><br>Ctrl
</div>
</div>