Changeset 56613 in webkit


Ignore:
Timestamp:
Mar 26, 2010 1:05:08 AM (14 years ago)
Author:
pfeldman@chromium.org
Message:

2010-03-25 Ilya Tikhonovsky <​loislo@chromium.org>

Reviewed by Pavel Feldman.

Web Inspector: Shot record filter is implemented in Timeline Panel.
​https://bugs.webkit.org/show_bug.cgi?id=36606

  • English.lproj/localizedStrings.js:
  • inspector/front-end/TimelinePanel.js: (WebInspector.TimelinePanel): (WebInspector.TimelinePanel.prototype.get statusBarItems): (WebInspector.TimelinePanel.prototype._createStatusbarButtons): (WebInspector.TimelinePanel.prototype._toggleFilterButtonClicked): (WebInspector.TimelinePanel.prototype._innerAddRecordToTimeline): (WebInspector.TimelinePanel.prototype._addToRecordsWindow): (WebInspector.TimelineRecordGraphRow.prototype.update): (WebInspector.TimelinePanel.FormattedRecord.prototype.get _isLongEvent):
  • inspector/front-end/inspector.css:
Location:
trunk/WebCore
Files:
4 edited

Legend:

Unmodified
Added
Removed

  • trunk/WebCore/ChangeLog

    r56610 r56613  
     12010-03-25  Ilya Tikhonovsky  <loislo@chromium.org>
     2
     3        Reviewed by Pavel Feldman.
     4
     5        Web Inspector: Shot record filter is implemented in Timeline Panel.
     6        https://bugs.webkit.org/show_bug.cgi?id=36606
     7
     8        * English.lproj/localizedStrings.js:
     9        * inspector/front-end/TimelinePanel.js:
     10        (WebInspector.TimelinePanel):
     11        (WebInspector.TimelinePanel.prototype.get statusBarItems):
     12        (WebInspector.TimelinePanel.prototype._createStatusbarButtons):
     13        (WebInspector.TimelinePanel.prototype._toggleFilterButtonClicked):
     14        (WebInspector.TimelinePanel.prototype._innerAddRecordToTimeline):
     15        (WebInspector.TimelinePanel.prototype._addToRecordsWindow):
     16        (WebInspector.TimelineRecordGraphRow.prototype.update):
     17        (WebInspector.TimelinePanel.FormattedRecord.prototype.get _isLongEvent):
     18        * inspector/front-end/inspector.css:
     19
    1202010-03-25  Pavel Feldman  <pfeldman@chromium.org>
    221

  • trunk/WebCore/inspector/front-end/TimelinePanel.js

    r56467 r56613  
    8484
    8585    this._calculator = new WebInspector.TimelineCalculator();
     86    this._calculator._showShortEvents = false;
    8687    this._boundariesAreValid = true;
    8788    this._scrollTop = 0;
    8889
    8990    this._popoverHelper = new WebInspector.PopoverHelper(this._containerElement, this._getPopoverAnchor.bind(this), this._showPopover.bind(this), true);
     91
     92    // Disable short events filter by default.
     93    this.toggleFilterButton.toggled = true;
     94    this._calculator._showShortEvents = this.toggleFilterButton.toggled;
    9095}
    9196
    … …  
    100105    get statusBarItems()
    101106    {
    102         return [this.toggleTimelineButton.element, this.clearButton.element];
     107        return [this.toggleFilterButton.element, this.toggleTimelineButton.element, this.clearButton.element];
    103108    },
    104109
    … …  
    149154    _createStatusbarButtons: function()
    150155    {
    151         this.toggleTimelineButton = new WebInspector.StatusBarButton("", "record-profile-status-bar-item");
     156        this.toggleTimelineButton = new WebInspector.StatusBarButton(WebInspector.UIString("Record"), "record-profile-status-bar-item");
    152157        this.toggleTimelineButton.addEventListener("click", this._toggleTimelineButtonClicked.bind(this), false);
    153158
    154         this.clearButton = new WebInspector.StatusBarButton("", "timeline-clear-status-bar-item");
     159        this.clearButton = new WebInspector.StatusBarButton(WebInspector.UIString("Clear"), "timeline-clear-status-bar-item");
    155160        this.clearButton.addEventListener("click", this._clearPanel.bind(this), false);
     161
     162        this.toggleFilterButton = new WebInspector.StatusBarButton(WebInspector.UIString("Show short records"), "timeline-filter-status-bar-item");
     163        this.toggleFilterButton.addEventListener("click", this._toggleFilterButtonClicked.bind(this), false);
    156164    },
    157165
    … …  
    164172            InspectorBackend.startTimelineProfiler();
    165173        }
     174    },
     175
     176    _toggleFilterButtonClicked: function()
     177    {
     178        this.toggleFilterButton.toggled = !this.toggleFilterButton.toggled;
     179        this._calculator._showShortEvents = this.toggleFilterButton.toggled;
     180        this._scheduleRefresh(true);
    166181    },
    167182
    … …  
    219234            formattedRecord.collapsed = true;
    220235
    221         // Glue subsequent records with same category and title together if they are closer than 100ms to each other.
    222         var lastRecord = parentRecord._lastRecord;
    223         if (lastRecord && (!record.children || !record.children.length) &&
    224                 lastRecord.category == formattedRecord.category &&
    225                 lastRecord.title == formattedRecord.title &&
    226                 lastRecord.details == formattedRecord.details &&
    227                 lastRecord.callerScriptName == formattedRecord.callerScriptName &&
    228                 lastRecord.callerScriptLine == formattedRecord.callerScriptLine &&
    229                 formattedRecord.startTime - lastRecord.endTime < 0.1) {
    230             lastRecord.endTime = formattedRecord.endTime;
    231             lastRecord.count++;
    232         } else {
    233             for (var i = 0; record.children && i < record.children.length; ++i)
    234                 this._innerAddRecordToTimeline(record.children[i], formattedRecord);
    235             parentRecord._lastRecord = record.children && record.children.length ? null : formattedRecord;
    236         }
     236        var hasLongChildrenEvents = false;
     237        for (var i = 0; record.children && i < record.children.length; ++i)
     238            hasLongChildrenEvents |= this._innerAddRecordToTimeline(record.children[i], formattedRecord);
     239        formattedRecord._hasLongChildrenEvents = hasLongChildrenEvents;
    237240
    238241        if (connectedToOldRecord) {
    … …  
    242245                record = record.parent;
    243246            }
    244         }
     247            // We have attached a fresh event record received from Timeline Agent to some old event record.
     248            // If that old parent record haven't had long children events and new child record has it
     249            // then we want to propagate _hasLongChildrenEvents flag to parent, grand-parent etc.
     250            if (record._isLongEvent()) {
     251                record = formattedRecord;
     252                while (record.parent && !record.parent._isLongEvent()) {
     253                    record = record.parent;
     254                    record._hasLongChildrenEvents = true;
     255                }
     256            }
     257        }
     258        return hasLongChildrenEvents || formattedRecord._isLongEvent();
    245259    },
    246260
    … …  
    269283        var rootRecord = {};
    270284        rootRecord.children = [];
    271         rootRecord._lastRecord = null;
    272285        return rootRecord;
    273286    },
    … …  
    360373    _addToRecordsWindow: function(record, recordsWindow)
    361374    {
     375        if (!this._calculator._showShortEvents && !record._isLongEvent())
     376            return;
     377
    362378        recordsWindow.push(record);
     379        var index = recordsWindow.length;
    363380        if (!record.collapsed) {
    364             var index = recordsWindow.length;
    365381            for (var i = 0; i < record.children.length; ++i)
    366382                this._addToRecordsWindow(record.children[i], recordsWindow);
    367             record.visibleChildrenCount = recordsWindow.length - index;
    368         }
     383        }
     384        record.visibleChildrenCount = recordsWindow.length - index;
    369385    },
    370386
    … …  
    652668        this._barElement.style.width =  barPosition.width + "px";
    653669
    654         if (record.children.length) {
     670        if (record.visibleChildrenCount || record._hasLongChildrenEvents || (calculator._showShortEvents && record.children.length)) {
    655671            this._expandElement.style.top = index * this._rowHeight + "px";
    656672            this._expandElement.style.left = barPosition.left + "px";
    … …  
    738754
    739755WebInspector.TimelinePanel.FormattedRecord.prototype = {
     756    _isLongEvent: function()
     757    {
     758        const shortEventLength = 0.015;
     759        return (this._lastChildEndTime - this.startTime) > shortEventLength;
     760    },
     761
    740762    _createCell: function(content, styleName)
    741763    {

  • trunk/WebCore/inspector/front-end/inspector.css

    r56608 r56613  
    36273627}
    36283628
     3629.timeline-details {
     3630    -webkit-user-select: text;
     3631}
     3632
     3633.timeline-details-row-title {
     3634    font-weight: bold;
     3635    text-align: right;
     3636    white-space: nowrap;
     3637}
     3638
     3639.timeline-details-row-data {
     3640    white-space: nowrap;
     3641}
     3642
     3643.timeline-details-title {
     3644    font-weight: bold;
     3645    white-space: nowrap;
     3646}
     3647
     3648.timeline-filter-status-bar-item .glyph {
     3649    -webkit-mask-image: url(Images/largerResourcesButtonGlyph.png);
     3650}
     3651
     3652.timeline-filter-status-bar-item.toggled-on .glyph {
     3653    background-color: rgb(66, 129, 235) !important;
     3654}
     3655
    36293656/* Profiler Style */
    36303657
    … …  
    38893916}
    38903917
    3891 .timeline-details {
    3892     -webkit-user-select: text;
    3893 }
    3894 
    3895 .timeline-details-row-title {
    3896     font-weight: bold;
    3897     text-align: right;
    3898     white-space: nowrap;
    3899 }
    3900 
    3901 .timeline-details-row-data {
    3902     white-space: nowrap;
    3903 }
    3904 
    3905 .timeline-details-title {
    3906     font-weight: bold;
    3907     white-space: nowrap;
    3908 }
    3909 
    39103918.workers-list {
    39113919    list-style: none;
Note: See TracChangeset for help on using the changeset viewer.