GithubFollow/One-KVM
1
0
Fork 0
mirror of https://github.com/mofeng-git/One-KVM.git synced 2026-01-30 17:41:54 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

testing mouse buttons for touch interface

Browse Source
This commit is contained in:
Devaev Maxim
2018-08-31 17:48:36 +03:00
parent 1bf3506d2e
commit ecb866f57a
6 changed files with 76 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
kvmd/web/js/mouse.js
View File

@@ -21,8 +21,14 @@ function Mouse() {
$("stream-box").onmousemove = __moveHandler;
$("stream-box").onwheel = __wheelHandler;
$("stream-box").ontouchstart = (event) => __touchHandler(event, true);
$("stream-box").ontouchend = (event) => __touchHandler(event, false);
$("stream-box").ontouchstart = (event) => __touchMoveHandler(event);
Array.prototype.forEach.call(document.querySelectorAll("[data-mouse-button]"), function(el_button) {
var button = el_button.getAttribute("data-mouse-button");
el_button.onmousedown = () => __sendButton(button, true);
el_button.onmouseup = () => __sendButton(button, false);
el_button.ontouchstart = () => __sendButton(button, true);
el_button.ontouchend = () => __sendButton(button, false);
});
setInterval(__sendMove, 100);
};
@@ -58,8 +64,19 @@ function Mouse() {
}
};
var __touchHandler = function(event, state) {
if (state) {
var __buttonHandler = function(event, state) {
// https://www.w3schools.com/jsref/event_button.asp
event.preventDefault();
switch (event.button) {
case 0: __sendButton("left", state); break;
case 2: __sendButton("right", state); break;
}
};
var __touchMoveHandler = function(event) {
event.stopPropagation();
event.preventDefault();
if (event.touches[0].target && event.touches[0].target.getBoundingClientRect) {
var rect = event.touches[0].target.getBoundingClientRect();
__current_pos = {
x: Math.round(event.touches[0].clientX - rect.left),
@@ -67,38 +84,6 @@ function Mouse() {
};
__sendMove();
}
var button = "left"; // TODO
tools.debug("Mouse button", (state ? "pressed:" : "released:"), button);
if (__ws) {
__ws.send(JSON.stringify({
event_type: "mouse_button",
button: button,
state: state,
}));
}
event.stopPropagation();
event.preventDefault();
};
var __buttonHandler = function(event, state) {
// https://www.w3schools.com/jsref/event_button.asp
var button = null;
switch (event.button) {
case 0: button = "left"; break;
case 2: button = "right"; break;
}
if (button) {
event.preventDefault();
tools.debug("Mouse button", (state ? "pressed:" : "released:"), button);
__sendMove();
if (__ws) {
__ws.send(JSON.stringify({
event_type: "mouse_button",
button: button,
state: state,
}));
}
}
};
var __moveHandler = function(event) {
@@ -109,6 +94,19 @@ function Mouse() {
};
};
var __sendButton = function(button, state) {
tools.debug("Mouse button", (state ? "pressed:" : "released:"), button);
__sendMove();
if (__ws) {
__ws.send(JSON.stringify({
event_type: "mouse_button",
button: button,
state: state,
}));
}
};
var __sendMove = function() {
var pos = __current_pos;
if (pos.x !== __sent_pos.x || pos.y !== __sent_pos.y) {

8
kvmd/web/js/ui.js
View File

@@ -8,6 +8,12 @@ function Ui() {
var __ctl_items = [];
var __init__ = function() {
Array.prototype.forEach.call(document.querySelectorAll("button"), function(el_button) {
// XXX: Workaround for iOS Safari:
// https://stackoverflow.com/questions/3885018/active-pseudo-class-doesnt-work-in-mobile-safari
el_button.ontouchstart = function() {};
});
Array.prototype.forEach.call($$("ctl-item"), function(el_item) {
el_item.onclick = () => __toggleMenu(el_item);
__ctl_items.push(el_item);
@@ -85,12 +91,14 @@ function Ui() {
var el_cancel_button = document.createElement("button");
el_cancel_button.innerHTML = "Cancel";
el_cancel_button.onclick = () => close(false);
el_cancel_button.ontouchstart = function() {};
el_buttons.appendChild(el_cancel_button);
}
if (ok) {
var el_ok_button = document.createElement("button");
el_ok_button.innerHTML = "OK";
el_ok_button.onclick = () => close(true);
el_cancel_button.ontouchstart = function() {};
el_buttons.appendChild(el_ok_button);
}
if (ok && cancel) {