1 // Copyright 2014 The Chromium Authors. All rights reserved. 2 // Use of this source code is governed by a BSD-style license that can be 3 // found in the LICENSE file. 4 5 /** 6 * @constructor 7 * @extends {WebInspector.App} 8 */ 9 WebInspector.AdvancedApp = function() 10 { 11 WebInspector.App.call(this); 12 WebInspector.dockController.addEventListener(WebInspector.DockController.Events.BeforeDockSideChanged, this._openToolboxWindow, this); 13 }; 14 15 WebInspector.AdvancedApp.prototype = { 16 createRootView: function() 17 { 18 var rootView = new WebInspector.RootView(); 19 20 this._rootSplitView = new WebInspector.SplitView(false, true, WebInspector.dockController.canDock() ? "InspectorView.splitViewState" : "InspectorView.dummySplitViewState", 300, 300, true); 21 this._rootSplitView.show(rootView.element); 22 23 WebInspector.inspectorView.show(this._rootSplitView.sidebarElement()); 24 25 this._inspectedPagePlaceholder = new WebInspector.InspectedPagePlaceholder(); 26 this._inspectedPagePlaceholder.addEventListener(WebInspector.InspectedPagePlaceholder.Events.Update, this._onSetInspectedPageBounds.bind(this, false), this); 27 if (WebInspector.experimentsSettings.responsiveDesign.isEnabled()) { 28 this._responsiveDesignView = new WebInspector.ResponsiveDesignView(this._inspectedPagePlaceholder); 29 this._responsiveDesignView.show(this._rootSplitView.mainElement()); 30 } else { 31 this._inspectedPagePlaceholder.show(this._rootSplitView.mainElement()); 32 } 33 34 WebInspector.dockController.addEventListener(WebInspector.DockController.Events.BeforeDockSideChanged, this._onBeforeDockSideChange, this); 35 WebInspector.dockController.addEventListener(WebInspector.DockController.Events.DockSideChanged, this._onDockSideChange, this); 36 WebInspector.dockController.addEventListener(WebInspector.DockController.Events.AfterDockSideChanged, this._onAfterDockSideChange, this); 37 this._onDockSideChange(); 38 39 rootView.attachToBody(); 40 }, 41 42 /** 43 * @param {!WebInspector.Event} event 44 */ 45 _openToolboxWindow: function(event) 46 { 47 if (/** @type {string} */ (event.data.to) !== WebInspector.DockController.State.Undocked) 48 return; 49 50 if (this._toolboxWindow || !WebInspector.experimentsSettings.responsiveDesign.isEnabled()) 51 return; 52 53 var toolbox = (window.location.search ? "&" : "?") + "toolbox=true"; 54 var hash = window.location.hash; 55 var url = window.location.href.replace(hash, "") + toolbox + hash; 56 this._toolboxWindow = window.open(url, undefined); 57 }, 58 59 /** 60 * @param {!WebInspector.Toolbox} toolbox 61 */ 62 _toolboxLoaded: function(toolbox) 63 { 64 this._toolbox = toolbox; 65 this._updatePageResizer(); 66 }, 67 68 _updatePageResizer: function() 69 { 70 if (!WebInspector.experimentsSettings.responsiveDesign.isEnabled()) 71 return; 72 73 if (this._isDocked()) 74 this._responsiveDesignView.updatePageResizer(); 75 else if (this._toolbox) 76 this._toolbox._responsiveDesignView.updatePageResizer(); 77 }, 78 79 /** 80 * @param {!WebInspector.Event} event 81 */ 82 _onBeforeDockSideChange: function(event) 83 { 84 if (/** @type {string} */ (event.data.to) === WebInspector.DockController.State.Undocked && this._toolbox) { 85 // Hide inspectorView and force layout to mimic the undocked state. 86 this._rootSplitView.hideSidebar(); 87 this._inspectedPagePlaceholder.update(); 88 } 89 90 this._changingDockSide = true; 91 }, 92 93 /** 94 * @param {!WebInspector.Event=} event 95 */ 96 _onDockSideChange: function(event) 97 { 98 this._updatePageResizer(); 99 100 var toDockSide = event ? /** @type {string} */ (event.data.to) : WebInspector.dockController.dockSide(); 101 if (toDockSide === WebInspector.DockController.State.Undocked) { 102 this._updateForUndocked(); 103 } else if (this._toolbox && event && /** @type {string} */ (event.data.from) === WebInspector.DockController.State.Undocked) { 104 // Don't update yet for smooth transition. 105 this._rootSplitView.hideSidebar(); 106 } else { 107 this._updateForDocked(toDockSide); 108 } 109 }, 110 111 /** 112 * @param {!WebInspector.Event} event 113 */ 114 _onAfterDockSideChange: function(event) 115 { 116 // We may get here on the first dock side change while loading without BeforeDockSideChange. 117 if (!this._changingDockSide) 118 return; 119 this._changingDockSide = false; 120 if (/** @type {string} */ (event.data.from) === WebInspector.DockController.State.Undocked) { 121 // Restore docked layout in case of smooth transition. 122 this._updateForDocked(/** @type {string} */ (event.data.to)); 123 } 124 this._inspectedPagePlaceholder.update(); 125 }, 126 127 /** 128 * @param {string} dockSide 129 */ 130 _updateForDocked: function(dockSide) 131 { 132 this._rootSplitView.setVertical(dockSide === WebInspector.DockController.State.DockedToLeft || dockSide === WebInspector.DockController.State.DockedToRight); 133 this._rootSplitView.setSecondIsSidebar(dockSide === WebInspector.DockController.State.DockedToRight || dockSide === WebInspector.DockController.State.DockedToBottom); 134 this._rootSplitView.toggleResizer(this._rootSplitView.resizerElement(), true); 135 this._rootSplitView.toggleResizer(WebInspector.inspectorView.topResizerElement(), dockSide === WebInspector.DockController.State.DockedToBottom); 136 this._rootSplitView.showBoth(); 137 }, 138 139 _updateForUndocked: function() 140 { 141 this._rootSplitView.toggleResizer(this._rootSplitView.resizerElement(), false); 142 this._rootSplitView.toggleResizer(WebInspector.inspectorView.topResizerElement(), false); 143 this._rootSplitView.hideMain(); 144 }, 145 146 _isDocked: function() 147 { 148 return WebInspector.dockController.dockSide() !== WebInspector.DockController.State.Undocked; 149 }, 150 151 /** 152 * @param {boolean} toolbox 153 * @param {!WebInspector.Event} event 154 */ 155 _onSetInspectedPageBounds: function(toolbox, event) 156 { 157 if (this._changingDockSide || (this._isDocked() === toolbox)) 158 return; 159 if (!window.innerWidth || !window.innerHeight) 160 return; 161 var bounds = /** @type {{x: number, y: number, width: number, height: number}} */ (event.data); 162 InspectorFrontendHost.setInspectedPageBounds(bounds); 163 }, 164 165 __proto__: WebInspector.App.prototype 166 }; 167 168 /** 169 * @constructor 170 */ 171 WebInspector.Toolbox = function() 172 { 173 if (!window.opener) 174 return; 175 176 WebInspector.zoomManager = window.opener.WebInspector.zoomManager; 177 WebInspector.overridesSupport = window.opener.WebInspector.overridesSupport; 178 WebInspector.settings = window.opener.WebInspector.settings; 179 WebInspector.experimentsSettings = window.opener.WebInspector.experimentsSettings; 180 WebInspector.cssModel = window.opener.WebInspector.cssModel; 181 WebInspector.domModel = window.opener.WebInspector.domModel; 182 WebInspector.workspace = window.opener.WebInspector.workspace; 183 WebInspector.Revealer = window.opener.WebInspector.Revealer; 184 WebInspector.installPortStyles(); 185 186 var advancedApp = /** @type {!WebInspector.AdvancedApp} */ (window.opener.WebInspector.app); 187 var rootView = new WebInspector.RootView(); 188 this._inspectedPagePlaceholder = new WebInspector.InspectedPagePlaceholder(); 189 this._inspectedPagePlaceholder.addEventListener(WebInspector.InspectedPagePlaceholder.Events.Update, advancedApp._onSetInspectedPageBounds.bind(advancedApp, true)); 190 if (WebInspector.experimentsSettings.responsiveDesign.isEnabled()) { 191 this._responsiveDesignView = new WebInspector.ResponsiveDesignView(this._inspectedPagePlaceholder); 192 this._responsiveDesignView.show(rootView.element); 193 } else { 194 this._inspectedPagePlaceholder.show(rootView.element); 195 } 196 rootView.attachToBody(); 197 advancedApp._toolboxLoaded(this); 198 } 199