Dialog.js 3.4 KB

12345678910111213141516171819202122
  1. export default class Dialog extends UI.GlassPane{constructor(){super();this.registerRequiredCSS('ui/dialog.css');this.contentElement.tabIndex=0;this.contentElement.addEventListener('focus',()=>this.widget().focus(),false);this.widget().setDefaultFocusedElement(this.contentElement);this.setPointerEventsBehavior(UI.GlassPane.PointerEventsBehavior.BlockedByGlassPane);this.setOutsideClickCallback(event=>{this.hide();event.consume(true);});UI.ARIAUtils.markAsModalDialog(this.contentElement);this._tabIndexBehavior=OutsideTabIndexBehavior.DisableAllOutsideTabIndex;this._tabIndexMap=new Map();this._focusRestorer=null;this._closeOnEscape=true;this._targetDocument;this._targetDocumentKeyDownHandler=this._onKeyDown.bind(this);}
  2. static hasInstance(){return!!UI.Dialog._instance;}
  3. show(where){const document=(where instanceof Document?where:(where||UI.inspectorView.element).ownerDocument);this._targetDocument=document;this._targetDocument.addEventListener('keydown',this._targetDocumentKeyDownHandler,true);if(UI.Dialog._instance){UI.Dialog._instance.hide();}
  4. UI.Dialog._instance=this;this._disableTabIndexOnElements(document);super.show(document);this._focusRestorer=new UI.WidgetFocusRestorer(this.widget());}
  5. hide(){this._focusRestorer.restore();super.hide();if(this._targetDocument){this._targetDocument.removeEventListener('keydown',this._targetDocumentKeyDownHandler,true);}
  6. this._restoreTabIndexOnElements();delete UI.Dialog._instance;}
  7. setCloseOnEscape(close){this._closeOnEscape=close;}
  8. addCloseButton(){const closeButton=this.contentElement.createChild('div','dialog-close-button','dt-close-button');closeButton.gray=true;closeButton.addEventListener('click',()=>this.hide(),false);}
  9. setOutsideTabIndexBehavior(tabIndexBehavior){this._tabIndexBehavior=tabIndexBehavior;}
  10. _disableTabIndexOnElements(document){if(this._tabIndexBehavior===OutsideTabIndexBehavior.PreserveTabIndex){return;}
  11. let exclusionSet=(null);if(this._tabIndexBehavior===OutsideTabIndexBehavior.PreserveMainViewTabIndex){exclusionSet=this._getMainWidgetTabIndexElements(UI.inspectorView.ownerSplit());}
  12. this._tabIndexMap.clear();for(let node=document;node;node=node.traverseNextNode(document)){if(node instanceof HTMLElement){const element=(node);const tabIndex=element.tabIndex;if(tabIndex>=0&&(!exclusionSet||!exclusionSet.has(element))){this._tabIndexMap.set(element,tabIndex);element.tabIndex=-1;}}}}
  13. _getMainWidgetTabIndexElements(splitWidget){const elementSet=(new Set());if(!splitWidget){return elementSet;}
  14. const mainWidget=splitWidget.mainWidget();if(!mainWidget||!mainWidget.element){return elementSet;}
  15. for(let node=mainWidget.element;node;node=node.traverseNextNode(mainWidget.element)){if(!(node instanceof HTMLElement)){continue;}
  16. const element=(node);const tabIndex=element.tabIndex;if(tabIndex<0){continue;}
  17. elementSet.add(element);}
  18. return elementSet;}
  19. _restoreTabIndexOnElements(){for(const element of this._tabIndexMap.keys()){element.tabIndex=(this._tabIndexMap.get(element));}
  20. this._tabIndexMap.clear();}
  21. _onKeyDown(event){if(this._closeOnEscape&&event.keyCode===UI.KeyboardShortcut.Keys.Esc.code&&UI.KeyboardShortcut.hasNoModifiers(event)){event.consume(true);this.hide();}}}
  22. export const OutsideTabIndexBehavior={DisableAllOutsideTabIndex:Symbol('DisableAllTabIndex'),PreserveMainViewTabIndex:Symbol('PreserveMainViewTabIndex'),PreserveTabIndex:Symbol('PreserveTabIndex')};self.UI=self.UI||{};UI=UI||{};UI.Dialog=Dialog;UI.Dialog.OutsideTabIndexBehavior=OutsideTabIndexBehavior;