Mouse Lock/Pointer Lock API

Само название этого API, не так давно внедренного в Mоzilla Fire-fox, может вызвать недоумение и вопрос «А зачем?». Но это только если вы не работаете в игровой индустрии. Этот механизм позволяет создателям игр получить полный контроль над мышью, например скрыть штатный курсор, обеспечить собственную обработку перемещения мыши. Вот пример работы этого инструмента:

<!DOCTYPE HTML>

<html>

<head>

<title>Html5 audi o</title>

<link href="basic. css" rel="stylesheet" media="all" />

<script src="../jquery-1.4.4.min. js"></script>

<script> </script>

</head>

<body>

<button onclick="lockPointer();">Lock it!</button>

<div id="pointer-lock-element"></div>

<script> var elem:

Function fullscreenChange() {

If (elem. oequestPointerLock =elem)

Elem. requestPointerLock = elem. requestPointerLock || elem. mozRequestPointerLock;

Elem. requestPointerLock():

}

}

Document. addEventListener(‘mozfullscreenchange’, fullscreenChange, false);

Function pointerLockChange() {

If (document. mozPointerLockElement === elem) { console. log("Pointer Lock was successful.");

} else {

Console. log("Pointer Lock was lost.");

}

}

Document. addEventListener(‘mozpointerlockchange’, pointerLockChange, false); function pointerLockError() {

}

Document. addEventListener(‘mozpointerlockerror’, pointerLockError, false); function lockPointer() {

Elem = document. getElementById("pointer-lock-element"); elem. requestFullScreen():

}

</script>

</body>

</html>

Честно говоря, этот код ужасен. Мало того, что он написан только под Firefox, при демонстрации API пришлось учесть тот факт, что в текущей реализации механизм pointer-lock действует лишь в полноэкранном режиме. Но, как бы то ни было, при нажатии на кнопку мы получим ситуацию, изображенную на рис. 126, — браузер запрашивает у нас разрешение на блокирование мыши. После нажатия на кнопку Allow указатель мыши исчезнет. Точнее, станет невидимым. События вроде onmoupsemove или onmousedown никуда не денутся. Более того, в новом API мышь обрела дополнительные свойства movementX и movementY — показывающие изменение в положении мыши.

Вообще, это еще не все. Даже далеко не все. Но в какой-то момент стоит остановиться, а то иногда создается впечатление, что скорость создания новых API различной степени сырости несколько выше скорости написания нашего путеводителя.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *