blob: 298f3b9252f77fe2bdbdd05dfc03c32654aa50be [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<title>Fullscreen and Mouse Lock Scripts</title>
<script type="text/javascript">
function enterFullscreen() {
console.log("enterFullscreen()");
document.getElementById('container').webkitRequestFullScreen(
Element.ALLOW_KEYBOARD_INPUT);
}
function exitFullscreen() {
console.log("exitFullscreen()");
document.webkitCancelFullScreen();
}
// Wait for notification from JS, then notify test of success or failure
// callback that the click has registered and the mouse lock state has changed.
function lockMouse1(callback) {
console.log("lockMouse1()");
navigator.webkitPointer.lock(document.getElementById("lockTarget1"),
function() {
console.log("lock success");
if (callback) {
callback("success");
}
},
function() {
console.log("lock failed");
if (callback) {
callback("failure");
}
}
);
}
var lock_result1 = "";
// In the pyAuto test the fullscreen is initiated, accepted and enters into a wait state
// reading the value of lock_result1. One of the two asynchronous functions in the JS will
// be executed. The pyAuto code waits for lock_result to return "success" or "failure".
// Sample pyAuto code: lock_result = self._driver.execute_script('lockMouse1AndSetLockResult()')
function lockMouse1AndSetLockResult() {
console.log("lockMouse1AndSetLockResult()");
lock_result1 = "";
navigator.webkitPointer.lock(document.getElementById("lockTarget1"),
function() {
console.log("lock success");
lock_result = "success"
},
function() {
console.log("lock failed");
lock_result = "failure"
}
);
}
function lockMouse2() {
console.log("lockMouse2()");
navigator.webkitPointer.lock(document.getElementById("lockTarget2"),
function(){console.log("lock success")},
function(){console.log("lock failed")});
}
function delayedLockMouse1() {
console.log("delayedLockMouse1()");
window.setTimeout(lockMouse1, 1010);
// Delay must be over 1 second or the click that initiated the delayed action
// may still be considered active and treat this as a user gesture.
// We want to test a lock not associated with a user gesture.
}
function spamLockMouse2() {
console.log("spamLockMouse2()")
window.setInterval(lockMouse2, 111);
}
function unlockMouse() {
console.log("unlockMouse()");
navigator.webkitPointer.unlock();
}
function enterFullscreenAndLockMouse1() {
console.log("enterFullscreenAndLockMouse1()");
enterFullscreen();
lockMouse1();
}
function lockMouse1AndEnterFullscreen() {
console.log("lockMouse1AndEnterFullscreen()");
lockMouse1();
enterFullscreen();
}
</script>
</head>
<body title="This tooltip should not be shown if the mouse is locked.">
<div id="container">
<button id="enterFullscreen" onclick="enterFullscreen();">enterFullscreen() [f]</button><br>
<button id="exitFullscreen" onclick="exitFullscreen();">exitFullscreen() [x]</button><br>
<button id="lockMouse1" onclick="lockMouse1();">lockMouse1() [1]</button><br>
<button id="lockMouse2" onclick="lockMouse2();">lockMouse2() [2]</button><br>
<button id="delayedLockMouse1" onclick="delayedLockMouse1();">delayedLockMouse1() [d]</button><br>
<button id="spamLockMouse2" onclick="spamLockMouse2();">spamLockMouse2()</button><br>
<button id="unlockMouse" onclick="unlockMouse();">unlockMouse() [u]</button><br>
<button id="enterFullscreenAndLockMouse1" onclick="enterFullscreenAndLockMouse1()">enterFullscreenAndLockMouse1() [b]</button><br>
<button id="lockMouse1AndEnterFullscreen" onclick="lockMouse1AndEnterFullscreen()">lockMouse1AndEnterFullscreen() [B]</button><br>
<div id="lockTarget1">lockTarget1</div>
<div id="lockTarget2">lockTarget2</div>
</div>
This text is outside of the container that is made fullscreen. This text should not be visible when fullscreen.
</body>
<script>
document.body.onkeypress = function (e) {
switch (String.fromCharCode(e.charCode)) {
case "f": enterFullscreen(); break;
case "x": exitFullscreen(); break;
case "1": lockMouse1(); break;
case "2": lockMouse2(); break;
case "d": delayedLockMouse1(); break;
case "u": unlockMouse(); break;
case "b": enterFullscreenAndLockMouse1(); break;
case "B": lockMouse1AndEnterFullscreen(); break;
}
}
</script>
</html>