• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1// Copyright (c) 2013 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 Filter Control.
9 */
10base.requireStylesheet('ui.filter_control');
11
12base.require('base.properties');
13base.require('tracing.filter');
14base.require('ui');
15base.require('ui.overlay');
16base.exportTo('ui', function() {
17
18  /**
19   * FilterControl
20   * @constructor
21   */
22  var FilterControl = ui.define('span');
23
24  FilterControl.prototype = {
25    __proto__: HTMLSpanElement.prototype,
26
27    decorate: function() {
28      this.className = 'filter-control';
29      // Filter input element.
30      this.filterEl_ = document.createElement('input');
31      this.filterEl_.type = 'input';
32
33      this.hitCountEl_ = document.createElement('span');
34      this.hitCountEl_.className = 'hit-count-label';
35
36      this.filterEl_.addEventListener('input', function(e) {
37        this.filterText = this.filterEl_.value;
38      }.bind(this));
39
40      this.filterEl_.addEventListener('keydown', function(e) {
41        if (e.keyCode == 27) { // Escape
42          this.filterEl_.blur();
43        }
44      }.bind(this));
45
46      this.addEventListener(
47          'hitCountTextChange',
48          this.updateHitCountEl_.bind(this)
49      );
50
51      this.addEventListener(
52          'filterTextChange',
53          this.onFilterTextChange_.bind(this)
54      );
55
56      // Attach everything.
57      this.appendChild(this.filterEl_);
58      this.appendChild(this.hitCountEl_);
59
60      this.filterText = '';
61      this.hitCountText = '0 of 0';
62    },
63
64    // Input, internal control of text field
65    get filterText() {
66      return this.filterText_;
67    },
68
69    set filterText(newValue) {
70      base.setPropertyAndDispatchChange(this, 'filterText', newValue);
71    },
72
73    // Output, result of filterText updates.
74    get hitCountText() {
75      return this.hitCountText_;
76    },
77
78    set hitCountText(newValue) {
79      base.setPropertyAndDispatchChange(this, 'hitCountText', newValue);
80    },
81
82    focus: function() {
83      this.filterEl_.selectionStart = 0;
84      this.filterEl_.selectionEnd = this.filterEl_.value.length;
85      this.filterEl_.focus();
86    },
87
88    updateHitCountEl_: function(event) {
89      this.hitCountEl_.textContent = event ? event.newValue : '';
90    },
91
92    onFilterTextChange_: function() {
93      this.filterEl_.value = event.newValue;
94    }
95  };
96
97  return {
98    FilterControl: FilterControl
99  };
100});
101
102