core/rfb.js

   1 /*
   2  * noVNC: HTML5 VNC client
   3  * Copyright (C) 2012 Joel Martin
   4  * Copyright (C) 2018 Samuel Mannehed for Cendio AB
   5  * Licensed under MPL 2.0 (see LICENSE.txt)
   6  *
   7  * See README.md for usage and integration instructions.
   8  *
   9  * TIGHT decoder portion:
  10  * (c) 2012 Michael Tinglof, Joe Balaz, Les Piech (Mercuri.ca)
  11  */
  12
  13 import * as Log from './util/logging.js';
  14 import { decodeUTF8 } from './util/strings.js';
  15 import EventTargetMixin from './util/eventtarget.js';
  16 import Display from "./display.js";
  17 import Keyboard from "./input/keyboard.js";
  18 import Mouse from "./input/mouse.js";
  19 import Cursor from "./util/cursor.js";
  20 import Websock from "./websock.js";
  21 import DES from "./des.js";
  22 import KeyTable from "./input/keysym.js";
  23 import XtScancode from "./input/xtscancodes.js";
  24 import Inflator from "./inflator.js";
  25 import { encodings, encodingName } from "./encodings.js";
  26 import "./util/polyfill.js";
  27
  28 // How many seconds to wait for a disconnect to finish
  29 const DISCONNECT_TIMEOUT = 3;
  30
  31 export default function RFB(target, url, options) {
  32     if (!target) {
  33         throw Error("Must specify target");
  34     }
  35     if (!url) {
  36         throw Error("Must specify URL");
  37     }
  38
  39     this._target = target;
  40     this._url = url;
  41
  42     // Connection details
  43     options = options || {};
  44     this._rfb_credentials = options.credentials || {};
  45     this._shared = 'shared' in options ? !!options.shared : true;
  46     this._repeaterID = options.repeaterID || '';
  47
  48     // Internal state
  49     this._rfb_connection_state = '';
  50     this._rfb_init_state = '';
  51     this._rfb_auth_scheme = '';
  52     this._rfb_clean_disconnect = true;
  53
  54     // Server capabilities
  55     this._rfb_version = 0;
  56     this._rfb_max_version = 3.8;
  57     this._rfb_tightvnc = false;
  58     this._rfb_xvp_ver = 0;
  59
  60     this._fb_width = 0;
  61     this._fb_height = 0;
  62
  63     this._fb_name = "";
  64
  65     this._capabilities = { power: false };
  66
  67     this._supportsFence = false;
  68
  69     this._supportsContinuousUpdates = false;
  70     this._enabledContinuousUpdates = false;
  71
  72     this._supportsSetDesktopSize = false;
  73     this._screen_id = 0;
  74     this._screen_flags = 0;
  75
  76     this._qemuExtKeyEventSupported = false;
  77
  78     // Internal objects
  79     this._sock = null;              // Websock object
  80     this._display = null;           // Display object
  81     this._flushing = false;         // Display flushing state
  82     this._keyboard = null;          // Keyboard input handler object
  83     this._mouse = null;             // Mouse input handler object
  84
  85     // Timers
  86     this._disconnTimer = null;      // disconnection timer
  87     this._resizeTimeout = null;     // resize rate limiting
  88
  89     // Decoder states and stats
  90     this._encHandlers = {};
  91     this._encStats = {};
  92
  93     this._FBU = {
  94         rects: 0,
  95         subrects: 0,            // RRE and HEXTILE
  96         lines: 0,               // RAW
  97         tiles: 0,               // HEXTILE
  98         bytes: 0,
  99         x: 0,
 100         y: 0,
 101         width: 0,
 102         height: 0,
 103         encoding: 0,
 104         subencoding: -1,
 105         background: null,
 106         zlibs: []               // TIGHT zlib streams
 107     };
 108     for (let i = 0; i < 4; i++) {
 109         this._FBU.zlibs[i] = new Inflator();
 110     }
 111
 112     this._destBuff = null;
 113     this._paletteBuff = new Uint8Array(1024);  // 256 * 4 (max palette size * max bytes-per-pixel)
 114
 115     this._rre_chunk_sz = 100;
 116
 117     this._timing = {
 118         last_fbu: 0,
 119         fbu_total: 0,
 120         fbu_total_cnt: 0,
 121         full_fbu_total: 0,
 122         full_fbu_cnt: 0,
 123
 124         fbu_rt_start: 0,
 125         fbu_rt_total: 0,
 126         fbu_rt_cnt: 0,
 127         pixels: 0
 128     };
 129
 130     // Mouse state
 131     this._mouse_buttonMask = 0;
 132     this._mouse_arr = [];
 133     this._viewportDragging = false;
 134     this._viewportDragPos = {};
 135     this._viewportHasMoved = false;
 136
 137     // Bound event handlers
 138     this._eventHandlers = {
 139         focusCanvas: this._focusCanvas.bind(this),
 140         windowResize: this._windowResize.bind(this),
 141     };
 142
 143     // main setup
 144     Log.Debug(">> RFB.constructor");
 145
 146     // Create DOM elements
 147     this._screen = document.createElement('div');
 148     this._screen.style.display = 'flex';
 149     this._screen.style.width = '100%';
 150     this._screen.style.height = '100%';
 151     this._screen.style.overflow = 'auto';
 152     this._screen.style.backgroundColor = 'rgb(40, 40, 40)';
 153     this._canvas = document.createElement('canvas');
 154     this._canvas.style.margin = 'auto';
 155     // Some browsers add an outline on focus
 156     this._canvas.style.outline = 'none';
 157     // IE miscalculates width without this :(
 158     this._canvas.style.flexShrink = '0';
 159     this._canvas.width = 0;
 160     this._canvas.height = 0;
 161     this._canvas.tabIndex = -1;
 162     this._screen.appendChild(this._canvas);
 163
 164     this._cursor = new Cursor();
 165
 166     // populate encHandlers with bound versions
 167     this._encHandlers[encodings.encodingRaw] = RFB.encodingHandlers.RAW.bind(this);
 168     this._encHandlers[encodings.encodingCopyRect] = RFB.encodingHandlers.COPYRECT.bind(this);
 169     this._encHandlers[encodings.encodingRRE] = RFB.encodingHandlers.RRE.bind(this);
 170     this._encHandlers[encodings.encodingHextile] = RFB.encodingHandlers.HEXTILE.bind(this);
 171     this._encHandlers[encodings.encodingTight] = RFB.encodingHandlers.TIGHT.bind(this, false);
 172     this._encHandlers[encodings.encodingTightPNG] = RFB.encodingHandlers.TIGHT.bind(this, true);
 173
 174     this._encHandlers[encodings.pseudoEncodingDesktopSize] = RFB.encodingHandlers.DesktopSize.bind(this);
 175     this._encHandlers[encodings.pseudoEncodingLastRect] = RFB.encodingHandlers.last_rect.bind(this);
 176     this._encHandlers[encodings.pseudoEncodingCursor] = RFB.encodingHandlers.Cursor.bind(this);
 177     this._encHandlers[encodings.pseudoEncodingQEMUExtendedKeyEvent] = RFB.encodingHandlers.QEMUExtendedKeyEvent.bind(this);
 178     this._encHandlers[encodings.pseudoEncodingExtendedDesktopSize] = RFB.encodingHandlers.ExtendedDesktopSize.bind(this);
 179
 180     // NB: nothing that needs explicit teardown should be done
 181     // before this point, since this can throw an exception
 182     try {
 183         this._display = new Display(this._canvas);
 184     } catch (exc) {
 185         Log.Error("Display exception: " + exc);
 186         throw exc;
 187     }
 188     this._display.onflush = this._onFlush.bind(this);
 189     this._display.clear();
 190
 191     this._keyboard = new Keyboard(this._canvas);
 192     this._keyboard.onkeyevent = this._handleKeyEvent.bind(this);
 193
 194     this._mouse = new Mouse(this._canvas);
 195     this._mouse.onmousebutton = this._handleMouseButton.bind(this);
 196     this._mouse.onmousemove = this._handleMouseMove.bind(this);
 197
 198     this._sock = new Websock();
 199     this._sock.on('message', this._handle_message.bind(this));
 200     this._sock.on('open', function () {
 201         if ((this._rfb_connection_state === 'connecting') &&
 202             (this._rfb_init_state === '')) {
 203             this._rfb_init_state = 'ProtocolVersion';
 204             Log.Debug("Starting VNC handshake");
 205         } else {
 206             this._fail("Unexpected server connection while " +
 207                        this._rfb_connection_state);
 208         }
 209     }.bind(this));
 210     this._sock.on('close', function (e) {
 211         Log.Debug("WebSocket on-close event");
 212         let msg = "";
 213         if (e.code) {
 214             msg = "(code: " + e.code;
 215             if (e.reason) {
 216                 msg += ", reason: " + e.reason;
 217             }
 218             msg += ")";
 219         }
 220         switch (this._rfb_connection_state) {
 221             case 'connecting':
 222                 this._fail("Connection closed " + msg);
 223                 break;
 224             case 'connected':
 225                 // Handle disconnects that were initiated server-side
 226                 this._updateConnectionState('disconnecting');
 227                 this._updateConnectionState('disconnected');
 228                 break;
 229             case 'disconnecting':
 230                 // Normal disconnection path
 231                 this._updateConnectionState('disconnected');
 232                 break;
 233             case 'disconnected':
 234                 this._fail("Unexpected server disconnect " +
 235                            "when already disconnected " + msg);
 236                 break;
 237             default:
 238                 this._fail("Unexpected server disconnect before connecting " +
 239                            msg);
 240                 break;
 241         }
 242         this._sock.off('close');
 243     }.bind(this));
 244     this._sock.on('error', function (e) {
 245         Log.Warn("WebSocket on-error event");
 246     });
 247
 248     // Slight delay of the actual connection so that the caller has
 249     // time to set up callbacks
 250     setTimeout(this._updateConnectionState.bind(this, 'connecting'));
 251
 252     Log.Debug("<< RFB.constructor");
 253 }
 254
 255 RFB.prototype = {
 256     // ===== PROPERTIES =====
 257
 258     dragViewport: false,
 259     focusOnClick: true,
 260
 261     _viewOnly: false,
 262     get viewOnly() { return this._viewOnly; },
 263     set viewOnly(viewOnly) {
 264         this._viewOnly = viewOnly;
 265
 266         if (this._rfb_connection_state === "connecting" ||
 267             this._rfb_connection_state === "connected") {
 268             if (viewOnly) {
 269                 this._keyboard.ungrab();
 270                 this._mouse.ungrab();
 271             } else {
 272                 this._keyboard.grab();
 273                 this._mouse.grab();
 274             }
 275         }
 276     },
 277
 278     get capabilities() { return this._capabilities; },
 279
 280     get touchButton() { return this._mouse.touchButton; },
 281     set touchButton(button) { this._mouse.touchButton = button; },
 282
 283     _clipViewport: false,
 284     get clipViewport() { return this._clipViewport; },
 285     set clipViewport(viewport) {
 286         this._clipViewport = viewport;
 287         this._updateClip();
 288     },
 289
 290     _scaleViewport: false,
 291     get scaleViewport() { return this._scaleViewport; },
 292     set scaleViewport(scale) {
 293         this._scaleViewport = scale;
 294         // Scaling trumps clipping, so we may need to adjust
 295         // clipping when enabling or disabling scaling
 296         if (scale && this._clipViewport) {
 297             this._updateClip();
 298         }
 299         this._updateScale();
 300         if (!scale && this._clipViewport) {
 301             this._updateClip();
 302         }
 303     },
 304
 305     _resizeSession: false,
 306     get resizeSession() { return this._resizeSession; },
 307     set resizeSession(resize) {
 308         this._resizeSession = resize;
 309         if (resize) {
 310             this._requestRemoteResize();
 311         }
 312     },
 313
 314     // ===== PUBLIC METHODS =====
 315
 316     disconnect: function () {
 317         this._updateConnectionState('disconnecting');
 318         this._sock.off('error');
 319         this._sock.off('message');
 320         this._sock.off('open');
 321     },
 322
 323     sendCredentials: function (creds) {
 324         this._rfb_credentials = creds;
 325         setTimeout(this._init_msg.bind(this), 0);
 326     },
 327
 328     sendCtrlAltDel: function () {
 329         if (this._rfb_connection_state !== 'connected' || this._viewOnly) { return; }
 330         Log.Info("Sending Ctrl-Alt-Del");
 331
 332         this.sendKey(KeyTable.XK_Control_L, "ControlLeft", true);
 333         this.sendKey(KeyTable.XK_Alt_L, "AltLeft", true);
 334         this.sendKey(KeyTable.XK_Delete, "Delete", true);
 335         this.sendKey(KeyTable.XK_Delete, "Delete", false);
 336         this.sendKey(KeyTable.XK_Alt_L, "AltLeft", false);
 337         this.sendKey(KeyTable.XK_Control_L, "ControlLeft", false);
 338     },
 339
 340     machineShutdown: function () {
 341         this._xvpOp(1, 2);
 342     },
 343
 344     machineReboot: function () {
 345         this._xvpOp(1, 3);
 346     },
 347
 348     machineReset: function () {
 349         this._xvpOp(1, 4);
 350     },
 351
 352     // Send a key press. If 'down' is not specified then send a down key
 353     // followed by an up key.
 354     sendKey: function (keysym, code, down) {
 355         if (this._rfb_connection_state !== 'connected' || this._viewOnly) { return; }
 356
 357         if (down === undefined) {
 358             this.sendKey(keysym, code, true);
 359             this.sendKey(keysym, code, false);
 360             return;
 361         }
 362
 363         const scancode = XtScancode[code];
 364
 365         if (this._qemuExtKeyEventSupported && scancode) {
 366             // 0 is NoSymbol
 367             keysym = keysym || 0;
 368
 369             Log.Info("Sending key (" + (down ? "down" : "up") + "): keysym " + keysym + ", scancode " + scancode);
 370
 371             RFB.messages.QEMUExtendedKeyEvent(this._sock, keysym, down, scancode);
 372         } else {
 373             if (!keysym) {
 374                 return;
 375             }
 376             Log.Info("Sending keysym (" + (down ? "down" : "up") + "): " + keysym);
 377             RFB.messages.keyEvent(this._sock, keysym, down ? 1 : 0);
 378         }
 379     },
 380
 381     focus: function () {
 382         this._canvas.focus();
 383     },
 384
 385     blur: function () {
 386         this._canvas.blur();
 387     },
 388
 389     clipboardPasteFrom: function (text) {
 390         if (this._rfb_connection_state !== 'connected' || this._viewOnly) { return; }
 391         RFB.messages.clientCutText(this._sock, text);
 392     },
 393
 394     // ===== PRIVATE METHODS =====
 395
 396     _connect: function () {
 397         Log.Debug(">> RFB.connect");
 398
 399         Log.Info("connecting to " + this._url);
 400
 401         try {
 402             // WebSocket.onopen transitions to the RFB init states
 403             this._sock.open(this._url, ['binary']);
 404         } catch (e) {
 405             if (e.name === 'SyntaxError') {
 406                 this._fail("Invalid host or port (" + e + ")");
 407             } else {
 408                 this._fail("Error when opening socket (" + e + ")");
 409             }
 410         }
 411
 412         // Make our elements part of the page
 413         this._target.appendChild(this._screen);
 414
 415         this._cursor.attach(this._canvas);
 416
 417         // Monitor size changes of the screen
 418         // FIXME: Use ResizeObserver, or hidden overflow
 419         window.addEventListener('resize', this._eventHandlers.windowResize);
 420
 421         // Always grab focus on some kind of click event
 422         this._canvas.addEventListener("mousedown", this._eventHandlers.focusCanvas);
 423         this._canvas.addEventListener("touchstart", this._eventHandlers.focusCanvas);
 424
 425         Log.Debug("<< RFB.connect");
 426     },
 427
 428     _disconnect: function () {
 429         Log.Debug(">> RFB.disconnect");
 430         this._cursor.detach();
 431         this._canvas.removeEventListener("mousedown", this._eventHandlers.focusCanvas);
 432         this._canvas.removeEventListener("touchstart", this._eventHandlers.focusCanvas);
 433         window.removeEventListener('resize', this._eventHandlers.windowResize);
 434         this._keyboard.ungrab();
 435         this._mouse.ungrab();
 436         this._sock.close();
 437         this._print_stats();
 438         try {
 439             this._target.removeChild(this._screen);
 440         } catch (e) {
 441             if (e.name === 'NotFoundError') {
 442                 // Some cases where the initial connection fails
 443                 // can disconnect before the _screen is created
 444             } else {
 445                 throw e;
 446             }
 447         }
 448         clearTimeout(this._resizeTimeout);
 449         Log.Debug("<< RFB.disconnect");
 450     },
 451
 452     _print_stats: function () {
 453         const stats = this._encStats;
 454
 455         Log.Info("Encoding stats for this connection:");
 456         Object.keys(stats).forEach(function (key) {
 457             const s = stats[key];
 458             if (s[0] + s[1] > 0) {
 459                 Log.Info("    " + encodingName(key) + ": " + s[0] + " rects");
 460             }
 461         });
 462
 463         Log.Info("Encoding stats since page load:");
 464         Object.keys(stats).forEach(function (key) {
 465             const s = stats[key];
 466             Log.Info("    " + encodingName(key) + ": " + s[1] + " rects");
 467         });
 468     },
 469
 470     _focusCanvas: function(event) {
 471         // Respect earlier handlers' request to not do side-effects
 472         if (event.defaultPrevented) {
 473             return;
 474         }
 475
 476         if (!this.focusOnClick) {
 477             return;
 478         }
 479
 480         this.focus();
 481     },
 482
 483     _windowResize: function (event) {
 484         // If the window resized then our screen element might have
 485         // as well. Update the viewport dimensions.
 486         window.requestAnimationFrame(function () {
 487             this._updateClip();
 488             this._updateScale();
 489         }.bind(this));
 490
 491         if (this._resizeSession) {
 492             // Request changing the resolution of the remote display to
 493             // the size of the local browser viewport.
 494
 495             // In order to not send multiple requests before the browser-resize
 496             // is finished we wait 0.5 seconds before sending the request.
 497             clearTimeout(this._resizeTimeout);
 498             this._resizeTimeout = setTimeout(this._requestRemoteResize.bind(this), 500);
 499         }
 500     },
 501
 502     // Update state of clipping in Display object, and make sure the
 503     // configured viewport matches the current screen size
 504     _updateClip: function () {
 505         const cur_clip = this._display.clipViewport;
 506         let new_clip = this._clipViewport;
 507
 508         if (this._scaleViewport) {
 509             // Disable viewport clipping if we are scaling
 510             new_clip = false;
 511         }
 512
 513         if (cur_clip !== new_clip) {
 514             this._display.clipViewport = new_clip;
 515         }
 516
 517         if (new_clip) {
 518             // When clipping is enabled, the screen is limited to
 519             // the size of the container.
 520             const size = this._screenSize();
 521             this._display.viewportChangeSize(size.w, size.h);
 522             this._fixScrollbars();
 523         }
 524     },
 525
 526     _updateScale: function () {
 527         if (!this._scaleViewport) {
 528             this._display.scale = 1.0;
 529         } else {
 530             const size = this._screenSize();
 531             this._display.autoscale(size.w, size.h);
 532         }
 533         this._fixScrollbars();
 534     },
 535
 536     // Requests a change of remote desktop size. This message is an extension
 537     // and may only be sent if we have received an ExtendedDesktopSize message
 538     _requestRemoteResize: function () {
 539         clearTimeout(this._resizeTimeout);
 540         this._resizeTimeout = null;
 541
 542         if (!this._resizeSession || this._viewOnly ||
 543             !this._supportsSetDesktopSize) {
 544             return;
 545         }
 546
 547         const size = this._screenSize();
 548         RFB.messages.setDesktopSize(this._sock, size.w, size.h,
 549                                     this._screen_id, this._screen_flags);
 550
 551         Log.Debug('Requested new desktop size: ' +
 552                    size.w + 'x' + size.h);
 553     },
 554
 555     // Gets the the size of the available screen
 556     _screenSize: function () {
 557         return { w: this._screen.offsetWidth,
 558                  h: this._screen.offsetHeight };
 559     },
 560
 561     _fixScrollbars: function () {
 562         // This is a hack because Chrome screws up the calculation
 563         // for when scrollbars are needed. So to fix it we temporarily
 564         // toggle them off and on.
 565         const orig = this._screen.style.overflow;
 566         this._screen.style.overflow = 'hidden';
 567         // Force Chrome to recalculate the layout by asking for
 568         // an element's dimensions
 569         this._screen.getBoundingClientRect();
 570         this._screen.style.overflow = orig;
 571     },
 572
 573     /*
 574      * Connection states:
 575      *   connecting
 576      *   connected
 577      *   disconnecting
 578      *   disconnected - permanent state
 579      */
 580     _updateConnectionState: function (state) {
 581         const oldstate = this._rfb_connection_state;
 582
 583         if (state === oldstate) {
 584             Log.Debug("Already in state '" + state + "', ignoring");
 585             return;
 586         }
 587
 588         // The 'disconnected' state is permanent for each RFB object
 589         if (oldstate === 'disconnected') {
 590             Log.Error("Tried changing state of a disconnected RFB object");
 591             return;
 592         }
 593
 594         // Ensure proper transitions before doing anything
 595         switch (state) {
 596             case 'connected':
 597                 if (oldstate !== 'connecting') {
 598                     Log.Error("Bad transition to connected state, " +
 599                                "previous connection state: " + oldstate);
 600                     return;
 601                 }
 602                 break;
 603
 604             case 'disconnected':
 605                 if (oldstate !== 'disconnecting') {
 606                     Log.Error("Bad transition to disconnected state, " +
 607                                "previous connection state: " + oldstate);
 608                     return;
 609                 }
 610                 break;
 611
 612             case 'connecting':
 613                 if (oldstate !== '') {
 614                     Log.Error("Bad transition to connecting state, " +
 615                                "previous connection state: " + oldstate);
 616                     return;
 617                 }
 618                 break;
 619
 620             case 'disconnecting':
 621                 if (oldstate !== 'connected' && oldstate !== 'connecting') {
 622                     Log.Error("Bad transition to disconnecting state, " +
 623                                "previous connection state: " + oldstate);
 624                     return;
 625                 }
 626                 break;
 627
 628             default:
 629                 Log.Error("Unknown connection state: " + state);
 630                 return;
 631         }
 632
 633         // State change actions
 634
 635         this._rfb_connection_state = state;
 636
 637         const smsg = "New state '" + state + "', was '" + oldstate + "'.";
 638         Log.Debug(smsg);
 639
 640         if (this._disconnTimer && state !== 'disconnecting') {
 641             Log.Debug("Clearing disconnect timer");
 642             clearTimeout(this._disconnTimer);
 643             this._disconnTimer = null;
 644
 645             // make sure we don't get a double event
 646             this._sock.off('close');
 647         }
 648
 649         switch (state) {
 650             case 'connecting':
 651                 this._connect();
 652                 break;
 653
 654             case 'connected':
 655                 this.dispatchEvent(new CustomEvent("connect", { detail: {} }));
 656                 break;
 657
 658             case 'disconnecting':
 659                 this._disconnect();
 660
 661                 this._disconnTimer = setTimeout(function () {
 662                     Log.Error("Disconnection timed out.");
 663                     this._updateConnectionState('disconnected');
 664                 }.bind(this), DISCONNECT_TIMEOUT * 1000);
 665                 break;
 666
 667             case 'disconnected':
 668                 this.dispatchEvent(new CustomEvent(
 669                     "disconnect", { detail:
 670                                     { clean: this._rfb_clean_disconnect } }));
 671                 break;
 672         }
 673     },
 674
 675     /* Print errors and disconnect
 676      *
 677      * The parameter 'details' is used for information that
 678      * should be logged but not sent to the user interface.
 679      */
 680     _fail: function (details) {
 681         switch (this._rfb_connection_state) {
 682             case 'disconnecting':
 683                 Log.Error("Failed when disconnecting: " + details);
 684                 break;
 685             case 'connected':
 686                 Log.Error("Failed while connected: " + details);
 687                 break;
 688             case 'connecting':
 689                 Log.Error("Failed when connecting: " + details);
 690                 break;
 691             default:
 692                 Log.Error("RFB failure: " + details);
 693                 break;
 694         }
 695         this._rfb_clean_disconnect = false; //This is sent to the UI
 696
 697         // Transition to disconnected without waiting for socket to close
 698         this._updateConnectionState('disconnecting');
 699         this._updateConnectionState('disconnected');
 700
 701         return false;
 702     },
 703
 704     _setCapability: function (cap, val) {
 705         this._capabilities[cap] = val;
 706         this.dispatchEvent(new CustomEvent("capabilities",
 707             { detail: { capabilities: this._capabilities } }));
 708     },
 709
 710     _handle_message: function () {
 711         if (this._sock.rQlen() === 0) {
 712             Log.Warn("handle_message called on an empty receive queue");
 713             return;
 714         }
 715
 716         switch (this._rfb_connection_state) {
 717             case 'disconnected':
 718                 Log.Error("Got data while disconnected");
 719                 break;
 720             case 'connected':
 721                 while (true) {
 722                     if (this._flushing) {
 723                         break;
 724                     }
 725                     if (!this._normal_msg()) {
 726                         break;
 727                     }
 728                     if (this._sock.rQlen() === 0) {
 729                         break;
 730                     }
 731                 }
 732                 break;
 733             default:
 734                 this._init_msg();
 735                 break;
 736         }
 737     },
 738
 739     _handleKeyEvent: function (keysym, code, down) {
 740         this.sendKey(keysym, code, down);
 741     },
 742
 743     _handleMouseButton: function (x, y, down, bmask) {
 744         if (down) {
 745             this._mouse_buttonMask |= bmask;
 746         } else {
 747             this._mouse_buttonMask &= ~bmask;
 748         }
 749
 750         if (this.dragViewport) {
 751             if (down && !this._viewportDragging) {
 752                 this._viewportDragging = true;
 753                 this._viewportDragPos = {'x': x, 'y': y};
 754                 this._viewportHasMoved = false;
 755
 756                 // Skip sending mouse events
 757                 return;
 758             } else {
 759                 this._viewportDragging = false;
 760
 761                 // If we actually performed a drag then we are done
 762                 // here and should not send any mouse events
 763                 if (this._viewportHasMoved) {
 764                     return;
 765                 }
 766
 767                 // Otherwise we treat this as a mouse click event.
 768                 // Send the button down event here, as the button up
 769                 // event is sent at the end of this function.
 770                 RFB.messages.pointerEvent(this._sock,
 771                                           this._display.absX(x),
 772                                           this._display.absY(y),
 773                                           bmask);
 774             }
 775         }
 776
 777         if (this._viewOnly) { return; } // View only, skip mouse events
 778
 779         if (this._rfb_connection_state !== 'connected') { return; }
 780         RFB.messages.pointerEvent(this._sock, this._display.absX(x), this._display.absY(y), this._mouse_buttonMask);
 781     },
 782
 783     _handleMouseMove: function (x, y) {
 784         if (this._viewportDragging) {
 785             const deltaX = this._viewportDragPos.x - x;
 786             const deltaY = this._viewportDragPos.y - y;
 787
 788             // The goal is to trigger on a certain physical width, the
 789             // devicePixelRatio brings us a bit closer but is not optimal.
 790             const dragThreshold = 10 * (window.devicePixelRatio || 1);
 791
 792             if (this._viewportHasMoved || (Math.abs(deltaX) > dragThreshold ||
 793                                            Math.abs(deltaY) > dragThreshold)) {
 794                 this._viewportHasMoved = true;
 795
 796                 this._viewportDragPos = {'x': x, 'y': y};
 797                 this._display.viewportChangePos(deltaX, deltaY);
 798             }
 799
 800             // Skip sending mouse events
 801             return;
 802         }
 803
 804         if (this._viewOnly) { return; } // View only, skip mouse events
 805
 806         if (this._rfb_connection_state !== 'connected') { return; }
 807         RFB.messages.pointerEvent(this._sock, this._display.absX(x), this._display.absY(y), this._mouse_buttonMask);
 808     },
 809
 810     // Message Handlers
 811
 812     _negotiate_protocol_version: function () {
 813         if (this._sock.rQlen() < 12) {
 814             return this._fail("Received incomplete protocol version.");
 815         }
 816
 817         const sversion = this._sock.rQshiftStr(12).substr(4, 7);
 818         Log.Info("Server ProtocolVersion: " + sversion);
 819         let is_repeater = 0;
 820         switch (sversion) {
 821             case "000.000":  // UltraVNC repeater
 822                 is_repeater = 1;
 823                 break;
 824             case "003.003":
 825             case "003.006":  // UltraVNC
 826             case "003.889":  // Apple Remote Desktop
 827                 this._rfb_version = 3.3;
 828                 break;
 829             case "003.007":
 830                 this._rfb_version = 3.7;
 831                 break;
 832             case "003.008":
 833             case "004.000":  // Intel AMT KVM
 834             case "004.001":  // RealVNC 4.6
 835             case "005.000":  // RealVNC 5.3
 836                 this._rfb_version = 3.8;
 837                 break;
 838             default:
 839                 return this._fail("Invalid server version " + sversion);
 840         }
 841
 842         if (is_repeater) {
 843             let repeaterID = "ID:" + this._repeaterID;
 844             while (repeaterID.length < 250) {
 845                 repeaterID += "\0";
 846             }
 847             this._sock.send_string(repeaterID);
 848             return true;
 849         }
 850
 851         if (this._rfb_version > this._rfb_max_version) {
 852             this._rfb_version = this._rfb_max_version;
 853         }
 854
 855         const cversion = "00" + parseInt(this._rfb_version, 10) +
 856                        ".00" + ((this._rfb_version * 10) % 10);
 857         this._sock.send_string("RFB " + cversion + "\n");
 858         Log.Debug('Sent ProtocolVersion: ' + cversion);
 859
 860         this._rfb_init_state = 'Security';
 861     },
 862
 863     _negotiate_security: function () {
 864         // Polyfill since IE and PhantomJS doesn't have
 865         // TypedArray.includes()
 866         function includes(item, array) {
 867             for (let i = 0; i < array.length; i++) {
 868                 if (array[i] === item) {
 869                     return true;
 870                 }
 871             }
 872             return false;
 873         }
 874
 875         if (this._rfb_version >= 3.7) {
 876             // Server sends supported list, client decides
 877             const num_types = this._sock.rQshift8();
 878             if (this._sock.rQwait("security type", num_types, 1)) { return false; }
 879
 880             if (num_types === 0) {
 881                 return this._handle_security_failure("no security types");
 882             }
 883
 884             const types = this._sock.rQshiftBytes(num_types);
 885             Log.Debug("Server security types: " + types);
 886
 887             // Look for each auth in preferred order
 888             this._rfb_auth_scheme = 0;
 889             if (includes(1, types)) {
 890                 this._rfb_auth_scheme = 1; // None
 891             } else if (includes(22, types)) {
 892                 this._rfb_auth_scheme = 22; // XVP
 893             } else if (includes(16, types)) {
 894                 this._rfb_auth_scheme = 16; // Tight
 895             } else if (includes(2, types)) {
 896                 this._rfb_auth_scheme = 2; // VNC Auth
 897             } else {
 898                 return this._fail("Unsupported security types (types: " + types + ")");
 899             }
 900
 901             this._sock.send([this._rfb_auth_scheme]);
 902         } else {
 903             // Server decides
 904             if (this._sock.rQwait("security scheme", 4)) { return false; }
 905             this._rfb_auth_scheme = this._sock.rQshift32();
 906         }
 907
 908         this._rfb_init_state = 'Authentication';
 909         Log.Debug('Authenticating using scheme: ' + this._rfb_auth_scheme);
 910
 911         return this._init_msg(); // jump to authentication
 912     },
 913
 914     /*
 915      * Get the security failure reason if sent from the server and
 916      * send the 'securityfailure' event.
 917      *
 918      * - The optional parameter context can be used to add some extra
 919      *   context to the log output.
 920      *
 921      * - The optional parameter security_result_status can be used to
 922      *   add a custom status code to the event.
 923      */
 924     _handle_security_failure: function (context, security_result_status) {
 925
 926         if (typeof context === 'undefined') {
 927             context = "";
 928         } else {
 929             context = " on " + context;
 930         }
 931
 932         if (typeof security_result_status === 'undefined') {
 933             security_result_status = 1; // fail
 934         }
 935
 936         if (this._sock.rQwait("reason length", 4)) {
 937             return false;
 938         }
 939         const strlen = this._sock.rQshift32();
 940         let reason = "";
 941
 942         if (strlen > 0) {
 943             if (this._sock.rQwait("reason", strlen, 8)) { return false; }
 944             reason = this._sock.rQshiftStr(strlen);
 945         }
 946
 947         if (reason !== "") {
 948             this.dispatchEvent(new CustomEvent(
 949                 "securityfailure",
 950                 { detail: { status: security_result_status, reason: reason } }));
 951
 952             return this._fail("Security negotiation failed" + context +
 953                               " (reason: " + reason + ")");
 954         } else {
 955             this.dispatchEvent(new CustomEvent(
 956                 "securityfailure",
 957                 { detail: { status: security_result_status } }));
 958
 959             return this._fail("Security negotiation failed" + context);
 960         }
 961     },
 962
 963     // authentication
 964     _negotiate_xvp_auth: function () {
 965         if (!this._rfb_credentials.username ||
 966             !this._rfb_credentials.password ||
 967             !this._rfb_credentials.target) {
 968             this.dispatchEvent(new CustomEvent(
 969                 "credentialsrequired",
 970                 { detail: { types: ["username", "password", "target"] } }));
 971             return false;
 972         }
 973
 974         const xvp_auth_str = String.fromCharCode(this._rfb_credentials.username.length) +
 975                            String.fromCharCode(this._rfb_credentials.target.length) +
 976                            this._rfb_credentials.username +
 977                            this._rfb_credentials.target;
 978         this._sock.send_string(xvp_auth_str);
 979         this._rfb_auth_scheme = 2;
 980         return this._negotiate_authentication();
 981     },
 982
 983     _negotiate_std_vnc_auth: function () {
 984         if (this._sock.rQwait("auth challenge", 16)) { return false; }
 985
 986         if (!this._rfb_credentials.password) {
 987             this.dispatchEvent(new CustomEvent(
 988                 "credentialsrequired",
 989                 { detail: { types: ["password"] } }));
 990             return false;
 991         }
 992
 993         // TODO(directxman12): make genDES not require an Array
 994         const challenge = Array.prototype.slice.call(this._sock.rQshiftBytes(16));
 995         const response = RFB.genDES(this._rfb_credentials.password, challenge);
 996         this._sock.send(response);
 997         this._rfb_init_state = "SecurityResult";
 998         return true;
 999     },
1000
1001     _negotiate_tight_tunnels: function (numTunnels) {
1002         const clientSupportedTunnelTypes = {
1003             0: { vendor: 'TGHT', signature: 'NOTUNNEL' }
1004         };
1005         const serverSupportedTunnelTypes = {};
1006         // receive tunnel capabilities
1007         for (let i = 0; i < numTunnels; i++) {
1008             const cap_code = this._sock.rQshift32();
1009             const cap_vendor = this._sock.rQshiftStr(4);
1010             const cap_signature = this._sock.rQshiftStr(8);
1011             serverSupportedTunnelTypes[cap_code] = { vendor: cap_vendor, signature: cap_signature };
1012         }
1013
1014         Log.Debug("Server Tight tunnel types: " + serverSupportedTunnelTypes);
1015
1016         // Siemens touch panels have a VNC server that supports NOTUNNEL,
1017         // but forgets to advertise it. Try to detect such servers by
1018         // looking for their custom tunnel type.
1019         if (serverSupportedTunnelTypes[1] &&
1020             (serverSupportedTunnelTypes[1].vendor === "SICR") &&
1021             (serverSupportedTunnelTypes[1].signature === "SCHANNEL")) {
1022             Log.Debug("Detected Siemens server. Assuming NOTUNNEL support.");
1023             serverSupportedTunnelTypes[0] = { vendor: 'TGHT', signature: 'NOTUNNEL' };
1024         }
1025
1026         // choose the notunnel type
1027         if (serverSupportedTunnelTypes[0]) {
1028             if (serverSupportedTunnelTypes[0].vendor != clientSupportedTunnelTypes[0].vendor ||
1029                 serverSupportedTunnelTypes[0].signature != clientSupportedTunnelTypes[0].signature) {
1030                 return this._fail("Client's tunnel type had the incorrect " +
1031                                   "vendor or signature");
1032             }
1033             Log.Debug("Selected tunnel type: " + clientSupportedTunnelTypes[0]);
1034             this._sock.send([0, 0, 0, 0]);  // use NOTUNNEL
1035             return false; // wait until we receive the sub auth count to continue
1036         } else {
1037             return this._fail("Server wanted tunnels, but doesn't support " +
1038                               "the notunnel type");
1039         }
1040     },
1041
1042     _negotiate_tight_auth: function () {
1043         if (!this._rfb_tightvnc) {  // first pass, do the tunnel negotiation
1044             if (this._sock.rQwait("num tunnels", 4)) { return false; }
1045             const numTunnels = this._sock.rQshift32();
1046             if (numTunnels > 0 && this._sock.rQwait("tunnel capabilities", 16 * numTunnels, 4)) { return false; }
1047
1048             this._rfb_tightvnc = true;
1049
1050             if (numTunnels > 0) {
1051                 this._negotiate_tight_tunnels(numTunnels);
1052                 return false;  // wait until we receive the sub auth to continue
1053             }
1054         }
1055
1056         // second pass, do the sub-auth negotiation
1057         if (this._sock.rQwait("sub auth count", 4)) { return false; }
1058         const subAuthCount = this._sock.rQshift32();
1059         if (subAuthCount === 0) {  // empty sub-auth list received means 'no auth' subtype selected
1060             this._rfb_init_state = 'SecurityResult';
1061             return true;
1062         }
1063
1064         if (this._sock.rQwait("sub auth capabilities", 16 * subAuthCount, 4)) { return false; }
1065
1066         const clientSupportedTypes = {
1067             'STDVNOAUTH__': 1,
1068             'STDVVNCAUTH_': 2
1069         };
1070
1071         const serverSupportedTypes = [];
1072
1073         for (let i = 0; i < subAuthCount; i++) {
1074             this._sock.rQshift32(); // capNum
1075             const capabilities = this._sock.rQshiftStr(12);
1076             serverSupportedTypes.push(capabilities);
1077         }
1078
1079         Log.Debug("Server Tight authentication types: " + serverSupportedTypes);
1080
1081         for (let authType in clientSupportedTypes) {
1082             if (serverSupportedTypes.indexOf(authType) != -1) {
1083                 this._sock.send([0, 0, 0, clientSupportedTypes[authType]]);
1084                 Log.Debug("Selected authentication type: " + authType);
1085
1086                 switch (authType) {
1087                     case 'STDVNOAUTH__':  // no auth
1088                         this._rfb_init_state = 'SecurityResult';
1089                         return true;
1090                     case 'STDVVNCAUTH_': // VNC auth
1091                         this._rfb_auth_scheme = 2;
1092                         return this._init_msg();
1093                     default:
1094                         return this._fail("Unsupported tiny auth scheme " +
1095                                           "(scheme: " + authType + ")");
1096                 }
1097             }
1098         }
1099
1100         return this._fail("No supported sub-auth types!");
1101     },
1102
1103     _negotiate_authentication: function () {
1104         switch (this._rfb_auth_scheme) {
1105             case 0:  // connection failed
1106                 return this._handle_security_failure("authentication scheme");
1107
1108             case 1:  // no auth
1109                 if (this._rfb_version >= 3.8) {
1110                     this._rfb_init_state = 'SecurityResult';
1111                     return true;
1112                 }
1113                 this._rfb_init_state = 'ClientInitialisation';
1114                 return this._init_msg();
1115
1116             case 22:  // XVP auth
1117                 return this._negotiate_xvp_auth();
1118
1119             case 2:  // VNC authentication
1120                 return this._negotiate_std_vnc_auth();
1121
1122             case 16:  // TightVNC Security Type
1123                 return this._negotiate_tight_auth();
1124
1125             default:
1126                 return this._fail("Unsupported auth scheme (scheme: " +
1127                                   this._rfb_auth_scheme + ")");
1128         }
1129     },
1130
1131     _handle_security_result: function () {
1132         if (this._sock.rQwait('VNC auth response ', 4)) { return false; }
1133
1134         const status = this._sock.rQshift32();
1135
1136         if (status === 0) { // OK
1137             this._rfb_init_state = 'ClientInitialisation';
1138             Log.Debug('Authentication OK');
1139             return this._init_msg();
1140         } else {
1141             if (this._rfb_version >= 3.8) {
1142                 return this._handle_security_failure("security result", status);
1143             } else {
1144                 this.dispatchEvent(new CustomEvent(
1145                     "securityfailure",
1146                     { detail: { status: status } }));
1147
1148                 return this._fail("Security handshake failed");
1149             }
1150         }
1151     },
1152
1153     _negotiate_server_init: function () {
1154         if (this._sock.rQwait("server initialization", 24)) { return false; }
1155
1156         /* Screen size */
1157         const width = this._sock.rQshift16();
1158         const height = this._sock.rQshift16();
1159
1160         /* PIXEL_FORMAT */
1161         const bpp         = this._sock.rQshift8();
1162         const depth       = this._sock.rQshift8();
1163         const big_endian  = this._sock.rQshift8();
1164         const true_color  = this._sock.rQshift8();
1165
1166         const red_max     = this._sock.rQshift16();
1167         const green_max   = this._sock.rQshift16();
1168         const blue_max    = this._sock.rQshift16();
1169         const red_shift   = this._sock.rQshift8();
1170         const green_shift = this._sock.rQshift8();
1171         const blue_shift  = this._sock.rQshift8();
1172         this._sock.rQskipBytes(3);  // padding
1173
1174         // NB(directxman12): we don't want to call any callbacks or print messages until
1175         //                   *after* we're past the point where we could backtrack
1176
1177         /* Connection name/title */
1178         const name_length = this._sock.rQshift32();
1179         if (this._sock.rQwait('server init name', name_length, 24)) { return false; }
1180         this._fb_name = decodeUTF8(this._sock.rQshiftStr(name_length));
1181
1182         if (this._rfb_tightvnc) {
1183             if (this._sock.rQwait('TightVNC extended server init header', 8, 24 + name_length)) { return false; }
1184             // In TightVNC mode, ServerInit message is extended
1185             const numServerMessages = this._sock.rQshift16();
1186             const numClientMessages = this._sock.rQshift16();
1187             const numEncodings = this._sock.rQshift16();
1188             this._sock.rQskipBytes(2);  // padding
1189
1190             const totalMessagesLength = (numServerMessages + numClientMessages + numEncodings) * 16;
1191             if (this._sock.rQwait('TightVNC extended server init header', totalMessagesLength, 32 + name_length)) { return false; }
1192
1193             // we don't actually do anything with the capability information that TIGHT sends,
1194             // so we just skip the all of this.
1195
1196             // TIGHT server message capabilities
1197             this._sock.rQskipBytes(16 * numServerMessages);
1198
1199             // TIGHT client message capabilities
1200             this._sock.rQskipBytes(16 * numClientMessages);
1201
1202             // TIGHT encoding capabilities
1203             this._sock.rQskipBytes(16 * numEncodings);
1204         }
1205
1206         // NB(directxman12): these are down here so that we don't run them multiple times
1207         //                   if we backtrack
1208         Log.Info("Screen: " + width + "x" + height +
1209                   ", bpp: " + bpp + ", depth: " + depth +
1210                   ", big_endian: " + big_endian +
1211                   ", true_color: " + true_color +
1212                   ", red_max: " + red_max +
1213                   ", green_max: " + green_max +
1214                   ", blue_max: " + blue_max +
1215                   ", red_shift: " + red_shift +
1216                   ", green_shift: " + green_shift +
1217                   ", blue_shift: " + blue_shift);
1218
1219         if (big_endian !== 0) {
1220             Log.Warn("Server native endian is not little endian");
1221         }
1222
1223         if (red_shift !== 16) {
1224             Log.Warn("Server native red-shift is not 16");
1225         }
1226
1227         if (blue_shift !== 0) {
1228             Log.Warn("Server native blue-shift is not 0");
1229         }
1230
1231         // we're past the point where we could backtrack, so it's safe to call this
1232         this.dispatchEvent(new CustomEvent(
1233             "desktopname",
1234             { detail: { name: this._fb_name } }));
1235
1236         this._resize(width, height);
1237
1238         if (!this._viewOnly) { this._keyboard.grab(); }
1239         if (!this._viewOnly) { this._mouse.grab(); }
1240
1241         this._fb_depth = 24;
1242
1243         if (this._fb_name === "Intel(r) AMT KVM") {
1244             Log.Warn("Intel AMT KVM only supports 8/16 bit depths. Using low color mode.");
1245             this._fb_depth = 8;
1246         }
1247
1248         RFB.messages.pixelFormat(this._sock, this._fb_depth, true);
1249         this._sendEncodings();
1250         RFB.messages.fbUpdateRequest(this._sock, false, 0, 0, this._fb_width, this._fb_height);
1251
1252         this._timing.fbu_rt_start = (new Date()).getTime();
1253         this._timing.pixels = 0;
1254
1255         this._updateConnectionState('connected');
1256         return true;
1257     },
1258
1259     _sendEncodings: function () {
1260         const encs = [];
1261
1262         // In preference order
1263         encs.push(encodings.encodingCopyRect);
1264         // Only supported with full depth support
1265         if (this._fb_depth == 24) {
1266             encs.push(encodings.encodingTight);
1267             encs.push(encodings.encodingTightPNG);
1268             encs.push(encodings.encodingHextile);
1269             encs.push(encodings.encodingRRE);
1270         }
1271         encs.push(encodings.encodingRaw);
1272
1273         // Psuedo-encoding settings
1274         encs.push(encodings.pseudoEncodingQualityLevel0 + 6);
1275         encs.push(encodings.pseudoEncodingCompressLevel0 + 2);
1276
1277         encs.push(encodings.pseudoEncodingDesktopSize);
1278         encs.push(encodings.pseudoEncodingLastRect);
1279         encs.push(encodings.pseudoEncodingQEMUExtendedKeyEvent);
1280         encs.push(encodings.pseudoEncodingExtendedDesktopSize);
1281         encs.push(encodings.pseudoEncodingXvp);
1282         encs.push(encodings.pseudoEncodingFence);
1283         encs.push(encodings.pseudoEncodingContinuousUpdates);
1284
1285         if (this._fb_depth == 24) {
1286             encs.push(encodings.pseudoEncodingCursor);
1287         }
1288
1289         RFB.messages.clientEncodings(this._sock, encs);
1290     },
1291
1292     /* RFB protocol initialization states:
1293      *   ProtocolVersion
1294      *   Security
1295      *   Authentication
1296      *   SecurityResult
1297      *   ClientInitialization - not triggered by server message
1298      *   ServerInitialization
1299      */
1300     _init_msg: function () {
1301         switch (this._rfb_init_state) {
1302             case 'ProtocolVersion':
1303                 return this._negotiate_protocol_version();
1304
1305             case 'Security':
1306                 return this._negotiate_security();
1307
1308             case 'Authentication':
1309                 return this._negotiate_authentication();
1310
1311             case 'SecurityResult':
1312                 return this._handle_security_result();
1313
1314             case 'ClientInitialisation':
1315                 this._sock.send([this._shared ? 1 : 0]); // ClientInitialisation
1316                 this._rfb_init_state = 'ServerInitialisation';
1317                 return true;
1318
1319             case 'ServerInitialisation':
1320                 return this._negotiate_server_init();
1321
1322             default:
1323                 return this._fail("Unknown init state (state: " +
1324                                   this._rfb_init_state + ")");
1325         }
1326     },
1327
1328     _handle_set_colour_map_msg: function () {
1329         Log.Debug("SetColorMapEntries");
1330
1331         return this._fail("Unexpected SetColorMapEntries message");
1332     },
1333
1334     _handle_server_cut_text: function () {
1335         Log.Debug("ServerCutText");
1336
1337         if (this._sock.rQwait("ServerCutText header", 7, 1)) { return false; }
1338         this._sock.rQskipBytes(3);  // Padding
1339         const length = this._sock.rQshift32();
1340         if (this._sock.rQwait("ServerCutText", length, 8)) { return false; }
1341
1342         const text = this._sock.rQshiftStr(length);
1343
1344         if (this._viewOnly) { return true; }
1345
1346         this.dispatchEvent(new CustomEvent(
1347             "clipboard",
1348             { detail: { text: text } }));
1349
1350         return true;
1351     },
1352
1353     _handle_server_fence_msg: function() {
1354         if (this._sock.rQwait("ServerFence header", 8, 1)) { return false; }
1355         this._sock.rQskipBytes(3); // Padding
1356         let flags = this._sock.rQshift32();
1357         let length = this._sock.rQshift8();
1358
1359         if (this._sock.rQwait("ServerFence payload", length, 9)) { return false; }
1360
1361         if (length > 64) {
1362             Log.Warn("Bad payload length (" + length + ") in fence response");
1363             length = 64;
1364         }
1365
1366         const payload = this._sock.rQshiftStr(length);
1367
1368         this._supportsFence = true;
1369
1370         /*
1371          * Fence flags
1372          *
1373          *  (1<<0)  - BlockBefore
1374          *  (1<<1)  - BlockAfter
1375          *  (1<<2)  - SyncNext
1376          *  (1<<31) - Request
1377          */
1378
1379         if (!(flags & (1<<31))) {
1380             return this._fail("Unexpected fence response");
1381         }
1382
1383         // Filter out unsupported flags
1384         // FIXME: support syncNext
1385         flags &= (1<<0) | (1<<1);
1386
1387         // BlockBefore and BlockAfter are automatically handled by
1388         // the fact that we process each incoming message
1389         // synchronuosly.
1390         RFB.messages.clientFence(this._sock, flags, payload);
1391
1392         return true;
1393     },
1394
1395     _handle_xvp_msg: function () {
1396         if (this._sock.rQwait("XVP version and message", 3, 1)) { return false; }
1397         this._sock.rQskip8();  // Padding
1398         const xvp_ver = this._sock.rQshift8();
1399         const xvp_msg = this._sock.rQshift8();
1400
1401         switch (xvp_msg) {
1402             case 0:  // XVP_FAIL
1403                 Log.Error("XVP Operation Failed");
1404                 break;
1405             case 1:  // XVP_INIT
1406                 this._rfb_xvp_ver = xvp_ver;
1407                 Log.Info("XVP extensions enabled (version " + this._rfb_xvp_ver + ")");
1408                 this._setCapability("power", true);
1409                 break;
1410             default:
1411                 this._fail("Illegal server XVP message (msg: " + xvp_msg + ")");
1412                 break;
1413         }
1414
1415         return true;
1416     },
1417
1418     _normal_msg: function () {
1419         let msg_type;
1420         if (this._FBU.rects > 0) {
1421             msg_type = 0;
1422         } else {
1423             msg_type = this._sock.rQshift8();
1424         }
1425
1426         let first, ret;
1427         switch (msg_type) {
1428             case 0:  // FramebufferUpdate
1429                 ret = this._framebufferUpdate();
1430                 if (ret && !this._enabledContinuousUpdates) {
1431                     RFB.messages.fbUpdateRequest(this._sock, true, 0, 0,
1432                                                  this._fb_width, this._fb_height);
1433                 }
1434                 return ret;
1435
1436             case 1:  // SetColorMapEntries
1437                 return this._handle_set_colour_map_msg();
1438
1439             case 2:  // Bell
1440                 Log.Debug("Bell");
1441                 this.dispatchEvent(new CustomEvent(
1442                     "bell",
1443                     { detail: {} }));
1444                 return true;
1445
1446             case 3:  // ServerCutText
1447                 return this._handle_server_cut_text();
1448
1449             case 150: // EndOfContinuousUpdates
1450                 first = !this._supportsContinuousUpdates;
1451                 this._supportsContinuousUpdates = true;
1452                 this._enabledContinuousUpdates = false;
1453                 if (first) {
1454                     this._enabledContinuousUpdates = true;
1455                     this._updateContinuousUpdates();
1456                     Log.Info("Enabling continuous updates.");
1457                 } else {
1458                     // FIXME: We need to send a framebufferupdaterequest here
1459                     // if we add support for turning off continuous updates
1460                 }
1461                 return true;
1462
1463             case 248: // ServerFence
1464                 return this._handle_server_fence_msg();
1465
1466             case 250:  // XVP
1467                 return this._handle_xvp_msg();
1468
1469             default:
1470                 this._fail("Unexpected server message (type " + msg_type + ")");
1471                 Log.Debug("sock.rQslice(0, 30): " + this._sock.rQslice(0, 30));
1472                 return true;
1473         }
1474     },
1475
1476     _onFlush: function() {
1477         this._flushing = false;
1478         // Resume processing
1479         if (this._sock.rQlen() > 0) {
1480             this._handle_message();
1481         }
1482     },
1483
1484     _framebufferUpdate: function () {
1485         if (this._FBU.rects === 0) {
1486             if (this._sock.rQwait("FBU header", 3, 1)) { return false; }
1487             this._sock.rQskip8();  // Padding
1488             this._FBU.rects = this._sock.rQshift16();
1489             this._FBU.bytes = 0;
1490             this._timing.cur_fbu = 0;
1491             if (this._timing.fbu_rt_start > 0) {
1492                 const now = (new Date()).getTime();
1493                 Log.Info("First FBU latency: " + (now - this._timing.fbu_rt_start));
1494             }
1495
1496             // Make sure the previous frame is fully rendered first
1497             // to avoid building up an excessive queue
1498             if (this._display.pending()) {
1499                 this._flushing = true;
1500                 this._display.flush();
1501                 return false;
1502             }
1503         }
1504
1505         while (this._FBU.rects > 0) {
1506             if (this._rfb_connection_state !== 'connected') { return false; }
1507
1508             if (this._sock.rQwait("FBU", this._FBU.bytes)) { return false; }
1509             if (this._FBU.bytes === 0) {
1510                 if (this._sock.rQwait("rect header", 12)) { return false; }
1511                 /* New FramebufferUpdate */
1512
1513                 const hdr = this._sock.rQshiftBytes(12);
1514                 this._FBU.x        = (hdr[0] << 8) + hdr[1];
1515                 this._FBU.y        = (hdr[2] << 8) + hdr[3];
1516                 this._FBU.width    = (hdr[4] << 8) + hdr[5];
1517                 this._FBU.height   = (hdr[6] << 8) + hdr[7];
1518                 this._FBU.encoding = parseInt((hdr[8] << 24) + (hdr[9] << 16) +
1519                                               (hdr[10] << 8) + hdr[11], 10);
1520
1521                 if (!this._encHandlers[this._FBU.encoding]) {
1522                     this._fail("Unsupported encoding (encoding: " +
1523                                this._FBU.encoding + ")");
1524                     return false;
1525                 }
1526             }
1527
1528             this._timing.last_fbu = (new Date()).getTime();
1529
1530             const ret = this._encHandlers[this._FBU.encoding]();
1531
1532             const now = (new Date()).getTime();
1533             this._timing.cur_fbu += (now - this._timing.last_fbu);
1534
1535             if (ret) {
1536                 if (!(this._FBU.encoding in this._encStats)) {
1537                     this._encStats[this._FBU.encoding] = [0, 0];
1538                 }
1539                 this._encStats[this._FBU.encoding][0]++;
1540                 this._encStats[this._FBU.encoding][1]++;
1541                 this._timing.pixels += this._FBU.width * this._FBU.height;
1542             }
1543
1544             if (this._timing.pixels >= (this._fb_width * this._fb_height)) {
1545                 if ((this._FBU.width === this._fb_width && this._FBU.height === this._fb_height) ||
1546                     this._timing.fbu_rt_start > 0) {
1547                     this._timing.full_fbu_total += this._timing.cur_fbu;
1548                     this._timing.full_fbu_cnt++;
1549                     Log.Info("Timing of full FBU, curr: " +
1550                               this._timing.cur_fbu + ", total: " +
1551                               this._timing.full_fbu_total + ", cnt: " +
1552                               this._timing.full_fbu_cnt + ", avg: " +
1553                               (this._timing.full_fbu_total / this._timing.full_fbu_cnt));
1554                 }
1555
1556                 if (this._timing.fbu_rt_start > 0) {
1557                     const fbu_rt_diff = now - this._timing.fbu_rt_start;
1558                     this._timing.fbu_rt_total += fbu_rt_diff;
1559                     this._timing.fbu_rt_cnt++;
1560                     Log.Info("full FBU round-trip, cur: " +
1561                               fbu_rt_diff + ", total: " +
1562                               this._timing.fbu_rt_total + ", cnt: " +
1563                               this._timing.fbu_rt_cnt + ", avg: " +
1564                               (this._timing.fbu_rt_total / this._timing.fbu_rt_cnt));
1565                     this._timing.fbu_rt_start = 0;
1566                 }
1567             }
1568
1569             if (!ret) { return ret; }  // need more data
1570         }
1571
1572         this._display.flip();
1573
1574         return true;  // We finished this FBU
1575     },
1576
1577     _updateContinuousUpdates: function() {
1578         if (!this._enabledContinuousUpdates) { return; }
1579
1580         RFB.messages.enableContinuousUpdates(this._sock, true, 0, 0,
1581                                              this._fb_width, this._fb_height);
1582     },
1583
1584     _resize: function(width, height) {
1585         this._fb_width = width;
1586         this._fb_height = height;
1587
1588         this._destBuff = new Uint8Array(this._fb_width * this._fb_height * 4);
1589
1590         this._display.resize(this._fb_width, this._fb_height);
1591
1592         // Adjust the visible viewport based on the new dimensions
1593         this._updateClip();
1594         this._updateScale();
1595
1596         this._timing.fbu_rt_start = (new Date()).getTime();
1597         this._updateContinuousUpdates();
1598     },
1599
1600     _xvpOp: function (ver, op) {
1601         if (this._rfb_xvp_ver < ver) { return; }
1602         Log.Info("Sending XVP operation " + op + " (version " + ver + ")");
1603         RFB.messages.xvpOp(this._sock, ver, op);
1604     },
1605 };
1606
1607 Object.assign(RFB.prototype, EventTargetMixin);
1608
1609 // Class Methods
1610 RFB.messages = {
1611     keyEvent: function (sock, keysym, down) {
1612         const buff = sock._sQ;
1613         const offset = sock._sQlen;
1614
1615         buff[offset] = 4;  // msg-type
1616         buff[offset + 1] = down;
1617
1618         buff[offset + 2] = 0;
1619         buff[offset + 3] = 0;
1620
1621         buff[offset + 4] = (keysym >> 24);
1622         buff[offset + 5] = (keysym >> 16);
1623         buff[offset + 6] = (keysym >> 8);
1624         buff[offset + 7] = keysym;
1625
1626         sock._sQlen += 8;
1627         sock.flush();
1628     },
1629
1630     QEMUExtendedKeyEvent: function (sock, keysym, down, keycode) {
1631         function getRFBkeycode(xt_scancode) {
1632             const upperByte = (keycode >> 8);
1633             const lowerByte = (keycode & 0x00ff);
1634             if (upperByte === 0xe0 && lowerByte < 0x7f) {
1635                 return lowerByte | 0x80;
1636             }
1637             return xt_scancode;
1638         }
1639
1640         const buff = sock._sQ;
1641         const offset = sock._sQlen;
1642
1643         buff[offset] = 255; // msg-type
1644         buff[offset + 1] = 0; // sub msg-type
1645
1646         buff[offset + 2] = (down >> 8);
1647         buff[offset + 3] = down;
1648
1649         buff[offset + 4] = (keysym >> 24);
1650         buff[offset + 5] = (keysym >> 16);
1651         buff[offset + 6] = (keysym >> 8);
1652         buff[offset + 7] = keysym;
1653
1654         const RFBkeycode = getRFBkeycode(keycode);
1655
1656         buff[offset + 8] = (RFBkeycode >> 24);
1657         buff[offset + 9] = (RFBkeycode >> 16);
1658         buff[offset + 10] = (RFBkeycode >> 8);
1659         buff[offset + 11] = RFBkeycode;
1660
1661         sock._sQlen += 12;
1662         sock.flush();
1663     },
1664
1665     pointerEvent: function (sock, x, y, mask) {
1666         const buff = sock._sQ;
1667         const offset = sock._sQlen;
1668
1669         buff[offset] = 5; // msg-type
1670
1671         buff[offset + 1] = mask;
1672
1673         buff[offset + 2] = x >> 8;
1674         buff[offset + 3] = x;
1675
1676         buff[offset + 4] = y >> 8;
1677         buff[offset + 5] = y;
1678
1679         sock._sQlen += 6;
1680         sock.flush();
1681     },
1682
1683     // TODO(directxman12): make this unicode compatible?
1684     clientCutText: function (sock, text) {
1685         const buff = sock._sQ;
1686         const offset = sock._sQlen;
1687
1688         buff[offset] = 6; // msg-type
1689
1690         buff[offset + 1] = 0; // padding
1691         buff[offset + 2] = 0; // padding
1692         buff[offset + 3] = 0; // padding
1693
1694         const length = text.length;
1695
1696         buff[offset + 4] = length >> 24;
1697         buff[offset + 5] = length >> 16;
1698         buff[offset + 6] = length >> 8;
1699         buff[offset + 7] = length;
1700
1701         sock._sQlen += 8;
1702
1703         // We have to keep track of from where in the text we begin creating the
1704         // buffer for the flush in the next iteration.
1705         let textOffset = 0;
1706
1707         let remaining = length;
1708         while (remaining > 0) {
1709
1710             const flushSize = Math.min(remaining, (sock._sQbufferSize - sock._sQlen));
1711             if (flushSize <= 0) {
1712                 this._fail("Clipboard contents could not be sent");
1713                 break;
1714             }
1715
1716             for (let i = 0; i < flushSize; i++) {
1717                 buff[sock._sQlen + i] =  text.charCodeAt(textOffset + i);
1718             }
1719
1720             sock._sQlen += flushSize;
1721             sock.flush();
1722
1723             remaining -= flushSize;
1724             textOffset += flushSize;
1725         }
1726     },
1727
1728     setDesktopSize: function (sock, width, height, id, flags) {
1729         const buff = sock._sQ;
1730         const offset = sock._sQlen;
1731
1732         buff[offset] = 251;              // msg-type
1733         buff[offset + 1] = 0;            // padding
1734         buff[offset + 2] = width >> 8;   // width
1735         buff[offset + 3] = width;
1736         buff[offset + 4] = height >> 8;  // height
1737         buff[offset + 5] = height;
1738
1739         buff[offset + 6] = 1;            // number-of-screens
1740         buff[offset + 7] = 0;            // padding
1741
1742         // screen array
1743         buff[offset + 8] = id >> 24;     // id
1744         buff[offset + 9] = id >> 16;
1745         buff[offset + 10] = id >> 8;
1746         buff[offset + 11] = id;
1747         buff[offset + 12] = 0;           // x-position
1748         buff[offset + 13] = 0;
1749         buff[offset + 14] = 0;           // y-position
1750         buff[offset + 15] = 0;
1751         buff[offset + 16] = width >> 8;  // width
1752         buff[offset + 17] = width;
1753         buff[offset + 18] = height >> 8; // height
1754         buff[offset + 19] = height;
1755         buff[offset + 20] = flags >> 24; // flags
1756         buff[offset + 21] = flags >> 16;
1757         buff[offset + 22] = flags >> 8;
1758         buff[offset + 23] = flags;
1759
1760         sock._sQlen += 24;
1761         sock.flush();
1762     },
1763
1764     clientFence: function (sock, flags, payload) {
1765         const buff = sock._sQ;
1766         const offset = sock._sQlen;
1767
1768         buff[offset] = 248; // msg-type
1769
1770         buff[offset + 1] = 0; // padding
1771         buff[offset + 2] = 0; // padding
1772         buff[offset + 3] = 0; // padding
1773
1774         buff[offset + 4] = flags >> 24; // flags
1775         buff[offset + 5] = flags >> 16;
1776         buff[offset + 6] = flags >> 8;
1777         buff[offset + 7] = flags;
1778
1779         const n = payload.length;
1780
1781         buff[offset + 8] = n; // length
1782
1783         for (let i = 0; i < n; i++) {
1784             buff[offset + 9 + i] = payload.charCodeAt(i);
1785         }
1786
1787         sock._sQlen += 9 + n;
1788         sock.flush();
1789     },
1790
1791     enableContinuousUpdates: function (sock, enable, x, y, width, height) {
1792         const buff = sock._sQ;
1793         const offset = sock._sQlen;
1794
1795         buff[offset] = 150;             // msg-type
1796         buff[offset + 1] = enable;      // enable-flag
1797
1798         buff[offset + 2] = x >> 8;      // x
1799         buff[offset + 3] = x;
1800         buff[offset + 4] = y >> 8;      // y
1801         buff[offset + 5] = y;
1802         buff[offset + 6] = width >> 8;  // width
1803         buff[offset + 7] = width;
1804         buff[offset + 8] = height >> 8; // height
1805         buff[offset + 9] = height;
1806
1807         sock._sQlen += 10;
1808         sock.flush();
1809     },
1810
1811     pixelFormat: function (sock, depth, true_color) {
1812         const buff = sock._sQ;
1813         const offset = sock._sQlen;
1814
1815         let bpp;
1816
1817         if (depth > 16) {
1818             bpp = 32;
1819         } else if (depth > 8) {
1820             bpp = 16;
1821         } else {
1822             bpp = 8;
1823         }
1824
1825         const bits = Math.floor(depth/3);
1826
1827         buff[offset] = 0;  // msg-type
1828
1829         buff[offset + 1] = 0; // padding
1830         buff[offset + 2] = 0; // padding
1831         buff[offset + 3] = 0; // padding
1832
1833         buff[offset + 4] = bpp;                 // bits-per-pixel
1834         buff[offset + 5] = depth;               // depth
1835         buff[offset + 6] = 0;                   // little-endian
1836         buff[offset + 7] = true_color ? 1 : 0;  // true-color
1837
1838         buff[offset + 8] = 0;    // red-max
1839         buff[offset + 9] = (1 << bits) - 1;  // red-max
1840
1841         buff[offset + 10] = 0;   // green-max
1842         buff[offset + 11] = (1 << bits) - 1; // green-max
1843
1844         buff[offset + 12] = 0;   // blue-max
1845         buff[offset + 13] = (1 << bits) - 1; // blue-max
1846
1847         buff[offset + 14] = bits * 2; // red-shift
1848         buff[offset + 15] = bits * 1; // green-shift
1849         buff[offset + 16] = bits * 0; // blue-shift
1850
1851         buff[offset + 17] = 0;   // padding
1852         buff[offset + 18] = 0;   // padding
1853         buff[offset + 19] = 0;   // padding
1854
1855         sock._sQlen += 20;
1856         sock.flush();
1857     },
1858
1859     clientEncodings: function (sock, encodings) {
1860         const buff = sock._sQ;
1861         const offset = sock._sQlen;
1862
1863         buff[offset] = 2; // msg-type
1864         buff[offset + 1] = 0; // padding
1865
1866         buff[offset + 2] = encodings.length >> 8;
1867         buff[offset + 3] = encodings.length;
1868
1869         let j = offset + 4;
1870         for (let i = 0; i < encodings.length; i++) {
1871             const enc = encodings[i];
1872             buff[j] = enc >> 24;
1873             buff[j + 1] = enc >> 16;
1874             buff[j + 2] = enc >> 8;
1875             buff[j + 3] = enc;
1876
1877             j += 4;
1878         }
1879
1880         sock._sQlen += j - offset;
1881         sock.flush();
1882     },
1883
1884     fbUpdateRequest: function (sock, incremental, x, y, w, h) {
1885         const buff = sock._sQ;
1886         const offset = sock._sQlen;
1887
1888         if (typeof(x) === "undefined") { x = 0; }
1889         if (typeof(y) === "undefined") { y = 0; }
1890
1891         buff[offset] = 3;  // msg-type
1892         buff[offset + 1] = incremental ? 1 : 0;
1893
1894         buff[offset + 2] = (x >> 8) & 0xFF;
1895         buff[offset + 3] = x & 0xFF;
1896
1897         buff[offset + 4] = (y >> 8) & 0xFF;
1898         buff[offset + 5] = y & 0xFF;
1899
1900         buff[offset + 6] = (w >> 8) & 0xFF;
1901         buff[offset + 7] = w & 0xFF;
1902
1903         buff[offset + 8] = (h >> 8) & 0xFF;
1904         buff[offset + 9] = h & 0xFF;
1905
1906         sock._sQlen += 10;
1907         sock.flush();
1908     },
1909
1910     xvpOp: function (sock, ver, op) {
1911         const buff = sock._sQ;
1912         const offset = sock._sQlen;
1913
1914         buff[offset] = 250; // msg-type
1915         buff[offset + 1] = 0; // padding
1916
1917         buff[offset + 2] = ver;
1918         buff[offset + 3] = op;
1919
1920         sock._sQlen += 4;
1921         sock.flush();
1922     },
1923 };
1924
1925 RFB.genDES = function (password, challenge) {
1926     const passwd = [];
1927     for (let i = 0; i < password.length; i++) {
1928         passwd.push(password.charCodeAt(i));
1929     }
1930     return (new DES(passwd)).encrypt(challenge);
1931 };
1932
1933 RFB.encodingHandlers = {
1934     RAW: function () {
1935         if (this._FBU.lines === 0) {
1936             this._FBU.lines = this._FBU.height;
1937         }
1938
1939         const pixelSize = this._fb_depth == 8 ? 1 : 4;
1940         this._FBU.bytes = this._FBU.width * pixelSize;  // at least a line
1941         if (this._sock.rQwait("RAW", this._FBU.bytes)) { return false; }
1942         const cur_y = this._FBU.y + (this._FBU.height - this._FBU.lines);
1943         const curr_height = Math.min(this._FBU.lines,
1944                                    Math.floor(this._sock.rQlen() / (this._FBU.width * pixelSize)));
1945         let data = this._sock.get_rQ();
1946         let index = this._sock.get_rQi();
1947         if (this._fb_depth == 8) {
1948             const pixels = this._FBU.width * curr_height
1949             const newdata = new Uint8Array(pixels * 4);
1950             for (let i = 0; i < pixels; i++) {
1951                 newdata[i * 4 + 0] = ((data[index + i] >> 0) & 0x3) * 255 / 3;
1952                 newdata[i * 4 + 1] = ((data[index + i] >> 2) & 0x3) * 255 / 3;
1953                 newdata[i * 4 + 2] = ((data[index + i] >> 4) & 0x3) * 255 / 3;
1954                 newdata[i * 4 + 4] = 0;
1955             }
1956             data = newdata;
1957             index = 0;
1958         }
1959         this._display.blitImage(this._FBU.x, cur_y, this._FBU.width,
1960                                 curr_height, data, index);
1961         this._sock.rQskipBytes(this._FBU.width * curr_height * pixelSize);
1962         this._FBU.lines -= curr_height;
1963
1964         if (this._FBU.lines > 0) {
1965             this._FBU.bytes = this._FBU.width * pixelSize;  // At least another line
1966         } else {
1967             this._FBU.rects--;
1968             this._FBU.bytes = 0;
1969         }
1970
1971         return true;
1972     },
1973
1974     COPYRECT: function () {
1975         this._FBU.bytes = 4;
1976         if (this._sock.rQwait("COPYRECT", 4)) { return false; }
1977         this._display.copyImage(this._sock.rQshift16(), this._sock.rQshift16(),
1978                                 this._FBU.x, this._FBU.y, this._FBU.width,
1979                                 this._FBU.height);
1980
1981         this._FBU.rects--;
1982         this._FBU.bytes = 0;
1983         return true;
1984     },
1985
1986     RRE: function () {
1987         let color;
1988         if (this._FBU.subrects === 0) {
1989             this._FBU.bytes = 4 + 4;
1990             if (this._sock.rQwait("RRE", 4 + 4)) { return false; }
1991             this._FBU.subrects = this._sock.rQshift32();
1992             color = this._sock.rQshiftBytes(4);  // Background
1993             this._display.fillRect(this._FBU.x, this._FBU.y, this._FBU.width, this._FBU.height, color);
1994         }
1995
1996         while (this._FBU.subrects > 0 && this._sock.rQlen() >= (4 + 8)) {
1997             color = this._sock.rQshiftBytes(4);
1998             const x = this._sock.rQshift16();
1999             const y = this._sock.rQshift16();
2000             const width = this._sock.rQshift16();
2001             const height = this._sock.rQshift16();
2002             this._display.fillRect(this._FBU.x + x, this._FBU.y + y, width, height, color);
2003             this._FBU.subrects--;
2004         }
2005
2006         if (this._FBU.subrects > 0) {
2007             const chunk = Math.min(this._rre_chunk_sz, this._FBU.subrects);
2008             this._FBU.bytes = (4 + 8) * chunk;
2009         } else {
2010             this._FBU.rects--;
2011             this._FBU.bytes = 0;
2012         }
2013
2014         return true;
2015     },
2016
2017     HEXTILE: function () {
2018         const rQ = this._sock.get_rQ();
2019         let rQi = this._sock.get_rQi();
2020
2021         if (this._FBU.tiles === 0) {
2022             this._FBU.tiles_x = Math.ceil(this._FBU.width / 16);
2023             this._FBU.tiles_y = Math.ceil(this._FBU.height / 16);
2024             this._FBU.total_tiles = this._FBU.tiles_x * this._FBU.tiles_y;
2025             this._FBU.tiles = this._FBU.total_tiles;
2026         }
2027
2028         while (this._FBU.tiles > 0) {
2029             this._FBU.bytes = 1;
2030             if (this._sock.rQwait("HEXTILE subencoding", this._FBU.bytes)) { return false; }
2031             const subencoding = rQ[rQi];  // Peek
2032             if (subencoding > 30) {  // Raw
2033                 this._fail("Illegal hextile subencoding (subencoding: " +
2034                            subencoding + ")");
2035                 return false;
2036             }
2037
2038             let subrects = 0;
2039             const curr_tile = this._FBU.total_tiles - this._FBU.tiles;
2040             const tile_x = curr_tile % this._FBU.tiles_x;
2041             const tile_y = Math.floor(curr_tile / this._FBU.tiles_x);
2042             const x = this._FBU.x + tile_x * 16;
2043             const y = this._FBU.y + tile_y * 16;
2044             const w = Math.min(16, (this._FBU.x + this._FBU.width) - x);
2045             const h = Math.min(16, (this._FBU.y + this._FBU.height) - y);
2046
2047             // Figure out how much we are expecting
2048             if (subencoding & 0x01) {  // Raw
2049                 this._FBU.bytes += w * h * 4;
2050             } else {
2051                 if (subencoding & 0x02) {  // Background
2052                     this._FBU.bytes += 4;
2053                 }
2054                 if (subencoding & 0x04) {  // Foreground
2055                     this._FBU.bytes += 4;
2056                 }
2057                 if (subencoding & 0x08) {  // AnySubrects
2058                     this._FBU.bytes++;  // Since we aren't shifting it off
2059                     if (this._sock.rQwait("hextile subrects header", this._FBU.bytes)) { return false; }
2060                     subrects = rQ[rQi + this._FBU.bytes - 1];  // Peek
2061                     if (subencoding & 0x10) {  // SubrectsColoured
2062                         this._FBU.bytes += subrects * (4 + 2);
2063                     } else {
2064                         this._FBU.bytes += subrects * 2;
2065                     }
2066                 }
2067             }
2068
2069             if (this._sock.rQwait("hextile", this._FBU.bytes)) { return false; }
2070
2071             // We know the encoding and have a whole tile
2072             this._FBU.subencoding = rQ[rQi];
2073             rQi++;
2074             if (this._FBU.subencoding === 0) {
2075                 if (this._FBU.lastsubencoding & 0x01) {
2076                     // Weird: ignore blanks are RAW
2077                     Log.Debug("     Ignoring blank after RAW");
2078                 } else {
2079                     this._display.fillRect(x, y, w, h, this._FBU.background);
2080                 }
2081             } else if (this._FBU.subencoding & 0x01) {  // Raw
2082                 this._display.blitImage(x, y, w, h, rQ, rQi);
2083                 rQi += this._FBU.bytes - 1;
2084             } else {
2085                 if (this._FBU.subencoding & 0x02) {  // Background
2086                     this._FBU.background = [rQ[rQi], rQ[rQi + 1], rQ[rQi + 2], rQ[rQi + 3]];
2087                     rQi += 4;
2088                 }
2089                 if (this._FBU.subencoding & 0x04) {  // Foreground
2090                     this._FBU.foreground = [rQ[rQi], rQ[rQi + 1], rQ[rQi + 2], rQ[rQi + 3]];
2091                     rQi += 4;
2092                 }
2093
2094                 this._display.startTile(x, y, w, h, this._FBU.background);
2095                 if (this._FBU.subencoding & 0x08) {  // AnySubrects
2096                     subrects = rQ[rQi];
2097                     rQi++;
2098
2099                     for (let s = 0; s < subrects; s++) {
2100                         let color;
2101                         if (this._FBU.subencoding & 0x10) {  // SubrectsColoured
2102                             color = [rQ[rQi], rQ[rQi + 1], rQ[rQi + 2], rQ[rQi + 3]];
2103                             rQi += 4;
2104                         } else {
2105                             color = this._FBU.foreground;
2106                         }
2107                         const xy = rQ[rQi];
2108                         rQi++;
2109                         const sx = (xy >> 4);
2110                         const sy = (xy & 0x0f);
2111
2112                         const wh = rQ[rQi];
2113                         rQi++;
2114                         const sw = (wh >> 4) + 1;
2115                         const sh = (wh & 0x0f) + 1;
2116
2117                         this._display.subTile(sx, sy, sw, sh, color);
2118                     }
2119                 }
2120                 this._display.finishTile();
2121             }
2122             this._sock.set_rQi(rQi);
2123             this._FBU.lastsubencoding = this._FBU.subencoding;
2124             this._FBU.bytes = 0;
2125             this._FBU.tiles--;
2126         }
2127
2128         if (this._FBU.tiles === 0) {
2129             this._FBU.rects--;
2130         }
2131
2132         return true;
2133     },
2134
2135     TIGHT: function (isTightPNG) {
2136         this._FBU.bytes = 1;  // compression-control byte
2137         if (this._sock.rQwait("TIGHT compression-control", this._FBU.bytes)) { return false; }
2138
2139         let resetStreams = 0;
2140         let streamId = -1;
2141         const decompress = function (data, expected) {
2142             for (let i = 0; i < 4; i++) {
2143                 if ((resetStreams >> i) & 1) {
2144                     this._FBU.zlibs[i].reset();
2145                     Log.Info("Reset zlib stream " + i);
2146                 }
2147             }
2148
2149             //const uncompressed = this._FBU.zlibs[streamId].uncompress(data, 0);
2150             const uncompressed = this._FBU.zlibs[streamId].inflate(data, true, expected);
2151             /*if (uncompressed.status !== 0) {
2152                 Log.Error("Invalid data in zlib stream");
2153             }*/
2154
2155             //return uncompressed.data;
2156             return uncompressed;
2157         }.bind(this);
2158
2159         const indexedToRGBX2Color = function (data, palette, width, height) {
2160             // Convert indexed (palette based) image data to RGB
2161             // TODO: reduce number of calculations inside loop
2162             const dest = this._destBuff;
2163             const w = Math.floor((width + 7) / 8);
2164             const w1 = Math.floor(width / 8);
2165
2166             /*for (let y = 0; y < height; y++) {
2167                 let b, x, dp, sp;
2168                 const yoffset = y * width;
2169                 const ybitoffset = y * w;
2170                 let xoffset, targetbyte;
2171                 for (x = 0; x < w1; x++) {
2172                     xoffset = yoffset + x * 8;
2173                     targetbyte = data[ybitoffset + x];
2174                     for (b = 7; b >= 0; b--) {
2175                         dp = (xoffset + 7 - b) * 3;
2176                         sp = (targetbyte >> b & 1) * 3;
2177                         dest[dp] = palette[sp];
2178                         dest[dp + 1] = palette[sp + 1];
2179                         dest[dp + 2] = palette[sp + 2];
2180                     }
2181                 }
2182
2183                 xoffset = yoffset + x * 8;
2184                 targetbyte = data[ybitoffset + x];
2185                 for (b = 7; b >= 8 - width % 8; b--) {
2186                     dp = (xoffset + 7 - b) * 3;
2187                     sp = (targetbyte >> b & 1) * 3;
2188                     dest[dp] = palette[sp];
2189                     dest[dp + 1] = palette[sp + 1];
2190                     dest[dp + 2] = palette[sp + 2];
2191                 }
2192             }*/
2193
2194             for (let y = 0; y < height; y++) {
2195                 let dp, sp, x;
2196                 for (x = 0; x < w1; x++) {
2197                     for (let b = 7; b >= 0; b--) {
2198                         dp = (y * width + x * 8 + 7 - b) * 4;
2199                         sp = (data[y * w + x] >> b & 1) * 3;
2200                         dest[dp] = palette[sp];
2201                         dest[dp + 1] = palette[sp + 1];
2202                         dest[dp + 2] = palette[sp + 2];
2203                         dest[dp + 3] = 255;
2204                     }
2205                 }
2206
2207                 for (let b = 7; b >= 8 - width % 8; b--) {
2208                     dp = (y * width + x * 8 + 7 - b) * 4;
2209                     sp = (data[y * w + x] >> b & 1) * 3;
2210                     dest[dp] = palette[sp];
2211                     dest[dp + 1] = palette[sp + 1];
2212                     dest[dp + 2] = palette[sp + 2];
2213                     dest[dp + 3] = 255;
2214                 }
2215             }
2216
2217             return dest;
2218         }.bind(this);
2219
2220         const indexedToRGBX = function (data, palette, width, height) {
2221             // Convert indexed (palette based) image data to RGB
2222             const dest = this._destBuff;
2223             const total = width * height * 4;
2224             for (let i = 0, j = 0; i < total; i += 4, j++) {
2225                 const sp = data[j] * 3;
2226                 dest[i] = palette[sp];
2227                 dest[i + 1] = palette[sp + 1];
2228                 dest[i + 2] = palette[sp + 2];
2229                 dest[i + 3] = 255;
2230             }
2231
2232             return dest;
2233         }.bind(this);
2234
2235         const rQi = this._sock.get_rQi();
2236         const rQ = this._sock.rQwhole();
2237         let cmode, data;
2238         let cl_header, cl_data;
2239
2240         const handlePalette = function () {
2241             const numColors = rQ[rQi + 2] + 1;
2242             const paletteSize = numColors * 3;
2243             this._FBU.bytes += paletteSize;
2244             if (this._sock.rQwait("TIGHT palette " + cmode, this._FBU.bytes)) { return false; }
2245
2246             const bpp = (numColors <= 2) ? 1 : 8;
2247             const rowSize = Math.floor((this._FBU.width * bpp + 7) / 8);
2248             let raw = false;
2249             if (rowSize * this._FBU.height < 12) {
2250                 raw = true;
2251                 cl_header = 0;
2252                 cl_data = rowSize * this._FBU.height;
2253                 //clength = [0, rowSize * this._FBU.height];
2254             } else {
2255                 // begin inline getTightCLength (returning two-item arrays is bad for performance with GC)
2256                 const cl_offset = rQi + 3 + paletteSize;
2257                 cl_header = 1;
2258                 cl_data = 0;
2259                 cl_data += rQ[cl_offset] & 0x7f;
2260                 if (rQ[cl_offset] & 0x80) {
2261                     cl_header++;
2262                     cl_data += (rQ[cl_offset + 1] & 0x7f) << 7;
2263                     if (rQ[cl_offset + 1] & 0x80) {
2264                         cl_header++;
2265                         cl_data += rQ[cl_offset + 2] << 14;
2266                     }
2267                 }
2268                 // end inline getTightCLength
2269             }
2270
2271             this._FBU.bytes += cl_header + cl_data;
2272             if (this._sock.rQwait("TIGHT " + cmode, this._FBU.bytes)) { return false; }
2273
2274             // Shift ctl, filter id, num colors, palette entries, and clength off
2275             this._sock.rQskipBytes(3);
2276             //const palette = this._sock.rQshiftBytes(paletteSize);
2277             this._sock.rQshiftTo(this._paletteBuff, paletteSize);
2278             this._sock.rQskipBytes(cl_header);
2279
2280             if (raw) {
2281                 data = this._sock.rQshiftBytes(cl_data);
2282             } else {
2283                 data = decompress(this._sock.rQshiftBytes(cl_data), rowSize * this._FBU.height);
2284             }
2285
2286             // Convert indexed (palette based) image data to RGB
2287             let rgbx;
2288             if (numColors == 2) {
2289                 rgbx = indexedToRGBX2Color(data, this._paletteBuff, this._FBU.width, this._FBU.height);
2290             } else {
2291                 rgbx = indexedToRGBX(data, this._paletteBuff, this._FBU.width, this._FBU.height);
2292             }
2293
2294             this._display.blitRgbxImage(this._FBU.x, this._FBU.y, this._FBU.width, this._FBU.height, rgbx, 0, false);
2295
2296
2297             return true;
2298         }.bind(this);
2299
2300         const handleCopy = function () {
2301             let raw = false;
2302             const uncompressedSize = this._FBU.width * this._FBU.height * 3;
2303             if (uncompressedSize < 12) {
2304                 raw = true;
2305                 cl_header = 0;
2306                 cl_data = uncompressedSize;
2307             } else {
2308                 // begin inline getTightCLength (returning two-item arrays is for peformance with GC)
2309                 const cl_offset = rQi + 1;
2310                 cl_header = 1;
2311                 cl_data = 0;
2312                 cl_data += rQ[cl_offset] & 0x7f;
2313                 if (rQ[cl_offset] & 0x80) {
2314                     cl_header++;
2315                     cl_data += (rQ[cl_offset + 1] & 0x7f) << 7;
2316                     if (rQ[cl_offset + 1] & 0x80) {
2317                         cl_header++;
2318                         cl_data += rQ[cl_offset + 2] << 14;
2319                     }
2320                 }
2321                 // end inline getTightCLength
2322             }
2323             this._FBU.bytes = 1 + cl_header + cl_data;
2324             if (this._sock.rQwait("TIGHT " + cmode, this._FBU.bytes)) { return false; }
2325
2326             // Shift ctl, clength off
2327             this._sock.rQshiftBytes(1 + cl_header);
2328
2329             if (raw) {
2330                 data = this._sock.rQshiftBytes(cl_data);
2331             } else {
2332                 data = decompress(this._sock.rQshiftBytes(cl_data), uncompressedSize);
2333             }
2334
2335             this._display.blitRgbImage(this._FBU.x, this._FBU.y, this._FBU.width, this._FBU.height, data, 0, false);
2336
2337             return true;
2338         }.bind(this);
2339
2340         let ctl = this._sock.rQpeek8();
2341
2342         // Keep tight reset bits
2343         resetStreams = ctl & 0xF;
2344
2345         // Figure out filter
2346         ctl = ctl >> 4;
2347         streamId = ctl & 0x3;
2348
2349         if (ctl === 0x08)       cmode = "fill";
2350         else if (ctl === 0x09)  cmode = "jpeg";
2351         else if (ctl === 0x0A)  cmode = "png";
2352         else if (ctl & 0x04)    cmode = "filter";
2353         else if (ctl < 0x04)    cmode = "copy";
2354         else return this._fail("Illegal tight compression received (ctl: " +
2355                                ctl + ")");
2356
2357         if (isTightPNG && (ctl < 0x08)) {
2358             return this._fail("BasicCompression received in TightPNG rect");
2359         }
2360         if (!isTightPNG && (ctl === 0x0A)) {
2361             return this._fail("PNG received in standard Tight rect");
2362         }
2363
2364         switch (cmode) {
2365             // fill use depth because TPIXELs drop the padding byte
2366             case "fill":  // TPIXEL
2367                 this._FBU.bytes += 3;
2368                 break;
2369             case "jpeg":  // max clength
2370                 this._FBU.bytes += 3;
2371                 break;
2372             case "png":  // max clength
2373                 this._FBU.bytes += 3;
2374                 break;
2375             case "filter":  // filter id + num colors if palette
2376                 this._FBU.bytes += 2;
2377                 break;
2378             case "copy":
2379                 break;
2380         }
2381
2382         if (this._sock.rQwait("TIGHT " + cmode, this._FBU.bytes)) { return false; }
2383
2384         // Determine FBU.bytes
2385         let cl_offset, filterId;
2386         switch (cmode) {
2387             case "fill":
2388                 // skip ctl byte
2389                 this._display.fillRect(this._FBU.x, this._FBU.y, this._FBU.width, this._FBU.height, [rQ[rQi + 3], rQ[rQi + 2], rQ[rQi + 1]], false);
2390                 this._sock.rQskipBytes(4);
2391                 break;
2392             case "png":
2393             case "jpeg":
2394                 // begin inline getTightCLength (returning two-item arrays is for peformance with GC)
2395                 cl_offset = rQi + 1;
2396                 cl_header = 1;
2397                 cl_data = 0;
2398                 cl_data += rQ[cl_offset] & 0x7f;
2399                 if (rQ[cl_offset] & 0x80) {
2400                     cl_header++;
2401                     cl_data += (rQ[cl_offset + 1] & 0x7f) << 7;
2402                     if (rQ[cl_offset + 1] & 0x80) {
2403                         cl_header++;
2404                         cl_data += rQ[cl_offset + 2] << 14;
2405                     }
2406                 }
2407                 // end inline getTightCLength
2408                 this._FBU.bytes = 1 + cl_header + cl_data;  // ctl + clength size + jpeg-data
2409                 if (this._sock.rQwait("TIGHT " + cmode, this._FBU.bytes)) { return false; }
2410
2411                 // We have everything, render it
2412                 this._sock.rQskipBytes(1 + cl_header);  // shift off clt + compact length
2413                 data = this._sock.rQshiftBytes(cl_data);
2414                 this._display.imageRect(this._FBU.x, this._FBU.y, "image/" + cmode, data);
2415                 break;
2416             case "filter":
2417                 filterId = rQ[rQi + 1];
2418                 if (filterId === 1) {
2419                     if (!handlePalette()) { return false; }
2420                 } else {
2421                     // Filter 0, Copy could be valid here, but servers don't send it as an explicit filter
2422                     // Filter 2, Gradient is valid but not use if jpeg is enabled
2423                     this._fail("Unsupported tight subencoding received " +
2424                                "(filter: " + filterId + ")");
2425                 }
2426                 break;
2427             case "copy":
2428                 if (!handleCopy()) { return false; }
2429                 break;
2430         }
2431
2432
2433         this._FBU.bytes = 0;
2434         this._FBU.rects--;
2435
2436         return true;
2437     },
2438
2439     last_rect: function () {
2440         this._FBU.rects = 0;
2441         return true;
2442     },
2443
2444     ExtendedDesktopSize: function () {
2445         this._FBU.bytes = 1;
2446         if (this._sock.rQwait("ExtendedDesktopSize", this._FBU.bytes)) { return false; }
2447
2448         const firstUpdate = !this._supportsSetDesktopSize;
2449         this._supportsSetDesktopSize = true;
2450
2451         // Normally we only apply the current resize mode after a
2452         // window resize event. However there is no such trigger on the
2453         // initial connect. And we don't know if the server supports
2454         // resizing until we've gotten here.
2455         if (firstUpdate) {
2456             this._requestRemoteResize();
2457         }
2458
2459         const number_of_screens = this._sock.rQpeek8();
2460
2461         this._FBU.bytes = 4 + (number_of_screens * 16);
2462         if (this._sock.rQwait("ExtendedDesktopSize", this._FBU.bytes)) { return false; }
2463
2464         this._sock.rQskipBytes(1);  // number-of-screens
2465         this._sock.rQskipBytes(3);  // padding
2466
2467         for (let i = 0; i < number_of_screens; i += 1) {
2468             // Save the id and flags of the first screen
2469             if (i === 0) {
2470                 this._screen_id = this._sock.rQshiftBytes(4);    // id
2471                 this._sock.rQskipBytes(2);                       // x-position
2472                 this._sock.rQskipBytes(2);                       // y-position
2473                 this._sock.rQskipBytes(2);                       // width
2474                 this._sock.rQskipBytes(2);                       // height
2475                 this._screen_flags = this._sock.rQshiftBytes(4); // flags
2476             } else {
2477                 this._sock.rQskipBytes(16);
2478             }
2479         }
2480
2481         /*
2482          * The x-position indicates the reason for the change:
2483          *
2484          *  0 - server resized on its own
2485          *  1 - this client requested the resize
2486          *  2 - another client requested the resize
2487          */
2488
2489         // We need to handle errors when we requested the resize.
2490         if (this._FBU.x === 1 && this._FBU.y !== 0) {
2491             let msg = "";
2492             // The y-position indicates the status code from the server
2493             switch (this._FBU.y) {
2494             case 1:
2495                 msg = "Resize is administratively prohibited";
2496                 break;
2497             case 2:
2498                 msg = "Out of resources";
2499                 break;
2500             case 3:
2501                 msg = "Invalid screen layout";
2502                 break;
2503             default:
2504                 msg = "Unknown reason";
2505                 break;
2506             }
2507             Log.Warn("Server did not accept the resize request: "
2508                      + msg);
2509         } else {
2510             this._resize(this._FBU.width, this._FBU.height);
2511         }
2512
2513         this._FBU.bytes = 0;
2514         this._FBU.rects -= 1;
2515         return true;
2516     },
2517
2518     DesktopSize: function () {
2519         this._resize(this._FBU.width, this._FBU.height);
2520         this._FBU.bytes = 0;
2521         this._FBU.rects -= 1;
2522         return true;
2523     },
2524
2525     Cursor: function () {
2526         Log.Debug(">> set_cursor");
2527         const x = this._FBU.x;  // hotspot-x
2528         const y = this._FBU.y;  // hotspot-y
2529         const w = this._FBU.width;
2530         const h = this._FBU.height;
2531
2532         const pixelslength = w * h * 4;
2533         const masklength = Math.floor((w + 7) / 8) * h;
2534
2535         this._FBU.bytes = pixelslength + masklength;
2536         if (this._sock.rQwait("cursor encoding", this._FBU.bytes)) { return false; }
2537
2538         this._cursor.change(this._sock.rQshiftBytes(pixelslength),
2539                             this._sock.rQshiftBytes(masklength),
2540                             x, y, w, h);
2541
2542         this._FBU.bytes = 0;
2543         this._FBU.rects--;
2544
2545         Log.Debug("<< set_cursor");
2546         return true;
2547     },
2548
2549     QEMUExtendedKeyEvent: function () {
2550         this._FBU.rects--;
2551
2552         // Old Safari doesn't support creating keyboard events
2553         try {
2554             const keyboardEvent = document.createEvent("keyboardEvent");
2555             if (keyboardEvent.code !== undefined) {
2556                 this._qemuExtKeyEventSupported = true;
2557             }
2558         } catch (err) {
2559             // Do nothing
2560         }
2561     },
2562 }