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 79 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
302 ctx.textBaseline = 'top'; | 310 ctx.textBaseline = 'top'; |
303 ctx.font = '10px sans-serif'; | 311 ctx.font = '10px sans-serif'; |
304 ctx.strokeStyle = 'rgb(0,0,0)'; | 312 ctx.strokeStyle = 'rgb(0,0,0)'; |
305 ctx.fillStyle = 'rgb(0,0,0)'; | 313 ctx.fillStyle = 'rgb(0,0,0)'; |
306 var quickDiscardThresshold = pixWidth * 20; // dont render until 20px wide | 314 var quickDiscardThresshold = pixWidth * 20; // dont render until 20px wide |
307 for (var i = 0; i < slices.length; ++i) { | 315 for (var i = 0; i < slices.length; ++i) { |
308 var slice = slices[i]; | 316 var slice = slices[i]; |
309 if (slice.duration > quickDiscardThresshold) { | 317 if (slice.duration > quickDiscardThresshold) { |
310 var title = slice.title; | 318 var title = slice.title; |
311 if (slice.didNotFinish) { | 319 if (slice.didNotFinish) { |
312 title += " (Did Not Finish)"; | 320 title += ' (Did Not Finish)'; |
313 } | 321 } |
314 var labelWidth = quickMeasureText(ctx, title) + 2; | 322 var labelWidth = quickMeasureText(ctx, title) + 2; |
315 var labelWidthWorld = pixWidth * labelWidth; | 323 var labelWidthWorld = pixWidth * labelWidth; |
316 if (labelWidthWorld < slice.duration) { | 324 if (labelWidthWorld < slice.duration) { |
317 var cX = vp.xWorldToView(slice.start + 0.5 * slice.duration); | 325 var cX = vp.xWorldToView(slice.start + 0.5 * slice.duration); |
318 ctx.fillText(title, cX, 2.5); | 326 ctx.fillText(title, cX, 2.5); |
319 } | 327 } |
320 } | 328 } |
321 } | 329 } |
322 }, | 330 }, |
(...skipping 53 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
376 onPickHit); | 384 onPickHit); |
377 } | 385 } |
378 | 386 |
379 }; | 387 }; |
380 | 388 |
381 return { | 389 return { |
382 TimelineSliceTrack: TimelineSliceTrack, | 390 TimelineSliceTrack: TimelineSliceTrack, |
383 TimelineThreadTrack: TimelineThreadTrack | 391 TimelineThreadTrack: TimelineThreadTrack |
384 }; | 392 }; |
385 }); | 393 }); |
OLD | NEW |