| 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 |