Changeset 175784 in webkit


Ignore:
Timestamp:
Nov 8, 2014 7:17:40 PM (9 years ago)
Author:
commit-queue@webkit.org
Message:

Web Inspector: decouple child element folderization logic from FrameTreeElement
​https://bugs.webkit.org/show_bug.cgi?id=138364

Patch by Matt Baker <Matt Baker> on 2014-11-08
Reviewed by Timothy Hatcher.

Created FolderizedTreeElement base class, which FrameTreeElement now inherits via SourceCodeTreeElement.
FolderizedTreeElement uses settings provided by derived classes for labeling subfolders and to determine
folder membership for child items.

  • UserInterface/Base/Main.js:

(WebInspector.canArchiveMainFrame):

  • UserInterface/Main.html:
  • UserInterface/Models/LayoutTimelineRecord.js:

(WebInspector.LayoutTimelineRecord.displayNameForEventType):
(WebInspector.LayoutTimelineRecord.EventType.displayName): Deleted.

  • UserInterface/Models/Resource.js:

(WebInspector.Resource):
(WebInspector.Resource.typeFromMIMEType):
(WebInspector.Resource.displayNameForType):
(WebInspector.Resource.prototype.get syntheticMIMEType):
(WebInspector.Resource.prototype.updateForResponse):
(WebInspector.Resource.Type.fromMIMEType): Deleted.
(WebInspector.Resource.Type.displayName): Deleted.

  • UserInterface/Models/SourceMapResource.js:

(WebInspector.SourceMapResource):

  • UserInterface/Views/FolderizedTreeElement.js: Added.

(WebInspector.FolderizedTreeElement):
(WebInspector.FolderizedTreeElement.prototype.get groupedIntoFolders):
(WebInspector.FolderizedTreeElement.prototype.set folderSettingsKey):
(WebInspector.FolderizedTreeElement.prototype.registerFolderizeSettings):
(WebInspector.FolderizedTreeElement.prototype.set removeChildren):
(WebInspector.FolderizedTreeElement.prototype.addChildForRepresentedObject):
(WebInspector.FolderizedTreeElement.prototype.addRepresentedObjectToNewChildQueue):
(WebInspector.FolderizedTreeElement.prototype.removeChildForRepresentedObject):
(WebInspector.FolderizedTreeElement.prototype.compareChildTreeElements):
(WebInspector.FolderizedTreeElement.prototype.updateParentStatus):
(WebInspector.FolderizedTreeElement.prototype._clearNewChildQueue):
(WebInspector.FolderizedTreeElement.prototype._populateFromNewChildQueue):
(WebInspector.FolderizedTreeElement.prototype._removeRepresentedObjectFromNewChildQueue):
(WebInspector.FolderizedTreeElement.prototype._addTreeElement):
(WebInspector.FolderizedTreeElement.prototype._compareTreeElementsByMainTitle):
(WebInspector.FolderizedTreeElement.prototype._insertFolderTreeElement):
(WebInspector.FolderizedTreeElement.prototype._insertChildTreeElement):
(WebInspector.FolderizedTreeElement.prototype._removeTreeElement):
(WebInspector.FolderizedTreeElement.prototype._parentTreeElementForRepresentedObject):
(WebInspector.FolderizedTreeElement.prototype._folderTreeElementExpandedStateChange):
(WebInspector.FolderizedTreeElement.prototype._settingsForRepresentedObject):
(WebInspector.FolderizedTreeElement.prototype._shouldGroupIntoFolders.pushCategory):
(WebInspector.FolderizedTreeElement.prototype._shouldGroupIntoFolders):

  • UserInterface/Views/FrameTreeElement.js:

(.this):
(WebInspector.FrameTreeElement.prototype.updateSourceMapResources):
(WebInspector.FrameTreeElement.prototype.onattach):
(WebInspector.FrameTreeElement.prototype.ondetach):
(WebInspector.FrameTreeElement.prototype.compareChildTreeElements):
(WebInspector.FrameTreeElement.prototype.onpopulate):
(WebInspector.FrameTreeElement.prototype._mainResourceDidChange):
(WebInspector.FrameTreeElement.prototype._resourceWasAdded):
(WebInspector.FrameTreeElement.prototype._resourceWasRemoved):
(WebInspector.FrameTreeElement.prototype._childFrameWasAdded):
(WebInspector.FrameTreeElement.prototype._childFrameWasRemoved):
(WebInspector.FrameTreeElement.prototype._childContentFlowWasAdded):
(WebInspector.FrameTreeElement.prototype._childContentFlowWasRemoved):
(WebInspector.FrameTreeElement.prototype._rootDOMNodeInvalidated):
(WebInspector.FrameTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype.removeChildren): Deleted.
(WebInspector.FrameTreeElement.prototype._updateParentStatus): Deleted.
(WebInspector.FrameTreeElement.prototype._addRepresentedObjectToNewChildQueue): Deleted.
(WebInspector.FrameTreeElement.prototype._removeRepresentedObjectFromNewChildQueue): Deleted.
(WebInspector.FrameTreeElement.prototype._populateFromNewChildQueue): Deleted.
(WebInspector.FrameTreeElement.prototype._clearNewChildQueue): Deleted.
(WebInspector.FrameTreeElement.prototype._addChildForRepresentedObject): Deleted.
(WebInspector.FrameTreeElement.prototype._removeChildForRepresentedObject): Deleted.
(WebInspector.FrameTreeElement.prototype._addTreeElementForRepresentedObject): Deleted.
(WebInspector.FrameTreeElement.prototype._addTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype._compareTreeElementsByMainTitle): Deleted.
(WebInspector.FrameTreeElement.prototype._insertFolderTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype._compareResourceTreeElements): Deleted.
(WebInspector.FrameTreeElement.prototype._insertResourceTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype._removeTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype._folderNameForResourceType): Deleted.
(WebInspector.FrameTreeElement.prototype._parentTreeElementForRepresentedObject.createFolderTreeElement): Deleted.
(WebInspector.FrameTreeElement.prototype._parentTreeElementForRepresentedObject): Deleted.
(WebInspector.FrameTreeElement.prototype._folderTreeElementExpandedStateChange): Deleted.
(WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders.pushResourceType): Deleted.
(WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders.pushCategory): Deleted.
(WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders): Deleted.

  • UserInterface/Views/LayoutTimelineDataGridNode.js:

(WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):

  • UserInterface/Views/LayoutTimelineView.js:

(WebInspector.LayoutTimelineView): Deleted.

  • UserInterface/Views/NetworkTimelineView.js:

(WebInspector.NetworkTimelineView): Deleted.

  • UserInterface/Views/ResourceDetailsSidebarPanel.js:

(WebInspector.ResourceDetailsSidebarPanel.prototype._refreshResourceType):

  • UserInterface/Views/ResourceTimelineDataGridNode.js:

(WebInspector.ResourceTimelineDataGridNode.prototype.createCellContent):

  • UserInterface/Views/SourceCodeTreeElement.js:

(WebInspector.SourceCodeTreeElement):

  • UserInterface/Views/TimelineDataGrid.js:

(WebInspector.TimelineDataGrid.createColumnScopeBar):

  • UserInterface/Views/TimelineRecordTreeElement.js:

(WebInspector.TimelineRecordTreeElement):

  • WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
  • WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
Location:
trunk/Source/WebInspectorUI
Files:
1 added
17 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r175767 r175784  
     12014-11-08  Matt Baker  <mattbaker@apple.com>
     2
     3        Web Inspector: decouple child element folderization logic from FrameTreeElement
     4        https://bugs.webkit.org/show_bug.cgi?id=138364
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        Created FolderizedTreeElement base class, which FrameTreeElement now inherits via SourceCodeTreeElement.
     9        FolderizedTreeElement uses settings provided by derived classes for labeling subfolders and to determine
     10        folder membership for child items.
     11
     12        * UserInterface/Base/Main.js:
     13        (WebInspector.canArchiveMainFrame):
     14        * UserInterface/Main.html:
     15        * UserInterface/Models/LayoutTimelineRecord.js:
     16        (WebInspector.LayoutTimelineRecord.displayNameForEventType):
     17        (WebInspector.LayoutTimelineRecord.EventType.displayName): Deleted.
     18        * UserInterface/Models/Resource.js:
     19        (WebInspector.Resource):
     20        (WebInspector.Resource.typeFromMIMEType):
     21        (WebInspector.Resource.displayNameForType):
     22        (WebInspector.Resource.prototype.get syntheticMIMEType):
     23        (WebInspector.Resource.prototype.updateForResponse):
     24        (WebInspector.Resource.Type.fromMIMEType): Deleted.
     25        (WebInspector.Resource.Type.displayName): Deleted.
     26        * UserInterface/Models/SourceMapResource.js:
     27        (WebInspector.SourceMapResource):
     28        * UserInterface/Views/FolderizedTreeElement.js: Added.
     29        (WebInspector.FolderizedTreeElement):
     30        (WebInspector.FolderizedTreeElement.prototype.get groupedIntoFolders):
     31        (WebInspector.FolderizedTreeElement.prototype.set folderSettingsKey):
     32        (WebInspector.FolderizedTreeElement.prototype.registerFolderizeSettings):
     33        (WebInspector.FolderizedTreeElement.prototype.set removeChildren):
     34        (WebInspector.FolderizedTreeElement.prototype.addChildForRepresentedObject):
     35        (WebInspector.FolderizedTreeElement.prototype.addRepresentedObjectToNewChildQueue):
     36        (WebInspector.FolderizedTreeElement.prototype.removeChildForRepresentedObject):
     37        (WebInspector.FolderizedTreeElement.prototype.compareChildTreeElements):
     38        (WebInspector.FolderizedTreeElement.prototype.updateParentStatus):
     39        (WebInspector.FolderizedTreeElement.prototype._clearNewChildQueue):
     40        (WebInspector.FolderizedTreeElement.prototype._populateFromNewChildQueue):
     41        (WebInspector.FolderizedTreeElement.prototype._removeRepresentedObjectFromNewChildQueue):
     42        (WebInspector.FolderizedTreeElement.prototype._addTreeElement):
     43        (WebInspector.FolderizedTreeElement.prototype._compareTreeElementsByMainTitle):
     44        (WebInspector.FolderizedTreeElement.prototype._insertFolderTreeElement):
     45        (WebInspector.FolderizedTreeElement.prototype._insertChildTreeElement):
     46        (WebInspector.FolderizedTreeElement.prototype._removeTreeElement):
     47        (WebInspector.FolderizedTreeElement.prototype._parentTreeElementForRepresentedObject):
     48        (WebInspector.FolderizedTreeElement.prototype._folderTreeElementExpandedStateChange):
     49        (WebInspector.FolderizedTreeElement.prototype._settingsForRepresentedObject):
     50        (WebInspector.FolderizedTreeElement.prototype._shouldGroupIntoFolders.pushCategory):
     51        (WebInspector.FolderizedTreeElement.prototype._shouldGroupIntoFolders):
     52        * UserInterface/Views/FrameTreeElement.js:
     53        (.this):
     54        (WebInspector.FrameTreeElement.prototype.updateSourceMapResources):
     55        (WebInspector.FrameTreeElement.prototype.onattach):
     56        (WebInspector.FrameTreeElement.prototype.ondetach):
     57        (WebInspector.FrameTreeElement.prototype.compareChildTreeElements):
     58        (WebInspector.FrameTreeElement.prototype.onpopulate):
     59        (WebInspector.FrameTreeElement.prototype._mainResourceDidChange):
     60        (WebInspector.FrameTreeElement.prototype._resourceWasAdded):
     61        (WebInspector.FrameTreeElement.prototype._resourceWasRemoved):
     62        (WebInspector.FrameTreeElement.prototype._childFrameWasAdded):
     63        (WebInspector.FrameTreeElement.prototype._childFrameWasRemoved):
     64        (WebInspector.FrameTreeElement.prototype._childContentFlowWasAdded):
     65        (WebInspector.FrameTreeElement.prototype._childContentFlowWasRemoved):
     66        (WebInspector.FrameTreeElement.prototype._rootDOMNodeInvalidated):
     67        (WebInspector.FrameTreeElement): Deleted.
     68        (WebInspector.FrameTreeElement.prototype.removeChildren): Deleted.
     69        (WebInspector.FrameTreeElement.prototype._updateParentStatus): Deleted.
     70        (WebInspector.FrameTreeElement.prototype._addRepresentedObjectToNewChildQueue): Deleted.
     71        (WebInspector.FrameTreeElement.prototype._removeRepresentedObjectFromNewChildQueue): Deleted.
     72        (WebInspector.FrameTreeElement.prototype._populateFromNewChildQueue): Deleted.
     73        (WebInspector.FrameTreeElement.prototype._clearNewChildQueue): Deleted.
     74        (WebInspector.FrameTreeElement.prototype._addChildForRepresentedObject): Deleted.
     75        (WebInspector.FrameTreeElement.prototype._removeChildForRepresentedObject): Deleted.
     76        (WebInspector.FrameTreeElement.prototype._addTreeElementForRepresentedObject): Deleted.
     77        (WebInspector.FrameTreeElement.prototype._addTreeElement): Deleted.
     78        (WebInspector.FrameTreeElement.prototype._compareTreeElementsByMainTitle): Deleted.
     79        (WebInspector.FrameTreeElement.prototype._insertFolderTreeElement): Deleted.
     80        (WebInspector.FrameTreeElement.prototype._compareResourceTreeElements): Deleted.
     81        (WebInspector.FrameTreeElement.prototype._insertResourceTreeElement): Deleted.
     82        (WebInspector.FrameTreeElement.prototype._removeTreeElement): Deleted.
     83        (WebInspector.FrameTreeElement.prototype._folderNameForResourceType): Deleted.
     84        (WebInspector.FrameTreeElement.prototype._parentTreeElementForRepresentedObject.createFolderTreeElement): Deleted.
     85        (WebInspector.FrameTreeElement.prototype._parentTreeElementForRepresentedObject): Deleted.
     86        (WebInspector.FrameTreeElement.prototype._folderTreeElementExpandedStateChange): Deleted.
     87        (WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders.pushResourceType): Deleted.
     88        (WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders.pushCategory): Deleted.
     89        (WebInspector.FrameTreeElement.prototype._shouldGroupIntoFolders): Deleted.
     90        * UserInterface/Views/LayoutTimelineDataGridNode.js:
     91        (WebInspector.LayoutTimelineDataGridNode.prototype.createCellContent):
     92        * UserInterface/Views/LayoutTimelineView.js:
     93        (WebInspector.LayoutTimelineView): Deleted.
     94        * UserInterface/Views/NetworkTimelineView.js:
     95        (WebInspector.NetworkTimelineView): Deleted.
     96        * UserInterface/Views/ResourceDetailsSidebarPanel.js:
     97        (WebInspector.ResourceDetailsSidebarPanel.prototype._refreshResourceType):
     98        * UserInterface/Views/ResourceTimelineDataGridNode.js:
     99        (WebInspector.ResourceTimelineDataGridNode.prototype.createCellContent):
     100        * UserInterface/Views/SourceCodeTreeElement.js:
     101        (WebInspector.SourceCodeTreeElement):
     102        * UserInterface/Views/TimelineDataGrid.js:
     103        (WebInspector.TimelineDataGrid.createColumnScopeBar):
     104        * UserInterface/Views/TimelineRecordTreeElement.js:
     105        (WebInspector.TimelineRecordTreeElement):
     106        * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj:
     107        * WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters:
     108
    11092014-11-07  Joseph Pecoraro  <pecoraro@apple.com>
    2110

  • trunk/Source/WebInspectorUI/UserInterface/Base/Main.js

    r175767 r175784  
    18641864        return false;
    18651865
    1866     return WebInspector.Resource.Type.fromMIMEType(WebInspector.frameResourceManager.mainFrame.mainResource.mimeType) === WebInspector.Resource.Type.Document;
     1866    return WebInspector.Resource.typeFromMIMEType(WebInspector.frameResourceManager.mainFrame.mainResource.mimeType) === WebInspector.Resource.Type.Document;
    18671867}
    18681868

  • trunk/Source/WebInspectorUI/UserInterface/Main.html

    r175767 r175784  
    302302
    303303    <script src="Views/DOMDetailsSidebarPanel.js"></script>
     304    <script src="Views/FolderizedTreeElement.js"></script>
    304305    <script src="Views/SourceCodeTreeElement.js"></script>
    305306    <script src="Views/StorageTreeElement.js"></script>

  • trunk/Source/WebInspectorUI/UserInterface/Models/LayoutTimelineRecord.js

    r164918 r175784  
    5050};
    5151
    52 WebInspector.LayoutTimelineRecord.EventType.displayName = function(eventType)
     52WebInspector.LayoutTimelineRecord.displayNameForEventType = function(eventType)
    5353{
    5454    switch(eventType) {

  • trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js

    r175203 r175784  
    3535    this._url = url;
    3636    this._mimeType = mimeType;
    37     this._type = type || WebInspector.Resource.Type.fromMIMEType(mimeType);
     37    this._type = type || WebInspector.Resource.typeFromMIMEType(mimeType);
    3838    this._loaderIdentifier = loaderIdentifier || null;
    3939    this._requestIdentifier = requestIdentifier || null;
    … …  
    8686};
    8787
    88 // This MIME Type map is private, use WebInspector.Resource.Type.fromMIMEType().
    89 WebInspector.Resource.Type._mimeTypeMap = {
     88// This MIME Type map is private, use WebInspector.Resource.typeFromMIMEType().
     89WebInspector.Resource._mimeTypeMap = {
    9090    "text/html": WebInspector.Resource.Type.Document,
    9191    "text/xml": WebInspector.Resource.Type.Document,
    … …  
    127127};
    128128
    129 WebInspector.Resource.Type.fromMIMEType = function(mimeType)
     129WebInspector.Resource.typeFromMIMEType = function(mimeType)
    130130{
    131131    if (!mimeType)
    … …  
    134134    mimeType = parseMIMEType(mimeType).type;
    135135
    136     if (mimeType in WebInspector.Resource.Type._mimeTypeMap)
    137         return WebInspector.Resource.Type._mimeTypeMap[mimeType];
     136    if (mimeType in WebInspector.Resource._mimeTypeMap)
     137        return WebInspector.Resource._mimeTypeMap[mimeType];
    138138
    139139    if (mimeType.startsWith("image/"))
    … …  
    146146};
    147147
    148 WebInspector.Resource.Type.displayName = function(type, plural)
     148WebInspector.Resource.displayNameForType = function(type, plural)
    149149{
    150150    switch(type) {
    … …  
    236236
    237237        // If the type matches the Resource.Type of the MIME-type, then return the actual MIME-type.
    238         if (this._type === WebInspector.Resource.Type.fromMIMEType(this._mimeType))
     238        if (this._type === WebInspector.Resource.typeFromMIMEType(this._mimeType))
    239239            return this._mimeType;
    240240
    … …  
    498498        this._url = url;
    499499        this._mimeType = mimeType;
    500         this._type = type || WebInspector.Resource.Type.fromMIMEType(mimeType);
     500        this._type = type || WebInspector.Resource.typeFromMIMEType(mimeType);
    501501        this._statusCode = statusCode;
    502502        this._statusText = statusText;

  • trunk/Source/WebInspectorUI/UserInterface/Models/SourceMapResource.js

    r170863 r175784  
    4242    // Resource base-class to set _mimeType and _type.
    4343    this._mimeType = fileExtensionMIMEType || inheritedMIMEType || "text/javascript";
    44     this._type = WebInspector.Resource.Type.fromMIMEType(this._mimeType);
     44    this._type = WebInspector.Resource.typeFromMIMEType(this._mimeType);
    4545
    4646    // Mark the resource as loaded so it does not show a spinner in the sidebar.

  • trunk/Source/WebInspectorUI/UserInterface/Views/FrameTreeElement.js

    r173407 r175784  
    3131
    3232    this._frame = frame;
    33     this._newChildQueue = [];
    3433
    3534    this._updateExpandedSetting();
    … …  
    4544    frame.domTree.addEventListener(WebInspector.DOMTree.Event.RootDOMNodeInvalidated, this._rootDOMNodeInvalidated, this);
    4645
    47     if (this._frame.isMainFrame()) {
     46    if (this._frame.isMainFrame())
    4847        this._downloadingPage = false;
    49         WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveStarted, this._pageArchiveStarted, this);
    50         WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveEnded, this._pageArchiveEnded, this);
     48
     49    this.shouldRefreshChildren = true;
     50    this.folderSettingsKey = this._frame.url.hash;
     51
     52    this.registerFolderizeSettings("frames", WebInspector.UIString("Frames"),
     53        function(representedObject) { return representedObject instanceof WebInspector.Frame; },
     54        function() { return this.frame.childFrames.length; }.bind(this),
     55        WebInspector.FrameTreeElement
     56    );
     57
     58    this.registerFolderizeSettings("flows", WebInspector.UIString("Flows"),
     59        function(representedObject) { return representedObject instanceof WebInspector.ContentFlow; },
     60        function() { return this.frame.domTree.flowsCount; }.bind(this),
     61        WebInspector.ContentFlowTreeElement
     62    );
     63
     64    function makeValidateCallback(resourceType) {
     65        return function(representedObject) {
     66            return representedObject instanceof WebInspector.Resource && representedObject.type === resourceType;
     67        };
    5168    }
    5269
    53     this._updateParentStatus();
    54     this.shouldRefreshChildren = true;
     70    function makeChildCountCallback(frame, resourceType) {
     71        return function() {
     72            return frame.resourcesWithType(resourceType).length;
     73        };
     74    }
     75
     76    for (var key in WebInspector.Resource.Type) {
     77        var value = WebInspector.Resource.Type[key];
     78        var folderName = WebInspector.Resource.displayNameForType(value, true);
     79        this.registerFolderizeSettings(key, folderName,
     80            makeValidateCallback(value),
     81            makeChildCountCallback(this.frame, value),
     82            WebInspector.ResourceTreeElement
     83        );
     84    }
     85
     86    this.updateParentStatus();
    5587};
    56 
    57 WebInspector.FrameTreeElement.MediumChildCountThreshold = 5;
    58 WebInspector.FrameTreeElement.LargeChildCountThreshold = 15;
    59 WebInspector.FrameTreeElement.NumberOfMediumCategoriesThreshold = 2;
    60 WebInspector.FrameTreeElement.NewChildQueueUpdateInterval = 500;
    6188
    6289WebInspector.FrameTreeElement.prototype = {
    6390    constructor: WebInspector.FrameTreeElement,
     91    __proto__: WebInspector.ResourceTreeElement.prototype,
    6492
    6593    // Public
    … …  
    100128            return;
    101129
    102         this._updateParentStatus();
     130        this.updateParentStatus();
    103131
    104132        if (this.resource && this.resource.sourceMaps.length)
    … …  
    108136    onattach: function()
    109137    {
    110         // Frames handle their own SourceMapResources.
    111 
     138        // Immediate superclasses are skipped, since Frames handle their own SourceMapResources.
    112139        WebInspector.GeneralTreeElement.prototype.onattach.call(this);
     140
     141        if (this._frame.isMainFrame()) {
     142            WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveStarted, this._pageArchiveStarted, this);
     143            WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveEnded, this._pageArchiveEnded, this);
     144        }
     145    },
     146
     147    ondetach: function()
     148    {
     149        WebInspector.ResourceTreeElement.prototype.ondetach.call(this);
     150
     151        if (this._frame.isMainFrame()) {
     152            WebInspector.notifications.removeEventListener(WebInspector.Notification.PageArchiveStarted, this._pageArchiveStarted, this);
     153            WebInspector.notifications.removeEventListener(WebInspector.Notification.PageArchiveEnded, this._pageArchiveEnded, this);
     154        }
     155    },
     156
     157    // Overrides from FolderizedTreeElement (Protected).
     158
     159    compareChildTreeElements: function(a, b)
     160    {
     161        if (a === b)
     162            return 0;
     163
     164        var aIsResource = a instanceof WebInspector.ResourceTreeElement;
     165        var bIsResource = b instanceof WebInspector.ResourceTreeElement;
     166
     167        if (aIsResource && bIsResource)
     168            return WebInspector.ResourceTreeElement.compareResourceTreeElements(a, b);
     169
     170        if (!aIsResource && !bIsResource) {
     171            // When both components are not resources then default to base class comparison.
     172            return WebInspector.ResourceTreeElement.prototype.compareChildTreeElements.call(this, a, b);
     173        }
     174
     175        // Non-resources should appear before the resources.
     176        // FIXME: There should be a better way to group the elements by their type.
     177        return aIsResource ? 1 : -1;
    113178    },
    114179
    … …  
    164229
    165230        this.removeChildren();
    166         this._clearNewChildQueue();
    167 
    168         if (this._shouldGroupIntoFolders() && !this._groupedIntoFolders)
    169             this._groupedIntoFolders = true;
    170231
    171232        for (var i = 0; i < this._frame.childFrames.length; ++i)
    172             this._addTreeElementForRepresentedObject(this._frame.childFrames[i]);
     233            this.addChildForRepresentedObject(this._frame.childFrames[i]);
    173234
    174235        for (var i = 0; i < this._frame.resources.length; ++i)
    175             this._addTreeElementForRepresentedObject(this._frame.resources[i]);
     236            this.addChildForRepresentedObject(this._frame.resources[i]);
    176237
    177238        var sourceMaps = this.resource && this.resource.sourceMaps;
    … …  
    179240            var sourceMap = sourceMaps[i];
    180241            for (var j = 0; j < sourceMap.resources.length; ++j)
    181             this._addTreeElementForRepresentedObject(sourceMap.resources[j]);
     242                this.addChildForRepresentedObject(sourceMap.resources[j]);
    182243        }
    183244
    184245        var flowMap = this._frame.domTree.flowMap;
    185246        for (var flowKey in flowMap)
    186             this._addTreeElementForRepresentedObject(flowMap[flowKey]);
     247            this.addChildForRepresentedObject(flowMap[flowKey]);
    187248    },
    188249
    … …  
    199260        if (this.hasChildren)
    200261            this._expandedSetting.value = false;
    201     },
    202 
    203     removeChildren: function()
    204     {
    205         TreeElement.prototype.removeChildren.call(this);
    206 
    207         if (this._framesFolderTreeElement)
    208             this._framesFolderTreeElement.removeChildren();
    209 
    210         for (var type in this._resourceFoldersTypeMap)
    211             this._resourceFoldersTypeMap[type].removeChildren();
    212 
    213         delete this._resourceFoldersTypeMap;
    214         delete this._framesFolderTreeElement;
    215262    },
    216263
    … …  
    226273    },
    227274
    228     _updateParentStatus: function()
    229     {
    230         this.hasChildren = (this._frame.resources.length || this._frame.childFrames.length || (this.resource && this.resource.sourceMaps.length));
    231         if (!this.hasChildren)
    232             this.removeChildren();
    233     },
    234 
    235275    _mainResourceDidChange: function(event)
    236276    {
    237277        this._updateResource(this._frame.mainResource);
    238         this._updateParentStatus();
    239 
    240         this._groupedIntoFolders = false;
    241 
    242         this._clearNewChildQueue();
    243 
     278
     279        this.updateParentStatus();
    244280        this.removeChildren();
    245281
    … …  
    256292    _resourceWasAdded: function(event)
    257293    {
    258         this._addRepresentedObjectToNewChildQueue(event.data.resource);
     294        this.addRepresentedObjectToNewChildQueue(event.data.resource);
    259295    },
    260296
    261297    _resourceWasRemoved: function(event)
    262298    {
    263         this._removeChildForRepresentedObject(event.data.resource);
     299        this.removeChildForRepresentedObject(event.data.resource);
    264300    },
    265301
    266302    _childFrameWasAdded: function(event)
    267303    {
    268         this._addRepresentedObjectToNewChildQueue(event.data.childFrame);
     304        this.addRepresentedObjectToNewChildQueue(event.data.childFrame);
    269305    },
    270306
    271307    _childFrameWasRemoved: function(event)
    272308    {
    273         this._removeChildForRepresentedObject(event.data.childFrame);
     309        this.removeChildForRepresentedObject(event.data.childFrame);
    274310    },
    275311
    276312    _childContentFlowWasAdded: function(event)
    277313    {
    278         this._addRepresentedObjectToNewChildQueue(event.data.flow);
     314        this.addRepresentedObjectToNewChildQueue(event.data.flow);
    279315    },
    280316
    281317    _childContentFlowWasRemoved: function(event)
    282318    {
    283         this._removeChildForRepresentedObject(event.data.flow);
    284     },
    285 
    286     _rootDOMNodeInvalidated: function() {
     319        this.removeChildForRepresentedObject(event.data.flow);
     320    },
     321
     322    _rootDOMNodeInvalidated: function()
     323    {
    287324        if (this.expanded)
    288325            this._frame.domTree.requestContentFlowList();
    289     },
    290 
    291     _addRepresentedObjectToNewChildQueue: function(representedObject)
    292     {
    293         // This queue reduces flashing as resources load and change folders when their type becomes known.
    294 
    295         this._newChildQueue.push(representedObject);
    296         if (!this._newChildQueueTimeoutIdentifier)
    297             this._newChildQueueTimeoutIdentifier = setTimeout(this._populateFromNewChildQueue.bind(this), WebInspector.FrameTreeElement.NewChildQueueUpdateInterval);
    298     },
    299 
    300     _removeRepresentedObjectFromNewChildQueue: function(representedObject)
    301     {
    302         this._newChildQueue.remove(representedObject);
    303     },
    304 
    305     _populateFromNewChildQueue: function()
    306     {
    307         if (!this.children.length) {
    308             this._updateParentStatus();
    309             this.shouldRefreshChildren = true;
    310             return;
    311         }
    312 
    313         for (var i = 0; i < this._newChildQueue.length; ++i)
    314             this._addChildForRepresentedObject(this._newChildQueue[i]);
    315 
    316         this._newChildQueue = [];
    317         this._newChildQueueTimeoutIdentifier = null;
    318     },
    319 
    320     _clearNewChildQueue: function()
    321     {
    322         this._newChildQueue = [];
    323         if (this._newChildQueueTimeoutIdentifier) {
    324             clearTimeout(this._newChildQueueTimeoutIdentifier);
    325             this._newChildQueueTimeoutIdentifier = null;
    326         }
    327     },
    328 
    329     _addChildForRepresentedObject: function(representedObject)
    330     {
    331         console.assert(representedObject instanceof WebInspector.Resource || representedObject instanceof WebInspector.Frame || representedObject instanceof WebInspector.ContentFlow);
    332         if (!(representedObject instanceof WebInspector.Resource || representedObject instanceof WebInspector.Frame || representedObject instanceof WebInspector.ContentFlow))
    333             return;
    334 
    335         this._updateParentStatus();
    336 
    337         if (!this.treeOutline) {
    338             // Just mark as needing to update to avoid doing work that might not be needed.
    339             this.shouldRefreshChildren = true;
    340             return;
    341         }
    342 
    343         if (this._shouldGroupIntoFolders() && !this._groupedIntoFolders) {
    344             // Mark as needing a refresh to rebuild the tree into folders.
    345             this._groupedIntoFolders = true;
    346             this.shouldRefreshChildren = true;
    347             return;
    348         }
    349 
    350         this._addTreeElementForRepresentedObject(representedObject);
    351     },
    352 
    353     _removeChildForRepresentedObject: function(representedObject)
    354     {
    355         console.assert(representedObject instanceof WebInspector.Resource || representedObject instanceof WebInspector.Frame || representedObject instanceof WebInspector.ContentFlow);
    356         if (!(representedObject instanceof WebInspector.Resource || representedObject instanceof WebInspector.Frame || representedObject instanceof WebInspector.ContentFlow))
    357             return;
    358 
    359         this._removeRepresentedObjectFromNewChildQueue(representedObject);
    360 
    361         this._updateParentStatus();
    362 
    363         if (!this.treeOutline) {
    364             // Just mark as needing to update to avoid doing work that might not be needed.
    365             this.shouldRefreshChildren = true;
    366             return;
    367         }
    368 
    369         // Find the tree element for the frame by using getCachedTreeElement
    370         // to only get the item if it has been created already.
    371         var childTreeElement = this.treeOutline.getCachedTreeElement(representedObject);
    372         if (!childTreeElement || !childTreeElement.parent)
    373             return;
    374 
    375         this._removeTreeElement(childTreeElement);
    376     },
    377 
    378     _addTreeElementForRepresentedObject: function(representedObject)
    379     {
    380         var childTreeElement = this.treeOutline.getCachedTreeElement(representedObject);
    381         if (!childTreeElement) {
    382             if (representedObject instanceof WebInspector.SourceMapResource)
    383                 childTreeElement = new WebInspector.SourceMapResourceTreeElement(representedObject);
    384             else if (representedObject instanceof WebInspector.Resource)
    385                 childTreeElement = new WebInspector.ResourceTreeElement(representedObject);
    386             else if (representedObject instanceof WebInspector.Frame)
    387                 childTreeElement = new WebInspector.FrameTreeElement(representedObject);
    388             else if (representedObject instanceof WebInspector.ContentFlow)
    389                 childTreeElement = new WebInspector.ContentFlowTreeElement(representedObject);
    390         }
    391 
    392         this._addTreeElement(childTreeElement);
    393     },
    394 
    395     _addTreeElement: function(childTreeElement)
    396     {
    397         console.assert(childTreeElement);
    398         if (!childTreeElement)
    399             return;
    400 
    401         var wasSelected = childTreeElement.selected;
    402 
    403         this._removeTreeElement(childTreeElement, true, true);
    404 
    405         var parentTreeElement = this._parentTreeElementForRepresentedObject(childTreeElement.representedObject);
    406         if (parentTreeElement !== this && !parentTreeElement.parent)
    407             this._insertFolderTreeElement(parentTreeElement);
    408 
    409         this._insertResourceTreeElement(parentTreeElement, childTreeElement);
    410 
    411         if (wasSelected)
    412             childTreeElement.revealAndSelect(true, false, true, true);
    413     },
    414 
    415     _compareTreeElementsByMainTitle: function(a, b)
    416     {
    417         return a.mainTitle.localeCompare(b.mainTitle);
    418     },
    419 
    420     _insertFolderTreeElement: function(folderTreeElement)
    421     {
    422         console.assert(this._groupedIntoFolders);
    423         console.assert(!folderTreeElement.parent);
    424         this.insertChild(folderTreeElement, insertionIndexForObjectInListSortedByFunction(folderTreeElement, this.children, this._compareTreeElementsByMainTitle));
    425     },
    426 
    427     _compareResourceTreeElements: function(a, b)
    428     {
    429         if (a === b)
    430             return 0;
    431 
    432         var aIsResource = a instanceof WebInspector.ResourceTreeElement;
    433         var bIsResource = b instanceof WebInspector.ResourceTreeElement;
    434 
    435         if (aIsResource && bIsResource)
    436             return WebInspector.ResourceTreeElement.compareResourceTreeElements(a, b);
    437 
    438         if (!aIsResource && !bIsResource) {
    439             // When both components are not resources then just compare the titles.
    440             return a.mainTitle.localeCompare(b.mainTitle);
    441         }
    442 
    443         // Non-resources should appear before the resources.
    444         // FIXME: There should be a better way to group the elements by their type.
    445         return aIsResource ? 1 : -1;
    446     },
    447 
    448     _insertResourceTreeElement: function(parentTreeElement, childTreeElement)
    449     {
    450         console.assert(!childTreeElement.parent);
    451         parentTreeElement.insertChild(childTreeElement, insertionIndexForObjectInListSortedByFunction(childTreeElement, parentTreeElement.children, this._compareResourceTreeElements));
    452     },
    453 
    454     _removeTreeElement: function(childTreeElement, suppressOnDeselect, suppressSelectSibling)
    455     {
    456         var oldParent = childTreeElement.parent;
    457         if (!oldParent)
    458             return;
    459 
    460         oldParent.removeChild(childTreeElement, suppressOnDeselect, suppressSelectSibling);
    461 
    462         if (oldParent === this)
    463             return;
    464 
    465         console.assert(oldParent instanceof WebInspector.FolderTreeElement);
    466         if (!(oldParent instanceof WebInspector.FolderTreeElement))
    467             return;
    468 
    469         // Remove the old parent folder if it is now empty.
    470         if (!oldParent.children.length)
    471             oldParent.parent.removeChild(oldParent);
    472     },
    473 
    474     _folderNameForResourceType: function(type)
    475     {
    476         return WebInspector.Resource.Type.displayName(type, true);
    477     },
    478 
    479     _parentTreeElementForRepresentedObject: function(representedObject)
    480     {
    481         if (!this._groupedIntoFolders)
    482             return this;
    483 
    484         function createFolderTreeElement(type, displayName)
    485         {
    486             var folderTreeElement = new WebInspector.FolderTreeElement(displayName);
    487             folderTreeElement._expandedSetting = new WebInspector.Setting(type + "-folder-expanded-" + this._frame.url.hash, false);
    488             if (folderTreeElement._expandedSetting.value)
    489                 folderTreeElement.expand();
    490             folderTreeElement.onexpand = this._folderTreeElementExpandedStateChange.bind(this);
    491             folderTreeElement.oncollapse = this._folderTreeElementExpandedStateChange.bind(this);
    492             return folderTreeElement;
    493         }
    494 
    495         if (representedObject instanceof WebInspector.Frame) {
    496             if (!this._framesFolderTreeElement)
    497                 this._framesFolderTreeElement = createFolderTreeElement.call(this, "frames", WebInspector.UIString("Frames"));
    498             return this._framesFolderTreeElement;
    499         }
    500 
    501         if (representedObject instanceof WebInspector.ContentFlow) {
    502             if (!this._flowsFolderTreeElement)
    503                 this._flowsFolderTreeElement = createFolderTreeElement.call(this, "flows", WebInspector.UIString("Flows"));
    504             return this._flowsFolderTreeElement;
    505         }
    506 
    507         if (representedObject instanceof WebInspector.Resource) {
    508             var folderName = this._folderNameForResourceType(representedObject.type);
    509             if (!folderName)
    510                 return this;
    511 
    512             if (!this._resourceFoldersTypeMap)
    513                 this._resourceFoldersTypeMap = {};
    514             if (!this._resourceFoldersTypeMap[representedObject.type])
    515                 this._resourceFoldersTypeMap[representedObject.type] = createFolderTreeElement.call(this, representedObject.type, folderName);
    516             return this._resourceFoldersTypeMap[representedObject.type];
    517         }
    518 
    519         console.error("Unknown representedObject: ", representedObject);
    520         return this;
    521     },
    522 
    523     _folderTreeElementExpandedStateChange: function(folderTreeElement)
    524     {
    525         console.assert(folderTreeElement._expandedSetting);
    526         folderTreeElement._expandedSetting.value = folderTreeElement.expanded;
    527     },
    528 
    529     _shouldGroupIntoFolders: function()
    530     {
    531         // Already grouped into folders, keep it that way.
    532         if (this._groupedIntoFolders)
    533             return true;
    534 
    535         // Resources and Frames are grouped into folders if one of two thresholds are met:
    536         // 1) Once the number of medium categories passes NumberOfMediumCategoriesThreshold.
    537         // 2) When there is a category that passes LargeChildCountThreshold and there are
    538         //    any resources in another category.
    539 
    540         // Folders are avoided when there is only one category or most categories are small.
    541 
    542         var numberOfSmallCategories = 0;
    543         var numberOfMediumCategories = 0;
    544         var foundLargeCategory = false;
    545         var frame = this._frame;
    546 
    547         function pushResourceType(type) {
    548             // There are some other properties on WebInspector.Resource.Type that we need to skip, like private data and functions
    549             if (type.charAt(0) === "_")
    550                 return false;
    551 
    552             // Only care about the values that are strings, not functions, etc.
    553             var typeValue = WebInspector.Resource.Type[type];
    554             if (typeof typeValue !== "string")
    555                 return false;
    556 
    557             return pushCategory(frame.resourcesWithType(typeValue).length);
    558         }
    559 
    560         function pushCategory(resourceCount)
    561         {
    562             if (!resourceCount)
    563                 return false;
    564 
    565             // If this type has any resources and there is a known large category, make folders.
    566             if (foundLargeCategory)
    567                 return true;
    568 
    569             // If there are lots of this resource type, then count it as a large category.
    570             if (resourceCount >= WebInspector.FrameTreeElement.LargeChildCountThreshold) {
    571                 // If we already have other resources in other small or medium categories, make folders.
    572                 if (numberOfSmallCategories || numberOfMediumCategories)
    573                     return true;
    574 
    575                 foundLargeCategory = true;
    576                 return false;
    577             }
    578 
    579             // Check if this is a medium category.
    580             if (resourceCount >= WebInspector.FrameTreeElement.MediumChildCountThreshold) {
    581                 // If this is the medium category that puts us over the maximum allowed, make folders.
    582                 return ++numberOfMediumCategories >= WebInspector.FrameTreeElement.NumberOfMediumCategoriesThreshold;
    583             }
    584 
    585             // This is a small category.
    586             ++numberOfSmallCategories;
    587             return false;
    588         }
    589 
    590         // Iterate over all the available resource types.
    591         return pushCategory(frame.childFrames.length) || pushCategory(frame.domTree.flowsCount) || Object.keys(WebInspector.Resource.Type).some(pushResourceType);
    592326    },
    593327
    … …  
    634368    }
    635369};
    636 
    637 WebInspector.FrameTreeElement.prototype.__proto__ = WebInspector.ResourceTreeElement.prototype;

  • trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineDataGridNode.js

    r164543 r175784  
    6565        switch (columnIdentifier) {
    6666        case "eventType":
    67             return WebInspector.LayoutTimelineRecord.EventType.displayName(value);
     67            return WebInspector.LayoutTimelineRecord.displayNameForEventType(value);
    6868
    6969        case "width":

  • trunk/Source/WebInspectorUI/UserInterface/Views/LayoutTimelineView.js

    r172435 r175784  
    3939    columns.eventType.title = WebInspector.UIString("Type");
    4040    columns.eventType.width = "15%";
    41     columns.eventType.scopeBar = WebInspector.TimelineDataGrid.createColumnScopeBar("layout", WebInspector.LayoutTimelineRecord.EventType);
     41
     42    var typeToLabelMap = new Map;
     43    for (var key in WebInspector.LayoutTimelineRecord.EventType) {
     44        var value = WebInspector.LayoutTimelineRecord.EventType[key];
     45        typeToLabelMap.set(value, WebInspector.LayoutTimelineRecord.displayNameForEventType(value));
     46    }
     47
     48    columns.eventType.scopeBar = WebInspector.TimelineDataGrid.createColumnScopeBar("layout", typeToLabelMap);
    4249    columns.eventType.hidden = true;
    4350

  • trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTimelineView.js

    r172435 r175784  
    4242    columns.type.title = WebInspector.UIString("Type");
    4343    columns.type.width = "8%";
    44     columns.type.scopeBar = WebInspector.TimelineDataGrid.createColumnScopeBar("network", WebInspector.Resource.Type);
     44
     45    var typeToLabelMap = new Map;
     46    for (var key in WebInspector.Resource.Type) {
     47        var value = WebInspector.Resource.Type[key];
     48        typeToLabelMap.set(value, WebInspector.Resource.displayNameForType(value, true));
     49    }
     50
     51    columns.type.scopeBar = WebInspector.TimelineDataGrid.createColumnScopeBar("network", typeToLabelMap);
    4552
    4653    columns.method.title = WebInspector.UIString("Method");

  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourceDetailsSidebarPanel.js

    r175767 r175784  
    246246            return;
    247247
    248         this._typeResourceTypeRow.value = WebInspector.Resource.Type.displayName(this._resource.type);
     248        this._typeResourceTypeRow.value = WebInspector.Resource.displayNameForType(this._resource.type);
    249249    },
    250250

  • trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js

    r164543 r175784  
    128128
    129129        case "type":
    130             return WebInspector.Resource.Type.displayName(value);
     130            return WebInspector.Resource.displayNameForType(value);
    131131
    132132        case "statusCode":

  • trunk/Source/WebInspectorUI/UserInterface/Views/SourceCodeTreeElement.js

    r164543 r175784  
    2828    console.assert(sourceCode instanceof WebInspector.SourceCode);
    2929
    30     WebInspector.GeneralTreeElement.call(this, classNames, title, subtitle, representedObject || sourceCode, hasChildren);
     30    WebInspector.FolderizedTreeElement.call(this, classNames, title, subtitle, representedObject || sourceCode, hasChildren);
    3131
    3232    this.small = true;
    … …  
    3737WebInspector.SourceCodeTreeElement.prototype = {
    3838    constructor: WebInspector.SourceCodeTreeElement,
     39    __proto__: WebInspector.FolderizedTreeElement.prototype,
    3940
    4041    // Public
    … …  
    205206    }
    206207};
    207 
    208 WebInspector.SourceCodeTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js

    r172334 r175784  
    7878    prefix = prefix + "-timeline-data-grid-";
    7979
    80     var keys = Object.keys(dictionary).filter(function(key) {
    81         return typeof dictionary[key] === "string" || dictionary[key] instanceof String;
    82     });
    83 
    84     var scopeBarItems = keys.map(function(key) {
    85         var value = dictionary[key];
    86         var id = prefix + value;
    87         var label = dictionary.displayName(value, true);
     80    var scopeBarItems = Object.keys(dictionary).map(function(key) {
     81        var id = prefix + key;
     82        var label = dictionary[key];
    8883        var item = new WebInspector.ScopeBarItem(id, label);
    89         item.value = value;
     84        item.value = key;
    9085        return item;
    9186    });

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js

    r171195 r175784  
    4747    switch (timelineRecord.type) {
    4848    case WebInspector.TimelineRecord.Type.Layout:
    49         title = WebInspector.LayoutTimelineRecord.EventType.displayName(timelineRecord.eventType);
     49        title = WebInspector.LayoutTimelineRecord.displayNameForEventType(timelineRecord.eventType);
    5050
    5151        switch (timelineRecord.eventType) {

  • trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj

    r175767 r175784  
    441441    <None Include="..\UserInterface\FolderIcon.css" />
    442442    <None Include="..\UserInterface\FolderTreeElement.js" />
     443    <None Include="..\UserInterface\FolderizedTreeElement.js" />
    443444    <None Include="..\UserInterface\FontResourceContentView.css" />
    444445    <None Include="..\UserInterface\FontResourceContentView.js" />

  • trunk/Source/WebInspectorUI/WebInspectorUI.vcxproj/WebInspectorUI.vcxproj.filters

    r175767 r175784  
    511511      <Filter>UserInterface</Filter>
    512512    </None>
     513    <None Include="..\UserInterface\FolderizedTreeElement.js">
     514      <Filter>UserInterface</Filter>
     515    </None>
    513516    <None Include="..\UserInterface\FontResourceContentView.css">
    514517      <Filter>UserInterface</Filter>
Note: See TracChangeset for help on using the changeset viewer.