Index: third_party/WebKit/Source/devtools/front_end/ui/Dialog.js |
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/Dialog.js b/third_party/WebKit/Source/devtools/front_end/ui/Dialog.js |
index 0feeb2a7078e0dcdb29b122da0d1cb02e811f64f..1c64971ebec8a09e5aa632452ec755c69a168b2b 100644 |
--- a/third_party/WebKit/Source/devtools/front_end/ui/Dialog.js |
+++ b/third_party/WebKit/Source/devtools/front_end/ui/Dialog.js |
@@ -27,246 +27,225 @@ |
* (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
*/ |
- |
/** |
- * @constructor |
- * @extends {WebInspector.Widget} |
+ * @unrestricted |
*/ |
-WebInspector.Dialog = function() |
-{ |
- WebInspector.Widget.call(this, true); |
+WebInspector.Dialog = class extends WebInspector.Widget { |
+ constructor() { |
+ super(true); |
this.markAsRoot(); |
- this.registerRequiredCSS("ui/dialog.css"); |
+ this.registerRequiredCSS('ui/dialog.css'); |
- this.contentElement.createChild("content"); |
+ this.contentElement.createChild('content'); |
this.contentElement.tabIndex = 0; |
- this.contentElement.addEventListener("focus", this._onFocus.bind(this), false); |
+ this.contentElement.addEventListener('focus', this._onFocus.bind(this), false); |
this._keyDownBound = this._onKeyDown.bind(this); |
this._wrapsContent = false; |
this._dimmed = false; |
/** @type {!Map<!HTMLElement, number>} */ |
this._tabIndexMap = new Map(); |
-}; |
+ } |
-/** |
- * @return {boolean} |
- */ |
-WebInspector.Dialog.hasInstance = function() |
-{ |
+ /** |
+ * @return {boolean} |
+ */ |
+ static hasInstance() { |
return !!WebInspector.Dialog._instance; |
-}; |
- |
-WebInspector.Dialog.prototype = { |
- /** |
- * @override |
- */ |
- show: function() |
- { |
- if (WebInspector.Dialog._instance) |
- WebInspector.Dialog._instance.detach(); |
- WebInspector.Dialog._instance = this; |
- |
- var document = /** @type {!Document} */ (WebInspector.Dialog._modalHostView.element.ownerDocument); |
- this._disableTabIndexOnElements(document); |
- |
- this._glassPane = new WebInspector.GlassPane(document, this._dimmed); |
- this._glassPane.element.addEventListener("click", this._onGlassPaneClick.bind(this), false); |
- this.element.ownerDocument.body.addEventListener("keydown", this._keyDownBound, false); |
- |
- WebInspector.Widget.prototype.show.call(this, this._glassPane.element); |
- |
- this._position(); |
- this._focusRestorer = new WebInspector.WidgetFocusRestorer(this); |
- }, |
- |
- /** |
- * @override |
- */ |
- detach: function() |
- { |
- this._focusRestorer.restore(); |
- |
- this.element.ownerDocument.body.removeEventListener("keydown", this._keyDownBound, false); |
- WebInspector.Widget.prototype.detach.call(this); |
- |
- this._glassPane.dispose(); |
- delete this._glassPane; |
- |
- this._restoreTabIndexOnElements(); |
- |
- delete WebInspector.Dialog._instance; |
- }, |
- |
- 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); |
- }, |
- |
- /** |
- * @param {number=} positionX |
- * @param {number=} positionY |
- */ |
- setPosition: function(positionX, positionY) |
- { |
- this._defaultPositionX = positionX; |
- this._defaultPositionY = positionY; |
- }, |
- |
- /** |
- * @param {!Size} size |
- */ |
- setMaxSize: function(size) |
- { |
- this._maxSize = size; |
- }, |
- |
- /** |
- * @param {boolean} wraps |
- */ |
- setWrapsContent: function(wraps) |
- { |
- this.element.classList.toggle("wraps-content", wraps); |
- this._wrapsContent = wraps; |
- }, |
- |
- /** |
- * @param {boolean} dimmed |
- */ |
- setDimmed: function(dimmed) |
- { |
- this._dimmed = dimmed; |
- }, |
- |
- contentResized: function() |
- { |
- if (this._wrapsContent) |
- this._position(); |
- }, |
- |
- /** |
- * @param {!Document} document |
- */ |
- _disableTabIndexOnElements: function(document) |
- { |
- this._tabIndexMap.clear(); |
- for (var node = document; node; node = node.traverseNextNode(document)) { |
- if (node instanceof HTMLElement) { |
- var element = /** @type {!HTMLElement} */ (node); |
- var tabIndex = element.tabIndex; |
- if (tabIndex >= 0) { |
- this._tabIndexMap.set(element, tabIndex); |
- element.tabIndex = -1; |
- } |
- } |
- } |
- }, |
- |
- _restoreTabIndexOnElements: function() |
- { |
- for (var element of this._tabIndexMap.keys()) |
- element.tabIndex = /** @type {number} */(this._tabIndexMap.get(element)); |
- this._tabIndexMap.clear(); |
- }, |
- |
- /** |
- * @param {!Event} event |
- */ |
- _onFocus: function(event) |
- { |
- this.focus(); |
- }, |
- |
- /** |
- * @param {!Event} event |
- */ |
- _onGlassPaneClick: function(event) |
- { |
- if (!this.element.isSelfOrAncestor(/** @type {?Node} */ (event.target))) |
- this.detach(); |
- }, |
- |
- _position: function() |
- { |
- var container = WebInspector.Dialog._modalHostView.element; |
- |
- var width = container.offsetWidth - 10; |
- var height = container.offsetHeight - 10; |
- |
- if (this._wrapsContent) { |
- width = Math.min(width, this.contentElement.offsetWidth); |
- height = Math.min(height, this.contentElement.offsetHeight); |
- } |
+ } |
- if (this._maxSize) { |
- width = Math.min(width, this._maxSize.width); |
- height = Math.min(height, this._maxSize.height); |
- } |
- |
- var positionX; |
- if (typeof this._defaultPositionX === "number") { |
- positionX = this._defaultPositionX; |
- } else { |
- positionX = (container.offsetWidth - width) / 2; |
- positionX = Number.constrain(positionX, 0, container.offsetWidth - width); |
- } |
+ /** |
+ * @param {!WebInspector.Widget} view |
+ */ |
+ static setModalHostView(view) { |
+ WebInspector.Dialog._modalHostView = view; |
+ } |
+ |
+ /** |
+ * FIXME: make utility method in Dialog, so clients use it instead of this getter. |
+ * Method should be like Dialog.showModalElement(position params, reposition callback). |
+ * @return {?WebInspector.Widget} |
+ */ |
+ static modalHostView() { |
+ return WebInspector.Dialog._modalHostView; |
+ } |
- var positionY; |
- if (typeof this._defaultPositionY === "number") { |
- positionY = this._defaultPositionY; |
- } else { |
- positionY = (container.offsetHeight - height) / 2; |
- positionY = Number.constrain(positionY, 0, container.offsetHeight - height); |
- } |
+ static modalHostRepositioned() { |
+ if (WebInspector.Dialog._instance) |
+ WebInspector.Dialog._instance._position(); |
+ } |
- this.element.style.width = width + "px"; |
- this.element.style.height = height + "px"; |
- this.element.positionAt(positionX, positionY, container); |
- }, |
- |
- /** |
- * @param {!Event} event |
- */ |
- _onKeyDown: function(event) |
- { |
- if (event.keyCode === WebInspector.KeyboardShortcut.Keys.Esc.code) { |
- event.consume(true); |
- this.detach(); |
+ /** |
+ * @override |
+ */ |
+ show() { |
+ if (WebInspector.Dialog._instance) |
+ WebInspector.Dialog._instance.detach(); |
+ WebInspector.Dialog._instance = this; |
+ |
+ var document = /** @type {!Document} */ (WebInspector.Dialog._modalHostView.element.ownerDocument); |
+ this._disableTabIndexOnElements(document); |
+ |
+ this._glassPane = new WebInspector.GlassPane(document, this._dimmed); |
+ this._glassPane.element.addEventListener('click', this._onGlassPaneClick.bind(this), false); |
+ this.element.ownerDocument.body.addEventListener('keydown', this._keyDownBound, false); |
+ |
+ super.show(this._glassPane.element); |
+ |
+ this._position(); |
+ this._focusRestorer = new WebInspector.WidgetFocusRestorer(this); |
+ } |
+ |
+ /** |
+ * @override |
+ */ |
+ detach() { |
+ this._focusRestorer.restore(); |
+ |
+ this.element.ownerDocument.body.removeEventListener('keydown', this._keyDownBound, false); |
+ super.detach(); |
+ |
+ this._glassPane.dispose(); |
+ delete this._glassPane; |
+ |
+ this._restoreTabIndexOnElements(); |
+ |
+ delete WebInspector.Dialog._instance; |
+ } |
+ |
+ addCloseButton() { |
+ var closeButton = this.contentElement.createChild('div', 'dialog-close-button', 'dt-close-button'); |
+ closeButton.gray = true; |
+ closeButton.addEventListener('click', this.detach.bind(this), false); |
+ } |
+ |
+ /** |
+ * @param {number=} positionX |
+ * @param {number=} positionY |
+ */ |
+ setPosition(positionX, positionY) { |
+ this._defaultPositionX = positionX; |
+ this._defaultPositionY = positionY; |
+ } |
+ |
+ /** |
+ * @param {!Size} size |
+ */ |
+ setMaxSize(size) { |
+ this._maxSize = size; |
+ } |
+ |
+ /** |
+ * @param {boolean} wraps |
+ */ |
+ setWrapsContent(wraps) { |
+ this.element.classList.toggle('wraps-content', wraps); |
+ this._wrapsContent = wraps; |
+ } |
+ |
+ /** |
+ * @param {boolean} dimmed |
+ */ |
+ setDimmed(dimmed) { |
+ this._dimmed = dimmed; |
+ } |
+ |
+ contentResized() { |
+ if (this._wrapsContent) |
+ this._position(); |
+ } |
+ |
+ /** |
+ * @param {!Document} document |
+ */ |
+ _disableTabIndexOnElements(document) { |
+ this._tabIndexMap.clear(); |
+ for (var node = document; node; node = node.traverseNextNode(document)) { |
+ if (node instanceof HTMLElement) { |
+ var element = /** @type {!HTMLElement} */ (node); |
+ var tabIndex = element.tabIndex; |
+ if (tabIndex >= 0) { |
+ this._tabIndexMap.set(element, tabIndex); |
+ element.tabIndex = -1; |
} |
- }, |
- |
- __proto__: WebInspector.Widget.prototype |
+ } |
+ } |
+ } |
+ |
+ _restoreTabIndexOnElements() { |
+ for (var element of this._tabIndexMap.keys()) |
+ element.tabIndex = /** @type {number} */ (this._tabIndexMap.get(element)); |
+ this._tabIndexMap.clear(); |
+ } |
+ |
+ /** |
+ * @param {!Event} event |
+ */ |
+ _onFocus(event) { |
+ this.focus(); |
+ } |
+ |
+ /** |
+ * @param {!Event} event |
+ */ |
+ _onGlassPaneClick(event) { |
+ if (!this.element.isSelfOrAncestor(/** @type {?Node} */ (event.target))) |
+ this.detach(); |
+ } |
+ |
+ _position() { |
+ var container = WebInspector.Dialog._modalHostView.element; |
+ |
+ var width = container.offsetWidth - 10; |
+ var height = container.offsetHeight - 10; |
+ |
+ if (this._wrapsContent) { |
+ width = Math.min(width, this.contentElement.offsetWidth); |
+ height = Math.min(height, this.contentElement.offsetHeight); |
+ } |
+ |
+ if (this._maxSize) { |
+ width = Math.min(width, this._maxSize.width); |
+ height = Math.min(height, this._maxSize.height); |
+ } |
+ |
+ var positionX; |
+ if (typeof this._defaultPositionX === 'number') { |
+ positionX = this._defaultPositionX; |
+ } else { |
+ positionX = (container.offsetWidth - width) / 2; |
+ positionX = Number.constrain(positionX, 0, container.offsetWidth - width); |
+ } |
+ |
+ var positionY; |
+ if (typeof this._defaultPositionY === 'number') { |
+ positionY = this._defaultPositionY; |
+ } else { |
+ positionY = (container.offsetHeight - height) / 2; |
+ positionY = Number.constrain(positionY, 0, container.offsetHeight - height); |
+ } |
+ |
+ this.element.style.width = width + 'px'; |
+ this.element.style.height = height + 'px'; |
+ this.element.positionAt(positionX, positionY, container); |
+ } |
+ |
+ /** |
+ * @param {!Event} event |
+ */ |
+ _onKeyDown(event) { |
+ if (event.keyCode === WebInspector.KeyboardShortcut.Keys.Esc.code) { |
+ event.consume(true); |
+ this.detach(); |
+ } |
+ } |
}; |
+ |
/** @type {?Element} */ |
WebInspector.Dialog._previousFocusedElement = null; |
/** @type {?WebInspector.Widget} */ |
WebInspector.Dialog._modalHostView = null; |
-/** |
- * @param {!WebInspector.Widget} view |
- */ |
-WebInspector.Dialog.setModalHostView = function(view) |
-{ |
- WebInspector.Dialog._modalHostView = view; |
-}; |
- |
-/** |
- * FIXME: make utility method in Dialog, so clients use it instead of this getter. |
- * 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(); |
-}; |