Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(145)

Side by Side Diff: chrome/browser/resources/tracing/timeline_view.js

Issue 8359025: Tons of timeline tweaks (Closed)
Patch Set: Disable eliding due to perf issues Created 9 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 5
6 /** 6 /**
7 * @fileoverview TimelineView visualizes TRACE_EVENT events using the 7 * @fileoverview TimelineView visualizes TRACE_EVENT events using the
8 * tracing.Timeline component. 8 * tracing.Timeline component.
9 */ 9 */
10 cr.define('tracing', function() { 10 cr.define('tracing', function() {
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after
57 this.summaryEl_.className = 'summary'; 57 this.summaryEl_.className = 'summary';
58 58
59 summaryContainer_.appendChild(this.summaryEl_); 59 summaryContainer_.appendChild(this.summaryEl_);
60 this.appendChild(this.timelineContainer_); 60 this.appendChild(this.timelineContainer_);
61 this.appendChild(summaryContainer_); 61 this.appendChild(summaryContainer_);
62 62
63 this.onSelectionChangedBoundToThis_ = this.onSelectionChanged_.bind(this); 63 this.onSelectionChangedBoundToThis_ = this.onSelectionChanged_.bind(this);
64 }, 64 },
65 65
66 set traceEvents(traceEvents) { 66 set traceEvents(traceEvents) {
67 console.log('TimelineView.refresh');
68 this.timelineModel_ = new tracing.TimelineModel(traceEvents); 67 this.timelineModel_ = new tracing.TimelineModel(traceEvents);
69 68
70 // remove old timeline 69 // remove old timeline
71 this.timelineContainer_.textContent = ''; 70 this.timelineContainer_.textContent = '';
72 71
73 // create new timeline if needed 72 // create new timeline if needed
74 if (traceEvents.length) { 73 if (traceEvents.length) {
74 if (this.timeline_)
75 this.timeline_.detach();
75 this.timeline_ = new tracing.Timeline(); 76 this.timeline_ = new tracing.Timeline();
76 this.timeline_.model = this.timelineModel_; 77 this.timeline_.model = this.timelineModel_;
77 this.timelineContainer_.appendChild(this.timeline_); 78 this.timelineContainer_.appendChild(this.timeline_);
78 this.timeline_.onResize();
79 this.timeline_.addEventListener('selectionChange', 79 this.timeline_.addEventListener('selectionChange',
80 this.onSelectionChangedBoundToThis_); 80 this.onSelectionChangedBoundToThis_);
81 this.onSelectionChanged_(); 81 this.onSelectionChanged_();
82 } else { 82 } else {
83 this.timeline_ = null; 83 this.timeline_ = null;
84 } 84 }
85 }, 85 },
86 86
87 onSelectionChanged_: function(e) { 87 onSelectionChanged_: function(e) {
88 console.log('selection changed');
89 var timeline = this.timeline_; 88 var timeline = this.timeline_;
90 var selection = timeline.selection; 89 var selection = timeline.selection;
91 if (!selection.length) { 90 if (!selection.length) {
92 var oldScrollTop = this.timelineContainer_.scrollTop; 91 var oldScrollTop = this.timelineContainer_.scrollTop;
93 this.summaryEl_.textContent = timeline.keyHelp; 92 this.summaryEl_.textContent = timeline.keyHelp;
94 this.timelineContainer_.scrollTop = oldScrollTop; 93 this.timelineContainer_.scrollTop = oldScrollTop;
95 return; 94 return;
96 } 95 }
97 96
98 var text = ''; 97 var text = '';
99 if (selection.length == 1) { 98 if (selection.length == 1) {
100 var c0Width = 14; 99 var c0Width = 14;
101 var slice = selection[0].slice; 100 var slice = selection[0].slice;
102 text = 'Selected item:\n'; 101 text = 'Selected item:\n';
103 text += leftAlign('Title', c0Width) + ': ' + slice.title + '\n'; 102 text += leftAlign('Title', c0Width) + ': ' + slice.title + '\n';
104 text += leftAlign('Start', c0Width) + ': ' + 103 text += leftAlign('Start', c0Width) + ': ' +
105 tsRound(slice.start) + ' ms\n'; 104 tsRound(slice.start) + ' ms\n';
106 text += leftAlign('Duration', c0Width) + ': ' + 105 text += leftAlign('Duration', c0Width) + ': ' +
107 tsRound(slice.duration) + ' ms\n'; 106 tsRound(slice.duration) + ' ms\n';
108 text += leftAlign('Duration (U)', c0Width) + ': ' + 107 if (slice.durationInUserTime)
109 tsRound(slice.durationInUserTime) + ' ms\n'; 108 text += leftAlign('Duration (U)', c0Width) + ': ' +
109 tsRound(slice.durationInUserTime) + ' ms\n';
110 110
111 var n = 0; 111 var n = 0;
112 for (var argName in slice.args) { 112 for (var argName in slice.args) {
113 n += 1; 113 n += 1;
114 } 114 }
115 if (n > 0) { 115 if (n > 0) {
116 text += leftAlign('Args', c0Width) + ':\n'; 116 text += leftAlign('Args', c0Width) + ':\n';
117 for (var argName in slice.args) { 117 for (var argName in slice.args) {
118 var argVal = slice.args[argName]; 118 var argVal = slice.args[argName];
119 text += leftAlign(' ' + argName, c0Width) + ': ' + argVal + '\n'; 119 text += leftAlign(' ' + argName, c0Width) + ': ' + argVal + '\n';
(...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after
175 var oldScrollTop = this.timelineContainer_.scrollTop; 175 var oldScrollTop = this.timelineContainer_.scrollTop;
176 this.summaryEl_.textContent = text; 176 this.summaryEl_.textContent = text;
177 this.timelineContainer_.scrollTop = oldScrollTop; 177 this.timelineContainer_.scrollTop = oldScrollTop;
178 } 178 }
179 }; 179 };
180 180
181 return { 181 return {
182 TimelineView: TimelineView 182 TimelineView: TimelineView
183 }; 183 };
184 }); 184 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698