/**
* @constructor
- * @extends {WebInspector.View}
+ * @extends {WebInspector.VBox}
*/
WebInspector.InspectorView = function()
{
- WebInspector.View.call(this);
- this.markAsRoot();
- this.element.classList.add("fill", "inspector-view");
- this.element.setAttribute("spellcheck", false);
-
- // We can use split view either for docking or screencast, but not together.
- var settingName = WebInspector.queryParamsObject["can_dock"] ? "InspectorView.splitView" : "InspectorView.screencastSplitView";
- this._splitView = new WebInspector.SplitView(false, settingName, 300, 300);
- this._splitView.setSecondIsSidebar(true);
- this._updateConstraints();
- WebInspector.dockController.addEventListener(WebInspector.DockController.Events.DockSideChanged, this._updateSplitView.bind(this));
-
- this._splitView.element.id = "inspector-split-view";
- this._splitView.show(this.element);
+ WebInspector.VBox.call(this);
+ WebInspector.Dialog.setModalHostView(this);
+ this.setMinimumSize(180, 72);
- this._overlayView = new WebInspector.InspectorView.OverlayView();
- this._splitView.setMainView(this._overlayView);
- this._zoomFactor = WebInspector.zoomFactor();
- WebInspector.settings.zoomLevel.addChangeListener(this._onZoomChanged, this);
-
- this._devtoolsView = new WebInspector.View();
- this._splitView.setSidebarView(this._devtoolsView);
+ // DevTools sidebar is a vertical split of panels tabbed pane and a drawer.
+ this._drawerSplitView = new WebInspector.SplitView(false, true, "Inspector.drawerSplitViewState", 200, 200);
+ this._drawerSplitView.hideSidebar();
+ this._drawerSplitView.enableShowModeSaving();
+ this._drawerSplitView.show(this.element);
this._tabbedPane = new WebInspector.TabbedPane();
this._tabbedPane.setRetainTabOrder(true, WebInspector.moduleManager.orderComparator(WebInspector.Panel, "name", "order"));
- this._tabbedPane.show(this._devtoolsView.element);
+ this._tabbedPane.show(this._drawerSplitView.mainElement());
+ this._drawer = new WebInspector.Drawer(this._drawerSplitView);
+ // Patch tabbed pane header with toolbar actions.
this._toolbarElement = document.createElement("div");
this._toolbarElement.className = "toolbar toolbar-background";
var headerElement = this._tabbedPane.headerElement();
this._closeButtonToolbarItem = document.createElementWithClass("div", "toolbar-close-button-item");
var closeButtonElement = this._closeButtonToolbarItem.createChild("div", "close-button");
- closeButtonElement.addEventListener("click", WebInspector.close.bind(WebInspector), true);
+ closeButtonElement.addEventListener("click", InspectorFrontendHost.closeWindow.bind(InspectorFrontendHost), true);
this._rightToolbarElement.appendChild(this._closeButtonToolbarItem);
- this._drawer = new WebInspector.Drawer(this);
this.appendToRightToolbar(this._drawer.toggleButtonElement());
this._history = [];
this._closeBracketIdentifiers = ["U+005D", "U+00DD"].keySet();
this._lastActivePanelSetting = WebInspector.settings.createSetting("lastActivePanel", "elements");
- this._updateSplitView();
-
- this._initialize();
-}
-
-WebInspector.InspectorView.Constraints = {
- OverlayWidth: 50,
- OverlayHeight: 50,
- DevToolsWidth: 150,
- DevToolsHeight: 50
+ this._loadPanelDesciptors();
};
WebInspector.InspectorView.prototype = {
- _initialize: function()
+ _loadPanelDesciptors: function()
{
WebInspector.startBatchUpdate();
WebInspector.moduleManager.extensions(WebInspector.Panel).forEach(processPanelExtensions.bind(this));
},
/**
- * @return {!WebInspector.Drawer}
- */
- drawer: function()
- {
- return this._drawer;
- },
-
- /**
- * @return {!Element}
- */
- devtoolsElement: function()
- {
- return this._devtoolsView.element;
- },
-
- /**
* @param {!WebInspector.PanelDescriptor} panelDescriptor
*/
addPanel: function(panelDescriptor)
{
this._tabbedPane.addEventListener(WebInspector.TabbedPane.EventTypes.TabSelected, this._tabSelected, this);
this._tabSelected();
- this._drawer.showOnLoadIfNecessary();
+ this._drawer.initialPanelShown();
+ },
+
+ showDrawerEditor: function()
+ {
+ this._drawer.showDrawerEditor();
+ },
+
+ /**
+ * @return {boolean}
+ */
+ isDrawerEditorShown: function()
+ {
+ return this._drawer.isDrawerEditorShown();
+ },
+
+ hideDrawerEditor: function()
+ {
+ this._drawer.hideDrawerEditor();
+ },
+
+ /**
+ * @param {boolean} available
+ */
+ setDrawerEditorAvailable: function(available)
+ {
+ this._drawer.setDrawerEditorAvailable(available);
},
_tabSelected: function()
this._drawer.showCloseableView(id, title, view);
},
+ showDrawer: function()
+ {
+ this._drawer.showDrawer();
+ },
+
+ /**
+ * @return {boolean}
+ */
+ drawerVisible: function()
+ {
+ return this._drawer.isShowing();
+ },
+
/**
* @param {string} id
+ * @param {boolean=} immediate
*/
- showViewInDrawer: function(id)
+ showViewInDrawer: function(id, immediate)
{
- this._drawer.showView(id);
+ this._drawer.showView(id, immediate);
},
/**
closeDrawer: function()
{
- this._drawer.hide();
+ this._drawer.closeDrawer();
},
/**
if (panelIndex !== -1) {
var panelName = this._tabbedPane.allTabs()[panelIndex];
if (panelName) {
- this.showPanel(panelName);
+ if (!WebInspector.Dialog.currentInstance())
+ this.showPanel(panelName);
event.consume(true);
}
return;
_keyDownInternal: function(event)
{
- if (this._openBracketIdentifiers[event.keyIdentifier]) {
- var isRotateLeft = !event.shiftKey && !event.altKey;
- if (isRotateLeft) {
- var panelOrder = this._tabbedPane.allTabs();
- var index = panelOrder.indexOf(this.currentPanel().name);
- index = (index === 0) ? panelOrder.length - 1 : index - 1;
- this.showPanel(panelOrder[index]);
- event.consume(true);
- return;
- }
+ var direction = 0;
- var isGoBack = event.altKey;
- if (isGoBack && this._canGoBackInHistory()) {
- this._goBackInHistory();
- event.consume(true);
- }
- return;
- }
+ if (this._openBracketIdentifiers[event.keyIdentifier])
+ direction = -1;
- if (this._closeBracketIdentifiers[event.keyIdentifier]) {
- var isRotateRight = !event.shiftKey && !event.altKey;
- if (isRotateRight) {
- var panelOrder = this._tabbedPane.allTabs();
- var index = panelOrder.indexOf(this.currentPanel().name);
- index = (index + 1) % panelOrder.length;
- this.showPanel(panelOrder[index]);
- event.consume(true);
- return;
- }
+ if (this._closeBracketIdentifiers[event.keyIdentifier])
+ direction = 1;
- var isGoForward = event.altKey;
- if (isGoForward && this._canGoForwardInHistory()) {
- this._goForwardInHistory();
- event.consume(true);
- }
+ if (!direction)
+ return;
+
+ if (!event.shiftKey && !event.altKey) {
+ if (!WebInspector.Dialog.currentInstance())
+ this._changePanelInDirection(direction);
+ event.consume(true);
return;
}
- },
- _canGoBackInHistory: function()
- {
- return this._historyIterator > 0;
+ if (event.altKey && this._moveInHistory(direction))
+ event.consume(true)
},
- _goBackInHistory: function()
+ _changePanelInDirection: function(direction)
{
- this._inHistory = true;
- this.setCurrentPanel(WebInspector.panels[this._history[--this._historyIterator]]);
- delete this._inHistory;
+ var panelOrder = this._tabbedPane.allTabs();
+ var index = panelOrder.indexOf(this.currentPanel().name);
+ index = (index + panelOrder.length + direction) % panelOrder.length;
+ this.showPanel(panelOrder[index]);
},
- _canGoForwardInHistory: function()
+ _moveInHistory: function(move)
{
- return this._historyIterator < this._history.length - 1;
- },
+ var newIndex = this._historyIterator + move;
+ if (newIndex >= this._history.length || newIndex < 0)
+ return false;
- _goForwardInHistory: function()
- {
this._inHistory = true;
- this.setCurrentPanel(WebInspector.panels[this._history[++this._historyIterator]]);
+ this._historyIterator = newIndex;
+ if (!WebInspector.Dialog.currentInstance())
+ this.setCurrentPanel(WebInspector.panels[this._history[this._historyIterator]]);
delete this._inHistory;
+
+ return true;
},
_pushToHistory: function(panelName)
onResize: function()
{
- // FIXME: make drawer a view.
- this.doResize();
- this._drawer.resize();
- },
-
- _updateSplitView: function()
- {
- var dockSide = WebInspector.dockController.dockSide();
- if (dockSide !== WebInspector.DockController.State.Undocked) {
- var vertical = WebInspector.dockController.isVertical();
- this._splitView.setVertical(vertical);
- if (vertical) {
- if (dockSide === WebInspector.DockController.State.DockedToRight)
- this._overlayView.setMargins(false, true, false, false);
- else
- this._overlayView.setMargins(false, false, false, true);
- this._splitView.setSecondIsSidebar(dockSide === WebInspector.DockController.State.DockedToRight);
- this._splitView.uninstallResizer(this._tabbedPane.headerElement());
- this._splitView.installResizer(this._splitView.resizerElement());
- } else {
- this._overlayView.setMargins(false, false, false, false);
- this._splitView.setSecondIsSidebar(true);
- this._splitView.uninstallResizer(this._splitView.resizerElement());
- this._splitView.installResizer(this._tabbedPane.headerElement());
- }
- this._splitView.setMainView(this._overlayView);
- this._splitView.setSidebarView(this._devtoolsView);
- this._splitView.showBoth();
- } else {
- this._overlayView.setMargins(false, false, false, false);
- this._splitView.setSecondIsSidebar(true);
- this._splitView.setMainView(this._overlayView);
- this._splitView.setSidebarView(this._devtoolsView);
- this._splitView.showOnlySecond();
- this._splitView.uninstallResizer(this._tabbedPane.headerElement());
- this._splitView.uninstallResizer(this._splitView.resizerElement());
- }
- },
-
- _onZoomChanged: function()
- {
- this._updateConstraints();
- var zoomFactor = WebInspector.zoomFactor();
- if (zoomFactor !== this._zoomFactor)
- this._splitView.setSidebarSize(this._splitView.sidebarSize() * this._zoomFactor / zoomFactor, true);
- this._zoomFactor = zoomFactor;
- },
-
- _updateConstraints: function()
- {
- var zoomFactor = WebInspector.zoomFactor();
- this._splitView.setSidebarElementConstraints(WebInspector.InspectorView.Constraints.DevToolsWidth / zoomFactor,
- WebInspector.InspectorView.Constraints.DevToolsHeight / zoomFactor);
- this._splitView.setMainElementConstraints(WebInspector.InspectorView.Constraints.OverlayWidth / zoomFactor,
- WebInspector.InspectorView.Constraints.OverlayHeight / zoomFactor);
+ WebInspector.Dialog.modalHostRepositioned();
},
/**
- * @param {!WebInspector.View} view
- * @param {boolean} vertical
+ * @return {!Element}
*/
- showScreencastView: function(view, vertical)
+ topResizerElement: function()
{
- if (view.parentView() !== this._overlayView)
- view.show(this._overlayView.element);
- this._splitView.setVertical(vertical);
- this._splitView.installResizer(this._splitView.resizerElement());
- this._splitView.showBoth();
+ return this._tabbedPane.headerElement();
},
- hideScreencastView: function()
+ _createImagedCounterElementIfNeeded: function(count, id, styleName)
{
- this._splitView.showOnlySecond();
+ if (!count)
+ return;
+
+ var imageElement = this._errorWarningCountElement.createChild("div", styleName);
+ var counterElement = this._errorWarningCountElement.createChild("span");
+ counterElement.id = id;
+ counterElement.textContent = count;
},
/**
*/
setErrorAndWarningCounts: function(errors, warnings)
{
- if (!errors && !warnings) {
- this._errorWarningCountElement.classList.add("hidden");
- this._tabbedPane.headerResized();
+ if (this._errors === errors && this._warnings === warnings)
return;
- }
-
- this._errorWarningCountElement.classList.remove("hidden");
+ this._errors = errors;
+ this._warnings = warnings;
+ this._errorWarningCountElement.classList.toggle("hidden", !errors && !warnings);
this._errorWarningCountElement.removeChildren();
- if (errors) {
- var errorImageElement = this._errorWarningCountElement.createChild("div", "error-icon-small");
- var errorElement = this._errorWarningCountElement.createChild("span");
- errorElement.id = "error-count";
- errorElement.textContent = errors;
- }
-
- if (warnings) {
- var warningsImageElement = this._errorWarningCountElement.createChild("div", "warning-icon-small");
- var warningsElement = this._errorWarningCountElement.createChild("span");
- warningsElement.id = "warning-count";
- warningsElement.textContent = warnings;
- }
-
- if (errors) {
- if (warnings) {
- if (errors == 1) {
- if (warnings == 1)
- this._errorWarningCountElement.title = WebInspector.UIString("%d error, %d warning", errors, warnings);
- else
- this._errorWarningCountElement.title = WebInspector.UIString("%d error, %d warnings", errors, warnings);
- } else if (warnings == 1)
- this._errorWarningCountElement.title = WebInspector.UIString("%d errors, %d warning", errors, warnings);
- else
- this._errorWarningCountElement.title = WebInspector.UIString("%d errors, %d warnings", errors, warnings);
- } else if (errors == 1)
- this._errorWarningCountElement.title = WebInspector.UIString("%d error", errors);
- else
- this._errorWarningCountElement.title = WebInspector.UIString("%d errors", errors);
- } else if (warnings == 1)
- this._errorWarningCountElement.title = WebInspector.UIString("%d warning", warnings);
- else if (warnings)
- this._errorWarningCountElement.title = WebInspector.UIString("%d warnings", warnings);
- else
- this._errorWarningCountElement.title = null;
+ this._createImagedCounterElementIfNeeded(errors, "error-count", "error-icon-small");
+ this._createImagedCounterElementIfNeeded(warnings, "warning-count", "warning-icon-small");
+ var errorString = errors ? WebInspector.UIString("%d error%s", errors, errors > 1 ? "s" : "") : "";
+ var warningString = warnings ? WebInspector.UIString("%d warning%s", warnings, warnings > 1 ? "s" : "") : "";
+ var commaString = errors && warnings ? ", " : "";
+ this._errorWarningCountElement.title = errorString + commaString + warningString;
this._tabbedPane.headerResized();
},
- __proto__: WebInspector.View.prototype
+ __proto__: WebInspector.VBox.prototype
};
/**
+ * @type {!WebInspector.InspectorView}
+ */
+WebInspector.inspectorView;
+
+/**
* @constructor
- * @extends {WebInspector.View}
+ * @implements {WebInspector.ActionDelegate}
*/
-WebInspector.InspectorView.OverlayView = function()
+WebInspector.InspectorView.DrawerToggleActionDelegate = function()
{
- WebInspector.View.call(this);
}
-WebInspector.InspectorView.OverlayView.prototype = {
+WebInspector.InspectorView.DrawerToggleActionDelegate.prototype = {
/**
- * @param {boolean} top
- * @param {boolean} right
- * @param {boolean} bottom
- * @param {boolean} left
+ * @return {boolean}
*/
- setMargins: function(top, right, bottom, left)
+ handleAction: function()
{
- var marginValue = Math.round(3 * WebInspector.zoomFactor()) + "px ";
- var margings = top ? marginValue : "0 ";
- margings += right ? marginValue : "0 ";
- margings += bottom ? marginValue : "0 ";
- margings += left ? marginValue : "0 ";
- this.element.style.margin = margings;
- },
+ if (WebInspector.inspectorView.drawerVisible()) {
+ WebInspector.inspectorView.closeDrawer();
+ return true;
+ }
+ if (!WebInspector.experimentsSettings.doNotOpenDrawerOnEsc.isEnabled()) {
+ WebInspector.inspectorView.showDrawer();
+ return true;
+ }
+ return false;
+ }
+}
- onResize: function()
+/**
+ * @constructor
+ * @extends {WebInspector.VBox}
+ */
+WebInspector.RootView = function()
+{
+ WebInspector.VBox.call(this);
+ this.markAsRoot();
+ this.element.classList.add("root-view");
+ this.element.setAttribute("spellcheck", false);
+ window.addEventListener("resize", this.doResize.bind(this), true);
+ this._onScrollBound = this._onScroll.bind(this);
+};
+
+WebInspector.RootView.prototype = {
+ attachToBody: function()
{
- var dockSide = WebInspector.dockController.dockSide();
- if (dockSide !== WebInspector.DockController.State.Undocked) {
- if (this._setContentsInsetsId)
- window.cancelAnimationFrame(this._setContentsInsetsId);
- this._setContentsInsetsId = window.requestAnimationFrame(this._setContentsInsets.bind(this));
- }
+ this.doResize();
+ this.show(document.body);
+ },
- // FIXME: make drawer a view.
- WebInspector.inspectorView._drawer.resize();
+ _onScroll: function()
+ {
+ // If we didn't have enough space at the start, we may have wrong scroll offsets.
+ if (document.body.scrollTop !== 0)
+ document.body.scrollTop = 0;
+ if (document.body.scrollLeft !== 0)
+ document.body.scrollLeft = 0;
},
- _setContentsInsets: function()
+ doResize: function()
{
- delete this._setContentsInsetsId;
+ var size = this.minimumSize();
+ var right = Math.min(0, window.innerWidth - size.width);
+ this.element.style.right = right + "px";
+ var bottom = Math.min(0, window.innerHeight - size.height);
+ this.element.style.bottom = bottom + "px";
- var dockSide = WebInspector.dockController.dockSide();
- var zoomFactor = WebInspector.zoomFactor();
- var totalWidth = document.body.offsetWidth;
- var totalHeight = document.body.offsetHeight;
- var boundingRect = this.element.getBoundingClientRect();
+ if (window.innerWidth < size.width || window.innerHeight < size.height)
+ window.addEventListener("scroll", this._onScrollBound, false);
+ else
+ window.removeEventListener("scroll", this._onScrollBound, false);
- InspectorFrontendHost.setContentsInsets(
- Math.round(boundingRect.top * zoomFactor),
- Math.round(boundingRect.left * zoomFactor),
- Math.round((totalHeight - boundingRect.bottom) * zoomFactor),
- Math.round((totalWidth - boundingRect.right) * zoomFactor));
+ WebInspector.VBox.prototype.doResize.call(this);
+ this._onScroll();
},
- __proto__: WebInspector.View.prototype
-}
-
-/**
- * @type {!WebInspector.InspectorView}
- */
-WebInspector.inspectorView;
+ __proto__: WebInspector.VBox.prototype
+};
projects / platform / framework / web / crosswalk.git / blobdiff