Skip to content

Commit

Permalink
fix rightclick and other virtual touchpad enhansements.
Browse files Browse the repository at this point in the history
  • Loading branch information
mmiscool authored and mmiscool committed Aug 23, 2023
1 parent 8914d92 commit 56448a9
Show file tree
Hide file tree
Showing 2 changed files with 98 additions and 58 deletions.
91 changes: 60 additions & 31 deletions web/mouse/mouseController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ cursor.style.height = "100px";
ActiveButtonBackgroundColor = "rgba(252, 242, 44, 0.3)";
InactiveButtonBackgroundColor = "rgba(100, 94, 94, 0.4)";


const FakeMouseHolderDiv = document.getElementById("FakeMouseHolder");
const holderHolder = document.getElementById("holderHolder");

Expand Down Expand Up @@ -42,8 +41,30 @@ function sendNewEvent(eventType) {

document.getElementById("touchpadArea").addEventListener("touchstart", function (event) {
//document.body.requestFullscreen();
lastTouchX = event.touches[0].clientX;
lastTouchY = event.touches[0].clientY;
console.log(event.touches);

if (event.touches.length == 1){
lastTouchX = event.touches[0].clientX;
lastTouchY = event.touches[0].clientY;
}

if (event.touches.length ==2){
lastScrollY = event.touches[0].clientY;
zooming = true;
event.preventDefault();

}

});


document.getElementById("touchpadArea").addEventListener("touchend", function (event) {
if (event.touches.length ==2){
zooming = false;
mouseObject.deltaY = 0;
lastScrollY = 0;
event.preventDefault();
}
});

document.getElementById("touchpadArea").addEventListener("click", function (event) {
Expand All @@ -63,26 +84,38 @@ document.getElementById("touchpadArea").addEventListener("contextmenu", function

document.getElementById("touchpadArea").addEventListener("touchmove", function (event) {
event.preventDefault();
if (event.touches.length == 1){
let x = event.touches[0].clientX;
let y = event.touches[0].clientY;

let difrenceX = x - lastTouchX;
let difrenceY = y - lastTouchY;

lastTouchX = x;
lastTouchY = y;

mouseObject.absoluteX = mouseObject.absoluteX + difrenceX * speed;
mouseObject.absoluteY = mouseObject.absoluteY + difrenceY * speed;

mouseObject.absoluteX = mouseObject.absoluteX > 0 ? mouseObject.absoluteX : 1;
mouseObject.absoluteY = mouseObject.absoluteY > 0 ? mouseObject.absoluteY : 1;

cursor.style.left = mouseObject.absoluteX + "px";
cursor.style.top = mouseObject.absoluteY + "px";

sendNewEvent("mousemove");
}

let x = event.touches[0].clientX;
let y = event.touches[0].clientY;

let difrenceX = x - lastTouchX;
let difrenceY = y - lastTouchY;

lastTouchX = x;
lastTouchY = y;

mouseObject.absoluteX = mouseObject.absoluteX + difrenceX * speed;
mouseObject.absoluteY = mouseObject.absoluteY + difrenceY * speed;

mouseObject.absoluteX = mouseObject.absoluteX > 0 ? mouseObject.absoluteX : 1;
mouseObject.absoluteY = mouseObject.absoluteY > 0 ? mouseObject.absoluteY : 1;

cursor.style.left = mouseObject.absoluteX + "px";
cursor.style.top = mouseObject.absoluteY + "px";
if (event.touches.length == 2){
//zoom zoom zoom
console.log("zoom zoom zoom")

sendNewEvent("mousemove");
let y = event.touches[0].clientY;
let difrenceY = y - lastScrollY;
lastScrollY = y;
mouseObject.deltaY = difrenceY / 10000;
sendNewEvent("zoom");
}
});

document.getElementById("leftMouseButton").addEventListener("contextmenu", function (event) {
Expand All @@ -104,12 +137,12 @@ document.getElementById("rightMouseButton").addEventListener("contextmenu", func
event.preventDefault();
if (event.target.innerHTML == "🔒") {
event.target.innerHTML = "🔓";
mouseObject.leftMouseDown = false;
mouseObject.rightMouseDown = false;
event.target.style.backgroundColor = InactiveButtonBackgroundColor;
sendNewEvent("mousemove");
} else {
event.target.innerHTML = "🔒";
mouseObject.leftMouseDown = true;
mouseObject.rightMouseDown = true;
event.target.style.backgroundColor = ActiveButtonBackgroundColor;
sendNewEvent("mousemove");
}
Expand All @@ -130,20 +163,18 @@ document.getElementById("rightMouseButton").addEventListener("click", function (
event.preventDefault();
if (event.target.innerHTML == "🔒") {
event.target.innerHTML = "🔓";
mouseObject.leftMouseDown = false;
mouseObject.rightMouseDown = false;
event.target.style.backgroundColor = InactiveButtonBackgroundColor;
sendNewEvent("mousemove");
}else{
doRightClick();
}
doRightClick();
});



document.getElementById("pickList").addEventListener("click", function (event) {
sendNewEvent("pickList");
sendNewEvent("pickList");
});


document.getElementById("ShiftButton").addEventListener("click", function (event) {
event.preventDefault();
if (event.target.innerHTML == "shift") {
Expand Down Expand Up @@ -253,7 +284,6 @@ document.getElementById("toggleUItabs").onclick = function (event) {
sendNewEvent("toggleUItabs");
};


document.getElementById("toggleUIoverlay").onclick = function (event) {
sendNewEvent("toggleUIoverlay");
};
Expand All @@ -262,7 +292,6 @@ document.getElementById("toggleUItoolbar").onclick = function (event) {
sendNewEvent("toggleUItoolbar");
};


document.getElementById("settingsButton").onclick = function (event) {
document.getElementById("settings").style.display = "";
//console.log("dats the window locations", window.location.search);
Expand Down
65 changes: 38 additions & 27 deletions web/mouse/virtualMousePointer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,9 @@ uiElementsToggle = {
toggleUItoolbar: "none",
};


document.getElementsByClassName("x-View3d-mainLayout")[0].prepend(document.getElementsByClassName("x-View3d-bottomStack")[0])


document
.getElementsByClassName("x-View3d-mainLayout")[0]
.prepend(document.getElementsByClassName("x-View3d-bottomStack")[0]);

window.setInterval(function () {
window.scrollTo(0, 0);
Expand Down Expand Up @@ -60,14 +59,14 @@ var shiftKey = false;
scaleFactor = 2;
window.addEventListener(
"message",
(event) => {
(event) => {
const thingToDo = event.data;
if (typeof thingToDo !== "object") return;

absoluteX = thingToDo.absoluteX ? thingToDo.absoluteX : "";
absoluteY = thingToDo.absoluteY ? thingToDo.absoluteY : "";
absoluteX = thingToDo.absoluteX ? thingToDo.absoluteX : "";
absoluteY = thingToDo.absoluteY ? thingToDo.absoluteY : "";

if (mouseDebugger)console.log(absoluteX, absoluteY);
if (mouseDebugger) console.log(absoluteX, absoluteY);

deltaY = thingToDo.deltaY ? thingToDo.deltaY : "";
eventType = thingToDo.eventType ? thingToDo.eventType : "";
Expand Down Expand Up @@ -153,45 +152,57 @@ window.addEventListener(
eventType = "click";
}


lastThingToDo = thingToDo;
stoplooping = "";
const itemsUnderMouse = document.elementsFromPoint(absoluteX, absoluteY);

stoplooping = doTheProperEvents(itemsUnderMouse[0]);
stoplooping = doTheProperEvents(itemsUnderMouse[0]);
// if (itemsUnderMouse[0].nodeName == "CANVAS" && stoplooping !== "stop") {
// itemsUnderMouse.forEach((item, key) => {
// if (key !== 0) stoplooping = doTheProperEvents(item);
// itemsUnderMouse.forEach( (item, key) => {
// if (key !== 0) stoplooping = doTheProperEvents(item);
// });
// }


let mouseOutObjects = [];
itemsUnderMouse.forEach((item, key) => {
if (!mouseOverList.includes(item)) mouseOutObjects.push(item);



let newMouseOverList = [];
mouseOverList.forEach((item, key) => {
if (!itemsUnderMouse.includes(item)){
mouseOutObjects.push(item);
}else{
newMouseOverList.push(item);
}
});

mouseOverList = newMouseOverList;


mouseOutObjects.forEach((item, key) => {
exicuteEvents(item, [
"mouseleave",
"mouseout",
"mouseexit",
"pointerleave",
"pointerout",

//"focusout",
]);
});


__CAD_APP.pickControlService.pickListMode = false;
//__CAD_APP.pickControlService.pickListMode = false;
},
true
);

function doTheProperEvents(item) {
function doTheProperEvents(item) {
if (eventType == "mousemove") {
exicuteEvents(item, ["mousemove", "mouseover"]);
exicuteEvents(item, ["mousemove", "mouseover"]);

if (!mouseOverList.includes(item)) {
mouseOverList.push(item);
exicuteEvents(item, ["mouseenter", "pointerenter"]);
exicuteEvents(item, ["mouseenter", "pointerenter"]);
}
}

Expand All @@ -204,8 +215,7 @@ function doTheProperEvents(item) {
}

if (eventType == "rightDragStart") {
exicuteEvents(item, ["contextmenu"]);
exicuteEvents(item, ["auxclick", "click", "mousedown", "pointerdown"], { button: 2 });
exicuteEvents(item, ["contextmenu","auxclick", "mousedown", "pointerdown"], { button: 2 });
}

if (eventType == "rightDragEnd") {
Expand All @@ -228,7 +238,7 @@ function doTheProperEvents(item) {
}
}

function exicuteEvent(TargetElement, eventToSend = {}) {
function exicuteEvent(TargetElement, eventToSend = {}) {
eventToSend.clientX = absoluteX;
eventToSend.clientY = absoluteY;
eventToSend.x = absoluteX;
Expand All @@ -242,19 +252,20 @@ function exicuteEvent(TargetElement, eventToSend = {}) {

eventToSend = new MouseEvent(eventToSend.type, eventToSend);
try {
testResult = TargetElement.dispatchEvent(eventToSend);
testResult = TargetElement.dispatchEvent(eventToSend);
if (mouseDebugger) if (!testResult) console.log("event trigger failed", testResult, TargetElement, eventToSend);
//if (TargetElement.dispatchEvent(eventToSend) == false) console.log("event trigger failed", TargetElement, eventToSend);
return testResult;
} catch {
if (mouseDebugger) console.log("event trigger failed", TargetElement, eventToSend);
return "failed";
}
}

function exicuteEvents(TargetElement, eventTypes, eventToSend = {}) {
function exicuteEvents(TargetElement, eventTypes, eventToSend = {}) {
eventTemplate = JSON.parse(JSON.stringify(eventToSend));
eventTypes.forEach((enenvtToFire, key) => {
eventTypes.forEach( (enenvtToFire, key) => {
eventTemplate.type = enenvtToFire;
exicuteEvent(TargetElement, eventTemplate);
exicuteEvent(TargetElement, eventTemplate);
});
}

0 comments on commit 56448a9

Please sign in to comment.