| OLD | NEW |
| 1 /* | 1 /* |
| 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. | 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. |
| 3 * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com> | 3 * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com> |
| 4 * Copyright (C) 2009 Joseph Pecoraro | 4 * Copyright (C) 2009 Joseph Pecoraro |
| 5 * | 5 * |
| 6 * Redistribution and use in source and binary forms, with or without | 6 * Redistribution and use in source and binary forms, with or without |
| 7 * modification, are permitted provided that the following conditions | 7 * modification, are permitted provided that the following conditions |
| 8 * are met: | 8 * are met: |
| 9 * | 9 * |
| 10 * 1. Redistributions of source code must retain the above copyright | 10 * 1. Redistributions of source code must retain the above copyright |
| (...skipping 21 matching lines...) Expand all Loading... |
| 32 * @constructor | 32 * @constructor |
| 33 * @implements {WebInspector.Searchable} | 33 * @implements {WebInspector.Searchable} |
| 34 * @implements {WebInspector.TargetManager.Observer} | 34 * @implements {WebInspector.TargetManager.Observer} |
| 35 * @extends {WebInspector.Panel} | 35 * @extends {WebInspector.Panel} |
| 36 */ | 36 */ |
| 37 WebInspector.ElementsPanel = function() | 37 WebInspector.ElementsPanel = function() |
| 38 { | 38 { |
| 39 WebInspector.Panel.call(this, "elements"); | 39 WebInspector.Panel.call(this, "elements"); |
| 40 this.registerRequiredCSS("elements/elementsPanel.css"); | 40 this.registerRequiredCSS("elements/elementsPanel.css"); |
| 41 | 41 |
| 42 this._splitView = new WebInspector.SplitView(true, true, "elementsPanelSplit
ViewState", 325, 325); | 42 this._splitWidget = new WebInspector.SplitWidget(true, true, "elementsPanelS
plitViewState", 325, 325); |
| 43 this._splitView.addEventListener(WebInspector.SplitView.Events.SidebarSizeCh
anged, this._updateTreeOutlineVisibleWidth.bind(this)); | 43 this._splitWidget.addEventListener(WebInspector.SplitWidget.Events.SidebarSi
zeChanged, this._updateTreeOutlineVisibleWidth.bind(this)); |
| 44 this._splitView.show(this.element); | 44 this._splitWidget.show(this.element); |
| 45 | 45 |
| 46 this._searchableView = new WebInspector.SearchableView(this); | 46 this._searchableView = new WebInspector.SearchableView(this); |
| 47 this._searchableView.setMinimumSize(25, 19); | 47 this._searchableView.setMinimumSize(25, 19); |
| 48 this._searchableView.setPlaceholder(WebInspector.UIString("Find by string, s
elector, or XPath")); | 48 this._searchableView.setPlaceholder(WebInspector.UIString("Find by string, s
elector, or XPath")); |
| 49 this._splitView.setMainView(this._searchableView); | 49 this._splitWidget.setMainWidget(this._searchableView); |
| 50 var stackElement = this._searchableView.element; | 50 var stackElement = this._searchableView.element; |
| 51 | 51 |
| 52 this._contentElement = stackElement.createChild("div"); | 52 this._contentElement = stackElement.createChild("div"); |
| 53 this._contentElement.id = "elements-content"; | 53 this._contentElement.id = "elements-content"; |
| 54 // FIXME: crbug.com/425984 | 54 // FIXME: crbug.com/425984 |
| 55 if (WebInspector.moduleSetting("domWordWrap").get()) | 55 if (WebInspector.moduleSetting("domWordWrap").get()) |
| 56 this._contentElement.classList.add("elements-wrap"); | 56 this._contentElement.classList.add("elements-wrap"); |
| 57 WebInspector.moduleSetting("domWordWrap").addChangeListener(this._domWordWra
pSettingChanged.bind(this)); | 57 WebInspector.moduleSetting("domWordWrap").addChangeListener(this._domWordWra
pSettingChanged.bind(this)); |
| 58 | 58 |
| 59 var crumbsContainer = stackElement.createChild("div"); | 59 var crumbsContainer = stackElement.createChild("div"); |
| (...skipping 122 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 182 treeOutline.unwireFromDOMModel(); | 182 treeOutline.unwireFromDOMModel(); |
| 183 this._treeOutlines.remove(treeOutline); | 183 this._treeOutlines.remove(treeOutline); |
| 184 treeOutline.element.remove(); | 184 treeOutline.element.remove(); |
| 185 }, | 185 }, |
| 186 | 186 |
| 187 _updateTreeOutlineVisibleWidth: function() | 187 _updateTreeOutlineVisibleWidth: function() |
| 188 { | 188 { |
| 189 if (!this._treeOutlines.length) | 189 if (!this._treeOutlines.length) |
| 190 return; | 190 return; |
| 191 | 191 |
| 192 var width = this._splitView.element.offsetWidth; | 192 var width = this._splitWidget.element.offsetWidth; |
| 193 if (this._splitView.isVertical()) | 193 if (this._splitWidget.isVertical()) |
| 194 width -= this._splitView.sidebarSize(); | 194 width -= this._splitWidget.sidebarSize(); |
| 195 for (var i = 0; i < this._treeOutlines.length; ++i) { | 195 for (var i = 0; i < this._treeOutlines.length; ++i) { |
| 196 this._treeOutlines[i].setVisibleWidth(width); | 196 this._treeOutlines[i].setVisibleWidth(width); |
| 197 this._treeOutlines[i].updateSelection(); | 197 this._treeOutlines[i].updateSelection(); |
| 198 } | 198 } |
| 199 this._breadcrumbs.updateSizes(); | 199 this._breadcrumbs.updateSizes(); |
| 200 }, | 200 }, |
| 201 | 201 |
| 202 /** | 202 /** |
| 203 * @override | 203 * @override |
| 204 * @return {!Element} | 204 * @return {!Element} |
| (...skipping 646 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 851 _showStylesSidebar: function() | 851 _showStylesSidebar: function() |
| 852 { | 852 { |
| 853 this.sidebarPaneView.selectTab(this.sidebarPanes.styles.title()); | 853 this.sidebarPaneView.selectTab(this.sidebarPanes.styles.title()); |
| 854 }, | 854 }, |
| 855 | 855 |
| 856 /** | 856 /** |
| 857 * @param {boolean} vertically | 857 * @param {boolean} vertically |
| 858 */ | 858 */ |
| 859 _splitVertically: function(vertically) | 859 _splitVertically: function(vertically) |
| 860 { | 860 { |
| 861 if (this.sidebarPaneView && vertically === !this._splitView.isVertical()
) | 861 if (this.sidebarPaneView && vertically === !this._splitWidget.isVertical
()) |
| 862 return; | 862 return; |
| 863 | 863 |
| 864 if (this.sidebarPaneView) { | 864 if (this.sidebarPaneView) { |
| 865 this.sidebarPaneView.detach(); | 865 this.sidebarPaneView.detach(); |
| 866 this._splitView.uninstallResizer(this.sidebarPaneView.headerElement(
)); | 866 this._splitWidget.uninstallResizer(this.sidebarPaneView.headerElemen
t()); |
| 867 } | 867 } |
| 868 | 868 |
| 869 this._splitView.setVertical(!vertically); | 869 this._splitWidget.setVertical(!vertically); |
| 870 | 870 |
| 871 var computedPane = new WebInspector.SidebarPane(WebInspector.UIString("C
omputed")); | 871 var computedPane = new WebInspector.SidebarPane(WebInspector.UIString("C
omputed")); |
| 872 computedPane.element.classList.add("composite"); | 872 computedPane.element.classList.add("composite"); |
| 873 computedPane.element.classList.add("fill"); | 873 computedPane.element.classList.add("fill"); |
| 874 | 874 |
| 875 computedPane.bodyElement.classList.add("metrics-and-computed"); | 875 computedPane.bodyElement.classList.add("metrics-and-computed"); |
| 876 | 876 |
| 877 var matchedStylePanesWrapper = createElement("div"); | 877 var matchedStylePanesWrapper = createElement("div"); |
| 878 matchedStylePanesWrapper.className = "style-panes-wrapper"; | 878 matchedStylePanesWrapper.className = "style-panes-wrapper"; |
| 879 var computedStylePanesWrapper = createElement("div"); | 879 var computedStylePanesWrapper = createElement("div"); |
| (...skipping 25 matching lines...) Expand all Loading... |
| 905 } | 905 } |
| 906 | 906 |
| 907 this.sidebarPaneView = new WebInspector.SidebarTabbedPane(); | 907 this.sidebarPaneView = new WebInspector.SidebarTabbedPane(); |
| 908 this.sidebarPaneView.element.addEventListener("contextmenu", this._sideb
arContextMenuEventFired.bind(this), false); | 908 this.sidebarPaneView.element.addEventListener("contextmenu", this._sideb
arContextMenuEventFired.bind(this), false); |
| 909 if (this._popoverHelper) | 909 if (this._popoverHelper) |
| 910 this._popoverHelper.hidePopover(); | 910 this._popoverHelper.hidePopover(); |
| 911 this._popoverHelper = new WebInspector.PopoverHelper(this.sidebarPaneVie
w.element, this._getPopoverAnchor.bind(this), this._showPopover.bind(this)); | 911 this._popoverHelper = new WebInspector.PopoverHelper(this.sidebarPaneVie
w.element, this._getPopoverAnchor.bind(this), this._showPopover.bind(this)); |
| 912 this._popoverHelper.setTimeout(0); | 912 this._popoverHelper.setTimeout(0); |
| 913 | 913 |
| 914 if (vertically) { | 914 if (vertically) { |
| 915 this._splitView.installResizer(this.sidebarPaneView.headerElement())
; | 915 this._splitWidget.installResizer(this.sidebarPaneView.headerElement(
)); |
| 916 | 916 |
| 917 var compositePane = new WebInspector.SidebarPane(this.sidebarPanes.s
tyles.title()); | 917 var compositePane = new WebInspector.SidebarPane(this.sidebarPanes.s
tyles.title()); |
| 918 compositePane.element.classList.add("composite"); | 918 compositePane.element.classList.add("composite"); |
| 919 compositePane.element.classList.add("fill"); | 919 compositePane.element.classList.add("fill"); |
| 920 | 920 |
| 921 var splitView = new WebInspector.SplitView(true, true, "stylesPaneSp
litViewState", 215); | 921 var splitWidget = new WebInspector.SplitWidget(true, true, "stylesPa
neSplitViewState", 215); |
| 922 splitView.show(compositePane.bodyElement); | 922 splitWidget.show(compositePane.bodyElement); |
| 923 | 923 |
| 924 var vbox1 = new WebInspector.VBox(); | 924 var vbox1 = new WebInspector.VBox(); |
| 925 vbox1.element.appendChild(matchedStylePanesWrapper); | 925 vbox1.element.appendChild(matchedStylePanesWrapper); |
| 926 vbox1.element.appendChild(this._matchedStylesFilterBoxContainer); | 926 vbox1.element.appendChild(this._matchedStylesFilterBoxContainer); |
| 927 splitView.setMainView(vbox1); | 927 splitWidget.setMainWidget(vbox1); |
| 928 | 928 |
| 929 var vbox2 = new WebInspector.VBox(); | 929 var vbox2 = new WebInspector.VBox(); |
| 930 vbox2.element.appendChild(computedStylePanesWrapper); | 930 vbox2.element.appendChild(computedStylePanesWrapper); |
| 931 vbox2.element.appendChild(this._computedStylesFilterBoxContainer); | 931 vbox2.element.appendChild(this._computedStylesFilterBoxContainer); |
| 932 splitView.setSidebarView(vbox2); | 932 splitWidget.setSidebarWidget(vbox2); |
| 933 | 933 |
| 934 computedPane.show(computedStylePanesWrapper); | 934 computedPane.show(computedStylePanesWrapper); |
| 935 this.sidebarPaneView.addPane(compositePane); | 935 this.sidebarPaneView.addPane(compositePane); |
| 936 } else { | 936 } else { |
| 937 var stylesPane = new WebInspector.SidebarPane(this.sidebarPanes.styl
es.title()); | 937 var stylesPane = new WebInspector.SidebarPane(this.sidebarPanes.styl
es.title()); |
| 938 stylesPane.element.classList.add("composite"); | 938 stylesPane.element.classList.add("composite"); |
| 939 stylesPane.element.classList.add("fill"); | 939 stylesPane.element.classList.add("fill"); |
| 940 stylesPane.bodyElement.classList.add("metrics-and-styles"); | 940 stylesPane.bodyElement.classList.add("metrics-and-styles"); |
| 941 | 941 |
| 942 stylesPane.bodyElement.appendChild(matchedStylePanesWrapper); | 942 stylesPane.bodyElement.appendChild(matchedStylePanesWrapper); |
| (...skipping 22 matching lines...) Expand all Loading... |
| 965 | 965 |
| 966 for (var sidebarViewWrapper of this._elementsSidebarViewWrappers) | 966 for (var sidebarViewWrapper of this._elementsSidebarViewWrappers) |
| 967 this.sidebarPaneView.addPane(sidebarViewWrapper); | 967 this.sidebarPaneView.addPane(sidebarViewWrapper); |
| 968 | 968 |
| 969 this._extensionSidebarPanesContainer = this.sidebarPaneView; | 969 this._extensionSidebarPanesContainer = this.sidebarPaneView; |
| 970 | 970 |
| 971 var extensionSidebarPanes = WebInspector.extensionServer.sidebarPanes(); | 971 var extensionSidebarPanes = WebInspector.extensionServer.sidebarPanes(); |
| 972 for (var i = 0; i < extensionSidebarPanes.length; ++i) | 972 for (var i = 0; i < extensionSidebarPanes.length; ++i) |
| 973 this._addExtensionSidebarPane(extensionSidebarPanes[i]); | 973 this._addExtensionSidebarPane(extensionSidebarPanes[i]); |
| 974 | 974 |
| 975 this._splitView.setSidebarView(this.sidebarPaneView); | 975 this._splitWidget.setSidebarWidget(this.sidebarPaneView); |
| 976 this.sidebarPanes.styles.expand(); | 976 this.sidebarPanes.styles.expand(); |
| 977 }, | 977 }, |
| 978 | 978 |
| 979 /** | 979 /** |
| 980 * @param {!WebInspector.Event} event | 980 * @param {!WebInspector.Event} event |
| 981 */ | 981 */ |
| 982 _extensionSidebarPaneAdded: function(event) | 982 _extensionSidebarPaneAdded: function(event) |
| 983 { | 983 { |
| 984 var pane = /** @type {!WebInspector.ExtensionSidebarPane} */ (event.data
); | 984 var pane = /** @type {!WebInspector.ExtensionSidebarPane} */ (event.data
); |
| 985 this._addExtensionSidebarPane(pane); | 985 this._addExtensionSidebarPane(pane); |
| (...skipping 120 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 1106 WebInspector.ElementsPanelFactory.prototype = { | 1106 WebInspector.ElementsPanelFactory.prototype = { |
| 1107 /** | 1107 /** |
| 1108 * @override | 1108 * @override |
| 1109 * @return {!WebInspector.Panel} | 1109 * @return {!WebInspector.Panel} |
| 1110 */ | 1110 */ |
| 1111 createPanel: function() | 1111 createPanel: function() |
| 1112 { | 1112 { |
| 1113 return WebInspector.ElementsPanel.instance(); | 1113 return WebInspector.ElementsPanel.instance(); |
| 1114 } | 1114 } |
| 1115 } | 1115 } |
| OLD | NEW |