Changeset 53794 in webkit


Ignore:
Timestamp:
Jan 25, 2010 2:37:52 AM (14 years ago)
Author:
pfeldman@chromium.org
Message:

2010-01-24 Pavel Feldman <pfeldman@chromium.org>

Reviewed by Timothy Hatcher.

Web Inspector: Replace split pane with tabbed pane in resource
contents view.

https://bugs.webkit.org/show_bug.cgi?id=32453

Location:
trunk/WebCore
Files:
9 edited

Legend:

Unmodified
Added
Removed
  • trunk/WebCore/ChangeLog

    r53792 r53794  
     12010-01-24  Pavel Feldman  <pfeldman@chromium.org>
     2
     3        Reviewed by Timothy Hatcher.
     4
     5        Web Inspector: Replace split pane with tabbed pane in resource
     6        contents view.
     7
     8        https://bugs.webkit.org/show_bug.cgi?id=32453
     9
     10        * inspector/front-end/ResourceView.js:
     11        (WebInspector.ResourceView):
     12        (WebInspector.ResourceView.prototype.attach):
     13        (WebInspector.ResourceView.prototype.show):
     14        (WebInspector.ResourceView.prototype._selectTab):
     15        (WebInspector.ResourceView.prototype._selectHeadersTab):
     16        (WebInspector.ResourceView.prototype._selectContentTab):
     17        * inspector/front-end/ResourcesPanel.js:
     18        (WebInspector.ResourcesPanel.prototype.show):
     19        (WebInspector.ResourcesPanel.prototype.recreateViewForResourceIfNeeded):
     20        (WebInspector.ResourcesPanel.prototype.showResource):
     21        * inspector/front-end/ScriptsPanel.js:
     22        (WebInspector.ScriptsPanel.prototype.show):
     23        (WebInspector.ScriptsPanel.prototype._showScriptOrResource):
     24        * inspector/front-end/Settings.js:
     25        (WebInspector.Settings.prototype._load):
     26        * inspector/front-end/SourceFrame.js:
     27        (WebInspector.SourceFrame.prototype._loaded):
     28        * inspector/front-end/SourceView.js:
     29        (WebInspector.SourceView):
     30        * inspector/front-end/inspector.css:
     31
    1322010-01-24  Eric Carlson  <eric.carlson@apple.com>
    233
  • trunk/WebCore/inspector/front-end/ResourceView.js

    r52203 r53794  
    3636    this.resource = resource;
    3737
     38    this.tabsElement = document.createElement("div");
     39    this.tabsElement.className = "scope-bar";
     40    this.element.appendChild(this.tabsElement);
     41
     42    this.headersTabElement = document.createElement("li");
     43    this.headersTabElement.textContent = WebInspector.UIString("Headers");
     44    this.contentTabElement = document.createElement("li");
     45    this.contentTabElement.textContent = WebInspector.UIString("Content");
     46    this.tabsElement.appendChild(this.headersTabElement);
     47    this.tabsElement.appendChild(this.contentTabElement);
     48
     49    this.headersTabElement.addEventListener("click", this._selectHeadersTab.bind(this), false);
     50    this.contentTabElement.addEventListener("click", this._selectContentTab.bind(this), false);
     51
    3852    this.headersElement = document.createElement("div");
    3953    this.headersElement.className = "resource-view-headers";
     
    6478     
    6579    this.requestHeadersTreeElement = new TreeElement("", null, true);
    66     this.requestHeadersTreeElement.expanded = false;
     80    this.requestHeadersTreeElement.expanded = true;
    6781    this.requestHeadersTreeElement.selectable = false;
    6882    this.headersTreeOutline.appendChild(this.requestHeadersTreeElement);
     
    7286
    7387    this.queryStringTreeElement = new TreeElement("", null, true);
    74     this.queryStringTreeElement.expanded = false;
     88    this.queryStringTreeElement.expanded = true;
    7589    this.queryStringTreeElement.selectable = false;
    7690    this.queryStringTreeElement.hidden = true;
     
    7892
    7993    this.formDataTreeElement = new TreeElement("", null, true);
    80     this.formDataTreeElement.expanded = false;
     94    this.formDataTreeElement.expanded = true;
    8195    this.formDataTreeElement.selectable = false;
    8296    this.formDataTreeElement.hidden = true;
     
    8498
    8599    this.requestPayloadTreeElement = new TreeElement(WebInspector.UIString("Request Payload"), null, true);
    86     this.requestPayloadTreeElement.expanded = false;
     100    this.requestPayloadTreeElement.expanded = true;
    87101    this.requestPayloadTreeElement.selectable = false;
    88102    this.requestPayloadTreeElement.hidden = true;
     
    90104
    91105    this.responseHeadersTreeElement = new TreeElement("", null, true);
    92     this.responseHeadersTreeElement.expanded = false;
     106    this.responseHeadersTreeElement.expanded = true;
    93107    this.responseHeadersTreeElement.selectable = false;
    94108    this.headersTreeOutline.appendChild(this.responseHeadersTreeElement);
    95 
    96     this.headersVisible = true;
    97109
    98110    resource.addEventListener("url changed", this._refreshURL, this);
     
    105117    this._refreshResponseHeaders();
    106118    this._refreshHTTPInformation();
     119    this._selectTab();
    107120}
    108121
    109122WebInspector.ResourceView.prototype = {
    110     get headersVisible()
    111     {
    112         return this._headersVisible;
    113     },
    114 
    115     set headersVisible(x)
    116     {
    117         if (x === this._headersVisible)
    118             return;
    119 
    120         this._headersVisible = x;
    121 
    122         if (x)
    123             this.element.addStyleClass("headers-visible");
    124         else
    125             this.element.removeStyleClass("headers-visible");
    126     },
    127 
    128123    attach: function()
    129124    {
     
    133128                parentElement.appendChild(this.element);
    134129        }
     130    },
     131
     132    show: function(parentElement)
     133    {
     134        WebInspector.View.prototype.show.call(this, parentElement);
     135        this._selectTab();
     136    },
     137
     138    _selectTab: function()
     139    {
     140        if (WebInspector.settings.resourceViewTab === "headers")
     141            this._selectHeadersTab();
     142        else
     143            this._selectContentTab();
     144    },
     145
     146    _selectHeadersTab: function()
     147    {
     148        WebInspector.settings.resourceViewTab = "headers";
     149        this.headersTabElement.addStyleClass("selected");
     150        this.contentTabElement.removeStyleClass("selected");
     151        this.headersElement.removeStyleClass("hidden");
     152        this.contentElement.addStyleClass("hidden");
     153    },
     154
     155    _selectContentTab: function()
     156    {
     157        WebInspector.settings.resourceViewTab = "content";
     158        this.contentTabElement.addStyleClass("selected");
     159        this.headersTabElement.removeStyleClass("selected");
     160        this.contentElement.removeStyleClass("hidden");
     161        this.headersElement.addStyleClass("hidden");
    135162    },
    136163
  • trunk/WebCore/inspector/front-end/ResourcesPanel.js

    r53766 r53794  
    193193
    194194        var visibleView = this.visibleView;
    195         if (this.visibleResource) {
    196             visibleView.headersVisible = true;
     195        if (this.visibleResource)
    197196            visibleView.show(this.viewsContainerElement);
    198         } else if (visibleView)
     197        else if (visibleView)
    199198            visibleView.show();
    200199
     
    446445        resource._resourcesView = newView;
    447446
    448         newView.headersVisible = oldView.headersVisible;
    449 
    450447        if (oldView.visible && oldView.element.parentNode)
    451448            newView.show(oldView.element.parentNode);
     
    473470
    474471        var view = this.resourceViewForResource(resource);
    475         view.headersVisible = true;
    476472        view.show(this.viewsContainerElement);
    477473
  • trunk/WebCore/inspector/front-end/ScriptsPanel.js

    r53766 r53794  
    230230        this.sidebarResizeElement.style.right = (this.sidebarElement.offsetWidth - 3) + "px";
    231231
    232         if (this.visibleView) {
    233             if (this.visibleView instanceof WebInspector.ResourceView)
    234                 this.visibleView.headersVisible = false;
     232        if (this.visibleView)
    235233            this.visibleView.show(this.viewsContainerElement);
    236         }
    237234
    238235        // Hide any views that are visible that are not this panel's current visible view.
     
    612609                return null;
    613610            view = WebInspector.panels.resources.resourceViewForResource(scriptOrResource);
    614             view.headersVisible = false;
    615611
    616612            if (scriptOrResource.url in this._breakpointsURLMap) {
  • trunk/WebCore/inspector/front-end/Settings.js

    r53545 r53794  
    6868        this._installSetting("showInheritedComputedStyleProperties", "show-inherited-computed-style-properties", false);
    6969        this._installSetting("showUserAgentStyles", "show-user-agent-styles", true);
     70        this._installSetting("resourceViewTab", "resource-view-tab", "headers");
    7071        this.dispatchEventToListeners("loaded");
    7172    },
  • trunk/WebCore/inspector/front-end/SourceFrame.js

    r53366 r53794  
    5757    },
    5858
    59     get autoSizesToFitContentHeight()
    60     {
    61         return this._autoSizesToFitContentHeight;
    62     },
    63 
    64     set autoSizesToFitContentHeight(x)
    65     {
    66         if (this._autoSizesToFitContentHeight === x)
    67             return;
    68 
    69         this._autoSizesToFitContentHeight = x;
    70 
    71         if (this._autoSizesToFitContentHeight) {
    72             this._windowResizeListener = this._windowResized.bind(this);
    73             window.addEventListener("resize", this._windowResizeListener, false);
    74             this.sizeToFitContentHeight();
    75         } else {
    76             this.element.style.removeProperty("height");
    77             if (this.element.contentDocument)
    78                 this.element.contentDocument.body.removeStyleClass("webkit-height-sized-to-fit");
    79             window.removeEventListener("resize", this._windowResizeListener, false);
    80             delete this._windowResizeListener;
    81         }
    82     },
    83 
    8459    sourceRow: function(lineNumber)
    8560    {
     
    279254            this.revealLine(this._executionLine);
    280255
    281         if (this.autoSizesToFitContentHeight)
    282             this.sizeToFitContentHeight();
    283 
    284256        if (this._lineNumberToReveal) {
    285257            this.revealLine(this._lineNumberToReveal);
     
    298270        var doc = this.element.contentDocument;
    299271        return doc && doc.getElementsByTagName("table")[0];
    300     },
    301 
    302     _windowResized: function(event)
    303     {
    304         if (!this._autoSizesToFitContentHeight)
    305             return;
    306         this.sizeToFitContentHeight();
    307272    },
    308273
  • trunk/WebCore/inspector/front-end/SourceView.js

    r51528 r53794  
    2929WebInspector.SourceView = function(resource)
    3030{
    31     // Set the sourceFrame first since WebInspector.ResourceView will set headersVisible
    32     // and our override of headersVisible needs the sourceFrame.
     31    WebInspector.ResourceView.call(this, resource);
     32
    3333    this.sourceFrame = new WebInspector.SourceFrame(null, this._addBreakpoint.bind(this));
    34 
    35     WebInspector.ResourceView.call(this, resource);
    3634
    3735    resource.addEventListener("finished", this._resourceLoadingFinished, this);
     
    4543    var gutterElement = document.createElement("div");
    4644    gutterElement.className = "webkit-line-gutter-backdrop";
    47     this.element.appendChild(gutterElement);
     45    this.contentElement.appendChild(gutterElement);
    4846}
    4947
    5048WebInspector.SourceView.prototype = {
    51     set headersVisible(x)
    52     {
    53         if (x === this._headersVisible)
    54             return;
    55 
    56         var superSetter = WebInspector.ResourceView.prototype.__lookupSetter__("headersVisible");
    57         if (superSetter)
    58             superSetter.call(this, x);
    59 
    60         this.sourceFrame.autoSizesToFitContentHeight = x;
    61     },
    62 
    6349    show: function(parentElement)
    6450    {
     
    7157        WebInspector.View.prototype.hide.call(this);
    7258        this._currentSearchResultIndex = -1;
    73     },
    74 
    75     resize: function()
    76     {
    77         if (this.sourceFrame.autoSizesToFitContentHeight)
    78             this.sourceFrame.sizeToFitContentHeight();
    7959    },
    8060
  • trunk/WebCore/inspector/front-end/inspector.css

    r53696 r53794  
    768768.resource-view {
    769769    display: none;
    770     overflow: hidden;
    771     position: absolute;
    772     top: 0;
    773     left: 0;
    774     right: 0;
    775     bottom: 0;
    776     overflow: hidden;
     770    position: absolute;
     771    top: 0;
     772    left: 0;
     773    right: 0;
     774    bottom: 0;
    777775}
    778776
     
    781779}
    782780
    783 .resource-view.headers-visible {
    784     overflow-y: auto;
    785     overflow-x: hidden;
     781.resource-view .scope-bar {
     782    position: absolute;
     783    height: 20px;
     784    top: 0;
     785    left: 0;
     786    right: 0;
     787    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(236, 236, 236)), to(rgb(217, 217, 217)));
     788    border-bottom: 1px solid rgb(163, 163, 163);
     789}
     790
     791.resource-view .scope-bar li {
     792    border-bottom-left-radius: 0;
     793    border-bottom-right-radius: 0;
    786794}
    787795
    788796.resource-view-headers {
    789     display: none;
    790797    padding: 6px;
    791     border-bottom: 1px solid rgb(64%, 64%, 64%);
    792     background-color: white;
    793     -webkit-user-select: text;
     798    -webkit-user-select: text;   
     799    position: absolute;
     800    top: 20px;
     801    left: 0;
     802    right: 0;
     803    bottom: 0;
     804    overflow: auto;
    794805}
    795806
     
    797808    -webkit-user-select: none;
    798809    font-weight: bold;
    799 }
    800 
    801 .resource-view.headers-visible .resource-view-headers {
    802     display: block;
    803810}
    804811
     
    834841.resource-view .resource-view-content {
    835842    position: absolute;
    836     top: 0;
    837     right: 0;
    838     left: 0;
    839     bottom: 0;
    840 }
    841 
    842 .resource-view.headers-visible .resource-view-content {
    843     position: relative;
    844     top: auto;
    845     right: auto;
    846     left: auto;
    847     bottom: auto;
    848 }
    849 
    850 .resource-view.headers-visible .source-view-frame {
    851     height: auto;
    852     vertical-align: top;
     843    top: 20px;
     844    right: 0;
     845    left: 0;
     846    bottom: 0;
    853847}
    854848
Note: See TracChangeset for help on using the changeset viewer.