diff options
author | Valerio Virgillito | 2012-05-03 22:53:07 -0700 |
---|---|---|
committer | Valerio Virgillito | 2012-05-03 22:53:07 -0700 |
commit | 24b483db367291b72170f969de78efcb1a9b95bd (patch) | |
tree | a691a7803cefbfa76a6331a50cbeebcd16287d91 /node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js | |
parent | dc93269cfa7c315d22d85c8217e2412749643f28 (diff) | |
download | ninja-24b483db367291b72170f969de78efcb1a9b95bd.tar.gz |
integrating the latest montage version
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js')
-rw-r--r-- | node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js | 498 |
1 files changed, 498 insertions, 0 deletions
diff --git a/node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js b/node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js new file mode 100644 index 00000000..0ce1ab85 --- /dev/null +++ b/node_modules/montage/ui/autocomplete/autocomplete.reel/autocomplete.js | |||
@@ -0,0 +1,498 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | var Montage = require("montage").Montage, | ||
7 | Component = require("ui/component").Component, | ||
8 | TextInput = require("ui/text-input").TextInput, | ||
9 | logger = require("core/logger").logger("autocomplete"), | ||
10 | ResultsList = require("ui/autocomplete/results-list.reel/results-list").ResultsList, | ||
11 | ArrayController = require("ui/controller/array-controller").ArrayController, | ||
12 | Popup = require("ui/popup/popup.reel").Popup, | ||
13 | PressComposer = require("ui/composer/press-composer").PressComposer; | ||
14 | |||
15 | var KEY_UP = 38, | ||
16 | KEY_DOWN = 40, | ||
17 | KEY_RIGHT = 39, | ||
18 | KEY_ENTER = 13, | ||
19 | KEY_ESC = 27; | ||
20 | |||
21 | var getElementPosition = function(obj) { | ||
22 | var curleft = 0, curtop = 0, curHt = 0, curWd = 0; | ||
23 | if (obj.offsetParent) { | ||
24 | do { | ||
25 | curleft += obj.offsetLeft; | ||
26 | curtop += obj.offsetTop; | ||
27 | curHt += obj.offsetHeight; | ||
28 | curWd += obj.offsetWidth; | ||
29 | } while ((obj = obj.offsetParent)); | ||
30 | } | ||
31 | return { | ||
32 | top: curtop, | ||
33 | left: curleft, | ||
34 | height: curHt, | ||
35 | width: curWd | ||
36 | }; | ||
37 | }; | ||
38 | |||
39 | /** | ||
40 | * The Autocomplete input | ||
41 | */ | ||
42 | var Autocomplete = exports.Autocomplete = Montage.create(TextInput, { | ||
43 | |||
44 | didCreate: { | ||
45 | value: function() { | ||
46 | this.delay = 500; | ||
47 | this.minLength = 2; | ||
48 | } | ||
49 | }, | ||
50 | |||
51 | hasTemplate: {value: true}, | ||
52 | |||
53 | delegate: { | ||
54 | value: null | ||
55 | }, | ||
56 | |||
57 | separator: { | ||
58 | value: ',', | ||
59 | distinct: true | ||
60 | }, | ||
61 | |||
62 | _delay: {value: null}, | ||
63 | delay: { | ||
64 | distinct: true, | ||
65 | get: function(){ | ||
66 | return this._delay; | ||
67 | }, | ||
68 | set: function(value) { | ||
69 | if(value !== this._delay) { | ||
70 | if(String.isString(value)) { | ||
71 | value = parseInt(value, 10); | ||
72 | } | ||
73 | this._delay = value; | ||
74 | } | ||
75 | } | ||
76 | }, | ||
77 | |||
78 | /** | ||
79 | * Number of characters the user must type before the suggest query is fired | ||
80 | * Default = 2 | ||
81 | */ | ||
82 | minLength: { | ||
83 | value: null | ||
84 | }, | ||
85 | |||
86 | _tokens: {value: null}, | ||
87 | tokens: { | ||
88 | get: function() { | ||
89 | return this._tokens; | ||
90 | }, | ||
91 | set: function(value) { | ||
92 | this._tokens = value; | ||
93 | this._valueSyncedWithInputField = false; | ||
94 | this.needsDraw = true; | ||
95 | }, | ||
96 | modify: function(v) { | ||
97 | this._tokens = v; | ||
98 | }, | ||
99 | distinct: true | ||
100 | }, | ||
101 | |||
102 | // overridden here to get the substring/searchString | ||
103 | value: { | ||
104 | get: function() { | ||
105 | return this._value; | ||
106 | //var arr = this.tokens; | ||
107 | //return (arr ? arr.join(',') : this._value); | ||
108 | }, | ||
109 | set: function(newValue, fromInput) { | ||
110 | this._value = newValue ? newValue.trim() : ''; | ||
111 | |||
112 | // get the entered text after the separator | ||
113 | var value = this._value; | ||
114 | |||
115 | |||
116 | if(fromInput) { | ||
117 | this._valueSyncedWithInputField = true; | ||
118 | if(value) { | ||
119 | var arr = value.split(this.separator).map(function(item) { | ||
120 | return item.trim(); | ||
121 | }); | ||
122 | this.activeTokenIndex = this._findActiveTokenIndex(this.tokens, arr); | ||
123 | this._tokens = value.split(this.separator).map(function(item) { | ||
124 | return item.trim(); | ||
125 | }); | ||
126 | if(this._tokens.length && this._tokens.length > 0) { | ||
127 | var searchTerm = this._tokens[this.activeTokenIndex]; | ||
128 | searchTerm = searchTerm ? searchTerm.trim() : ''; | ||
129 | if(searchTerm.length >= this.minLength) { | ||
130 | var self = this; | ||
131 | clearTimeout(this.delayTimer); | ||
132 | this.delayTimer = setTimeout(function() { | ||
133 | self.delayTimer = null; | ||
134 | if (logger.isDebug) { | ||
135 | logger.debug('SEARCH for ', searchTerm); | ||
136 | } | ||
137 | self.performSearch(searchTerm); | ||
138 | }, this.delay); | ||
139 | } else { | ||
140 | this.showPopup = false; | ||
141 | } | ||
142 | } else { | ||
143 | this.showPopup = false; | ||
144 | } | ||
145 | } | ||
146 | } else { | ||
147 | this.activeTokenIndex = 0; | ||
148 | this._tokens = []; | ||
149 | this.showPopup = false; | ||
150 | |||
151 | this._valueSyncedWithInputField = false; | ||
152 | this.needsDraw = true; | ||
153 | } | ||
154 | } | ||
155 | }, | ||
156 | |||
157 | |||
158 | |||
159 | //---- Private | ||
160 | |||
161 | // width of the popup | ||
162 | overlayWidth: { | ||
163 | value: null, | ||
164 | enumerable: false | ||
165 | }, | ||
166 | |||
167 | delayTimer: { | ||
168 | value: null, | ||
169 | enumerable: false | ||
170 | }, | ||
171 | |||
172 | // valid values are 'loading', 'complete' and 'timeout' | ||
173 | // --> ResultList.loadingStatus | ||
174 | _loadingStatus: {value: false, enumerable: false}, | ||
175 | loadingStatus: { | ||
176 | enumerable: false, | ||
177 | get: function() { | ||
178 | return this._loadingStatus; | ||
179 | }, | ||
180 | set: function(value) { | ||
181 | this._loadingStatus = value; | ||
182 | if(this._loadingStatus === 'loading') { | ||
183 | this.showPopup = false; | ||
184 | } | ||
185 | this.needsDraw = true; | ||
186 | } | ||
187 | }, | ||
188 | |||
189 | // the index of the token in the tokens Array that is being worked on | ||
190 | activeTokenIndex: {value: null}, | ||
191 | |||
192 | /** @private */ | ||
193 | _findActiveTokenIndex: { | ||
194 | enumerable: false, | ||
195 | value: function(before, after) { | ||
196 | if(before == null || after == null) { | ||
197 | return 0; | ||
198 | } | ||
199 | var i=0, len = after.length; | ||
200 | for(i=0; i< len; i++) { | ||
201 | if(i < before.length) { | ||
202 | if(before[i] === after[i]) { | ||