mouse support

1 files changed, 28 insertions, 3 deletions

diff --git a/kvmd/web/js/mouse.js b/kvmd/web/js/mouse.js
index b9d27e67..ba4eb264 100644
--- a/kvmd/web/js/mouse.js
+++ b/kvmd/web/js/mouse.js
@@ -2,9 +2,12 @@ var mouse = new function() {
 	var __ws = null;
 	var __current_pos = {x: 0, y:0};
 	var __sent_pos = {x: 0, y:0};
+	var __stream_hovered = false;
 
 	this.init = function() {
 		el_stream_box = $("stream-box");
+		el_stream_box.onmouseenter = __hoverStream;
+		el_stream_box.onmouseleave = __leaveStream;
 		el_stream_box.onmousedown = (event) => __buttonHandler(event, true);
 		el_stream_box.onmouseup = (event) => __buttonHandler(event, false);
 		el_stream_box.oncontextmenu = (event) => event.preventDefault();
@@ -15,11 +18,25 @@ var mouse = new function() {
 
 	this.setSocket = function(ws) {
 		__ws = ws;
+		if (ws) {
+			$("stream-box").classList.add("stream-box-mouse-enabled");
+		} else {
+			$("stream-box").classList.remove("stream-box-mouse-enabled");
+		}
+	};
+
+	var __hoverStream = function() {
+		__stream_hovered = true;
+		mouse.updateLeds();
+	};
+
+	var __leaveStream = function() {
+		__stream_hovered = false;
+		mouse.updateLeds();
 	};
 
 	this.updateLeds = function() {
-		var focused = (__ws && document.activeElement === $("stream-window"));
-		$("hid-mouse-led").className = (focused ? "led-on" : "led-off");
+		$("hid-mouse-led").className = (__ws && __stream_hovered ? "led-on" : "led-off");
 	};
 
 	var __buttonHandler = function(event, state) {
@@ -56,15 +73,23 @@ var mouse = new function() {
 		if (pos.x !== __sent_pos.x || pos.y !== __sent_pos.y) {
 			tools.debug("Mouse move:", pos);
 			if (__ws) {
+				el_stream_image = $("stream-image");
 				__ws.send(JSON.stringify({
 					event_type: "mouse_move",
-					to: pos,
+					to: {
+						x: __translate(pos.x, 0, el_stream_image.clientWidth, -32768, 32767),
+						y: __translate(pos.y, 0, el_stream_image.clientHeight, -32768, 32767),
+					},
 				}));
 			}
 			__sent_pos = pos;
 		}
 	};
 
+	var __translate = function(x, a, b, c, d) {
+		return Math.round((x - a) / (b - a) * (d - c) + c);
+	};
+
 	var __wheelHandler = function(event) {
 		// https://learn.javascript.ru/mousewheel
 		if (event.preventDefault) {