Diff
Modified: trunk/Source/WebCore/ChangeLog (117451 => 117452)
--- trunk/Source/WebCore/ChangeLog 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/ChangeLog 2012-05-17 15:51:11 UTC (rev 117452)
@@ -1,3 +1,42 @@
+2012-05-17 Pavel Feldman <pfeld...@chromium.org>
+
+ Web Inspector: convert styles panel into UISourceCodeProvider in the scripts panel.
+ https://bugs.webkit.org/show_bug.cgi?id=86734
+
+ Reviewed by Vsevolod Vlasov.
+
+ This change also makes Scripts render ans Source Code under that experiment.
+
+ * English.lproj/localizedStrings.js:
+ * inspector/front-end/ScriptsNavigator.js:
+ (WebInspector.ScriptsNavigator):
+ * inspector/front-end/ScriptsPanel.js:
+ (WebInspector.ScriptsPanel.prototype.get toolbarItemLabel):
+ (WebInspector.ScriptsPanel.prototype.canShowAnchorLocation):
+ (WebInspector.ScriptsPanel.prototype._createSourceFrame):
+ * inspector/front-end/Settings.js:
+ (WebInspector.ExperimentsSettings):
+ * inspector/front-end/StylesPanel.js:
+ (WebInspector.StylesUISourceCodeProvider):
+ (WebInspector.StylesUISourceCodeProvider.prototype.uiSourceCodes):
+ (WebInspector.StylesUISourceCodeProvider.prototype._initialize):
+ (WebInspector.StylesUISourceCodeProvider.prototype._resourceAdded):
+ (WebInspector.StylesUISourceCodeProvider.prototype._reset):
+ (WebInspector.StyleSource):
+ (WebInspector.StyleSourceFrame):
+ (WebInspector.StyleSourceFrame.prototype.canEditSource):
+ (WebInspector.StyleSourceFrame.prototype.requestContent):
+ (WebInspector.StyleSourceFrame.prototype.commitEditing):
+ (WebInspector.StyleSourceFrame.prototype.afterTextChanged):
+ (WebInspector.StyleSourceFrame.prototype._clearIncrementalUpdateTimer):
+ (WebInspector.StyleSourceFrame.prototype._contentChanged):
+ * inspector/front-end/StylesSidebarPane.js:
+ (WebInspector.StylePropertiesSection):
+ (WebInspector.StylePropertiesSection.prototype._createRuleOriginNode):
+ * inspector/front-end/UISourceCode.js:
+ * inspector/front-end/inspector.js:
+ (WebInspector._createPanels):
+
2012-05-17 Antti Koivisto <an...@apple.com>
Frame flattening should not expand tiny frames
Modified: trunk/Source/WebCore/English.lproj/localizedStrings.js
(Binary files differ)
Modified: trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/ScriptsNavigator.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -49,7 +49,8 @@
this._snippetsView.addEventListener(WebInspector.NavigatorView.Events.FileRenamed, this._fileRenamed, this);
this._snippetsView.addEventListener(WebInspector.SnippetsNavigatorView.Events.SnippetCreationRequested, this._snippetCreationRequested, this);
- this._tabbedPane.appendTab(WebInspector.ScriptsNavigator.ScriptsTab, WebInspector.UIString("Scripts"), this._scriptsView);
+ var sourcesTitle = WebInspector.experimentsSettings.sourceCodePanel.isEnabled() ? WebInspector.UIString("Sources") : WebInspector.UIString("Scripts");
+ this._tabbedPane.appendTab(WebInspector.ScriptsNavigator.ScriptsTab, sourcesTitle, this._scriptsView);
this._tabbedPane.selectTab(WebInspector.ScriptsNavigator.ScriptsTab);
this._tabbedPane.appendTab(WebInspector.ScriptsNavigator.ContentScriptsTab, WebInspector.UIString("Content scripts"), this._contentScriptsView);
if (WebInspector.experimentsSettings.snippetsSupport.isEnabled())
Modified: trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/ScriptsPanel.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -40,7 +40,10 @@
WebInspector.settings.debuggerSidebarHidden = WebInspector.settings.createSetting("debuggerSidebarHidden", false);
var scriptMapping = new WebInspector.DebuggerScriptMapping();
- this._uiSourceCodeProvider = uiSourceCodeProviderForTest || new WebInspector.CompositeUISourceCodeProvider(scriptMapping.uiSourceCodeProviders());
+ var providers = scriptMapping.uiSourceCodeProviders();
+ if (WebInspector.experimentsSettings.sourceCodePanel.isEnabled())
+ providers = providers.concat(new WebInspector.StylesUISourceCodeProvider());
+ this._uiSourceCodeProvider = uiSourceCodeProviderForTest || new WebInspector.CompositeUISourceCodeProvider(providers);
new WebInspector.PresentationConsoleMessageHelper(this._uiSourceCodeProvider);
new WebInspector.DebuggerResourceBinding(this._uiSourceCodeProvider);
@@ -195,6 +198,8 @@
WebInspector.ScriptsPanel.prototype = {
get toolbarItemLabel()
{
+ if (WebInspector.experimentsSettings.sourceCodePanel.isEnabled())
+ return WebInspector.UIString("Source Code");
return WebInspector.UIString("Scripts");
},
@@ -390,7 +395,16 @@
canShowAnchorLocation: function(anchor)
{
- return this._debuggerEnabled && anchor.uiSourceCode;
+ if (this._debuggerEnabled && anchor.uiSourceCode)
+ return true;
+ var uiSourceCodes = this._uiSourceCodeProvider.uiSourceCodes();
+ for (var i = 0; i < uiSourceCodes.length; ++i) {
+ if (uiSourceCodes[i].url ="" anchor.href) {
+ anchor.uiSourceCode = uiSourceCodes[i];
+ return true;
+ }
+ }
+ return false;
},
showAnchorLocation: function(anchor)
@@ -447,9 +461,16 @@
*/
_createSourceFrame: function(uiSourceCode)
{
- var sourceFrame = new WebInspector._javascript_SourceFrame(this, uiSourceCode);
-
- sourceFrame._uiSourceCode = uiSourceCode;
+ var sourceFrame;
+ if (uiSourceCode instanceof WebInspector._javascript_Source)
+ sourceFrame = new WebInspector._javascript_SourceFrame(this, uiSourceCode);
+ else if (uiSourceCode instanceof WebInspector.StyleSource)
+ sourceFrame = new WebInspector.StyleSourceFrame(uiSourceCode);
+ else {
+ console.assert(false, "Unknown UISourceCode type");
+ sourceFrame = new WebInspector.SourceFrame(uiSourceCode.url);
+ }
+
this._sourceFramesByUISourceCode.put(uiSourceCode, sourceFrame);
return sourceFrame;
},
Modified: trunk/Source/WebCore/inspector/front-end/Settings.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/Settings.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/Settings.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -182,7 +182,7 @@
// Add currently running experiments here.
this.showShadowDOM = this._createExperiment("showShadowDOM", "Show shadow DOM");
this.snippetsSupport = this._createExperiment("snippetsSupport", "Snippets support");
- this.showStylesPanel = this._createExperiment("stylesPanel", "Show styles panel");
+ this.sourceCodePanel = this._createExperiment("sourceCodePanel", "Source Code panel");
this._cleanUpSetting();
}
Modified: trunk/Source/WebCore/inspector/front-end/StylesPanel.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/StylesPanel.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/StylesPanel.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -28,71 +28,32 @@
/**
* @constructor
- * @extends {WebInspector.Panel}
- * @implements {WebInspector.TabbedEditorContainerDelegate}
+ * @extends {WebInspector.Object}
+ * @implements {WebInspector.UISourceCodeProvider}
*/
-WebInspector.StylesPanel = function()
+WebInspector.StylesUISourceCodeProvider = function()
{
- WebInspector.Panel.call(this, "styles");
- this.registerRequiredCSS("scriptsPanel.css");
-
- const initialNavigatorWidth = 225;
- const minimalViewsContainerWidthPercent = 50;
-
- this._mainView = new WebInspector.SplitView(WebInspector.SplitView.SidebarPosition.Left, "stylesPanelNavigatorSidebarWidth", initialNavigatorWidth);
- this._mainView.element.id = "styles-main-view";
- this._mainView.element.tabIndex = 0;
-
- this._mainView.minimalSidebarWidth = Preferences.minScriptsSidebarWidth;
- this._mainView.minimalMainWidthPercent = minimalViewsContainerWidthPercent;
-
- this._navigatorView = new WebInspector.NavigatorView();
- this._navigatorView.addEventListener(WebInspector.NavigatorView.Events.ItemSelected, this._itemSelected, this);
-
- this._tabbedPane = new WebInspector.TabbedPane();
- this._tabbedPane.element.addStyleClass("navigator-tabbed-pane");
- this._tabbedPane.shrinkableTabs = true;
- this._tabbedPane.appendTab(WebInspector.ScriptsNavigator.ScriptsTab, WebInspector.UIString("Stylesheets"), this._navigatorView);
- this._tabbedPane.show(this._mainView.sidebarElement);
-
- this._editorContainer = new WebInspector.TabbedEditorContainer(this, "previouslyViewedCSSFiles");
- this._editorContainer.show(this._mainView.mainElement);
-
- this._mainView.show(this.element);
-
- this._navigatorController = new WebInspector.NavigatorOverlayController(this, this._mainView, this._tabbedPane, this._editorContainer.view);
-
- WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.CachedResourcesLoaded, this._cachedResourcesLoaded, this);
+ WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.CachedResourcesLoaded, this._initialize, this);
WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.WillLoadCachedResources, this._reset, this);
WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._reset, this);
- this._sourceFramesForResource = new Map();
- this._urlToResource = {};
-
- var openResourceShortcut = WebInspector.OpenResourceDialog.createShortcut();
- this.registerShortcut(openResourceShortcut.key, this._showOpenStylesheetDialog.bind(this));
+ this._uiSourceCodes = [];
}
-WebInspector.StylesPanel.prototype = {
- wasShown: function()
+WebInspector.StylesUISourceCodeProvider.prototype = {
+ /**
+ * @return {Array.<WebInspector.UISourceCode>}
+ */
+ uiSourceCodes: function()
{
- WebInspector.Panel.prototype.wasShown.call(this);
- this._navigatorController.wasShown();
- this._initialize();
+ return this._uiSourceCodes;
},
_initialize: function()
{
- if (!this._initialized && this.isShowing() && this._cachedResourcesWereLoaded) {
- this._populateResourceTree();
- this._initialized = true;
- }
- },
+ if (this._initialized)
+ return;
- _populateResourceTree: function()
- {
- WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.ResourceAdded, this._resourceAdded, this);
-
function populateFrame(frame)
{
for (var i = 0; i < frame.childFrames.length; ++i)
@@ -103,6 +64,9 @@
this._resourceAdded({data:resources[i]});
}
populateFrame.call(this, WebInspector.resourceTreeModel.mainFrame);
+
+ WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.ResourceAdded, this._resourceAdded, this);
+ this._initialized = true;
},
_resourceAdded: function(event)
@@ -110,113 +74,98 @@
var resource = event.data;
if (resource.type !== WebInspector.resourceTypes.Stylesheet)
return;
- this._urlToResource[resource.url] = resource;
- this._navigatorView.addUISourceCode(resource);
- this._editorContainer.uiSourceCodeAdded(resource);
+ var uiSourceCode = new WebInspector.StyleSource(resource);
+ this._uiSourceCodes.push(uiSourceCode);
+ this.dispatchEventToListeners(WebInspector.UISourceCodeProvider.Events.UISourceCodeAdded, uiSourceCode);
},
_reset: function()
{
- this._navigatorView.reset();
- this._editorContainer.reset();
- this._urlToResource = {};
- this._sourceFramesForResource = new Map();
- },
+ this._uiSourceCodes = [];
+ }
+}
- _cachedResourcesLoaded: function()
- {
- this._cachedResourcesWereLoaded = true;
- this._initialize();
- },
+WebInspector.StylesUISourceCodeProvider.prototype.__proto__ = WebInspector.Object.prototype;
- get toolbarItemLabel()
- {
- return WebInspector.UIString("Styles");
- },
+/**
+ * @constructor
+ * @extends {WebInspector.UISourceCode}
+ * @param {WebInspector.Resource} resource
+ */
+WebInspector.StyleSource = function(resource)
+{
+ WebInspector.UISourceCode.call(this, resource.url, resource);
+ this._resource = resource;
+}
+WebInspector.StyleSource.prototype = {
+
+}
+
+WebInspector.StyleSource.prototype.__proto__ = WebInspector.UISourceCode.prototype;
+
+/**
+ * @constructor
+ * @extends {WebInspector.SourceFrame}
+ * @param {WebInspector.StyleSource} styleSource
+ */
+WebInspector.StyleSourceFrame = function(styleSource)
+{
+ this._resource = styleSource._resource;
+ this._styleSource = styleSource;
+ WebInspector.SourceFrame.call(this, this._resource.url);
+ this._resource.addEventListener(WebInspector.Resource.Events.RevisionAdded, this._contentChanged, this);
+}
+
+WebInspector.StyleSourceFrame.prototype = {
/**
- * @param {WebInspector.UISourceCode} uiSourceCode
- * @return {WebInspector.SourceFrame}
+ * @return {boolean}
*/
- viewForFile: function(uiSourceCode)
+ canEditSource: function()
{
- var sourceFrame = this._sourceFramesForResource.get(uiSourceCode);
- if (!sourceFrame) {
- sourceFrame = new WebInspector.EditableResourceSourceFrame(uiSourceCode);
- this._sourceFramesForResource.put(uiSourceCode, sourceFrame);
- }
- return sourceFrame;
+ return true;
},
- _itemSelected: function(event)
+ /**
+ * @param {function(?string,boolean,string)} callback
+ */
+ requestContent: function(callback)
{
- var uiSourceCode = /** @type {WebInspector.UISourceCode} */ event.data.uiSourceCode;
- this._showFile(uiSourceCode);
- this._navigatorController.hideNavigatorOverlay();
- if (event.data.focusSource)
- this._editorContainer.view.focus();
+ this._styleSource.requestContent(callback);
},
- _showFile: function(uiSourceCode)
+ /**
+ * @param {string} text
+ */
+ commitEditing: function(text)
{
- this._navigatorView.revealUISourceCode(uiSourceCode);
- this._editorContainer.showFile(uiSourceCode);
+ this._resource.setContent(text, true, function() {});
},
- canShowAnchorLocation: function(anchor)
+ afterTextChanged: function(oldRange, newRange)
{
- var resource = WebInspector.resourceForURL(anchor.href);
- return !!resource && resource.type === WebInspector.resourceTypes.Stylesheet;
+ function commitIncrementalEdit()
+ {
+ var text = this._textModel.text;
+ this._styleSource.setWorkingCopy(text);
+ this._resource.setContent(text, false, function() {});
+ }
+ const updateTimeout = 200;
+ this._incrementalUpdateTimer = setTimeout(commitIncrementalEdit.bind(this), updateTimeout);
},
- showAnchorLocation: function(anchor)
+ _clearIncrementalUpdateTimer: function()
{
- var resource = this._urlToResource[anchor.href];
- if (!resource)
- return;
-
- this._showFile(resource);
- var sourceFrame = this._sourceFramesForResource.get(resource);
- if (typeof anchor.lineNumber === "number")
- sourceFrame.highlightLine(anchor.lineNumber);
- this._editorContainer.view.focus();
+ if (this._incrementalUpdateTimer)
+ clearTimeout(this._incrementalUpdateTimer);
+ delete this._incrementalUpdateTimer;
},
- _showOpenStylesheetDialog: function()
+ _contentChanged: function(event)
{
- if (WebInspector.Dialog.currentInstance())
- return;
-
- var dialog = new WebInspector.FilteredItemSelectionDialog(new WebInspector.OpenStylesheetDialog(this));
- WebInspector.Dialog.show(this.element, dialog);
+ this._styleSource.contentChanged(this._resource.content || "");
+ this.setContent(this._resource.content, false, "text/stylesheet");
}
}
-WebInspector.StylesPanel.prototype.__proto__ = WebInspector.Panel.prototype;
-
-/**
- * @constructor
- * @extends {WebInspector.OpenResourceDialog}
- * @param {WebInspector.StylesPanel} panel
- */
-WebInspector.OpenStylesheetDialog = function(panel)
-{
- var resources = [];
- for (var url in panel._urlToResource)
- resources.push(panel._urlToResource[url]);
- WebInspector.OpenResourceDialog.call(this, resources);
-
- this._panel = panel;
-}
-
-WebInspector.OpenStylesheetDialog.prototype = {
- /**
- * @param {number} itemIndex
- */
- selectItem: function(itemIndex)
- {
- this._panel._showFile(this.resources[itemIndex]);
- }
-}
-
-WebInspector.OpenStylesheetDialog.prototype.__proto__ = WebInspector.OpenResourceDialog.prototype;
+WebInspector.StyleSourceFrame.prototype.__proto__ = WebInspector.SourceFrame.prototype;
Modified: trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/StylesSidebarPane.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -959,7 +959,7 @@
var refElement = mediaDataElement.createChild("div", "subtitle");
var lineNumber = media.sourceLine < 0 ? undefined : media.sourceLine;
var anchor = WebInspector.linkifyResourceAsNode(media.sourceURL, lineNumber, "subtitle", media.sourceURL + (isNaN(lineNumber) ? "" : (":" + (lineNumber + 1))));
- anchor.preferredPanel = "styles";
+ anchor.preferredPanel = "scripts";
anchor.style.float = "right";
refElement.appendChild(anchor);
}
@@ -1213,7 +1213,7 @@
function linkifyUncopyable(url, line)
{
var link = WebInspector.linkifyResourceAsNode(url, line, "", url + ":" + (line + 1));
- link.preferredPanel = "styles";
+ link.preferredPanel = "scripts";
link.classList.add("webkit-html-resource-link");
link.setAttribute("data-uncopyable", link.textContent);
link.textContent = "";
Modified: trunk/Source/WebCore/inspector/front-end/UISourceCode.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/UISourceCode.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/UISourceCode.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -34,7 +34,7 @@
* @extends {WebInspector.Object}
* @param {string} url
* @param {WebInspector.ContentProvider} contentProvider
- * @param {WebInspector.SourceMapping} sourceMapping
+ * @param {WebInspector.SourceMapping=} sourceMapping
*/
WebInspector.UISourceCode = function(url, contentProvider, sourceMapping)
{
@@ -155,11 +155,6 @@
return this._contentLoaded && typeof this._workingCopy !== "undefined" && this._workingCopy !== this._content;
},
- commitWorkingCopy: function(callback)
- {
- // Overriden.
- },
-
/**
* @return {string}
*/
Modified: trunk/Source/WebCore/inspector/front-end/inspector.js (117451 => 117452)
--- trunk/Source/WebCore/inspector/front-end/inspector.js 2012-05-17 15:42:17 UTC (rev 117451)
+++ trunk/Source/WebCore/inspector/front-end/inspector.js 2012-05-17 15:51:11 UTC (rev 117452)
@@ -53,8 +53,6 @@
this.panels.network = new WebInspector.NetworkPanel();
if (hiddenPanels.indexOf("scripts") === -1)
this.panels.scripts = new WebInspector.ScriptsPanel();
- if (hiddenPanels.indexOf("styles") === -1 && WebInspector.experimentsSettings.showStylesPanel.isEnabled())
- this.panels.styles = new WebInspector.StylesPanel();
if (hiddenPanels.indexOf("timeline") === -1)
this.panels.timeline = new WebInspector.TimelinePanel();
if (hiddenPanels.indexOf("profiles") === -1)
