HID Templates: first merge kbd and mouse
This commit is contained in:
		@@ -6,76 +6,110 @@
 | 
			
		||||
  <style>
 | 
			
		||||
  </style>
 | 
			
		||||
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
 | 
			
		||||
  <script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js" integrity="sha256-yr4fRk/GU1ehYJPAs8P4JlTgu0Hdsp4ZKrx8bDEDC3I=" crossorigin="anonymous"></script>
 | 
			
		||||
  <script>
 | 
			
		||||
    function zapis(t) {
 | 
			
		||||
      $("div").text(t);
 | 
			
		||||
    }
 | 
			
		||||
    
 | 
			
		||||
    var previous;
 | 
			
		||||
    
 | 
			
		||||
    $(window).bind('keydown', function(event) {
 | 
			
		||||
      event.preventDefault();
 | 
			
		||||
      var str = String.fromCharCode(event.which).toLowerCase();
 | 
			
		||||
    
 | 
			
		||||
      var ctrl = event.ctrlKey;
 | 
			
		||||
      if (previous == 17) {
 | 
			
		||||
        ctrl = true;
 | 
			
		||||
      }
 | 
			
		||||
    
 | 
			
		||||
      var obj = {
 | 
			
		||||
        ctrlKey: ctrl,
 | 
			
		||||
        shiftKey: event.shiftKey,
 | 
			
		||||
        altKey: event.altKey,
 | 
			
		||||
        which: event.which,
 | 
			
		||||
      code: event.code,
 | 
			
		||||
        str: str
 | 
			
		||||
      }
 | 
			
		||||
    
 | 
			
		||||
      if (event.which != 16 && event.which != 17 && event.which != 18) {
 | 
			
		||||
        console.log(obj);
 | 
			
		||||
    
 | 
			
		||||
        var ret = $.ajax({
 | 
			
		||||
            type: "POST",
 | 
			
		||||
            url: "hid/keyboard",
 | 
			
		||||
            data: JSON.stringify(obj),
 | 
			
		||||
            contentType: "application/json; charset=utf-8",
 | 
			
		||||
            dataType: "json"
 | 
			
		||||
        });
 | 
			
		||||
    
 | 
			
		||||
      console.log(ret);
 | 
			
		||||
      }
 | 
			
		||||
    
 | 
			
		||||
      var text = "";
 | 
			
		||||
      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;
 | 
			
		||||
    
 | 
			
		||||
    });
 | 
			
		||||
    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();
 | 
			
		||||
      });
 | 
			
		||||
    });
 | 
			
		||||
    
 | 
			
		||||
    function handleMouse() {
 | 
			
		||||
      $("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 input service, POST data to /keyboard or /mouse <br/>
 | 
			
		||||
<div>
 | 
			
		||||
</div>
 | 
			
		||||
  HID Remote Keyboard and mouse<br/>
 | 
			
		||||
 | 
			
		||||
<br/>
 | 
			
		||||
Server response: <span></span>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
function zapis(t) {
 | 
			
		||||
  $("div").text(t);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
var previous;
 | 
			
		||||
 | 
			
		||||
$(window).bind('keydown', function(event) {
 | 
			
		||||
  event.preventDefault();
 | 
			
		||||
  var str = String.fromCharCode(event.which).toLowerCase();
 | 
			
		||||
 | 
			
		||||
  var ctrl = event.ctrlKey;
 | 
			
		||||
  if (previous == 17) {
 | 
			
		||||
    ctrl = true;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  var obj = {
 | 
			
		||||
    ctrlKey: ctrl,
 | 
			
		||||
    shiftKey: event.shiftKey,
 | 
			
		||||
    altKey: event.altKey,
 | 
			
		||||
    which: event.which,
 | 
			
		||||
	code: event.code,
 | 
			
		||||
    str: str
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  if (event.which != 16 && event.which != 17 && event.which != 18) {
 | 
			
		||||
    console.log(obj);
 | 
			
		||||
 | 
			
		||||
    var ret = $.ajax({
 | 
			
		||||
        type: "POST",
 | 
			
		||||
        url: "hid/keyboard",
 | 
			
		||||
        data: JSON.stringify(obj),
 | 
			
		||||
        contentType: "application/json; charset=utf-8",
 | 
			
		||||
        dataType: "json"
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
	$("span").text(ret.responseText);
 | 
			
		||||
	console.log(ret);
 | 
			
		||||
	
 | 
			
		||||
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  var text = "";
 | 
			
		||||
  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>
 | 
			
		||||
<div></div>
 | 
			
		||||
 
 | 
			
		||||
<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>
 | 
			
		||||
</html>
 | 
			
		||||
 
 | 
			
		||||
@@ -8,7 +8,7 @@
 | 
			
		||||
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
 | 
			
		||||
</head>
 | 
			
		||||
<body>
 | 
			
		||||
	HID input service, POST data to /keyboard or /mouse <br/>
 | 
			
		||||
	HID input keyboard, POST data to /keyboard<br/>
 | 
			
		||||
<div>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -36,8 +36,6 @@ $(document).ready(function(){
 | 
			
		||||
		posY=event.offsetY;
 | 
			
		||||
		handleMouse();
 | 
			
		||||
	});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
function handleMouse() {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user