Home

# Class goog.ui.ModalPopup

Base class for modal popup UI components. This can also be used as a standalone component to render a modal popup with an empty div. WARNING: goog.ui.ModalPopup is only guaranteed to work when it is rendered directly in the 'body' element. The Html structure of the modal popup is:

    Element         Function              Class-name, goog-modalpopup = default
    ----------------------------------------------------------------------------
    - iframe         Iframe mask           goog-modalpopup-bg
    - div            Background mask       goog-modalpopup-bg
    - div            Modal popup area      goog-modalpopup
    - span           Tab catcher

extends goog.ui.Component

Instance Method Summary
| `canDecorate(?Element element) ⇒ boolean` Determines if a given element can be decorated by this type of component. This method should be overridden by inheriting objects.
| `createDom()` Creates the initial DOM representation for the modal popup. Overrides {@link goog.ui.Component#createDom}.
| `createTabCatcher_()` Creates the tab catcher element.
| `decorateInternal(?Element element)` Actually decorates the element. Should be overridden by inheriting objects. This method can assume there are checks to ensure the component has not already been rendered have occurred and that enter document will be called afterwards. This method is considered protected.
| `disposeInternal()` Disposes of the component. Calls {@code exitDocument}, which is expected to remove event handlers and clean up the component. Propagates the call to the component's children, if any. Removes the component's DOM from the document unless it was decorated.
| `enterDocument()` Called when the component's element is known to be in the document. Anything using document.getElementById etc. should be done at this stage. If the component contains child components, this call is propagated to its children.
| `exitDocument()` Called by dispose to clean up the elements and listeners created by a component, or by a parent component/application who has removed the component from the document but wants to reuse it later. If the component contains child components, this call is propagated to its children. It should be possible for the component to be rendered again once this method has been called.
| `focus()` Focuses on the modal popup.
| `focusElement_()` Moves the focus to the modal popup.
| `getBackgroundElement() ⇒ ?Element` Returns the background mask element.
| `getBackgroundIframe() ⇒ ?Element` Returns the background iframe mask element, if any.
| `getCssClass() ⇒ string`
| `hide_()` Hides the popup.
| `isVisible() ⇒ boolean`
| `manageBackgroundDom_()` Creates and disposes of the DOM for background mask elements.
| `onFocus_(?goog.events.BrowserEvent e)` Handles focus events. Makes sure that if the user tabs past the elements in the modal popup, the focus wraps back to the beginning.
| `onHide_()` Called after the popup is hidden.
| `onShow_()` Called after the popup is shown.
| `renderBackground_()` Renders the background mask.
| `reposition()` Centers the modal popup in the viewport, taking scrolling into account.
| `resizeBackground_()` Make the background element the size of the document. NOTE(user): We must hide the background element before measuring the document, otherwise the size of the background will stop the document from shrinking to fit a smaller window. This does cause a slight flicker in Linux browsers, but should not be a common scenario.
| `setTransition(!goog.fx.Transition popupShowTransition, !goog.fx.Transition popupHideTransition, !goog.fx.Transition bgShowTransition, !goog.fx.Transition bgHideTransition)` Sets the transitions to show and hide the popup and background.
| `setVisible(boolean visible)` Sets the visibility of the modal popup box and focus to the popup. Lazily renders the component if needed.
| `showPopupElement_(boolean visible)` Shows or hides the popup element.
| `show_()` Shows the popup.