111 lines
3.0 KiB
JavaScript
111 lines
3.0 KiB
JavaScript
let TouchControls=(function() {
|
|
|
|
if(!("ontouchstart" in document.documentElement)) {
|
|
return;
|
|
}
|
|
|
|
let nativeKeyDownEvent=function(keyCode,code) {
|
|
window.dispatchEvent(new KeyboardEvent('keydown',{'keyCode': keyCode,'code': code}));
|
|
}
|
|
|
|
let nativeKeyUpEvent=function(keyCode,code) {
|
|
window.dispatchEvent(new KeyboardEvent('keyup',{'keyCode': keyCode,'code': code}));
|
|
}
|
|
|
|
let controls,
|
|
dpad,
|
|
btnA,
|
|
btnB,
|
|
centerX,
|
|
centerY,
|
|
threshholdX,
|
|
threshholdY;
|
|
|
|
controls=document.getElementById('controls');
|
|
controls.style.display='block';
|
|
dpad=document.getElementById('controls-dpad');
|
|
btnA=document.getElementById('controls-btnA');
|
|
btnB=document.getElementById('controls-btnB');
|
|
centerX=dpad.clientWidth/2;
|
|
centerY=dpad.clientHeight/2;
|
|
threshholdX=centerX*0.15;
|
|
threshholdY=centerY*0.15;
|
|
|
|
dpad.addEventListener("touchmove",function(event) {
|
|
event.preventDefault();
|
|
if(event.targetTouches[0].target===dpad) {
|
|
let movedX=event.targetTouches[0].pageX;
|
|
let movedY=event.targetTouches[0].pageY;
|
|
movedX-=dpad.offsetLeft+centerX;
|
|
movedY-=dpad.offsetTop+centerY;
|
|
|
|
if(movedX<(threshholdX*-1)&&(movedX>((centerX+threshholdX)*-1))) {
|
|
nativeKeyDownEvent(37,"ArrowLeft");
|
|
} else {
|
|
nativeKeyUpEvent(37,"ArrowLeft");
|
|
}
|
|
|
|
if(movedX>threshholdX&&(movedX<(centerX+threshholdX))) {
|
|
nativeKeyDownEvent(39,"ArrowRight");
|
|
} else {
|
|
nativeKeyUpEvent(39,"ArrowRight");
|
|
}
|
|
|
|
if(movedY<(threshholdY*-1)&&(movedY>((centerY+threshholdY)*-1))) {
|
|
nativeKeyDownEvent(38,"ArrowUp");
|
|
} else {
|
|
nativeKeyUpEvent(38,"ArrowUp");
|
|
}
|
|
|
|
if(movedY>(threshholdY)&&(movedY<(centerY+threshholdY))) {
|
|
nativeKeyDownEvent(40,"ArrowDown");
|
|
} else {
|
|
nativeKeyUpEvent(40,"ArrowDown");
|
|
}
|
|
} else {
|
|
nativeKeyUpEvent(37,"ArrowLeft");
|
|
nativeKeyUpEvent(39,"ArrowRight");
|
|
nativeKeyUpEvent(38,"ArrowUp");
|
|
nativeKeyUpEvent(40,"ArrowDown");
|
|
}
|
|
});
|
|
|
|
dpad.addEventListener("touchend",function(event) {
|
|
nativeKeyUpEvent(37,"ArrowLeft");
|
|
nativeKeyUpEvent(39,"ArrowRight");
|
|
nativeKeyUpEvent(38,"ArrowUp");
|
|
nativeKeyUpEvent(40,"ArrowDown");
|
|
});
|
|
|
|
dpad.addEventListener("touchcancel",function(event) {
|
|
nativeKeyUpEvent(37,"ArrowLeft");
|
|
nativeKeyUpEvent(39,"ArrowRight");
|
|
nativeKeyUpEvent(38,"ArrowUp");
|
|
nativeKeyUpEvent(40,"ArrowDown");
|
|
});
|
|
|
|
btnA.addEventListener("touchstart",function(event) {
|
|
nativeKeyDownEvent(32,"Space");
|
|
nativeKeyDownEvent(13,"Enter");
|
|
console.log("btnA start");
|
|
});
|
|
|
|
btnA.addEventListener("touchend",function(event) {
|
|
nativeKeyUpEvent(32,"Space");
|
|
nativeKeyUpEvent(13,"Enter");
|
|
console.log("btnA end");
|
|
});
|
|
|
|
btnB.addEventListener("touchstart",function(event) {
|
|
nativeKeyDownEvent(16,"Shift");
|
|
console.log("btnB start");
|
|
});
|
|
|
|
btnB.addEventListener("touchend",function(event) {
|
|
nativeKeyUpEvent(16,"Shift");
|
|
console.log("btnB end");
|
|
});
|
|
|
|
});
|
|
|
|
TouchControls();
|