OLD | NEW |
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 Renders an array of slices into the provided div, | 7 * @fileoverview Renders an array of slices into the provided div, |
8 * using a child canvas element. Uses a FastRectRenderer to draw only | 8 * using a child canvas element. Uses a FastRectRenderer to draw only |
9 * the visible slices. | 9 * the visible slices. |
10 */ | 10 */ |
(...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
125 this.textContent = ''; | 125 this.textContent = ''; |
126 this.tracks_ = []; | 126 this.tracks_ = []; |
127 if (this.thread_) { | 127 if (this.thread_) { |
128 for (var srI = 0; srI < this.thread_.nonNestedSubRows.length; ++srI) { | 128 for (var srI = 0; srI < this.thread_.nonNestedSubRows.length; ++srI) { |
129 addTrack(this, this.thread_.nonNestedSubRows[srI]); | 129 addTrack(this, this.thread_.nonNestedSubRows[srI]); |
130 } | 130 } |
131 for (var srI = 0; srI < this.thread_.subRows.length; ++srI) { | 131 for (var srI = 0; srI < this.thread_.subRows.length; ++srI) { |
132 addTrack(this, this.thread_.subRows[srI]); | 132 addTrack(this, this.thread_.subRows[srI]); |
133 } | 133 } |
134 if (this.tracks_.length > 0) { | 134 if (this.tracks_.length > 0) { |
| 135 var tname = this.thread_.name || this.thread_.tid; |
135 this.tracks_[0].heading = this.thread_.parent.pid + ': ' + | 136 this.tracks_[0].heading = this.thread_.parent.pid + ': ' + |
136 this.thread_.tid + ': '; | 137 tname + ':'; |
| 138 this.tracks_[0].tooltip = 'pid: ' + this.thread_.parent.pid + |
| 139 ', tid: ' + this.thread_.tid + |
| 140 (this.thread_.name ? ', name: ' + this.thread_.name : ''); |
137 } | 141 } |
138 } | 142 } |
139 }, | 143 }, |
140 | 144 |
141 /** | 145 /** |
142 * Picks a slice, if any, at a given location. | 146 * Picks a slice, if any, at a given location. |
143 * @param {number} wX X location to search at, in worldspace. | 147 * @param {number} wX X location to search at, in worldspace. |
144 * @param {number} wY Y location to search at, in offset space. | 148 * @param {number} wY Y location to search at, in offset space. |
145 * offset space. | 149 * offset space. |
146 * @param {function():*} onHitCallback Callback to call with the slice, | 150 * @param {function():*} onHitCallback Callback to call with the slice, |
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
187 */ | 191 */ |
188 TimelineSliceTrack = cr.ui.define('div'); | 192 TimelineSliceTrack = cr.ui.define('div'); |
189 | 193 |
190 TimelineSliceTrack.prototype = { | 194 TimelineSliceTrack.prototype = { |
191 __proto__: HTMLDivElement.prototype, | 195 __proto__: HTMLDivElement.prototype, |
192 | 196 |
193 decorate: function() { | 197 decorate: function() { |
194 this.className = 'timeline-slice-track'; | 198 this.className = 'timeline-slice-track'; |
195 this.slices_ = null; | 199 this.slices_ = null; |
196 | 200 |
197 this.titleDiv_ = document.createElement('div'); | 201 this.headingDiv_ = document.createElement('div'); |
198 this.titleDiv_.className = 'timeline-slice-track-title'; | 202 this.headingDiv_.className = 'timeline-slice-track-title'; |
199 this.appendChild(this.titleDiv_); | 203 this.appendChild(this.headingDiv_); |
200 | 204 |
201 this.canvasContainer_ = document.createElement('div'); | 205 this.canvasContainer_ = document.createElement('div'); |
202 this.canvasContainer_.className = 'timeline-slice-track-canvas-container'; | 206 this.canvasContainer_.className = 'timeline-slice-track-canvas-container'; |
203 this.appendChild(this.canvasContainer_); | 207 this.appendChild(this.canvasContainer_); |
204 this.canvas_ = document.createElement('canvas'); | 208 this.canvas_ = document.createElement('canvas'); |
205 this.canvas_.className = 'timeline-slice-track-canvas'; | 209 this.canvas_.className = 'timeline-slice-track-canvas'; |
206 this.canvasContainer_.appendChild(this.canvas_); | 210 this.canvasContainer_.appendChild(this.canvas_); |
207 | 211 |
208 this.ctx_ = this.canvas_.getContext('2d'); | 212 this.ctx_ = this.canvas_.getContext('2d'); |
209 }, | 213 }, |
210 | 214 |
211 set heading(text) { | 215 set heading(text) { |
212 this.titleDiv_.textContent = text; | 216 this.headingDiv_.textContent = text; |
| 217 }, |
| 218 |
| 219 set tooltip(text) { |
| 220 this.headingDiv_.title = text; |
213 }, | 221 }, |
214 | 222 |
215 set slices(slices) { | 223 set slices(slices) { |
216 this.slices_ = slices; | 224 this.slices_ = slices; |
217 this.invalidate(); | 225 this.invalidate(); |
218 }, | 226 }, |
219 | 227 |
220 set viewport(v) { | 228 set viewport(v) { |
221 this.viewport_ = v; | 229 this.viewport_ = v; |
222 this.invalidate(); | 230 this.invalidate(); |
(...skipping 95 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
318 ctx.textBaseline = 'top'; | 326 ctx.textBaseline = 'top'; |
319 ctx.font = '10px sans-serif'; | 327 ctx.font = '10px sans-serif'; |
320 ctx.strokeStyle = 'rgb(0,0,0)'; | 328 ctx.strokeStyle = 'rgb(0,0,0)'; |
321 ctx.fillStyle = 'rgb(0,0,0)'; | 329 ctx.fillStyle = 'rgb(0,0,0)'; |
322 var quickDiscardThresshold = pixWidth * 20; // dont render until 20px wide | 330 var quickDiscardThresshold = pixWidth * 20; // dont render until 20px wide |
323 for (var i = 0; i < slices.length; ++i) { | 331 for (var i = 0; i < slices.length; ++i) { |
324 var slice = slices[i]; | 332 var slice = slices[i]; |
325 if (slice.duration > quickDiscardThresshold) { | 333 if (slice.duration > quickDiscardThresshold) { |
326 var title = slice.title; | 334 var title = slice.title; |
327 if (slice.didNotFinish) { | 335 if (slice.didNotFinish) { |
328 title += " (Did Not Finish)"; | 336 title += ' (Did Not Finish)'; |
329 } | 337 } |
330 function labelWidth() { | 338 function labelWidth() { |
331 return quickMeasureText(ctx, title) + 2; | 339 return quickMeasureText(ctx, title) + 2; |
332 } | 340 } |
333 function labelWidthWorld() { | 341 function labelWidthWorld() { |
334 return pixWidth * labelWidth(); | 342 return pixWidth * labelWidth(); |
335 } | 343 } |
336 var elided = false; | 344 var elided = false; |
337 while (labelWidthWorld() > slice.duration) { | 345 while (labelWidthWorld() > slice.duration) { |
338 title = title.substring(0, title.length * 0.75); | 346 title = title.substring(0, title.length * 0.75); |
(...skipping 110 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
449 return index != undefined ? this.slices_[index] : undefined; | 457 return index != undefined ? this.slices_[index] : undefined; |
450 }, | 458 }, |
451 | 459 |
452 }; | 460 }; |
453 | 461 |
454 return { | 462 return { |
455 TimelineSliceTrack: TimelineSliceTrack, | 463 TimelineSliceTrack: TimelineSliceTrack, |
456 TimelineThreadTrack: TimelineThreadTrack | 464 TimelineThreadTrack: TimelineThreadTrack |
457 }; | 465 }; |
458 }); | 466 }); |
OLD | NEW |