mirror of
https://github.com/mofeng-git/One-KVM.git
synced 2025-12-12 09:10:30 +08:00
1381 lines
62 KiB
HTML
1381 lines
62 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
==============================================================================
|
|
# #
|
|
# KVMD - The main Pi-KVM daemon. #
|
|
# #
|
|
# Copyright (C) 2018 Maxim Devaev <mdevaev@gmail.com> #
|
|
# #
|
|
# This program is free software: you can redistribute it and/or modify #
|
|
# it under the terms of the GNU General Public License as published by #
|
|
# the Free Software Foundation, either version 3 of the License, or #
|
|
# (at your option) any later version. #
|
|
# #
|
|
# This program is distributed in the hope that it will be useful, #
|
|
# but WITHOUT ANY WARRANTY; without even the implied warranty of #
|
|
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the #
|
|
# GNU General Public License for more details. #
|
|
# #
|
|
# You should have received a copy of the GNU General Public License #
|
|
# along with this program. If not, see <https://www.gnu.org/licenses/>. #
|
|
# #
|
|
==============================================================================
|
|
|
|
-->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Pi-KVM Session</title>
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/share/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/share/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/share/favicon-16x16.png">
|
|
<link rel="manifest" href="/share/site.webmanifest">
|
|
<link rel="mask-icon" href="/share/safari-pinned-tab.svg" color="#5bbad5">
|
|
<meta name="msapplication-TileColor" content="#2b5797">
|
|
<meta name="theme-color" content="#ffffff">
|
|
<link rel="stylesheet" href="/share/css/vars.css">
|
|
<link rel="stylesheet" href="/share/css/main.css">
|
|
<link rel="stylesheet" href="/share/css/navbar.css">
|
|
<link rel="stylesheet" href="/share/css/window.css">
|
|
<link rel="stylesheet" href="/share/css/modal.css">
|
|
<link rel="stylesheet" href="/share/css/led.css">
|
|
<link rel="stylesheet" href="/share/css/slider.css">
|
|
<link rel="stylesheet" href="/share/css/switch.css">
|
|
<link rel="stylesheet" href="/share/css/radio.css">
|
|
<link rel="stylesheet" href="/share/css/progress.css">
|
|
<link rel="stylesheet" href="/share/css/keypad.css">
|
|
<link rel="stylesheet" href="/share/css/tabs.css">
|
|
<link rel="stylesheet" href="/share/css/kvm/stream.css">
|
|
<link rel="stylesheet" href="/share/css/kvm/hid.css">
|
|
<link rel="stylesheet" href="/share/css/kvm/msd.css">
|
|
<link rel="stylesheet" href="/share/css/kvm/keyboard.css">
|
|
<link rel="stylesheet" href="/share/css/kvm/about.css">
|
|
<script type="module">import {main} from "/share/js/kvm/main.js";
|
|
main();
|
|
</script>
|
|
</head>
|
|
<body class="body-no-select">
|
|
<ul id="navbar">
|
|
<li class="left"><a id="logo" href="/">← <img class="svg-gray" src="/share/svg/logo.svg" alt="&pi;-kvm"></a></li>
|
|
<div class="hidden" id="hw-health-dropdown">
|
|
<li class="left"><a class="menu-button" href="#"><img class="hidden" data-dont-hide-menu id="hw-health-undervoltage-led" src="/share/svg/led-undervoltage.svg"><img class="hidden" data-dont-hide-menu id="hw-health-overheating-led" src="/share/svg/led-overheating.svg">↴</a>
|
|
<div class="menu" data-dont-hide-menu>
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td>
|
|
<td style="line-height:1.5"><b>Raspberry Pi's health is at risk</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">This is not a drill! A red icon indicates a current issue,<br>
|
|
a yellow one that was observed since the device booted up</sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="hidden" id="hw-health-message-undervoltage">
|
|
<hr>
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign led-gray" src="/share/svg/led-undervoltage.svg"></td>
|
|
<td style="line-height:1.5"><b>Undervoltage detected</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">Make sure your power supply and cabling are providing<br>
|
|
enough power to the Raspberry Pi (3A minimum)</sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="hidden" id="hw-health-message-overheating">
|
|
<hr>
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign led-gray" src="/share/svg/led-overheating.svg"></td>
|
|
<td style="line-height:1.5"><b>Overheating detected</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">Frequency capping due to overheating,<br>
|
|
improve cooling of the Raspberry Pi</sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</div>
|
|
<li class="right"><a class="menu-button" href="#"><img class="led-gray" data-dont-hide-menu id="link-led" src="/share/svg/led-link.svg"><img class="led-gray" data-dont-hide-menu id="stream-led" src="/share/svg/led-stream.svg"><img class="led-gray" data-dont-hide-menu id="hid-keyboard-led" src="/share/svg/led-hid-keyboard.svg"><img class="led-gray" data-dont-hide-menu id="hid-mouse-led" src="/share/svg/led-hid-mouse.svg">System ↴</a>
|
|
<div class="menu" data-dont-hide-menu>
|
|
<div class="buttons">
|
|
<button disabled data-force-hide-menu id="stream-screenshot-button">• Take a screenshot</button>
|
|
<hr>
|
|
<button data-force-hide-menu id="show-stream-button">• Show stream</button>
|
|
<button data-force-hide-menu id="show-keyboard-button">• Show keyboard</button>
|
|
<button data-force-hide-menu id="show-about-button">• Show about</button>
|
|
</div>
|
|
<div class="feature-disabled" id="stream-resolution">
|
|
<hr>
|
|
<div class="text">Stream resolution:
|
|
<div class="stream-param-box">
|
|
<select disabled data-dont-hide-menu id="stream-resolution-selector"></select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="feature-disabled" id="stream-quality">
|
|
<hr>
|
|
<div class="text">Stream quality: <span id="stream-quality-value">80%</span>
|
|
<div class="stream-param-box">
|
|
<input class="slider" disabled type="range" id="stream-quality-slider">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="text">Stream FPS: <span id="stream-desired-fps-value">0</span>
|
|
<div class="stream-param-box">
|
|
<input class="slider" disabled type="range" id="stream-desired-fps-slider">
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="text">Stream size: <span id="stream-size-value">100%</span>
|
|
<div class="stream-param-box">
|
|
<input class="slider" type="range" id="stream-size-slider">
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="text">
|
|
<table class="one-line-switch">
|
|
<td>Auto-resize stream:</td>
|
|
<td align="right">
|
|
<div class="switch-box">
|
|
<input checked type="checkbox" id="stream-auto-resize-checkbox">
|
|
<label for="stream-auto-resize-checkbox"><span class="switch-inner"></span><span class="switch"></span></label>
|
|
</div>
|
|
</td>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
<div class="buttons">
|
|
<button disabled data-force-hide-menu id="stream-reset-button">• Reset stream</button>
|
|
<button disabled data-force-hide-menu id="hid-reset-button">• Reset keyboard & mouse</button>
|
|
<button class="feature-disabled" disabled data-force-hide-menu id="msd-reset-button">• Reset mass storage</button>
|
|
</div>
|
|
<hr>
|
|
<div class="buttons">
|
|
<button data-force-hide-menu id="open-log-button">• Open log</button>
|
|
</div>
|
|
<div class="buttons feature-disabled" id="wol">
|
|
<hr>
|
|
<button disabled id="wol-wakeup-button">• Wake on LAN server</button>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="right feature-disabled" id="atx-dropdown"><a class="menu-button" href="#"><img class="led-gray" data-dont-hide-menu id="atx-power-led" src="/share/svg/led-atx-power.svg"><img class="led-gray" data-dont-hide-menu id="atx-hdd-led" src="/share/svg/led-atx-hdd.svg">ATX ↴</a>
|
|
<div class="menu">
|
|
<div class="buttons">
|
|
<button disabled id="atx-power-button">• Click Power <sup><i>short</i></sup></button>
|
|
<button disabled id="atx-power-button-long">• Click Power <sup><i>long</i></sup></button>
|
|
<hr>
|
|
<button disabled id="atx-reset-button">• Click Reset</button>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="right feature-disabled" id="msd-dropdown"><a class="menu-button" href="#"><img class="led-gray" data-dont-hide-menu id="msd-led" src="/share/svg/led-msd.svg">Mass Storage ↴</a>
|
|
<div class="menu" data-dont-hide-menu id="msd-menu">
|
|
<div class="hidden" id="msd-message-offline">
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td>
|
|
<td style="line-height:1.5"><b>Mass Storage Device is offline</b></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<div class="hidden" id="msd-message-image-broken">
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td>
|
|
<td style="line-height:1.5"><b>Current image is broken!</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">Perhaps uploading was interrupted<br></sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<div class="hidden" id="msd-message-too-big-for-cdrom">
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td>
|
|
<td style="line-height:1.5"><b>Current image is too big for CD-ROM!</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">The device filesystem will be truncated to 2.2GiB</sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<div class="hidden" id="msd-message-out-of-storage">
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/warning.svg"></td>
|
|
<td style="line-height:1.5"><b>Current image is out of storag</b></td>
|
|
</tr>
|
|
<tr>
|
|
<td><sup style="line-height:1">This image was connected manually using <b>kvmd-otgmsd</b></sup></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<div class="hidden" id="msd-message-another-user-uploads">
|
|
<div class="text">
|
|
<table>
|
|
<tr>
|
|
<td rowspan="2"><img class="sign " src="/share/svg/info.svg"></td>
|
|
<td style="line-height:1.5"><b>Another user uploads an image</b></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<table class="kv">
|
|
<tr>
|
|
<td>Status:</td>
|
|
<td class="value" id="msd-status"></td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<table class="kv msd-single-storage feature-disabled">
|
|
<tr>
|
|
<td>Current image:</td>
|
|
<td class="value" id="msd-image-name"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Image size:</td>
|
|
<td class="value" id="msd-image-size"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Storage size:</td>
|
|
<td class="value" id="msd-storage-size"></td>
|
|
</tr>
|
|
</table>
|
|
<table class="kv msd-multi-storage feature-disabled">
|
|
<tr>
|
|
<td>Image:</td>
|
|
<td width="100%">
|
|
<select disabled id="msd-image-selector"></select>
|
|
</td>
|
|
<td>
|
|
<button disabled id="msd-remove-image">Remove</button>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<table class="kv msd-multi-storage feature-disabled">
|
|
<tr class="msd-cdrom-emulation feature-disabled">
|
|
<td>Drive mode:</td>
|
|
<td>
|
|
<div class="radio-box">
|
|
<input checked type="radio" id="msd-mode-radio-cdrom" name="msd-mode-radio" value="1">
|
|
<label for="msd-mode-radio-cdrom">CD-ROM</label>
|
|
<input type="radio" id="msd-mode-radio-flash" name="msd-mode-radio" value="0">
|
|
<label for="msd-mode-radio-flash">Flash</label>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
<div class="msd-multi-storage feature-disabled">
|
|
<hr>
|
|
<div class="text">
|
|
<div class="progress" id="msd-storage-progress"><span class="progress-value" id="msd-storage-progress-value"></span></div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<input class="hidden" type="file" id="msd-select-new-image-file">
|
|
<div class="buttons buttons-row">
|
|
<button class="row50" disabled id="msd-select-new-image-button">Upload new image</button>
|
|
<button class="row25" disabled id="msd-upload-new-image-button">Start</button>
|
|
<button class="row25" disabled id="msd-abort-uploading-button">Abort</button>
|
|
</div>
|
|
<hr>
|
|
<div class="hidden" id="msd-submenu-new-image">
|
|
<table class="kv">
|
|
<tr>
|
|
<td>New image:</td>
|
|
<td class="value" id="msd-new-image-name"></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Upload size:</td>
|
|
<td class="value" id="msd-new-image-size"></td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<div class="text">
|
|
<div class="progress" id="msd-uploading-progress"><span class="progress-value" id="msd-uploading-progress-value"></span></div>
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
<div class="buttons buttons-row">
|
|
<button class="row50" disabled data-force-hide-menu id="msd-connect-button">• Connect drive to Server</button>
|
|
<button class="row50" disabled data-force-hide-menu id="msd-disconnect-button">• Disconnect drive</button>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="right"><a class="menu-button" href="#"><img class="led-gray" data-dont-hide-menu id="hid-recorder-led" src="/share/svg/led-gear.svg">Macro ↴</a>
|
|
<div class="menu" data-dont-hide-menu>
|
|
<div class="text"><b>Record and play keyboard & mouse actions<br></b><sub>For security reasons, the record will not saved on Pi-KVM</sub></div>
|
|
<hr>
|
|
<div class="buttons buttons-row">
|
|
<button class="row25" disabled data-force-hide-menu id="hid-recorder-record">• Rec</button>
|
|
<button class="row25" disabled id="hid-recorder-stop">Stop</button>
|
|
<button class="row25" disabled id="hid-recorder-play">Play</button>
|
|
<button class="row25" disabled id="hid-recorder-clear">Clear</button>
|
|
</div>
|
|
<hr>
|
|
<table class="kv">
|
|
<tr>
|
|
<td>Script time:</td>
|
|
<td class="value" colspan="2" id="hid-recorder-time">00:00:00.0</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Scripted events:</td>
|
|
<td class="value" id="hid-recorder-events-count">0</td>
|
|
<td><sup><i>include delays</i></sup></td>
|
|
</tr>
|
|
</table>
|
|
<hr>
|
|
<input type="file" id="hid-recorder-new-script-file">
|
|
<div class="buttons buttons-row">
|
|
<button class="row50" disabled id="hid-recorder-upload">Upload script</button>
|
|
<button class="row50" disabled id="hid-recorder-download">Download script</button>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li class="right"><a class="menu-button" href="#">Shortcuts ↴</a>
|
|
<div class="menu" data-dont-hide-menu>
|
|
<div class="buttons">
|
|
<textarea id="hid-pak-text" placeholder="Paste your text here"></textarea>
|
|
<hr>
|
|
<button disabled data-force-hide-menu id="hid-pak-button">• ↳ Paste-as-Keys <sup><i>ascii-only</i></sup></button>
|
|
<hr>
|
|
<div class="buttons-row">
|
|
<button class="row50" data-force-hide-menu data-shortcut="CapsLock">• Caps Lock <img class="inline-lamp hid-keyboard-caps-led led-gray" src="/share/svg/led-square.svg"></button>
|
|
<button class="row50" data-force-hide-menu data-shortcut="MetaLeft">• Left Win</button>
|
|
</div>
|
|
<hr>
|
|
<button data-force-hide-menu data-shortcut="AltLeft ShiftLeft">• Alt+Shift</button>
|
|
<button data-force-hide-menu data-shortcut="ControlLeft ShiftLeft">• Ctrl+Shift</button>
|
|
<button data-force-hide-menu data-shortcut="ShiftLeft ShiftRight">• Shift+Shift</button>
|
|
<button data-force-hide-menu data-shortcut="MetaLeft Space">• Win+Space</button>
|
|
<hr>
|
|
<button data-force-hide-menu data-shortcut="ControlLeft KeyW">• Ctrl+W</button>
|
|
<button data-force-hide-menu data-shortcut="AltLeft Tab">• Alt+Tab</button>
|
|
<button data-force-hide-menu data-shortcut="AltLeft Enter">• Alt+Enter</button>
|
|
<button data-force-hide-menu data-shortcut="AltLeft F4">• Alt+F4</button>
|
|
<hr>
|
|
<button data-force-hide-menu data-shortcut="ControlLeft AltLeft Delete">• Ctrl+Alt+Del</button>
|
|
</div>
|
|
<hr>
|
|
<div class="text">
|
|
↓ Alt+SysRq+... <sup><i>linux magic
|
|
<a target="_blank" href="https://www.kernel.org/doc/html/latest/admin-guide/sysrq.html">help</a></i></sup>
|
|
</div>
|
|
<hr>
|
|
<div class="buttons">
|
|
<div class="buttons-row">
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyR">R</button>
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyE">E</button>
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyI">I</button>
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyS">S</button>
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyU">U</button>
|
|
<button class="row16" data-shortcut="AltLeft PrintScreen KeyB">B</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<div class="window" id="stream-window">
|
|
<div class="window-header" id="stream-window-header" style="z-index:1">
|
|
<div class="window-grab">Stream</div>
|
|
</div>
|
|
<div id="stream-info"></div>
|
|
<div class="stream-box-inactive" id="stream-box"><img class="stream-image-inactive" id="stream-image" src="/share/png/blank-stream.png"></div>
|
|
<div class="keypad" id="stream-mouse-buttons" align="center">
|
|
<div class="keypad-block">
|
|
<div class="keypad-row">
|
|
<div class="key wide-4 left small" data-code="left"><span>Mouse<br>Left</span></div>
|
|
<div class="modifier wide-2 left small" data-code="left"><span><b>•</b><br>← Hold</span></div>
|
|
<div class="empty-key" style="width:10px"></div>
|
|
<div class="key wide-2 left small" data-code="middle"><span>Mouse<br>Middle</span></div>
|
|
<div class="modifier wide-2 left small" data-code="middle"><span><b>•</b><br>← Hold</span></div>
|
|
<div class="empty-key" style="width:10px"></div>
|
|
<div class="modifier wide-2 right small" data-code="right"><span><b>•</b><br>Hold →</span></div>
|
|
<div class="key wide-4 right small" data-code="right"><span>Mouse<br>Right</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="window" id="keyboard-window">
|
|
<div class="window-header" id="keyboard-window-header">
|
|
<div class="window-grab">Virtual Keyboard</div>
|
|
<button class="window-button-close">×</button>
|
|
</div>
|
|
<div class="keypad" id="keyboard-desktop" align="center">
|
|
<div class="keypad-block">
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Escape">
|
|
<div class="label">Esc
|
|
</div>
|
|
</div>
|
|
<div class="empty-key" style="width:24px"></div>
|
|
<div class="key small" data-code="F1">
|
|
<div class="label">F1
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F2">
|
|
<div class="label">F2
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F3">
|
|
<div class="label">F3
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F4">
|
|
<div class="label">F4
|
|
</div>
|
|
</div>
|
|
<div class="empty-key" style="width:10px"></div>
|
|
<div class="key small" data-code="F5">
|
|
<div class="label">F5
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F6">
|
|
<div class="label">F6
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F7">
|
|
<div class="label">F7
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F8">
|
|
<div class="label">F8
|
|
</div>
|
|
</div>
|
|
<div class="empty-key" style="width:10px"></div>
|
|
<div class="key small" data-code="F9">
|
|
<div class="label">F9
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F10">
|
|
<div class="label">F10
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F11">
|
|
<div class="label">F11
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="F12">
|
|
<div class="label">F12
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="keypad-row">
|
|
<div class="key " data-code="Backquote">
|
|
<div class="label">~<br>`
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit1">
|
|
<div class="label">!<br>1
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit2">
|
|
<div class="label">@<br>2
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit3">
|
|
<div class="label">#<br>3
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit4">
|
|
<div class="label">$<br>4
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit5">
|
|
<div class="label">%<br>5
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit6">
|
|
<div class="label">^<br>6
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit7">
|
|
<div class="label">&<br>7
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit8">
|
|
<div class="label">*<br>8
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit9">
|
|
<div class="label">(<br>9
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit0">
|
|
<div class="label">)<br>0
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Minus">
|
|
<div class="label">_<br>-
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Equal">
|
|
<div class="label">+<br>=
|
|
</div>
|
|
</div>
|
|
<div class="key wide-2 right" data-code="Backspace">
|
|
<div class="label">↤
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key wide-2 left" data-code="Tab">
|
|
<div class="label">⇤<br>⇥
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyQ">
|
|
<div class="label">Q
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyW">
|
|
<div class="label">W
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyE">
|
|
<div class="label">E
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyR">
|
|
<div class="label">R
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyT">
|
|
<div class="label">T
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyY">
|
|
<div class="label">Y
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyU">
|
|
<div class="label">U
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyI">
|
|
<div class="label">I
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyO">
|
|
<div class="label">O
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyP">
|
|
<div class="label">P
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="BracketLeft">
|
|
<div class="label">{<br>[
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="BracketRight">
|
|
<div class="label">}<br>]
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Backslash">
|
|
<div class="label">|<br>\
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key wide-3 left small" data-code="CapsLock">
|
|
<div class="label"><img class="inline-lamp hid-keyboard-caps-led led-gray" src="/share/svg/led-square.svg"><br> Caps Lock
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyA">
|
|
<div class="label">A
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyS">
|
|
<div class="label">S
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyD">
|
|
<div class="label">D
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyF">
|
|
<div class="label">F
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyG">
|
|
<div class="label">G
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyH">
|
|
<div class="label">H
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyJ">
|
|
<div class="label">J
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyK">
|
|
<div class="label">K
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyL">
|
|
<div class="label">L
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Semicolon">
|
|
<div class="label">:<br>;
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Quote">
|
|
<div class="label">"<br>'
|
|
</div>
|
|
</div>
|
|
<div class="key wide-3 right small" data-code="Enter">
|
|
<div class="label">Enter<br>↵
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="modifier wide-4 left small" data-code="ShiftLeft">
|
|
<div class="label"><b>•</b><br>Shift
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyZ">
|
|
<div class="label">Z
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyX">
|
|
<div class="label">X
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyC">
|
|
<div class="label">C
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyV">
|
|
<div class="label">V
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyB">
|
|
<div class="label">B
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyN">
|
|
<div class="label">N
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyM">
|
|
<div class="label">M
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Comma">
|
|
<div class="label"><<br>,
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Period">
|
|
<div class="label">><br>.
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Slash">
|
|
<div class="label">?<br>/
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-4 right small" data-code="ShiftRight">
|
|
<div class="label"><b>•</b><br>Shift
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="modifier wide-1 left small" data-code="ControlLeft">
|
|
<div class="label"><b>•</b><br>Ctrl
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 left small" data-code="MetaLeft">
|
|
<div class="label"><b>•</b><br>Win
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 left small" data-code="AltLeft">
|
|
<div class="label"><b>•</b><br>Alt
|
|
</div>
|
|
</div>
|
|
<div class="key wide-5" data-code="Space">
|
|
<div class="label">
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 right small" data-code="AltRight">
|
|
<div class="label"><b>•</b><br>Alt
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 right small" data-code="MetaRight">
|
|
<div class="label"><b>•</b><br>Win
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 right small" data-code="ControlRight">
|
|
<div class="label"><b>•</b><br>Ctrl
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-block">
|
|
<div class="keypad-row">
|
|
<div class="modifier small" data-code="PrintScreen">
|
|
<div class="label"><b>•</b><br>Pt/Sq
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="ScrollLock">
|
|
<div class="label"><img class="inline-lamp hid-keyboard-scroll-led led-gray" src="/share/svg/led-square.svg"><br> ScrLk
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Pause">
|
|
<div class="label">P/Brk
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Insert">
|
|
<div class="label">Ins
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Home">
|
|
<div class="label">Home
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="PageUp">
|
|
<div class="label">PgUp
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Delete">
|
|
<div class="label">Del
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="End">
|
|
<div class="label">End
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="PageDown">
|
|
<div class="label">PgDn
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row"></div>
|
|
<div class="keypad-row">
|
|
<div class="empty-key"></div>
|
|
<div class="key " data-code="ArrowUp">
|
|
<div class="label">↑
|
|
</div>
|
|
</div>
|
|
<div class="empty-key"></div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key " data-code="ArrowLeft">
|
|
<div class="label">←
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowDown">
|
|
<div class="label">↓
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowRight">
|
|
<div class="label">→
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-block">
|
|
<div class="keypad-row">
|
|
<div class="empty-key"></div>
|
|
<div class="empty-key"></div>
|
|
<div class="empty-key"></div>
|
|
<div class="key small" data-code="Power">
|
|
<div class="label">PWR
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="NumLock">
|
|
<div class="label"><img class="inline-lamp hid-keyboard-num-led led-gray" src="/share/svg/led-square.svg"><br> NmLk
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="NumpadDivide">
|
|
<div class="label">/
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="NumpadMultiply">
|
|
<div class="label">*
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="NumpadSubtract">
|
|
<div class="label">-
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Numpad7">
|
|
<div class="label">7<br>Home
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad8">
|
|
<div class="label">8<br>↑
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad9">
|
|
<div class="label">9<br>PgUp
|
|
</div>
|
|
</div>
|
|
<div class="empty-key"></div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Numpad4">
|
|
<div class="label">4<br>←
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad5">
|
|
<div class="label">5<br><br>
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad6">
|
|
<div class="label">6<br>→
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="NumpadAdd">
|
|
<div class="label">+
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Numpad1">
|
|
<div class="label">1<br>End
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad2">
|
|
<div class="label">2<br>↓
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="Numpad3">
|
|
<div class="label">3<br>PgDn
|
|
</div>
|
|
</div>
|
|
<div class="empty-key"></div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key small" data-code="Numpad0">
|
|
<div class="label">0<br>Ins
|
|
</div>
|
|
</div>
|
|
<div class="empty-key"></div>
|
|
<div class="key small" data-code="NumpadDecimal">
|
|
<div class="label">.<br>Del
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="NumpadEnter">
|
|
<div class="label">Ent
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad" id="keyboard-mobile" align="center">
|
|
<div class="keypad-block">
|
|
<div class="keypad-row">
|
|
<div class="key margin-0 small" data-code="Escape">
|
|
<div class="label">Esc
|
|
</div>
|
|
</div>
|
|
<div class="empty-key" style="width:1px"></div>
|
|
<div class="key wide-0 margin-0 small" data-code="F1">
|
|
<div class="label">F1
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F2">
|
|
<div class="label">F2
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F3">
|
|
<div class="label">F3
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F4">
|
|
<div class="label">F4
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F5">
|
|
<div class="label">F5
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F6">
|
|
<div class="label">F6
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F7">
|
|
<div class="label">F7
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F8">
|
|
<div class="label">F8
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F9">
|
|
<div class="label">F9
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F10">
|
|
<div class="label">F10
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F11">
|
|
<div class="label">F11
|
|
</div>
|
|
</div>
|
|
<div class="key wide-0 margin-0 small" data-code="F12">
|
|
<div class="label">F12
|
|
</div>
|
|
</div>
|
|
<div class="empty-key" style="width:2px"></div>
|
|
<div class="modifier margin-0 small" data-code="PrintScreen">
|
|
<div class="label"><b>•</b><br>Pt/Sq
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="ScrollLock">
|
|
<div class="label"><img class="inline-lamp hid-keyboard-scroll-led led-gray" src="/share/svg/led-square.svg"><br> ScrLk
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="Pause">
|
|
<div class="label">P/Brk
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="Insert">
|
|
<div class="label">Ins
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="Home">
|
|
<div class="label">Home
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="End">
|
|
<div class="label">End
|
|
</div>
|
|
</div>
|
|
<div class="key margin-0 small" data-code="Delete">
|
|
<div class="label">Del
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key " data-code="Backquote">
|
|
<div class="label">~<br>`
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit1">
|
|
<div class="label">!<br>1
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit2">
|
|
<div class="label">@<br>2
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit3">
|
|
<div class="label">#<br>3
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit4">
|
|
<div class="label">$<br>4
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit5">
|
|
<div class="label">%<br>5
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit6">
|
|
<div class="label">^<br>6
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit7">
|
|
<div class="label">&<br>7
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit8">
|
|
<div class="label">*<br>8
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit9">
|
|
<div class="label">(<br>9
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Digit0">
|
|
<div class="label">)<br>0
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Minus">
|
|
<div class="label">_<br>-
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Equal">
|
|
<div class="label">+<br>=
|
|
</div>
|
|
</div>
|
|
<div class="key wide-3 right" data-code="Backspace" style="width:101px">
|
|
<div class="label">↤
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key wide-2 left" data-code="Tab">
|
|
<div class="label">⇤<br>⇥
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyQ">
|
|
<div class="label">Q
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyW">
|
|
<div class="label">W
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyE">
|
|
<div class="label">E
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyR">
|
|
<div class="label">R
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyT">
|
|
<div class="label">T
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyY">
|
|
<div class="label">Y
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyU">
|
|
<div class="label">U
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyI">
|
|
<div class="label">I
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyO">
|
|
<div class="label">O
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyP">
|
|
<div class="label">P
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="BracketLeft">
|
|
<div class="label">{<br>[
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="BracketRight">
|
|
<div class="label">}<br>]
|
|
</div>
|
|
</div>
|
|
<div class="key wide-2 left" data-code="Backslash" style="width:78px">
|
|
<div class="label">|<br>\
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="key wide-3 left small" data-code="CapsLock">
|
|
<div class="label"><img class="inline-lamp hid-keyboard-caps-led led-gray" src="/share/svg/led-square.svg"><br> Caps Lock
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyA">
|
|
<div class="label">A
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyS">
|
|
<div class="label">S
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyD">
|
|
<div class="label">D
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyF">
|
|
<div class="label">F
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyG">
|
|
<div class="label">G
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyH">
|
|
<div class="label">H
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyJ">
|
|
<div class="label">J
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyK">
|
|
<div class="label">K
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyL">
|
|
<div class="label">L
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Semicolon">
|
|
<div class="label">:<br>;
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Quote">
|
|
<div class="label">`<br>'
|
|
</div>
|
|
</div>
|
|
<div class="key wide-4 right small" data-code="Enter" style="width:116px">
|
|
<div class="label">Enter<br>↵
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="modifier wide-4 left small" data-code="ShiftLeft">
|
|
<div class="label"><b>•</b><br>Shift
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyZ">
|
|
<div class="label">Z
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyX">
|
|
<div class="label">X
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyC">
|
|
<div class="label">C
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyV">
|
|
<div class="label">V
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyB">
|
|
<div class="label">B
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyN">
|
|
<div class="label">N
|
|
</div>
|
|
</div>
|
|
<div class="key single" data-code="KeyM">
|
|
<div class="label">M
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Comma">
|
|
<div class="label">lt;<br>,
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Period">
|
|
<div class="label">><br>.
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Slash">
|
|
<div class="label">?<br>/
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="PageUp">
|
|
<div class="label">PgUp
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowUp">
|
|
<div class="label">↑
|
|
</div>
|
|
</div>
|
|
<div class="key small" data-code="PageDown">
|
|
<div class="label">PgDn
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="keypad-row">
|
|
<div class="modifier wide-1 left small" data-code="ControlLeft">
|
|
<div class="label"><b>•</b><br>Ctrl
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 left small" data-code="MetaLeft">
|
|
<div class="label"><b>•</b><br>Win
|
|
</div>
|
|
</div>
|
|
<div class="modifier wide-1 left small" data-code="AltLeft">
|
|
<div class="label"><b>•</b><br>Alt
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="Space" style="width:190px">
|
|
<div class="label">
|
|
</div>
|
|
</div>
|
|
<div class="modifier right small" data-code="AltRight">
|
|
<div class="label"><b>•</b><br>Alt
|
|
</div>
|
|
</div>
|
|
<div class="modifier right small" data-code="MetaRight">
|
|
<div class="label"><b>•</b><br>Win
|
|
</div>
|
|
</div>
|
|
<div class="modifier right small" data-code="ShiftRight">
|
|
<div class="label"><b>•</b><br>Shift
|
|
</div>
|
|
</div>
|
|
<div class="modifier right small" data-code="ControlRight">
|
|
<div class="label"><b>•</b><br>Ctrl
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowLeft">
|
|
<div class="label">←
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowDown">
|
|
<div class="label">↓
|
|
</div>
|
|
</div>
|
|
<div class="key " data-code="ArrowRight">
|
|
<div class="label">→
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="window" id="about-window">
|
|
<div class="window-header" id="">
|
|
<div class="window-grab">About</div>
|
|
<button class="window-button-close">×</button>
|
|
</div>
|
|
<div id="about">
|
|
<table>
|
|
<tr>
|
|
<td class="logo" valign="top"><img class="svg-gray" src="../share/svg/logo.svg" alt="Pi-KVM" height="40"></td>
|
|
<td valign="top">
|
|
<table>
|
|
<tr>
|
|
<td class="title" colspan="2">The Open Source IP-KVM</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="copyright" colspan="2">Copyright © 2018 <a target="_blank" href="mailto:mdevaev@gmail.com">Maxim Devaev</a></td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table><br>
|
|
<div class="tabs-box">
|
|
<input checked type="radio" name="about-tab-button" id="about-tab-meta-button">
|
|
<label for="about-tab-meta-button">Meta</label>
|
|
<div class="tab">
|
|
<div class="code" id="about-meta"><span class="code-comment">No data</span>
|
|
</div>
|
|
</div>
|
|
<input type="radio" name="about-tab-button" id="about-tab-hw-button">
|
|
<label for="about-tab-hw-button">Hardware</label>
|
|
<div class="tab">
|
|
<div class="code" id="about-hw"><span class="code-comment">No data</span>
|
|
</div>
|
|
</div>
|
|
<input type="radio" name="about-tab-button" id="about-tab-version-button">
|
|
<label for="about-tab-version-button">Version</label>
|
|
<div class="tab">
|
|
<div class="code" id="about-version"><span class="code-comment">No data</span>
|
|
</div>
|
|
</div>
|
|
<input type="radio" name="about-tab-button" id="about-tab-thanks-button">
|
|
<label for="about-tab-thanks-button">Thanks</label>
|
|
<div class="tab">
|
|
<div class="code" id="about-thanks"><span class="code-comment">// These kind people donated money to the Pi-KVM project<br>
|
|
// and supported the work on it. We are very grateful<br>
|
|
// for their help, and memorializing their names<br>
|
|
// is the least we can do in gratitude.<br>
|
|
// If you also want to support this project,<br>
|
|
// you can use one of these services:
|
|
<a target="_blank" href="https://www.patreon.com/pikvm">Patreon</a>
|
|
or <a target="_blank" href="https://www.paypal.me/mdevaev">PayPal</a>.</span>
|
|
<ul>
|
|
<li>Aleksei Brusianskii</li>
|
|
<li>Alucard</li>
|
|
<li>Anton Kovalenko</li>
|
|
<li>Arthur Woimbée</li>
|
|
<li>baddog</li>
|
|
<li>Ben Gordon</li>
|
|
<li>Branden Shaulis</li>
|
|
<li>Brian White</li>
|
|
<li>Bruno Gomes</li>
|
|
<li>Bryan Adams</li>
|
|
<li>Christian Schlögl</li>
|
|
<li>Christof Maluck</li>
|
|
<li>Corey Lista</li>
|
|
<li>Clifford Coleman</li>
|
|
<li>Clinton Lee Taylor</li>
|
|
<li>David Howell</li>
|
|
<li>Denis Yatsenko</li>
|
|
<li>Dmitry Shilov</li>
|
|
<li>Ge Men</li>
|
|
<li>Grey Cynic</li>
|
|
<li>Guido Bernacchi</li>
|
|
<li>HimKo</li>
|
|
<li>Jacob Morgan</li>
|
|
<li>Jason Toland</li>
|
|
<li>Jeff Bowman</li>
|
|
<li>John McGovern</li>
|
|
<li>Jonathan Vaughn</li>
|
|
<li>Jozef Riha</li>
|
|
<li>Justin Waters</li>
|
|
<li>Krzysztof Żelaśkiewicz</li>
|
|
<li>Malcolm Cameron</li>
|
|
<li>Mark Gilbert</li>
|
|
<li>Mark Robinson</li>
|
|
<li>Mauricio Allende</li>
|
|
<li>Michael Kovacs</li>
|
|
<li>Michael Lynch</li>
|
|
<li>Nicholas Jeppson</li>
|
|
<li>Nils Orbat</li>
|
|
<li>Nithin Philips</li>
|
|
<li>pozitron03</li>
|
|
<li>Ranc1d</li>
|
|
<li>Samed Ozoglu</li>
|
|
<li>Scott</li>
|
|
<li>Steven Richter</li>
|
|
<li>Truman Kilen</li>
|
|
<li>Walter_Ego</li>
|
|
<li>YURI LEE</li>
|
|
<li>zgen</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div><br>
|
|
<p class="text">
|
|
Full documentation, source code, hardware schematics and legal information
|
|
can be found in our <a target="_blank" href="https://pikvm.org">official website</a>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<ul class="footer">
|
|
<li class="footer-left" id="kvmd-meta-server-host"></li>
|
|
<li class="footer-right"><a target="_blank" href="https://pikvm.org">Pi-KVM Project</a></li>
|
|
</ul>
|
|
</body>
|
|
</html> |