src/third_party/trace-viewer/src/tracing/find_control.js

   1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 'use strict';
   6
   7 /**
   8  * @fileoverview FindControl and FindController.
   9  */
  10 tvcm.requireTemplate('tracing.find_control');
  11
  12 tvcm.require('tracing.timeline_track_view');
  13 tvcm.require('tracing.filter');
  14 tvcm.exportTo('tracing', function() {
  15
  16   /**
  17    * FindControl
  18    * @constructor
  19    */
  20   var FindControl = tvcm.ui.define('find-control');
  21
  22   FindControl.prototype = {
  23     __proto__: HTMLUnknownElement.prototype,
  24
  25     decorate: function() {
  26       var shadow = this.webkitCreateShadowRoot();
  27       shadow.applyAuthorStyles = true;
  28       shadow.resetStyleInheritance = true;
  29
  30       shadow.appendChild(tvcm.instantiateTemplate('#find-control-template'));
  31
  32       this.hitCountEl_ = shadow.querySelector('.hit-count-label');
  33
  34       shadow.querySelector('.find-previous')
  35           .addEventListener('click', this.findPrevious_.bind(this));
  36
  37       shadow.querySelector('.find-next')
  38           .addEventListener('click', this.findNext_.bind(this));
  39
  40       this.filterEl_ = shadow.querySelector('#find-control-filter');
  41       this.filterEl_.addEventListener('input',
  42           this.filterTextChanged_.bind(this));
  43
  44       this.filterEl_.addEventListener('keydown', function(e) {
  45         e.stopPropagation();
  46         if (e.keyCode == 13) {
  47           if (e.shiftKey)
  48             this.findPrevious_();
  49           else
  50             this.findNext_();
  51         }
  52       }.bind(this));
  53
  54       this.filterEl_.addEventListener('keypress', function(e) {
  55         e.stopPropagation();
  56       });
  57
  58       this.filterEl_.addEventListener('blur', function(e) {
  59         this.updateHitCountEl_();
  60       }.bind(this));
  61
  62       this.filterEl_.addEventListener('focus', function(e) {
  63         this.controller.reset();
  64         this.filterTextChanged_();
  65         this.filterEl_.select();
  66       }.bind(this));
  67
  68       // Prevent that the input text is deselected after focusing the find
  69       // control with the mouse.
  70       this.filterEl_.addEventListener('mouseup', function(e) {
  71         e.preventDefault();
  72       });
  73
  74       this.updateHitCountEl_();
  75     },
  76
  77     get controller() {
  78       return this.controller_;
  79     },
  80
  81     set controller(c) {
  82       this.controller_ = c;
  83       this.updateHitCountEl_();
  84     },
  85
  86     focus: function() {
  87       this.filterEl_.focus();
  88     },
  89
  90     hasFocus: function() {
  91       return this === document.activeElement;
  92     },
  93
  94     filterTextChanged_: function() {
  95       this.controller.filterText = this.filterEl_.value;
  96       this.updateHitCountEl_();
  97     },
  98
  99     findNext_: function() {
 100       if (this.controller)
 101         this.controller.findNext();
 102       this.updateHitCountEl_();
 103     },
 104
 105     findPrevious_: function() {
 106       if (this.controller)
 107         this.controller.findPrevious();
 108       this.updateHitCountEl_();
 109     },
 110
 111     updateHitCountEl_: function() {
 112       if (!this.controller || !this.hasFocus()) {
 113         this.hitCountEl_.textContent = '';
 114         return;
 115       }
 116       var i = this.controller.currentHitIndex;
 117       var n = this.controller.filterHits.length;
 118       if (n == 0)
 119         this.hitCountEl_.textContent = '0 of 0';
 120       else
 121         this.hitCountEl_.textContent = (i + 1) + ' of ' + n;
 122     }
 123   };
 124
 125   function FindController() {
 126     this.timeline_ = undefined;
 127     this.model_ = undefined;
 128     this.filterText_ = '';
 129     this.filterHits_ = new tracing.Selection();
 130     this.filterHitsDirty_ = true;
 131     this.currentHitIndex_ = -1;
 132   };
 133
 134   FindController.prototype = {
 135     __proto__: Object.prototype,
 136
 137     get timeline() {
 138       return this.timeline_;
 139     },
 140
 141     set timeline(t) {
 142       this.timeline_ = t;
 143       this.filterHitsDirty_ = true;
 144     },
 145
 146     get filterText() {
 147       return this.filterText_;
 148     },
 149
 150     set filterText(f) {
 151       if (f == this.filterText_)
 152         return;
 153       this.filterText_ = f;
 154       this.filterHitsDirty_ = true;
 155
 156       if (!this.timeline)
 157         return;
 158
 159       this.timeline.setHighlightAndClearSelection(this.filterHits);
 160     },
 161
 162     get filterHits() {
 163       if (this.filterHitsDirty_) {
 164         this.filterHitsDirty_ = false;
 165         this.filterHits_ = new tracing.Selection();
 166         this.currentHitIndex_ = -1;
 167
 168         if (this.timeline_ && this.filterText.length) {
 169           var filter = new tracing.TitleFilter(this.filterText);
 170           this.timeline.addAllObjectsMatchingFilterToSelection(
 171               filter, this.filterHits_);
 172         }
 173       }
 174       return this.filterHits_;
 175     },
 176
 177     get currentHitIndex() {
 178       return this.currentHitIndex_;
 179     },
 180
 181     find_: function(dir) {
 182       var firstHit = this.currentHitIndex_ === -1;
 183       if (firstHit && dir < 0)
 184         this.currentHitIndex_ = 0;
 185
 186       var N = this.filterHits.length;
 187       this.currentHitIndex_ = (this.currentHitIndex_ + dir + N) % N;
 188
 189       if (!this.timeline)
 190         return;
 191
 192       this.timeline.selection =
 193           this.filterHits.subSelection(this.currentHitIndex_, 1);
 194     },
 195
 196     findNext: function() {
 197       this.find_(1);
 198     },
 199
 200     findPrevious: function() {
 201       this.find_(-1);
 202     },
 203
 204     reset: function() {
 205       this.filterText_ = '';
 206       this.filterHitsDirty_ = true;
 207     }
 208   };
 209
 210   return {
 211     FindControl: FindControl,
 212     FindController: FindController
 213   };
 214 });