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 |