1<!DOCTYPE html> 2<!-- 3Copyright (c) 2015 The Chromium Authors. All rights reserved. 4Use of this source code is governed by a BSD-style license that can be 5found in the LICENSE file. 6--> 7 8<link rel="import" href="/tracing/base/color_scheme.html"> 9<link rel="import" href="/tracing/ui/base/event_presenter.html"> 10<link rel="import" href="/tracing/ui/base/ui.html"> 11<link rel="import" href="/tracing/ui/tracks/letter_dot_track.html"> 12 13<script> 14'use strict'; 15 16tr.exportTo('tr.ui.tracks', function() { 17 var startCompare = function(x, y) { return x.start - y.start; } 18 19 /** 20 * Track enabling quick selection of frame slices/events. 21 * @constructor 22 */ 23 var FrameTrack = tr.ui.b.define( 24 'frame-track', tr.ui.tracks.LetterDotTrack); 25 26 FrameTrack.prototype = { 27 __proto__: tr.ui.tracks.LetterDotTrack.prototype, 28 29 decorate: function(viewport) { 30 tr.ui.tracks.LetterDotTrack.prototype.decorate.call(this, viewport); 31 this.heading = 'Frames'; 32 33 this.frames_ = undefined; 34 this.items = undefined; 35 }, 36 37 get frames() { 38 return this.frames_; 39 }, 40 41 set frames(frames) { 42 this.frames_ = frames; 43 if (frames === undefined) 44 return; 45 46 this.frames_ = this.frames_.slice(); 47 this.frames_.sort(startCompare); 48 49 // letter dots 50 this.items = this.frames_.map(function(frame) { 51 return new FrameDot(frame); 52 }); 53 } 54 }; 55 56 /** 57 * @constructor 58 * @extends {LetterDot} 59 */ 60 function FrameDot(frame) { 61 tr.ui.tracks.LetterDot.call(this, frame, 'F', frame.colorId, frame.start); 62 } 63 64 FrameDot.prototype = { 65 __proto__: tr.ui.tracks.LetterDot.prototype 66 }; 67 68 return { 69 FrameTrack: FrameTrack 70 }; 71}); 72</script> 73