core/util/events.js

   1 /*
   2  * noVNC: HTML5 VNC client
   3  * Copyright (C) 2012 Joel Martin
   4  * Licensed under MPL 2.0 (see LICENSE.txt)
   5  *
   6  * See README.md for usage and integration instructions.
   7  */
   8
   9 /*
  10  * Cross-browser event and position routines
  11  */
  12
  13 import * as Log from './logging.js';
  14
  15 export function getPointerEvent (e) {
  16     return e.changedTouches ? e.changedTouches[0] : e.touches ? e.touches[0] : e;
  17 };
  18
  19 export function stopEvent (e) {
  20     e.stopPropagation();
  21     e.preventDefault();
  22 };
  23
  24 // Emulate Element.setCapture() when not supported
  25 var _captureRecursion = false;
  26 var _captureElem = null;
  27 function _captureProxy(e) {
  28     // Recursion protection as we'll see our own event
  29     if (_captureRecursion) return;
  30
  31     // Clone the event as we cannot dispatch an already dispatched event
  32     var newEv = new e.constructor(e.type, e);
  33
  34     _captureRecursion = true;
  35     _captureElem.dispatchEvent(newEv);
  36     _captureRecursion = false;
  37
  38     // Avoid double events
  39     e.stopPropagation();
  40
  41     // Respect the wishes of the redirected event handlers
  42     if (newEv.defaultPrevented) {
  43         e.preventDefault();
  44     }
  45
  46     // Implicitly release the capture on button release
  47     if (e.type === "mouseup") {
  48         releaseCapture();
  49     }
  50 };
  51
  52 // Follow cursor style of target element
  53 function _captureElemChanged() {
  54     var captureElem = document.getElementById("noVNC_mouse_capture_elem");
  55     captureElem.style.cursor = window.getComputedStyle(_captureElem).cursor;
  56 };
  57 var _captureObserver = new MutationObserver(_captureElemChanged);
  58
  59 var _captureIndex = 0;
  60
  61 export function setCapture (elem) {
  62     if (elem.setCapture) {
  63
  64         elem.setCapture();
  65
  66         // IE releases capture on 'click' events which might not trigger
  67         elem.addEventListener('mouseup', releaseCapture);
  68
  69     } else {
  70         // Release any existing capture in case this method is
  71         // called multiple times without coordination
  72         releaseCapture();
  73
  74         var captureElem = document.getElementById("noVNC_mouse_capture_elem");
  75
  76         if (captureElem === null) {
  77             captureElem = document.createElement("div");
  78             captureElem.id = "noVNC_mouse_capture_elem";
  79             captureElem.style.position = "fixed";
  80             captureElem.style.top = "0px";
  81             captureElem.style.left = "0px";
  82             captureElem.style.width = "100%";
  83             captureElem.style.height = "100%";
  84             captureElem.style.zIndex = 10000;
  85             captureElem.style.display = "none";
  86             document.body.appendChild(captureElem);
  87
  88             // This is to make sure callers don't get confused by having
  89             // our blocking element as the target
  90             captureElem.addEventListener('contextmenu', _captureProxy);
  91
  92             captureElem.addEventListener('mousemove', _captureProxy);
  93             captureElem.addEventListener('mouseup', _captureProxy);
  94         }
  95
  96         _captureElem = elem;
  97         _captureIndex++;
  98
  99         // Track cursor and get initial cursor
 100         _captureObserver.observe(elem, {attributes:true});
 101         _captureElemChanged();
 102
 103         captureElem.style.display = "";
 104
 105         // We listen to events on window in order to keep tracking if it
 106         // happens to leave the viewport
 107         window.addEventListener('mousemove', _captureProxy);
 108         window.addEventListener('mouseup', _captureProxy);
 109     }
 110 };
 111
 112 export function releaseCapture () {
 113     if (document.releaseCapture) {
 114
 115         document.releaseCapture();
 116
 117     } else {
 118         if (!_captureElem) {
 119             return;
 120         }
 121
 122         // There might be events already queued, so we need to wait for
 123         // them to flush. E.g. contextmenu in Microsoft Edge
 124         window.setTimeout(function(expected) {
 125             // Only clear it if it's the expected grab (i.e. no one
 126             // else has initiated a new grab)
 127             if (_captureIndex === expected) {
 128                 _captureElem = null;
 129             }
 130         }, 0, _captureIndex);
 131
 132         _captureObserver.disconnect();
 133
 134         var captureElem = document.getElementById("noVNC_mouse_capture_elem");
 135         captureElem.style.display = "none";
 136
 137         window.removeEventListener('mousemove', _captureProxy);
 138         window.removeEventListener('mouseup', _captureProxy);
 139     }
 140 };