Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 1 | /* |
| 2 | * Copyright (C) 2008 Apple Inc. All Rights Reserved. |
| 3 | * Copyright (C) 2011 Google Inc. All Rights Reserved. |
| 4 | * |
| 5 | * Redistribution and use in source and binary forms, with or without |
| 6 | * modification, are permitted provided that the following conditions |
| 7 | * are met: |
| 8 | * 1. Redistributions of source code must retain the above copyright |
| 9 | * notice, this list of conditions and the following disclaimer. |
| 10 | * 2. Redistributions in binary form must reproduce the above copyright |
| 11 | * notice, this list of conditions and the following disclaimer in the |
| 12 | * documentation and/or other materials provided with the distribution. |
| 13 | * |
| 14 | * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY |
| 15 | * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
| 16 | * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR |
| 17 | * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR |
| 18 | * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, |
| 19 | * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, |
| 20 | * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR |
| 21 | * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY |
| 22 | * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT |
| 23 | * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE |
| 24 | * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| 25 | */ |
| 26 | |
Paul Lewis | 17e384e | 2020-01-08 15:46:51 | [diff] [blame] | 27 | import * as Common from '../common/common.js'; |
Simon Zünd | 1b21f29 | 2020-08-12 05:38:36 | [diff] [blame] | 28 | import * as DOMExtension from '../dom_extension/dom_extension.js'; |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 29 | import {Constraints, Size} from './Geometry.js'; |
| 30 | import {appendStyle} from './utils/append-style.js'; |
| 31 | import {createShadowRootWithCoreStyles} from './utils/create-shadow-root-with-core-styles.js'; |
| 32 | import {XWidget} from './XWidget.js'; |
| 33 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 34 | export class WidgetElement extends HTMLDivElement { // eslint-disable-line no-unused-vars |
| 35 | constructor() { |
| 36 | super(); |
| 37 | /** @type {?Widget} */ |
| 38 | this.__widget; |
| 39 | |
| 40 | /** @type {?number} */ |
| 41 | this.__widgetCounter; |
| 42 | } |
| 43 | } |
| 44 | |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 45 | /** |
| 46 | * @unrestricted |
| 47 | */ |
Paul Lewis | 17e384e | 2020-01-08 15:46:51 | [diff] [blame] | 48 | export class Widget extends Common.ObjectWrapper.ObjectWrapper { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 49 | /** |
| 50 | * @param {boolean=} isWebComponent |
Joel Einbinder | 7fbe24c | 2019-01-24 05:19:01 | [diff] [blame] | 51 | * @param {boolean=} delegatesFocus |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 52 | */ |
Joel Einbinder | 7fbe24c | 2019-01-24 05:19:01 | [diff] [blame] | 53 | constructor(isWebComponent, delegatesFocus) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 54 | super(); |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 55 | /** @type {!WidgetElement} */ |
| 56 | this.element; |
Tim van der Lippe | f49e232 | 2020-05-01 15:03:09 | [diff] [blame] | 57 | this.contentElement = document.createElement('div'); |
| 58 | this.contentElement.classList.add('widget'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 59 | if (isWebComponent) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 60 | this.element = /** @type {!WidgetElement} */ (document.createElement('div')); |
Tim van der Lippe | e7f2705 | 2020-05-01 15:15:28 | [diff] [blame] | 61 | this.element.classList.add('vbox'); |
| 62 | this.element.classList.add('flex-auto'); |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 63 | this._shadowRoot = createShadowRootWithCoreStyles(this.element, undefined, delegatesFocus); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 64 | this._shadowRoot.appendChild(this.contentElement); |
| 65 | } else { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 66 | this.element = /** @type {!WidgetElement} */ (this.contentElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 67 | } |
| 68 | this._isWebComponent = isWebComponent; |
| 69 | this.element.__widget = this; |
| 70 | this._visible = false; |
| 71 | this._isRoot = false; |
| 72 | this._isShowing = false; |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 73 | /** @type {!Array<!Widget>} */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 74 | this._children = []; |
| 75 | this._hideOnDetach = false; |
| 76 | this._notificationDepth = 0; |
| 77 | this._invalidationsSuspended = 0; |
| 78 | this._defaultFocusedChild = null; |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 79 | /** @type {?Widget} */ |
| 80 | this._parentWidget = null; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 81 | } |
| 82 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 83 | /** |
| 84 | * @param {!WidgetElement} parentElement |
| 85 | * @param {!WidgetElement} childElement |
| 86 | */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 87 | static _incrementWidgetCounter(parentElement, childElement) { |
| 88 | const count = (childElement.__widgetCounter || 0) + (childElement.__widget ? 1 : 0); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 89 | if (!count) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 90 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 91 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 92 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 93 | /** @type {?WidgetElement} */ |
| 94 | let currentElement = parentElement; |
| 95 | while (currentElement) { |
| 96 | currentElement.__widgetCounter = (currentElement.__widgetCounter || 0) + count; |
| 97 | currentElement = parentWidgetElementOrShadowHost(currentElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 98 | } |
| 99 | } |
| 100 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 101 | /** |
| 102 | * @param {!WidgetElement} parentElement |
| 103 | * @param {!WidgetElement} childElement |
| 104 | */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 105 | static _decrementWidgetCounter(parentElement, childElement) { |
| 106 | const count = (childElement.__widgetCounter || 0) + (childElement.__widget ? 1 : 0); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 107 | if (!count) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 108 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 109 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 110 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 111 | /** @type {?WidgetElement} */ |
| 112 | let currentElement = parentElement; |
| 113 | while (currentElement) { |
| 114 | if (currentElement.__widgetCounter) { |
| 115 | currentElement.__widgetCounter -= count; |
| 116 | } |
| 117 | currentElement = parentWidgetElementOrShadowHost(currentElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 118 | } |
| 119 | } |
| 120 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 121 | /** |
| 122 | * @param {*} condition |
| 123 | * @param {string} message |
| 124 | */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 125 | static __assert(condition, message) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 126 | if (!condition) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 127 | throw new Error(message); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 128 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 129 | } |
| 130 | |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 131 | markAsRoot() { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 132 | Widget.__assert(!this.element.parentElement, 'Attempt to mark as root attached node'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 133 | this._isRoot = true; |
| 134 | } |
| 135 | |
| 136 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 137 | * @return {?Widget} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 138 | */ |
| 139 | parentWidget() { |
| 140 | return this._parentWidget; |
| 141 | } |
| 142 | |
| 143 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 144 | * @return {!Array.<!Widget>} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 145 | */ |
| 146 | children() { |
| 147 | return this._children; |
| 148 | } |
| 149 | |
| 150 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 151 | * @param {!Widget} widget |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 152 | * @protected |
| 153 | */ |
| 154 | childWasDetached(widget) { |
| 155 | } |
| 156 | |
| 157 | /** |
| 158 | * @return {boolean} |
| 159 | */ |
| 160 | isShowing() { |
| 161 | return this._isShowing; |
| 162 | } |
| 163 | |
| 164 | /** |
| 165 | * @return {boolean} |
| 166 | */ |
| 167 | shouldHideOnDetach() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 168 | if (!this.element.parentElement) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 169 | return false; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 170 | } |
| 171 | if (this._hideOnDetach) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 172 | return true; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 173 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 174 | for (const child of this._children) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 175 | if (child.shouldHideOnDetach()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 176 | return true; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 177 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 178 | } |
| 179 | return false; |
| 180 | } |
| 181 | |
| 182 | setHideOnDetach() { |
| 183 | this._hideOnDetach = true; |
| 184 | } |
| 185 | |
| 186 | /** |
| 187 | * @return {boolean} |
| 188 | */ |
| 189 | _inNotification() { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 190 | return !!this._notificationDepth || !!(this._parentWidget && this._parentWidget._inNotification()); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 191 | } |
| 192 | |
| 193 | _parentIsShowing() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 194 | if (this._isRoot) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 195 | return true; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 196 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 197 | return !!this._parentWidget && this._parentWidget.isShowing(); |
| 198 | } |
| 199 | |
| 200 | /** |
Tim van der Lippe | 403a88d | 2020-05-13 11:51:32 | [diff] [blame] | 201 | * @param {function(this:Widget):void} method |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 202 | */ |
| 203 | _callOnVisibleChildren(method) { |
| 204 | const copy = this._children.slice(); |
| 205 | for (let i = 0; i < copy.length; ++i) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 206 | if (copy[i]._parentWidget === this && copy[i]._visible) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 207 | method.call(copy[i]); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 208 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 209 | } |
| 210 | } |
| 211 | |
| 212 | _processWillShow() { |
| 213 | this._callOnVisibleChildren(this._processWillShow); |
| 214 | this._isShowing = true; |
| 215 | } |
| 216 | |
| 217 | _processWasShown() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 218 | if (this._inNotification()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 219 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 220 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 221 | this.restoreScrollPositions(); |
| 222 | this._notify(this.wasShown); |
| 223 | this._callOnVisibleChildren(this._processWasShown); |
| 224 | } |
| 225 | |
| 226 | _processWillHide() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 227 | if (this._inNotification()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 228 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 229 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 230 | this.storeScrollPositions(); |
| 231 | |
| 232 | this._callOnVisibleChildren(this._processWillHide); |
| 233 | this._notify(this.willHide); |
| 234 | this._isShowing = false; |
| 235 | } |
| 236 | |
| 237 | _processWasHidden() { |
| 238 | this._callOnVisibleChildren(this._processWasHidden); |
| 239 | } |
| 240 | |
| 241 | _processOnResize() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 242 | if (this._inNotification()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 243 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 244 | } |
| 245 | if (!this.isShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 246 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 247 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 248 | this._notify(this.onResize); |
| 249 | this._callOnVisibleChildren(this._processOnResize); |
| 250 | } |
| 251 | |
| 252 | /** |
Tim van der Lippe | 403a88d | 2020-05-13 11:51:32 | [diff] [blame] | 253 | * @param {function(this:Widget):void} notification |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 254 | */ |
| 255 | _notify(notification) { |
| 256 | ++this._notificationDepth; |
| 257 | try { |
| 258 | notification.call(this); |
| 259 | } finally { |
| 260 | --this._notificationDepth; |
| 261 | } |
| 262 | } |
| 263 | |
| 264 | wasShown() { |
| 265 | } |
| 266 | |
| 267 | willHide() { |
| 268 | } |
| 269 | |
| 270 | onResize() { |
| 271 | } |
| 272 | |
| 273 | onLayout() { |
| 274 | } |
| 275 | |
| 276 | ownerViewDisposed() { |
| 277 | } |
| 278 | |
| 279 | /** |
| 280 | * @param {!Element} parentElement |
| 281 | * @param {?Node=} insertBefore |
| 282 | */ |
| 283 | show(parentElement, insertBefore) { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 284 | Widget.__assert(parentElement, 'Attempt to attach widget with no parent element'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 285 | |
| 286 | if (!this._isRoot) { |
| 287 | // Update widget hierarchy. |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 288 | /** @type {?WidgetElement} */ |
| 289 | let currentParent = /** @type {?WidgetElement} */ (parentElement); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 290 | while (currentParent && !currentParent.__widget) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 291 | currentParent = parentWidgetElementOrShadowHost(currentParent); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 292 | } |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 293 | if (!currentParent || !currentParent.__widget) { |
| 294 | throw new Error('Attempt to attach widget to orphan node'); |
| 295 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 296 | this._attach(currentParent.__widget); |
| 297 | } |
| 298 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 299 | this._showWidget(/** @type {!WidgetElement} */ (parentElement), insertBefore); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 300 | } |
| 301 | |
| 302 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 303 | * @param {!Widget} parentWidget |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 304 | */ |
| 305 | _attach(parentWidget) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 306 | if (parentWidget === this._parentWidget) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 307 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 308 | } |
| 309 | if (this._parentWidget) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 310 | this.detach(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 311 | } |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 312 | /** @type {?Widget} */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 313 | this._parentWidget = parentWidget; |
| 314 | this._parentWidget._children.push(this); |
| 315 | this._isRoot = false; |
| 316 | } |
| 317 | |
| 318 | showWidget() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 319 | if (this._visible) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 320 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 321 | } |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 322 | if (!this.element.parentElement) { |
| 323 | throw new Error('Attempt to show widget that is not hidden using hideWidget().'); |
| 324 | } |
| 325 | this._showWidget(/** @type {!WidgetElement} */ (this.element.parentElement), this.element.nextSibling); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 326 | } |
| 327 | |
| 328 | /** |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 329 | * @param {!WidgetElement} parentElement |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 330 | * @param {?Node=} insertBefore |
| 331 | */ |
| 332 | _showWidget(parentElement, insertBefore) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 333 | /** @type {?WidgetElement} */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 334 | let currentParent = parentElement; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 335 | while (currentParent && !currentParent.__widget) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 336 | currentParent = parentWidgetElementOrShadowHost(currentParent); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 337 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 338 | |
| 339 | if (this._isRoot) { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 340 | Widget.__assert(!currentParent, 'Attempt to show root widget under another widget'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 341 | } else { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 342 | Widget.__assert( |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 343 | currentParent && currentParent.__widget === this._parentWidget, |
| 344 | 'Attempt to show under node belonging to alien widget'); |
| 345 | } |
| 346 | |
| 347 | const wasVisible = this._visible; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 348 | if (wasVisible && this.element.parentElement === parentElement) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 349 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 350 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 351 | |
| 352 | this._visible = true; |
| 353 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 354 | if (!wasVisible && this._parentIsShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 355 | this._processWillShow(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 356 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 357 | |
| 358 | this.element.classList.remove('hidden'); |
| 359 | |
| 360 | // Reparent |
| 361 | if (this.element.parentElement !== parentElement) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 362 | if (!this._externallyManaged) { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 363 | Widget._incrementWidgetCounter(parentElement, this.element); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 364 | } |
| 365 | if (insertBefore) { |
Simon Zünd | 1b21f29 | 2020-08-12 05:38:36 | [diff] [blame] | 366 | DOMExtension.DOMExtension.originalInsertBefore.call(parentElement, this.element, insertBefore); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 367 | } else { |
Simon Zünd | 1b21f29 | 2020-08-12 05:38:36 | [diff] [blame] | 368 | DOMExtension.DOMExtension.originalAppendChild.call(parentElement, this.element); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 369 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 370 | } |
| 371 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 372 | if (!wasVisible && this._parentIsShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 373 | this._processWasShown(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 374 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 375 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 376 | if (this._parentWidget && this._hasNonZeroConstraints()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 377 | this._parentWidget.invalidateConstraints(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 378 | } else { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 379 | this._processOnResize(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 380 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 381 | } |
| 382 | |
| 383 | hideWidget() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 384 | if (!this._visible) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 385 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 386 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 387 | this._hideWidget(false); |
| 388 | } |
| 389 | |
| 390 | /** |
| 391 | * @param {boolean} removeFromDOM |
| 392 | */ |
| 393 | _hideWidget(removeFromDOM) { |
| 394 | this._visible = false; |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 395 | const parentElement = /** @type {!WidgetElement} */ (this.element.parentElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 396 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 397 | if (this._parentIsShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 398 | this._processWillHide(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 399 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 400 | |
| 401 | if (removeFromDOM) { |
| 402 | // Force legal removal |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 403 | Widget._decrementWidgetCounter(parentElement, this.element); |
Simon Zünd | 1b21f29 | 2020-08-12 05:38:36 | [diff] [blame] | 404 | DOMExtension.DOMExtension.originalRemoveChild.call(parentElement, this.element); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 405 | } else { |
| 406 | this.element.classList.add('hidden'); |
| 407 | } |
| 408 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 409 | if (this._parentIsShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 410 | this._processWasHidden(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 411 | } |
| 412 | if (this._parentWidget && this._hasNonZeroConstraints()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 413 | this._parentWidget.invalidateConstraints(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 414 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 415 | } |
| 416 | |
| 417 | /** |
Changhao Han | 0b38e24 | 2020-06-08 14:09:06 | [diff] [blame] | 418 | * @param {boolean=} overrideHideOnDetach remove element from DOM instead of hiding |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 419 | */ |
| 420 | detach(overrideHideOnDetach) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 421 | if (!this._parentWidget && !this._isRoot) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 422 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 423 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 424 | |
| 425 | // hideOnDetach means that we should never remove element from dom - content |
| 426 | // has iframes and detaching it will hurt. |
| 427 | // |
| 428 | // overrideHideOnDetach will override hideOnDetach and the client takes |
| 429 | // responsibility for the consequences. |
| 430 | const removeFromDOM = overrideHideOnDetach || !this.shouldHideOnDetach(); |
| 431 | if (this._visible) { |
| 432 | this._hideWidget(removeFromDOM); |
| 433 | } else if (removeFromDOM && this.element.parentElement) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 434 | const parentElement = /** @type {!WidgetElement} */ (this.element.parentElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 435 | // Force kick out from DOM. |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 436 | Widget._decrementWidgetCounter(parentElement, this.element); |
Simon Zünd | 1b21f29 | 2020-08-12 05:38:36 | [diff] [blame] | 437 | DOMExtension.DOMExtension.originalRemoveChild.call(parentElement, this.element); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 438 | } |
| 439 | |
| 440 | // Update widget hierarchy. |
| 441 | if (this._parentWidget) { |
| 442 | const childIndex = this._parentWidget._children.indexOf(this); |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 443 | Widget.__assert(childIndex >= 0, 'Attempt to remove non-child widget'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 444 | this._parentWidget._children.splice(childIndex, 1); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 445 | if (this._parentWidget._defaultFocusedChild === this) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 446 | this._parentWidget._defaultFocusedChild = null; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 447 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 448 | this._parentWidget.childWasDetached(this); |
| 449 | this._parentWidget = null; |
| 450 | } else { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 451 | Widget.__assert(this._isRoot, 'Removing non-root widget from DOM'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 452 | } |
| 453 | } |
| 454 | |
| 455 | detachChildWidgets() { |
| 456 | const children = this._children.slice(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 457 | for (let i = 0; i < children.length; ++i) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 458 | children[i].detach(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 459 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 460 | } |
| 461 | |
| 462 | /** |
| 463 | * @return {!Array.<!Element>} |
| 464 | */ |
| 465 | elementsToRestoreScrollPositionsFor() { |
| 466 | return [this.element]; |
| 467 | } |
| 468 | |
| 469 | storeScrollPositions() { |
| 470 | const elements = this.elementsToRestoreScrollPositionsFor(); |
Simon Zünd | de14eae | 2020-08-12 05:49:42 | [diff] [blame] | 471 | for (const container of elements) { |
| 472 | storedScrollPositions.set(container, {scrollLeft: container.scrollLeft, scrollTop: container.scrollTop}); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 473 | } |
| 474 | } |
| 475 | |
| 476 | restoreScrollPositions() { |
| 477 | const elements = this.elementsToRestoreScrollPositionsFor(); |
Simon Zünd | de14eae | 2020-08-12 05:49:42 | [diff] [blame] | 478 | for (const container of elements) { |
| 479 | const storedPositions = storedScrollPositions.get(container); |
| 480 | if (storedPositions) { |
| 481 | container.scrollLeft = storedPositions.scrollLeft; |
| 482 | container.scrollTop = storedPositions.scrollTop; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 483 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 484 | } |
| 485 | } |
| 486 | |
| 487 | doResize() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 488 | if (!this.isShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 489 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 490 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 491 | // No matter what notification we are in, dispatching onResize is not needed. |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 492 | if (!this._inNotification()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 493 | this._callOnVisibleChildren(this._processOnResize); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 494 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 495 | } |
| 496 | |
| 497 | doLayout() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 498 | if (!this.isShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 499 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 500 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 501 | this._notify(this.onLayout); |
| 502 | this.doResize(); |
| 503 | } |
| 504 | |
| 505 | /** |
| 506 | * @param {string} cssFile |
Jack Franklin | 71519f8 | 2020-11-03 12:08:59 | [diff] [blame^] | 507 | * @param {!{enableLegacyPatching:boolean}} options |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 508 | */ |
Jack Franklin | 71519f8 | 2020-11-03 12:08:59 | [diff] [blame^] | 509 | registerRequiredCSS(cssFile, options) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 510 | if (this._isWebComponent) { |
Jack Franklin | 71519f8 | 2020-11-03 12:08:59 | [diff] [blame^] | 511 | appendStyle(/** @type {!DocumentFragment} */ (this._shadowRoot), cssFile, options); |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 512 | } else { |
Jack Franklin | 71519f8 | 2020-11-03 12:08:59 | [diff] [blame^] | 513 | appendStyle(this.element, cssFile, options); |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 514 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 515 | } |
| 516 | |
| 517 | printWidgetHierarchy() { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 518 | /** @type {!Array<string>} */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 519 | const lines = []; |
| 520 | this._collectWidgetHierarchy('', lines); |
| 521 | console.log(lines.join('\n')); // eslint-disable-line no-console |
| 522 | } |
| 523 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 524 | /** |
| 525 | * @param {string} prefix |
| 526 | * @param {!Array<string>} lines |
| 527 | */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 528 | _collectWidgetHierarchy(prefix, lines) { |
| 529 | lines.push(prefix + '[' + this.element.className + ']' + (this._children.length ? ' {' : '')); |
| 530 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 531 | for (let i = 0; i < this._children.length; ++i) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 532 | this._children[i]._collectWidgetHierarchy(prefix + ' ', lines); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 533 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 534 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 535 | if (this._children.length) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 536 | lines.push(prefix + '}'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 537 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 538 | } |
| 539 | |
| 540 | /** |
| 541 | * @param {?Element} element |
| 542 | */ |
| 543 | setDefaultFocusedElement(element) { |
| 544 | this._defaultFocusedElement = element; |
| 545 | } |
| 546 | |
| 547 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 548 | * @param {!Widget} child |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 549 | */ |
| 550 | setDefaultFocusedChild(child) { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 551 | Widget.__assert(child._parentWidget === this, 'Attempt to set non-child widget as default focused.'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 552 | this._defaultFocusedChild = child; |
| 553 | } |
| 554 | |
| 555 | focus() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 556 | if (!this.isShowing()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 557 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 558 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 559 | |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 560 | const element = /** @type {?HTMLElement} */ (this._defaultFocusedElement); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 561 | if (element) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 562 | if (!element.hasFocus()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 563 | element.focus(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 564 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 565 | return; |
| 566 | } |
| 567 | |
| 568 | if (this._defaultFocusedChild && this._defaultFocusedChild._visible) { |
| 569 | this._defaultFocusedChild.focus(); |
| 570 | } else { |
| 571 | for (const child of this._children) { |
| 572 | if (child._visible) { |
| 573 | child.focus(); |
| 574 | return; |
| 575 | } |
| 576 | } |
| 577 | let child = this.contentElement.traverseNextNode(this.contentElement); |
| 578 | while (child) { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 579 | if (child instanceof XWidget) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 580 | child.focus(); |
| 581 | return; |
| 582 | } |
| 583 | child = child.traverseNextNode(this.contentElement); |
| 584 | } |
| 585 | } |
| 586 | } |
| 587 | |
| 588 | /** |
| 589 | * @return {boolean} |
| 590 | */ |
| 591 | hasFocus() { |
| 592 | return this.element.hasFocus(); |
| 593 | } |
| 594 | |
| 595 | /** |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 596 | * @return {!Constraints} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 597 | */ |
| 598 | calculateConstraints() { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 599 | return new Constraints(); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 600 | } |
| 601 | |
| 602 | /** |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 603 | * @return {!Constraints} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 604 | */ |
| 605 | constraints() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 606 | if (typeof this._constraints !== 'undefined') { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 607 | return this._constraints; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 608 | } |
| 609 | if (typeof this._cachedConstraints === 'undefined') { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 610 | this._cachedConstraints = this.calculateConstraints(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 611 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 612 | return this._cachedConstraints; |
| 613 | } |
| 614 | |
| 615 | /** |
| 616 | * @param {number} width |
| 617 | * @param {number} height |
| 618 | * @param {number} preferredWidth |
| 619 | * @param {number} preferredHeight |
| 620 | */ |
| 621 | setMinimumAndPreferredSizes(width, height, preferredWidth, preferredHeight) { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 622 | this._constraints = new Constraints(new Size(width, height), new Size(preferredWidth, preferredHeight)); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 623 | this.invalidateConstraints(); |
| 624 | } |
| 625 | |
| 626 | /** |
| 627 | * @param {number} width |
| 628 | * @param {number} height |
| 629 | */ |
| 630 | setMinimumSize(width, height) { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 631 | this._constraints = new Constraints(new Size(width, height)); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 632 | this.invalidateConstraints(); |
| 633 | } |
| 634 | |
| 635 | /** |
| 636 | * @return {boolean} |
| 637 | */ |
| 638 | _hasNonZeroConstraints() { |
| 639 | const constraints = this.constraints(); |
| 640 | return !!( |
| 641 | constraints.minimum.width || constraints.minimum.height || constraints.preferred.width || |
| 642 | constraints.preferred.height); |
| 643 | } |
| 644 | |
| 645 | suspendInvalidations() { |
| 646 | ++this._invalidationsSuspended; |
| 647 | } |
| 648 | |
| 649 | resumeInvalidations() { |
| 650 | --this._invalidationsSuspended; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 651 | if (!this._invalidationsSuspended && this._invalidationsRequested) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 652 | this.invalidateConstraints(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 653 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 654 | } |
| 655 | |
| 656 | invalidateConstraints() { |
| 657 | if (this._invalidationsSuspended) { |
| 658 | this._invalidationsRequested = true; |
| 659 | return; |
| 660 | } |
| 661 | this._invalidationsRequested = false; |
| 662 | const cached = this._cachedConstraints; |
| 663 | delete this._cachedConstraints; |
| 664 | const actual = this.constraints(); |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 665 | if (!actual.isEqual(cached || null) && this._parentWidget) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 666 | this._parentWidget.invalidateConstraints(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 667 | } else { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 668 | this.doLayout(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 669 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 670 | } |
Olivia Flynn | 1d938e4 | 2019-09-23 08:13:40 | [diff] [blame] | 671 | |
| 672 | // Excludes the widget from being tracked by its parents/ancestors via |
| 673 | // __widgetCounter because the widget is being handled by external code. |
| 674 | // Widgets marked as being externally managed are responsible for |
| 675 | // finishing out their own lifecycle (i.e. calling detach() before being |
| 676 | // removed from the DOM). This is e.g. used for CodeMirror. |
| 677 | // |
| 678 | // Also note that this must be called before the widget is shown so that |
| 679 | // so that its ancestor's __widgetCounter is not incremented. |
| 680 | markAsExternallyManaged() { |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 681 | Widget.__assert(!this._parentWidget, 'Attempt to mark widget as externally managed after insertion to the DOM'); |
Olivia Flynn | 1d938e4 | 2019-09-23 08:13:40 | [diff] [blame] | 682 | this._externallyManaged = true; |
| 683 | } |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 684 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 685 | |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 686 | /** |
Simon Zünd | de14eae | 2020-08-12 05:49:42 | [diff] [blame] | 687 | * @type {!WeakMap<!Element, !{ scrollLeft: number, scrollTop: number }>} |
| 688 | */ |
| 689 | const storedScrollPositions = new WeakMap(); |
| 690 | |
| 691 | /** |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 692 | * @unrestricted |
| 693 | */ |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 694 | export class VBox extends Widget { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 695 | /** |
| 696 | * @param {boolean=} isWebComponent |
Joel Einbinder | 7fbe24c | 2019-01-24 05:19:01 | [diff] [blame] | 697 | * @param {boolean=} delegatesFocus |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 698 | */ |
Joel Einbinder | 7fbe24c | 2019-01-24 05:19:01 | [diff] [blame] | 699 | constructor(isWebComponent, delegatesFocus) { |
| 700 | super(isWebComponent, delegatesFocus); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 701 | this.contentElement.classList.add('vbox'); |
| 702 | } |
| 703 | |
| 704 | /** |
| 705 | * @override |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 706 | * @return {!Constraints} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 707 | */ |
| 708 | calculateConstraints() { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 709 | let constraints = new Constraints(); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 710 | |
| 711 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 712 | * @this {!Widget} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 713 | * @suppressReceiverCheck |
| 714 | */ |
| 715 | function updateForChild() { |
| 716 | const child = this.constraints(); |
| 717 | constraints = constraints.widthToMax(child); |
| 718 | constraints = constraints.addHeight(child); |
| 719 | } |
| 720 | |
| 721 | this._callOnVisibleChildren(updateForChild); |
| 722 | return constraints; |
| 723 | } |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 724 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 725 | |
| 726 | /** |
| 727 | * @unrestricted |
| 728 | */ |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 729 | export class HBox extends Widget { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 730 | /** |
| 731 | * @param {boolean=} isWebComponent |
| 732 | */ |
| 733 | constructor(isWebComponent) { |
| 734 | super(isWebComponent); |
| 735 | this.contentElement.classList.add('hbox'); |
| 736 | } |
| 737 | |
| 738 | /** |
| 739 | * @override |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 740 | * @return {!Constraints} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 741 | */ |
| 742 | calculateConstraints() { |
Paul Lewis | 9950e18 | 2019-12-16 16:06:07 | [diff] [blame] | 743 | let constraints = new Constraints(); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 744 | |
| 745 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 746 | * @this {!Widget} |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 747 | * @suppressReceiverCheck |
| 748 | */ |
| 749 | function updateForChild() { |
| 750 | const child = this.constraints(); |
| 751 | constraints = constraints.addWidth(child); |
| 752 | constraints = constraints.heightToMax(child); |
| 753 | } |
| 754 | |
| 755 | this._callOnVisibleChildren(updateForChild); |
| 756 | return constraints; |
| 757 | } |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 758 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 759 | |
| 760 | /** |
| 761 | * @unrestricted |
| 762 | */ |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 763 | export class VBoxWithResizeCallback extends VBox { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 764 | /** |
Tim van der Lippe | 403a88d | 2020-05-13 11:51:32 | [diff] [blame] | 765 | * @param {function():void} resizeCallback |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 766 | */ |
| 767 | constructor(resizeCallback) { |
| 768 | super(); |
| 769 | this._resizeCallback = resizeCallback; |
| 770 | } |
| 771 | |
| 772 | /** |
| 773 | * @override |
| 774 | */ |
| 775 | onResize() { |
| 776 | this._resizeCallback(); |
| 777 | } |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 778 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 779 | |
| 780 | /** |
| 781 | * @unrestricted |
| 782 | */ |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 783 | export class WidgetFocusRestorer { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 784 | /** |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 785 | * @param {!Widget} widget |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 786 | */ |
| 787 | constructor(widget) { |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 788 | /** @type {?Widget} */ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 789 | this._widget = widget; |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 790 | /** @type {?HTMLElement} */ |
| 791 | this._previous = /** @type {?HTMLElement} */ (widget.element.ownerDocument.deepActiveElement()); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 792 | widget.focus(); |
| 793 | } |
| 794 | |
| 795 | restore() { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 796 | if (!this._widget) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 797 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 798 | } |
| 799 | if (this._widget.hasFocus() && this._previous) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 800 | this._previous.focus(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 801 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 802 | this._previous = null; |
| 803 | this._widget = null; |
| 804 | } |
Tim van der Lippe | 0830b3d | 2019-10-03 13:20:07 | [diff] [blame] | 805 | } |
Simon Zünd | 10ebfaf | 2020-08-12 05:55:32 | [diff] [blame] | 806 | |
| 807 | /** |
| 808 | * @param {!WidgetElement} element |
| 809 | * @return {?WidgetElement} |
| 810 | */ |
| 811 | function parentWidgetElementOrShadowHost(element) { |
| 812 | return /** @type {?WidgetElement} */ (element.parentElementOrShadowHost()); |
| 813 | } |