| 13 |
13 |
PAGE_UP: 33,
|
| 14 |
14 |
PAGE_DOWN: 34,
|
| 15 |
15 |
};
|
|
16 |
var CLASSES = {
|
|
17 |
PICKED: 'partpicker-picked',
|
|
18 |
UNDEFINED: 'partpicker-undefined',
|
|
19 |
FAT_SET_ITEM: 'partpicker_fat_set_item',
|
|
20 |
}
|
| 16 |
21 |
var o = $.extend({
|
| 17 |
22 |
limit: 20,
|
| 18 |
23 |
delay: 50,
|
| 19 |
|
fat_set_item: $real.hasClass('partpicker_fat_set_item'),
|
|
24 |
fat_set_item: $real.hasClass(CLASSES.FAT_SET_ITEM),
|
| 20 |
25 |
}, options);
|
| 21 |
26 |
var STATES = {
|
| 22 |
|
UNIQUE: 1,
|
| 23 |
|
UNDEFINED: 0,
|
|
27 |
PICKED: CLASSES.PICKED,
|
|
28 |
UNDEFINED: CLASSES.UNDEFINED
|
| 24 |
29 |
}
|
| 25 |
30 |
var real_id = $real.attr('id');
|
| 26 |
31 |
var $dummy = $('#' + real_id + '_name');
|
| ... | ... | |
| 31 |
36 |
var state = STATES.PICKED;
|
| 32 |
37 |
var last_real = $real.val();
|
| 33 |
38 |
var last_dummy = $dummy.val();
|
| 34 |
|
var last_unverified_dummy = $dummy.val();
|
| 35 |
39 |
var timer;
|
| 36 |
40 |
|
| 37 |
41 |
function open_dialog () {
|
| ... | ... | |
| 39 |
43 |
url: 'controller.pl?action=Part/part_picker_search',
|
| 40 |
44 |
data: $.extend({
|
| 41 |
45 |
real_id: real_id,
|
| 42 |
|
}, ajax_data(last_unverified_dummy)),
|
|
46 |
}, ajax_data($dummy.val())),
|
| 43 |
47 |
id: 'part_selection',
|
| 44 |
48 |
dialog: {
|
| 45 |
49 |
title: k.t8('Part picker'),
|
| ... | ... | |
| 82 |
86 |
state = STATES.PICKED;
|
| 83 |
87 |
last_real = $real.val();
|
| 84 |
88 |
last_dummy = $dummy.val();
|
|
89 |
last_unverified_dummy = $dummy.val();
|
| 85 |
90 |
$real.trigger('change');
|
| 86 |
91 |
|
| 87 |
92 |
if (o.fat_set_item && item.id) {
|
| ... | ... | |
| 95 |
100 |
} else {
|
| 96 |
101 |
$real.trigger('set_item:PartPicker', item);
|
| 97 |
102 |
}
|
|
103 |
annotate_state();
|
| 98 |
104 |
}
|
| 99 |
105 |
|
| 100 |
106 |
function make_defined_state () {
|
| 101 |
|
if (state == STATES.PICKED)
|
|
107 |
if (state == STATES.PICKED) {
|
|
108 |
annotate_state();
|
| 102 |
109 |
return true
|
| 103 |
|
else if (state == STATES.UNDEFINED && $dummy.val() == '')
|
|
110 |
} else if (state == STATES.UNDEFINED && $dummy.val() == '')
|
| 104 |
111 |
set_item({})
|
| 105 |
|
else
|
|
112 |
else {
|
| 106 |
113 |
last_unverified_dummy = $dummy.val();
|
| 107 |
114 |
set_item({ id: last_real, name: last_dummy })
|
|
115 |
}
|
|
116 |
annotate_state();
|
|
117 |
}
|
|
118 |
|
|
119 |
function annotate_state () {
|
|
120 |
if (state == STATES.PICKED)
|
|
121 |
$dummy.removeClass(STATES.UNDEFINED).addClass(STATES.PICKED);
|
|
122 |
else if (state == STATES.UNDEFINED && $dummy.val() == '')
|
|
123 |
$dummy.removeClass(STATES.UNDEFINED).addClass(STATES.PICKED);
|
|
124 |
else {
|
|
125 |
last_unverified_dummy = $dummy.val();
|
|
126 |
$dummy.addClass(STATES.UNDEFINED).removeClass(STATES.PICKED);
|
|
127 |
}
|
| 108 |
128 |
}
|
| 109 |
129 |
|
| 110 |
130 |
function update_results () {
|
| ... | ... | |
| 160 |
180 |
/* note:
|
| 161 |
181 |
* event.which does not contain tab events in keypressed in firefox but will report 0
|
| 162 |
182 |
* chrome does not fire keypressed at all on tab or escape
|
| 163 |
|
* TODO: users expect tab to work on keydown but enter to trigger on keyup,
|
| 164 |
|
* should be handled seperately
|
| 165 |
183 |
*/
|
| 166 |
184 |
$dummy.keydown(function(event){
|
| 167 |
|
if (event.which == KEY.ENTER || event.which == KEY.TAB) { // enter or tab or tab
|
|
185 |
if (event.which == KEY.ENTER || event.which == KEY.TAB) {
|
| 168 |
186 |
// if string is empty assume they want to delete
|
| 169 |
187 |
if ($dummy.val() == '') {
|
| 170 |
188 |
set_item({});
|
| ... | ... | |
| 172 |
190 |
} else if (state == STATES.PICKED) {
|
| 173 |
191 |
return true;
|
| 174 |
192 |
}
|
|
193 |
if (event.which == KEY.TAB) event.preventDefault();
|
| 175 |
194 |
$.ajax({
|
| 176 |
195 |
url: 'controller.pl?action=Part/ajax_autocomplete',
|
| 177 |
196 |
dataType: "json",
|
| 178 |
197 |
data: $.extend( ajax_data($dummy.val()), { prefer_exact: 1 } ),
|
| 179 |
|
success: function (data){
|
|
198 |
success: function (data) {
|
| 180 |
199 |
if (data.length == 1) {
|
| 181 |
200 |
set_item(data[0]);
|
| 182 |
201 |
if (event.which == KEY.ENTER)
|
| ... | ... | |
| 184 |
203 |
} else if (data.length > 1) {
|
| 185 |
204 |
if (event.which == KEY.ENTER)
|
| 186 |
205 |
open_dialog();
|
| 187 |
|
else
|
| 188 |
|
make_defined_state();
|
| 189 |
206 |
} else {
|
| 190 |
|
if (event.which == KEY.TAB)
|
| 191 |
|
make_defined_state();
|
| 192 |
207 |
}
|
|
208 |
annotate_state();
|
| 193 |
209 |
}
|
| 194 |
210 |
});
|
| 195 |
211 |
if (event.which == KEY.ENTER)
|
| ... | ... | |
| 201 |
217 |
|
| 202 |
218 |
$dummy.blur(function(){
|
| 203 |
219 |
window.clearTimeout(timer);
|
| 204 |
|
timer = window.setTimeout(make_defined_state, 100);
|
|
220 |
timer = window.setTimeout(annotate_state, 100);
|
| 205 |
221 |
});
|
| 206 |
222 |
|
| 207 |
223 |
// now add a picker div after the original input
|
| ... | ... | |
| 222 |
238 |
result_timer: result_timer,
|
| 223 |
239 |
set_item: set_item,
|
| 224 |
240 |
reset: make_defined_state,
|
|
241 |
is_defined_state: function() { return state == STATES.PICKED },
|
| 225 |
242 |
init_results: function () {
|
| 226 |
243 |
$('div.part_picker_part').each(function(){
|
| 227 |
244 |
$(this).click(function(){
|
PartPicker: Tab Event atomar, visuelles Feedback