InspectorView.js 6.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. export default class InspectorView extends UI.VBox{constructor(){super();UI.GlassPane.setContainer(this.element);this.setMinimumSize(240,72);this._drawerSplitWidget=new UI.SplitWidget(false,true,'Inspector.drawerSplitViewState',200,200);this._drawerSplitWidget.hideSidebar();this._drawerSplitWidget.hideDefaultResizer();this._drawerSplitWidget.enableShowModeSaving();this._drawerSplitWidget.show(this.element);this._drawerTabbedLocation=UI.viewManager.createTabbedLocation(this._showDrawer.bind(this,false),'drawer-view',true,true);const moreTabsButton=this._drawerTabbedLocation.enableMoreTabsButton();moreTabsButton.setTitle(ls`More Tools`);this._drawerTabbedPane=this._drawerTabbedLocation.tabbedPane();this._drawerTabbedPane.setMinimumSize(0,27);const closeDrawerButton=new UI.ToolbarButton(Common.UIString('Close drawer'),'largeicon-delete');closeDrawerButton.addEventListener(UI.ToolbarButton.Events.Click,this._closeDrawer,this);this._drawerSplitWidget.installResizer(this._drawerTabbedPane.headerElement());this._drawerTabbedPane.addEventListener(UI.TabbedPane.Events.TabSelected,this._drawerTabSelected,this);this._drawerSplitWidget.setSidebarWidget(this._drawerTabbedPane);this._drawerTabbedPane.rightToolbar().appendToolbarItem(closeDrawerButton);this._tabbedLocation=UI.viewManager.createTabbedLocation(Host.InspectorFrontendHost.bringToFront.bind(Host.InspectorFrontendHost),'panel',true,true,Root.Runtime.queryParam('panel'));this._tabbedPane=this._tabbedLocation.tabbedPane();this._tabbedPane.registerRequiredCSS('ui/inspectorViewTabbedPane.css');this._tabbedPane.addEventListener(UI.TabbedPane.Events.TabSelected,this._tabSelected,this);this._tabbedPane.setAccessibleName(Common.UIString('Panels'));Host.userMetrics.setLaunchPanel(this._tabbedPane.selectedTabId);if(Host.isUnderTest()){this._tabbedPane.setAutoSelectFirstItemOnShow(false);}
  2. this._drawerSplitWidget.setMainWidget(this._tabbedPane);this._keyDownBound=this._keyDown.bind(this);Host.InspectorFrontendHost.events.addEventListener(Host.InspectorFrontendHostAPI.Events.ShowPanel,showPanel.bind(this));function showPanel(event){const panelName=(event.data);this.showPanel(panelName);}}
  3. static instance(){return(self.runtime.sharedInstance(InspectorView));}
  4. wasShown(){this.element.ownerDocument.addEventListener('keydown',this._keyDownBound,false);}
  5. willHide(){this.element.ownerDocument.removeEventListener('keydown',this._keyDownBound,false);}
  6. resolveLocation(locationName){if(locationName==='drawer-view'){return this._drawerTabbedLocation;}
  7. if(locationName==='panel'){return this._tabbedLocation;}
  8. return null;}
  9. createToolbars(){this._tabbedPane.leftToolbar().appendItemsAtLocation('main-toolbar-left');this._tabbedPane.rightToolbar().appendItemsAtLocation('main-toolbar-right');}
  10. addPanel(view){this._tabbedLocation.appendView(view);}
  11. hasPanel(panelName){return this._tabbedPane.hasTab(panelName);}
  12. panel(panelName){return(UI.viewManager.view(panelName).widget());}
  13. onSuspendStateChanged(allTargetsSuspended){this._currentPanelLocked=allTargetsSuspended;this._tabbedPane.setCurrentTabLocked(this._currentPanelLocked);this._tabbedPane.leftToolbar().setEnabled(!this._currentPanelLocked);this._tabbedPane.rightToolbar().setEnabled(!this._currentPanelLocked);}
  14. canSelectPanel(panelName){return!this._currentPanelLocked||this._tabbedPane.selectedTabId===panelName;}
  15. showPanel(panelName){return UI.viewManager.showView(panelName);}
  16. setPanelIcon(panelName,icon){this._tabbedPane.setTabIcon(panelName,icon);}
  17. currentPanelDeprecated(){return(UI.viewManager.materializedWidget(this._tabbedPane.selectedTabId||''));}
  18. _showDrawer(focus){if(this._drawerTabbedPane.isShowing()){return;}
  19. this._drawerSplitWidget.showBoth();if(focus){this._focusRestorer=new UI.WidgetFocusRestorer(this._drawerTabbedPane);}else{this._focusRestorer=null;}}
  20. drawerVisible(){return this._drawerTabbedPane.isShowing();}
  21. _closeDrawer(){if(!this._drawerTabbedPane.isShowing()){return;}
  22. if(this._focusRestorer){this._focusRestorer.restore();}
  23. this._drawerSplitWidget.hideSidebar(true);}
  24. setDrawerMinimized(minimized){this._drawerSplitWidget.setSidebarMinimized(minimized);this._drawerSplitWidget.setResizable(!minimized);}
  25. isDrawerMinimized(){return this._drawerSplitWidget.isSidebarMinimized();}
  26. closeDrawerTab(id,userGesture){this._drawerTabbedPane.closeTab(id,userGesture);}
  27. _keyDown(event){const keyboardEvent=(event);if(!UI.KeyboardShortcut.eventHasCtrlOrMeta(keyboardEvent)||event.altKey||event.shiftKey){return;}
  28. const panelShortcutEnabled=Common.moduleSetting('shortcutPanelSwitch').get();if(panelShortcutEnabled){let panelIndex=-1;if(event.keyCode>0x30&&event.keyCode<0x3A){panelIndex=event.keyCode-0x31;}else if(event.keyCode>0x60&&event.keyCode<0x6A&&keyboardEvent.location===KeyboardEvent.DOM_KEY_LOCATION_NUMPAD){panelIndex=event.keyCode-0x61;}
  29. if(panelIndex!==-1){const panelName=this._tabbedPane.tabIds()[panelIndex];if(panelName){if(!UI.Dialog.hasInstance()&&!this._currentPanelLocked){this.showPanel(panelName);}
  30. event.consume(true);}}}}
  31. onResize(){UI.GlassPane.containerMoved(this.element);}
  32. topResizerElement(){return this._tabbedPane.headerElement();}
  33. toolbarItemResized(){this._tabbedPane.headerResized();}
  34. _tabSelected(event){const tabId=(event.data['tabId']);Host.userMetrics.panelShown(tabId);}
  35. _drawerTabSelected(event){const tabId=(event.data['tabId']);Host.userMetrics.drawerShown(tabId);}
  36. setOwnerSplit(splitWidget){this._ownerSplitWidget=splitWidget;}
  37. ownerSplit(){return this._ownerSplitWidget;}
  38. minimize(){if(this._ownerSplitWidget){this._ownerSplitWidget.setSidebarMinimized(true);}}
  39. restore(){if(this._ownerSplitWidget){this._ownerSplitWidget.setSidebarMinimized(false);}}}
  40. export class ActionDelegate{handleAction(context,actionId){switch(actionId){case'main.toggle-drawer':if(UI.inspectorView.drawerVisible()){UI.inspectorView._closeDrawer();}else{UI.inspectorView._showDrawer(true);}
  41. return true;case'main.next-tab':UI.inspectorView._tabbedPane.selectNextTab();UI.inspectorView._tabbedPane.focus();return true;case'main.previous-tab':UI.inspectorView._tabbedPane.selectPrevTab();UI.inspectorView._tabbedPane.focus();return true;}
  42. return false;}}
  43. self.UI=self.UI||{};UI=UI||{};UI.InspectorView=InspectorView;UI.InspectorView.ActionDelegate=ActionDelegate;UI.inspectorView;