Backup_Repos/jsketcher
1
0
Fork 0
mirror of https://github.com/xibyte/jsketcher synced 2025-12-06 16:33:15 +01:00
Code Issues Projects Releases Wiki Activity

cleanup virtual touchpad code.

Browse source
This commit is contained in:
mmiscool 2023-08-24 01:04:57 +00:00
parent 5ac1a0cd99
commit 378353e260
6 changed files with 63 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
web/index.html
View file

@ -20,34 +20,7 @@
<script src="./static/index.bundle.js"></script> <script src="./static/index.bundle.js"></script>
<script> <script src="./mouse/checkIfMobile.js"></script>
// check for common mobile user agents
if (
navigator.userAgent.match(/Android/i) ||
navigator.userAgent.match(/webOS/i) ||
navigator.userAgent.match(/iPhone/i) ||
navigator.userAgent.match(/iPad/i) ||
navigator.userAgent.match(/iPod/i) ||
navigator.userAgent.match(/BlackBerry/i) ||
navigator.userAgent.match(/Windows Phone/i)
) {
// the user is using a mobile device, so redirect to the mobile version of the website
try {
//detect iframe parent and see if it is the mobile mouse
//if frame is loaded in mouse page do nothing otherwise redirect to mouse page
if ( window.location.pathname == window.parent.location.pathname ) {
//test if parent is mobile mouse emulator page and redirect if not
if (!window.parent.location.pathname.includes("/mouse.html")){
window.location = "./mouse.html" + window.location.search;
}
}
} catch { }
}
</script>
</body> </body>

2
web/mouse.html
View file

@ -160,7 +160,7 @@
</style> </style>
<body> <body>
<iframe id="jsketcher" title="JSketcher" scrolling="no"></iframe> <iframe id="pointerTarget" scrolling="no"></iframe>
<div id="holderHolder"> <div id="holderHolder">
<div id="FakeMouseHolder"> <div id="FakeMouseHolder">

22
web/mouse/checkIfMobile.js Normal file
View file

@ -0,0 +1,22 @@
// check for common mobile user agents
if (
navigator.userAgent.match(/Android/i) ||
navigator.userAgent.match(/webOS/i) ||
navigator.userAgent.match(/iPhone/i) ||
navigator.userAgent.match(/iPad/i) ||
navigator.userAgent.match(/iPod/i) ||
navigator.userAgent.match(/BlackBerry/i) ||
navigator.userAgent.match(/Windows Phone/i)
) {
// the user is using a mobile device, so redirect to the mobile version of the website
try {
//detect iframe parent and see if it is the mobile mouse
//if frame is loaded in mouse page do nothing otherwise redirect to mouse page
if ( window.location.pathname == window.parent.location.pathname ) {
//test if parent is mobile mouse emulator page and redirect if not
if (!window.parent.location.pathname.includes("/mouse.html")){
window.location = "./mouse.html" + window.location.search;
}
}
} catch { }
}

28
web/mouse/mouseController.js
View file

