[AppRemoting] Implement ConnectionDroppedDialog.

remoting/webapp/base/js/modal_dialogs.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /** @suppress {duplicate} */
 var remoting = remoting || {};
 
 (function() {
 
 'use strict';
@@ skipping 140 matching lines @@
  * @param {remoting.MessageDialog.Result} result
  * @return {Function}
  * @private
  */
 remoting.MessageDialog.prototype.onClicked_ = function(result) {
   this.deferred_.resolve(result);
   this.deferred_ = null;
   this.dispose();
 };
 
+
+
+/**
+ * A promise-based dialog implementation using HTML Dialog element.

[Jamie, 2015/05/20 02:20:37]

s/Dialog/<dialog>/

[kelvinp, 2015/05/20 18:13:00]

Done.

+ *
+ * @param {HTMLDialogElement} dialog
+ * @param {HTMLElement} primaryButton
+ * @param {HTMLElement=} opt_secondaryButton
+ * @constructor
+ *
+ * @implements {remoting.WindowShape.ClientUI}
+ * @implements {base.Disposable}
+ */
+remoting.Html5ModalDialog = function(dialog, primaryButton,
+                                     opt_secondaryButton) {
+  /** @private */
+  this.dialog_ = dialog;
+  /** @private {base.Disposables} */
+  this.eventHooks_ = new base.Disposables(
+      new base.DomEventHook(dialog, 'cancel', this.onCancel_.bind(this), false),

[kelvinp, 2015/05/20 01:27:31]

This is called when the user press Escape.

+      new base.DomEventHook(
+          primaryButton, 'click',
+          this.onClicked_.bind(this, remoting.MessageDialog.Result.PRIMARY),
+          false)
+  );
+
+  if (opt_secondaryButton) {
+    this.eventHooks_.add(new base.DomEventHook(
+        opt_secondaryButton, 'click',
+        this.onClicked_.bind(this, remoting.MessageDialog.Result.SECONDARY),
+        false));
+  }
+
+  /** @private {base.Deferred} */
+  this.deferred_ = null;
+  remoting.windowShape.registerClientUI(this);
+};
+
+remoting.Html5ModalDialog.prototype.dispose = function() {
+  base.dispose(this.eventHooks_);
+  remoting.windowShape.unregisterClientUI(this);
+};
+
+/**
+ * @return {Promise<remoting.MessageDialog.Result>}  Promise that resolves with
+ * the button clicked.
+ */
+remoting.Html5ModalDialog.prototype.show = function() {
+  base.debug.assert(this.deferred_ === null);
+  this.deferred_ = new base.Deferred();
+  this.dialog_.showModal();
+
+  remoting.windowShape.centerToDesktop(this.dialog_);
+  return this.deferred_.promise();
+};
+
+/** @param {Event} e */
+remoting.Html5ModalDialog.prototype.onCancel_ = function(e) {
+  e.preventDefault();

[Jamie, 2015/05/20 02:20:37]

I'm not sure that a generic Html5ModalDialog class should prevent the default
behaviour of the Escape key. In the specific case of the connection-dropped
dialog, it probably makes sense, because the user didn't take any explicit
action to pop up the dialog, but I think we want to start using this class for
all our dialogs, at which point it does make sense to handle Escape in a
standard way. Maybe make it configurable, either with a ctor parameter, or via a
setter method.

[kelvinp, 2015/05/20 18:13:00]

Done.

+};
+
+/**
+ * @param {remoting.MessageDialog.Result} result
+ * @private
+ */
+remoting.Html5ModalDialog.prototype.onClicked_ = function(result) {
+  this.dialog_.close();
+  this.deferred_.resolve(result);
+  this.deferred_ = null;
+  this.dispose();
+};
+
+remoting.Html5ModalDialog.prototype.addToRegion = function(rects) {
+  var rect = /** @type {ClientRect} */(this.dialog_.getBoundingClientRect());
+  rects.push({
+    left: rect.left,
+    top: rect.top,
+    width: rect.width,
+    height: rect.height
+  });
+};
+
+
 /**
  * @param {Function} cancelCallback The callback to invoke when the user clicks
  *     on the cancel button.
  * @constructor
  */
 remoting.ConnectingDialog = function(cancelCallback) {
   /** @private */
   this.dialog_ = new remoting.MessageDialog(
       remoting.AppMode.CLIENT_CONNECTING,
       document.getElementById('cancel-connect-button'));
@@ skipping 18 matching lines @@
 
 /**
  * Define the enum at the end of file as JSCompile doesn't understand enums that
  * are defined within an IIFE (Immediately Invoked Function Expression).
  * @enum {number}
  */
 remoting.MessageDialog.Result = {
   PRIMARY: 0,
   SECONDARY: 1
 };