Add testing modes + different mouse types;
This commit is contained in:
parent
28602d3501
commit
dc2c9a6a32
84
index.html
84
index.html
@ -114,8 +114,6 @@
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const WAIT_TIMEOUT = 3000;
|
||||
|
||||
// x=0 ---->
|
||||
// y=0
|
||||
// |
|
||||
@ -127,40 +125,23 @@
|
||||
// Values in pixels.
|
||||
const START_BUTTON_HEIGHT = 100;
|
||||
const START_BUTTON_WIDTH = 300;
|
||||
|
||||
const BOX_WIDTH = 500;
|
||||
|
||||
const BUTTON_Y_OFFSET_FROM_BOTTOM = 60;
|
||||
|
||||
//document.onmousemove = function(event) {
|
||||
// console.log(`x=${event.pageX}, y=${event.pageY}`);
|
||||
//}
|
||||
//document.addEventListener('mousedown', function(event) {
|
||||
// console.log('document', event);
|
||||
//});
|
||||
|
||||
// Parameters that can be tweaked.
|
||||
const WAIT_TIMEOUT = 8000;
|
||||
const DISPATCH_ON_CANVAS = true;
|
||||
const TEST_MODE = true;
|
||||
|
||||
setTimeout(function() {
|
||||
let $canvas = document.getElementById("#canvas");
|
||||
|
||||
document.addEventListener('mousedown', function(event) {
|
||||
console.log(`onmousedown client x=${event.clientX}, y=${event.clientY}`);
|
||||
console.log(`onmousedown page x=${event.pageX}, y=${event.pageY}`);
|
||||
console.log(event);
|
||||
});
|
||||
|
||||
let x = Math.max(0, (window.innerWidth - $canvas.width) / 2); // $canvas x offset
|
||||
x = x + ($canvas.width - BOX_WIDTH) / 2; // box x offset
|
||||
//let x = ($canvas.width - BOX_WIDTH) / 2;
|
||||
x = x + (BOX_WIDTH - START_BUTTON_WIDTH) / 2; // left of start button
|
||||
x = x + START_BUTTON_WIDTH / 2; // ~ middle of start button x
|
||||
|
||||
let y = (window.innerHeight - $canvas.height) / 2; // $canvas y offset
|
||||
y = y + $canvas.height; // $canvas bottom
|
||||
//let y = $canvas.height;
|
||||
y = y - BUTTON_Y_OFFSET_FROM_BOTTOM; // start button bottom
|
||||
y = y - START_BUTTON_HEIGHT / 2; // ~ middle of start button y
|
||||
|
||||
console.warn(`clicking x=${x}, y=${y}!`);
|
||||
|
||||
for (let name of ['mousedown', 'click']) {
|
||||
let click = new MouseEvent(name, {
|
||||
function dispatchOne(eventName, x, y) {
|
||||
let ev = new MouseEvent(eventName, {
|
||||
clientX: x,
|
||||
clientY: y,
|
||||
screenX: x,
|
||||
@ -170,9 +151,48 @@
|
||||
bubbles: true,
|
||||
});
|
||||
|
||||
document.dispatchEvent(click);
|
||||
//$canvas.dispatchEvent(click);
|
||||
console.warn('click done');
|
||||
if (DISPATCH_ON_CANVAS) {
|
||||
$canvas.dispatchEvent(ev);
|
||||
} else {
|
||||
document.dispatchEvent(ev);
|
||||
}
|
||||
}
|
||||
|
||||
//$canvas.addEventListener('mousedown', function(event) {
|
||||
// console.log(event);
|
||||
//});
|
||||
|
||||
let x, y;
|
||||
if (DISPATCH_ON_CANVAS) {
|
||||
x = ($canvas.width - BOX_WIDTH) / 2; // box x offset
|
||||
y = $canvas.height;
|
||||
} else {
|
||||
x = Math.max(0, (window.innerWidth - $canvas.width) / 2); // $canvas x offset
|
||||
x = x + ($canvas.width - BOX_WIDTH) / 2; // box x offset
|
||||
|
||||
y = (window.innerHeight - $canvas.height) / 2; // $canvas y offset
|
||||
y = y + $canvas.height; // $canvas bottom
|
||||
}
|
||||
|
||||
x = x + (BOX_WIDTH - START_BUTTON_WIDTH) / 2; // left of start button
|
||||
x = x + START_BUTTON_WIDTH / 2; // ~ middle of start button x
|
||||
|
||||
y = y - BUTTON_Y_OFFSET_FROM_BOTTOM; // start button bottom
|
||||
y = y - START_BUTTON_HEIGHT / 2; // ~ middle of start button y
|
||||
|
||||
if (TEST_MODE) {
|
||||
for (let eventName of ['mousedown', 'mousemove', 'mouseup', 'click']) {
|
||||
for (let x = 0; x < $canvas.width; x += 10) {
|
||||
for (let y = 0; y < $canvas.height; y += 10) {
|
||||
dispatchOne(eventName, x, y);
|
||||
}
|
||||
}
|
||||
console.log(`done with ${eventName}!`);
|
||||
}
|
||||
console.log('done with all click types')
|
||||
} else {
|
||||
console.warn(`clicking x=${x}, y=${y}!`);
|
||||
dispatchOne('mousedown', x, y);
|
||||
}
|
||||
}, WAIT_TIMEOUT);
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user