@ -1,6 +1,3 @@
pointerImage =
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeAQMAAAAB/jzhAAAABlBMVEX/AAAAAABBoxIDAAAAAnRSTlP/AOW3MEoAAABISURBVHicPc6xCQAgDETRhBQpM0JGyWjBTR3BAQTlW9g8uOK4kz5nS0FCgIOBgjwaChICHAwU5NFQkBDgYKA//hroYHdyY/W+8QFAUbYNynAAAAAASUVORK5CYII=";
document.body.innerHTML += ` document.body.innerHTML += `
<svg id="cursor" xmlns="http://www.w3.org/2000/svg" viewBox="-10003 -10003 20010 20010"> <svg id="cursor" xmlns="http://www.w3.org/2000/svg" viewBox="-10003 -10003 20010 20010">
<path d="M 0 0 L 0 10000 Z M 0 0 L 0 -10000 M 0 0 L -10000 0 M 0 0 L 10000 0 M 25 0 A 1 1 0 0 0 -25 0 A 1 1 0 0 0 25 0" stroke="black" stroke-width="3" fill="none"/> <path d="M 0 0 L 0 10000 Z M 0 0 L 0 -10000 M 0 0 L -10000 0 M 0 0 L 10000 0 M 25 0 A 1 1 0 0 0 -25 0 A 1 1 0 0 0 25 0" stroke="black" stroke-width="3" fill="none"/>
@ -31,17 +28,17 @@ var lastTouchY = 0;
var speed = 0.6; var speed = 0.6;
const pointerTarget = document.getElementById("jsketcher").contentWindow; const pointerTarget = document.getElementById("pointerTarget");
function sendNewEvent(eventType) { function sendNewEvent(eventType) {
let obj = JSON.parse(JSON.stringify(mouseObject)); let obj = JSON.parse(JSON.stringify(mouseObject));
obj.eventType = eventType; obj.eventType = eventType;
//console.log("sending this", obj); //console.log("sending this", obj);
pointerTarget.postMessage(obj); return pointerTarget.contentWindow.postMessage(obj);
} }
document.getElementById("touchpadArea").addEventListener("touchstart", function (event) { document.getElementById("touchpadArea").addEventListener("touchstart", function (event) {
//document.body.requestFullscreen(); if (window.innerHeight !== screen.height) document.body.requestFullscreen();
console.log(event.touches);
if (event.touches.length == 1){ if (event.touches.length == 1){
lastTouchX = event.touches[0].clientX; lastTouchX = event.touches[0].clientX;
@ -67,7 +64,11 @@ document.getElementById("touchpadArea").addEventListener("touchend", function (e
} }
}); });
document.getElementById("touchpadArea").addEventListener("click", function (event) { document.getElementById("touchpadArea").addEventListener("click", async function (event) {
// //alert(await sendNewEvent("whatUnderTouchLocation"));
// let bla = await sendNewEvent("whatUnderTouchLocation");
// console.log(bla)
document.getElementById("leftMouseButton").click(); document.getElementById("leftMouseButton").click();
}); });
@ -250,17 +251,18 @@ document.getElementById("ScrollWheel").addEventListener("touchmove", async funct
}); });
window.addEventListener("message", function (event) { window.addEventListener("message", function (event) {
console.log("Message received from the child: " + event.data); // Message received from child //console.log("Message received from the child: " + event.data); // Message received from child
if (event.data == "showTouchpad") toggleMousepad("show"); if (event.data == "showTouchpad") toggleMousepad("show");
}); });
var iframe = document.getElementById("jsketcher");
iframe.onload = function () {
pointerTarget.onload = function () {
const elem = document.createElement(`script`); const elem = document.createElement(`script`);
elem.src = "./mouse/virtualMousePointer.js"; elem.src = "./mouse/virtualMousePointer.js";
elem.type="module";
iframe.contentDocument.body.appendChild(elem); pointerTarget.contentDocument.body.appendChild(elem);
console.log(window.location); console.log(window.location);
}; };
@ -269,7 +271,7 @@ document.body.onload = function () {
try { try {
document.getElementById("mouseSpeed").value = localStorage.mouseSpeed; document.getElementById("mouseSpeed").value = localStorage.mouseSpeed;
} catch {} } catch {}
iframe.src = "./" + window.location.search; pointerTarget.src = "./" + window.location.search;
//console.log("dats the window locations", window.location.search); //console.log("dats the window locations", window.location.search);
}; };

12
web/mouse/virtualMousePointer.css
View file

@ -1,12 +0,0 @@
#cursor {
pointer-events: none;
/* doing this makes sure .elementFromPoint
do not acquires the image cursor object */
position: absolute;
}
/* makes the cursor invisible */
* {
cursor: none;
}

32
web/mouse/virtualMousePointer.js
View file

