OLD | NEW |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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 cr.define('print_preview', function() { | 5 cr.define('print_preview', function() { |
6 'use strict'; | 6 'use strict'; |
7 | 7 |
8 /** | 8 /** |
9 * Component that renders a search box for searching through destinations. | 9 * Component that renders a search box for searching through destinations. |
10 * @param {string} searchBoxPlaceholderText Search box placeholder text. | 10 * @param {string} searchBoxPlaceholderText Search box placeholder text. |
11 * @constructor | 11 * @constructor |
12 * @extends {print_preview.Component} | 12 * @extends {print_preview.Component} |
13 */ | 13 */ |
14 function SearchBox(searchBoxPlaceholderText) { | 14 function SearchBox(searchBoxPlaceholderText) { |
15 print_preview.Component.call(this); | 15 print_preview.Component.call(this); |
16 | 16 |
17 /** | 17 /** |
18 * Search box placeholder text. | 18 * Search box placeholder text. |
19 * @private {string} | 19 * @private {string} |
20 */ | 20 */ |
21 this.searchBoxPlaceholderText_ = searchBoxPlaceholderText; | 21 this.searchBoxPlaceholderText_ = searchBoxPlaceholderText; |
22 | 22 |
23 /** | 23 /** |
24 * Timeout used to control incremental search. | 24 * Timeout used to control incremental search. |
25 * @private {?number} | 25 * @private {?number} |
26 */ | 26 */ |
27 this.timeout_ = null; | 27 this.timeout_ = null; |
28 | 28 |
29 /** | 29 /** |
30 * Input box where the query is entered. | 30 * Input box where the query is entered. |
31 * @private {HTMLInputElement} | 31 * @private {HTMLInputElement} |
32 */ | 32 */ |
33 this.input_ = null; | 33 this.input_ = null; |
34 } | 34 } |
35 | 35 |
36 /** | 36 /** |
37 * Enumeration of event types dispatched from the search box. | 37 * Enumeration of event types dispatched from the search box. |
38 * @enum {string} | 38 * @enum {string} |
39 */ | 39 */ |
40 SearchBox.EventType = { | 40 SearchBox.EventType = {SEARCH: 'print_preview.SearchBox.SEARCH'}; |
41 SEARCH: 'print_preview.SearchBox.SEARCH' | |
42 }; | |
43 | 41 |
44 /** | 42 /** |
45 * Delay in milliseconds before dispatching a SEARCH event. | 43 * Delay in milliseconds before dispatching a SEARCH event. |
46 * @private {number} | 44 * @private {number} |
47 * @const | 45 * @const |
48 */ | 46 */ |
49 SearchBox.SEARCH_DELAY_ = 150; | 47 SearchBox.SEARCH_DELAY_ = 150; |
50 | 48 |
51 SearchBox.prototype = { | 49 SearchBox.prototype = { |
52 __proto__: print_preview.Component.prototype, | 50 __proto__: print_preview.Component.prototype, |
53 | 51 |
54 /** @param {?string} query New query to set the search box's query to. */ | 52 /** @param {?string} query New query to set the search box's query to. */ |
55 setQuery: function(query) { | 53 setQuery: function(query) { |
56 query = query || ''; | 54 query = query || ''; |
57 this.input_.value = query.trim(); | 55 this.input_.value = query.trim(); |
58 }, | 56 }, |
59 | 57 |
60 /** Sets the input element of the search box in focus. */ | 58 /** Sets the input element of the search box in focus. */ |
61 focus: function() { | 59 focus: function() { |
62 this.input_.focus(); | 60 this.input_.focus(); |
63 }, | 61 }, |
64 | 62 |
65 /** @override */ | 63 /** @override */ |
66 createDom: function() { | 64 createDom: function() { |
67 this.setElementInternal(this.cloneTemplateInternal( | 65 this.setElementInternal( |
68 'search-box-template')); | 66 this.cloneTemplateInternal('search-box-template')); |
69 this.input_ = assertInstanceof(this.getChildElement('.search-box-input'), | 67 this.input_ = assertInstanceof( |
70 HTMLInputElement); | 68 this.getChildElement('.search-box-input'), HTMLInputElement); |
71 this.input_.setAttribute('placeholder', this.searchBoxPlaceholderText_); | 69 this.input_.setAttribute('placeholder', this.searchBoxPlaceholderText_); |
72 }, | 70 }, |
73 | 71 |
74 /** @override */ | 72 /** @override */ |
75 enterDocument: function() { | 73 enterDocument: function() { |
76 print_preview.Component.prototype.enterDocument.call(this); | 74 print_preview.Component.prototype.enterDocument.call(this); |
77 this.tracker.add(assert(this.input_), 'input', | 75 this.tracker.add( |
78 this.onInputInput_.bind(this)); | 76 assert(this.input_), 'input', this.onInputInput_.bind(this)); |
79 }, | 77 }, |
80 | 78 |
81 /** @override */ | 79 /** @override */ |
82 exitDocument: function() { | 80 exitDocument: function() { |
83 print_preview.Component.prototype.exitDocument.call(this); | 81 print_preview.Component.prototype.exitDocument.call(this); |
84 this.input_ = null; | 82 this.input_ = null; |
85 }, | 83 }, |
86 | 84 |
87 /** | 85 /** |
88 * @return {string} The current query of the search box. | 86 * @return {string} The current query of the search box. |
(...skipping 28 matching lines...) Expand all Loading... |
117 */ | 115 */ |
118 onInputInput_: function() { | 116 onInputInput_: function() { |
119 if (this.timeout_) | 117 if (this.timeout_) |
120 clearTimeout(this.timeout_); | 118 clearTimeout(this.timeout_); |
121 this.timeout_ = setTimeout( | 119 this.timeout_ = setTimeout( |
122 this.dispatchSearchEvent_.bind(this), SearchBox.SEARCH_DELAY_); | 120 this.dispatchSearchEvent_.bind(this), SearchBox.SEARCH_DELAY_); |
123 } | 121 } |
124 }; | 122 }; |
125 | 123 |
126 // Export | 124 // Export |
127 return { | 125 return {SearchBox: SearchBox}; |
128 SearchBox: SearchBox | |
129 }; | |
130 }); | 126 }); |
OLD | NEW |