HID Templates: first merge kbd and mouse

This commit is contained in:
Petr Kracik 2020-06-05 17:28:34 +02:00
parent 1fa5e4be16
commit 11119bb1cb
3 changed files with 102 additions and 70 deletions

View File

@ -6,76 +6,110 @@
<style> <style>
</style> </style>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script> <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head> <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js" integrity="sha256-yr4fRk/GU1ehYJPAs8P4JlTgu0Hdsp4ZKrx8bDEDC3I=" crossorigin="anonymous"></script>
<body> <script>
HID input service, POST data to /keyboard or /mouse <br/> function zapis(t) {
<div> $("div").text(t);
</div> }
<br/> var previous;
Server response: <span></span>
<script> $(window).bind('keydown', function(event) {
function zapis(t) { event.preventDefault();
$("div").text(t); var str = String.fromCharCode(event.which).toLowerCase();
}
var previous; var ctrl = event.ctrlKey;
if (previous == 17) {
ctrl = true;
}
$(window).bind('keydown', function(event) { var obj = {
event.preventDefault(); ctrlKey: ctrl,
var str = String.fromCharCode(event.which).toLowerCase(); shiftKey: event.shiftKey,
altKey: event.altKey,
which: event.which,
code: event.code,
str: str
}
var ctrl = event.ctrlKey; if (event.which != 16 && event.which != 17 && event.which != 18) {
if (previous == 17) { console.log(obj);
ctrl = true;
}
var obj = { var ret = $.ajax({
ctrlKey: ctrl, type: "POST",
shiftKey: event.shiftKey, url: "hid/keyboard",
altKey: event.altKey, data: JSON.stringify(obj),
which: event.which, contentType: "application/json; charset=utf-8",
code: event.code, dataType: "json"
str: str });
}
if (event.which != 16 && event.which != 17 && event.which != 18) { console.log(ret);
console.log(obj); }
var ret = $.ajax({ var text = "";
type: "POST", if (ctrl) {
url: "hid/keyboard", text = text + ' + Control';
data: JSON.stringify(obj), }
contentType: "application/json; charset=utf-8", if (event.shiftKey) {
dataType: "json" text = text + ' + Shift';
}
if (event.altKey) {
text = text + ' + Alt';
}
text = text + ' + ' + str;
text = text.substr(3);
zapis(text);
previous = event.keyCode;
});
var btn=0;
var posX=0;
var posY=0;
var wheel=0;
var socket = io();
$(document).ready(function(){
$("canvas").mousedown(function(event){
btn=event.buttons;
handleMouse();
});
$("canvas").mouseup(function(event){
btn=event.buttons;
handleMouse();
});
$("canvas").mousemove(function(event){
posX=event.offsetX;
posY=event.offsetY;
handleMouse();
});
}); });
$("span").text(ret.responseText); function handleMouse() {
console.log(ret); $("span").text(btn +", "+ posX + ", " + posY);
sendMouse(btn, posX, posY, wheel);
}
function sendMouse(btn, x, y) {
var obj = {
x: x,
y: y,
btn: btn,
wheel: wheel,
}
} socket.emit('mouseEvent', JSON.stringify(obj));
};
</script>
</head>
<body>
HID Remote Keyboard and mouse<br/>
var text = ""; <div></div>
if (ctrl) {
text = text + ' + Control';
}
if (event.shiftKey) {
text = text + ' + Shift';
}
if (event.altKey) {
text = text + ' + Alt';
}
text = text + ' + ' + str;
text = text.substr(3);
zapis(text);
previous = event.keyCode;
});
</script>
<span></span><br/><br/>
<canvas width=1920 height=1080 style="border: 1px solid black" oncontextmenu="return false" onwheel='wheel=event.deltaY*-1; handleMouse(); wheel=0; return false;' ></canvas>
</body> </body>
</html> </html>

View File

@ -8,7 +8,7 @@
<script src="https://code.jquery.com/jquery-3.5.0.js"></script> <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head> </head>
<body> <body>
HID input service, POST data to /keyboard or /mouse <br/> HID input keyboard, POST data to /keyboard<br/>
<div> <div>
</div> </div>

View File

@ -36,8 +36,6 @@ $(document).ready(function(){
posY=event.offsetY; posY=event.offsetY;
handleMouse(); handleMouse();
}); });
}); });
function handleMouse() { function handleMouse() {