@ -1,8 +1,8 @@
//Allways keep page at propper position, //Allways keep page at propper position,
// prevents page scrolling acidentally due to html elements going out of view. // prevents page scrolling acidentally due to html elements going out of view.
mouseDebugger = false; let mouseDebugger = false;
uiElementsToggle = { let uiElementsToggle = {
toggleUItabs: "none", toggleUItabs: "none",
toggleUIoverlay: "none", toggleUIoverlay: "none",
toggleUItoolbar: "none", toggleUItoolbar: "none",
@ -26,9 +26,9 @@ function setDisplayValueByClassName(clssOfItem, newDsiplayValue) {
} catch {} } catch {}
} }
mouseOverList = []; var mouseOverList = [];
theToolbar = document.getElementsByClassName("x-Toolbar disable-selection condensed x-Toolbar-flat")[0]; let theToolbar = document.getElementsByClassName("x-Toolbar disable-selection condensed x-Toolbar-flat")[0];
theToolbar.style.display = "none"; theToolbar.style.display = "none";
theToolbar.style.position = "fixed"; theToolbar.style.position = "fixed";
theToolbar.style.left = "30px"; theToolbar.style.left = "30px";
@ -56,13 +56,22 @@ var lastThingToDo = {
}; };
var shiftKey = false; var shiftKey = false;
scaleFactor = 2; let scaleFactor = 2;
let absoluteX = 0;
let absoluteY = 0;
let deltaY;
let eventType;;
window.addEventListener( window.addEventListener(
"message", "message",
(event) => { (event) => {
const thingToDo = event.data; const thingToDo = event.data;
if (typeof thingToDo !== "object") return; if (typeof thingToDo !== "object") return;
// if (thingToDo == "whatUnderTouchLocation"){
// return "here is my message";
// }
absoluteX = thingToDo.absoluteX ? thingToDo.absoluteX : ""; absoluteX = thingToDo.absoluteX ? thingToDo.absoluteX : "";
absoluteY = thingToDo.absoluteY ? thingToDo.absoluteY : ""; absoluteY = thingToDo.absoluteY ? thingToDo.absoluteY : "";
@ -154,10 +163,15 @@ window.addEventListener(
lastThingToDo = thingToDo; lastThingToDo = thingToDo;
stoplooping = "";
//let stoplooping = "";
const itemsUnderMouse = document.elementsFromPoint(absoluteX, absoluteY); const itemsUnderMouse = document.elementsFromPoint(absoluteX, absoluteY);
stoplooping = doTheProperEvents(itemsUnderMouse[0]); doTheProperEvents(itemsUnderMouse[0]);
// stoplooping = doTheProperEvents(itemsUnderMouse[0]);
// if (itemsUnderMouse[0].nodeName == "CANVAS" && stoplooping !== "stop") { // if (itemsUnderMouse[0].nodeName == "CANVAS" && stoplooping !== "stop") {
// itemsUnderMouse.forEach( (item, key) => { // itemsUnderMouse.forEach( (item, key) => {
// if (key !== 0) stoplooping = doTheProperEvents(item); // if (key !== 0) stoplooping = doTheProperEvents(item);
@ -191,7 +205,7 @@ window.addEventListener(
]); ]);
}); });
//__CAD_APP.pickControlService.pickListMode = false; __CAD_APP.pickControlService.pickListMode = false;
}, },
true true
); );
@ -263,7 +277,7 @@ window.addEventListener(
} }
function exicuteEvents(TargetElement, eventTypes, eventToSend = {}) { function exicuteEvents(TargetElement, eventTypes, eventToSend = {}) {
eventTemplate = JSON.parse(JSON.stringify(eventToSend)); const eventTemplate = JSON.parse(JSON.stringify(eventToSend));
eventTypes.forEach( (enenvtToFire, key) => { eventTypes.forEach( (enenvtToFire, key) => {
eventTemplate.type = enenvtToFire; eventTemplate.type = enenvtToFire;
exicuteEvent(TargetElement, eventTemplate); exicuteEvent(TargetElement, eventTemplate);