[DevTools] Remove HelpScreen, turn SettingsScreen into dialog and web component.

third_party/WebKit/Source/devtools/front_end/ui/Dialog.js

 /*
  * Copyright (C) 2012 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 35 matching lines @@
     this._wrapsContent = false;
     this._dimmed = false;
 }
 
 /**
  * TODO(dgozman): remove this method (it's only used for shortcuts handling).
  * @return {boolean}
  */
 WebInspector.Dialog.hasInstance = function()
 {
-    return !!WebInspector.Dialog._instance;
+    return !!WebInspector.Dialog._instances.length;
 }
 
+/** @type {!Array<!WebInspector.Dialog>} */
+WebInspector.Dialog._instances = [];
+
 WebInspector.Dialog.prototype = {
     /**
      * @override
      */
     show: function()
     {
-        if (WebInspector.Dialog._instance)
-            WebInspector.Dialog._instance.detach();
-        WebInspector.Dialog._instance = this;
+        WebInspector.Dialog._instances.push(this);
 
         this._glassPane = new WebInspector.GlassPane(/** @type {!Document} */ (WebInspector.Dialog._modalHostView.element.ownerDocument), this._dimmed);
         this._glassPane.element.addEventListener("click", this._onGlassPaneClick.bind(this), false);
         WebInspector.GlassPane.DefaultFocusedViewStack.push(this);
 
         WebInspector.Widget.prototype.show.call(this, this._glassPane.element);
 
         this._position();
         this.focus();
     },
 
     /**
      * @override
      */
     detach: function()
     {
         WebInspector.Widget.prototype.detach.call(this);
 
         WebInspector.GlassPane.DefaultFocusedViewStack.pop();
         this._glassPane.dispose();
         delete this._glassPane;
 
-        delete WebInspector.Dialog._instance;
+        console.assert(this === WebInspector.Dialog._instances.peekLast());

[yurys, 2015/10/13 00:52:11]

How can you be sure that the dialogs are not closed in different order?

[dgozman, 2015/10/13 01:57:42]

They are stacked on top of each other. The alternative is to close this one and
all others opened later. What do you prefer?

+        WebInspector.Dialog._instances.pop();
     },
 
     addCloseButton: function()
     {
         var closeButton = this.contentElement.createChild("div", "dialog-close-button", "dt-close-button");
         closeButton.gray = true;
         closeButton.addEventListener("click", this.detach.bind(this, false), false);
     },
 
     /**
@@ skipping 116 matching lines @@
  * Method should be like Dialog.showModalElement(position params, reposition callback).
  * @return {?WebInspector.Widget}
  */
 WebInspector.Dialog.modalHostView = function()
 {
     return WebInspector.Dialog._modalHostView;
 };
 
 WebInspector.Dialog.modalHostRepositioned = function()
 {
-    if (WebInspector.Dialog._instance)
-        WebInspector.Dialog._instance._position();
+    for (var index = 0; index < WebInspector.Dialog._instances.length; ++index)
+        WebInspector.Dialog._instances[index]._position();
 };