src/third_party/trace-viewer/trace_viewer/tracing/tracks/rect_track.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2013 The Chromium Authors. All rights reserved.
   4 Use of this source code is governed by a BSD-style license that can be
   5 found in the LICENSE file.
   6 -->
   7
   8 <link rel="stylesheet" href="/tracing/tracks/rect_track.css">
   9
  10 <link rel="import" href="/tracing/tracks/heading_track.html">
  11 <link rel="import" href="/tracing/fast_rect_renderer.html">
  12 <link rel="import" href="/tracing/draw_helpers.html">
  13 <link rel="import" href="/base/sorted_array_utils.html">
  14 <link rel="import" href="/base/ui.html">
  15
  16 <script>
  17 'use strict';
  18
  19 tv.exportTo('tracing.tracks', function() {
  20
  21   /**
  22    * A track that displays an array of Rect objects.
  23    * @constructor
  24    * @extends {HeadingTrack}
  25    */
  26   var RectTrack = tv.ui.define(
  27       'rect-track', tracing.tracks.HeadingTrack);
  28
  29   RectTrack.prototype = {
  30
  31     __proto__: tracing.tracks.HeadingTrack.prototype,
  32
  33     decorate: function(viewport) {
  34       tracing.tracks.HeadingTrack.prototype.decorate.call(this, viewport);
  35       this.classList.add('rect-track');
  36       this.asyncStyle_ = false;
  37       this.rects_ = null;
  38     },
  39
  40     get asyncStyle() {
  41       return this.asyncStyle_;
  42     },
  43
  44     set asyncStyle(v) {
  45       this.asyncStyle_ = !!v;
  46     },
  47
  48     get rects() {
  49       return this.rects_;
  50     },
  51
  52     set rects(rects) {
  53       this.rects_ = rects || [];
  54       this.invalidateDrawingContainer();
  55     },
  56
  57     get height() {
  58       return window.getComputedStyle(this).height;
  59     },
  60
  61     set height(height) {
  62       this.style.height = height;
  63       this.invalidateDrawingContainer();
  64     },
  65
  66     get hasVisibleContent() {
  67       return this.rects_.length > 0;
  68     },
  69
  70     addRectToSelection: function(rect, selection) {
  71       throw new Error('Not implemented.');
  72     },
  73
  74     draw: function(type, viewLWorld, viewRWorld) {
  75       switch (type) {
  76         case tracing.tracks.DrawType.SLICE:
  77           this.drawRects_(viewLWorld, viewRWorld);
  78           break;
  79       }
  80     },
  81
  82     drawRects_: function(viewLWorld, viewRWorld) {
  83       var ctx = this.context();
  84
  85       ctx.save();
  86       var bounds = this.getBoundingClientRect();
  87       tracing.drawSlices(
  88           ctx,
  89           this.viewport.currentDisplayTransform,
  90           viewLWorld,
  91           viewRWorld,
  92           bounds.height,
  93           this.rects_,
  94           this.asyncStyle_);
  95       ctx.restore();
  96
  97       if (bounds.height <= 6)
  98         return;
  99
 100       var fontSize, yOffset;
 101       if (bounds.height < 15) {
 102         fontSize = 6;
 103         yOffset = 1.0;
 104       } else {
 105         fontSize = 10;
 106         yOffset = 2.5;
 107       }
 108       tracing.drawLabels(
 109           ctx,
 110           this.viewport.currentDisplayTransform,
 111           viewLWorld,
 112           viewRWorld,
 113           this.rects_,
 114           this.asyncStyle_,
 115           fontSize,
 116           yOffset);
 117     },
 118
 119     addEventsToTrackMap: function(eventToTrackMap) {
 120       if (this.rects_ === undefined || this.rects_ === null)
 121         return;
 122
 123       this.rects_.forEach(function(rect) {
 124         eventToTrackMap.addEvent(rect, this);
 125       }, this);
 126     },
 127
 128     addIntersectingItemsInRangeToSelectionInWorldSpace: function(
 129         loWX, hiWX, viewPixWidthWorld, selection) {
 130       function onRect(rect) {
 131         this.addRectToSelection(rect, selection);
 132       }
 133       onRect = onRect.bind(this);
 134       tv.iterateOverIntersectingIntervals(this.rects_,
 135           function(x) { return x.start; },
 136           function(x) { return x.duration; },
 137           loWX, hiWX,
 138           onRect);
 139     },
 140
 141     /**
 142      * Find the index for the given rect.
 143      * @return {index} Index of the given rect, or undefined.
 144      * @private
 145      */
 146     indexOfRect_: function(rect) {
 147       var index = tv.findLowIndexInSortedArray(this.rects_,
 148           function(x) { return x.start; },
 149           rect.start);
 150       while (index < this.rects_.length &&
 151           rect.start == this.rects_[index].start &&
 152           rect.colorId != this.rects_[index].colorId) {
 153         index++;
 154       }
 155       return index < this.rects_.length ? index : undefined;
 156     },
 157
 158     /**
 159      * Add the item to the left or right of the provided event, if any, to the
 160      * selection.
 161      * @param {rect} The current rect.
 162      * @param {Number} offset Number of rects away from the event to look.
 163      * @param {Selection} selection The selection to add an event to,
 164      * if found.
 165      * @return {boolean} Whether an event was found.
 166      * @private
 167      */
 168     addItemNearToProvidedEventToSelection: function(event, offset, selection) {
 169       var index = this.indexOfRect_(event);
 170       if (index === undefined)
 171         return false;
 172
 173       var newIndex = index + offset;
 174       if (newIndex < 0 || newIndex >= this.rects_.length)
 175         return false;
 176
 177       this.addRectToSelection(this.rects_[newIndex], selection);
 178       return true;
 179     },
 180
 181     addAllObjectsMatchingFilterToSelection: function(filter, selection) {
 182       for (var i = 0; i < this.rects_.length; ++i) {
 183         if (filter.matchSlice(this.rects_[i]))
 184           this.addRectToSelection(this.rects_[i], selection);
 185       }
 186     },
 187
 188     addClosestEventToSelection: function(worldX, worldMaxDist, loY, hiY,
 189                                          selection) {
 190       var rect = tv.findClosestIntervalInSortedIntervals(
 191           this.rects_,
 192           function(x) { return x.start; },
 193           function(x) { return x.end; },
 194           worldX,
 195           worldMaxDist);
 196
 197       if (rect)
 198         this.addRectToSelection(rect, selection);
 199     }
 200   };
 201
 202   return {
 203     RectTrack: RectTrack
 204   };
 205 });
 206 </script>