author | Todd Larsen <tlarsen@google.com> |
Wed, 24 Sep 2008 02:22:12 +0000 | |
changeset 191 | 80f08751f1e5 |
parent 54 | 03e267d67478 |
permissions | -rw-r--r-- |
54
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
1 |
/* |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
2 |
SelectFilter - Turns a multiple-select box into a filter interface. |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
3 |
|
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
4 |
Requires SelectBox.js and addevent.js. |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
5 |
*/ |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
6 |
|
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
7 |
function findForm(node) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
8 |
// returns the node of the form containing the given node |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
9 |
if (node.tagName.toLowerCase() != 'form') { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
10 |
return findForm(node.parentNode); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
11 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
12 |
return node; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
13 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
14 |
|
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
15 |
var SelectFilter = { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
16 |
init: function(field_id) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
17 |
var from_box = document.getElementById(field_id); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
18 |
from_box.id += '_from'; // change its ID |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
19 |
// Create the INPUT input box |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
20 |
var input_box = document.createElement('input'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
21 |
input_box.id = field_id + '_input'; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
22 |
input_box.setAttribute('type', 'text'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
23 |
from_box.parentNode.insertBefore(input_box, from_box); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
24 |
from_box.parentNode.insertBefore(document.createElement('br'), input_box.nextSibling); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
25 |
// Create the TO box |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
26 |
var to_box = document.createElement('select'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
27 |
to_box.id = field_id + '_to'; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
28 |
to_box.setAttribute('multiple', 'multiple'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
29 |
to_box.setAttribute('size', from_box.size); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
30 |
from_box.parentNode.insertBefore(to_box, from_box.nextSibling); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
31 |
to_box.setAttribute('name', from_box.getAttribute('name')); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
32 |
from_box.setAttribute('name', from_box.getAttribute('name') + '_old'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
33 |
// Give the filters a CSS hook |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
34 |
from_box.setAttribute('class', 'filtered'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
35 |
to_box.setAttribute('class', 'filtered'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
36 |
// Set up the JavaScript event handlers for the select box filter interface |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
37 |
addEvent(input_box, 'keyup', function(e) { SelectFilter.filter_key_up(e, field_id); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
38 |
addEvent(input_box, 'keydown', function(e) { SelectFilter.filter_key_down(e, field_id); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
39 |
addEvent(from_box, 'dblclick', function() { SelectBox.move(field_id + '_from', field_id + '_to'); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
40 |
addEvent(from_box, 'focus', function() { input_box.focus(); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
41 |
addEvent(to_box, 'dblclick', function() { SelectBox.move(field_id + '_to', field_id + '_from'); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
42 |
addEvent(findForm(from_box), 'submit', function() { SelectBox.select_all(field_id + '_to'); }); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
43 |
SelectBox.init(field_id + '_from'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
44 |
SelectBox.init(field_id + '_to'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
45 |
// Move selected from_box options to to_box |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
46 |
SelectBox.move(field_id + '_from', field_id + '_to'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
47 |
}, |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
48 |
filter_key_up: function(event, field_id) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
49 |
from = document.getElementById(field_id + '_from'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
50 |
// don't submit form if user pressed Enter |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
51 |
if ((event.which && event.which == 13) || (event.keyCode && event.keyCode == 13)) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
52 |
from.selectedIndex = 0; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
53 |
SelectBox.move(field_id + '_from', field_id + '_to'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
54 |
from.selectedIndex = 0; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
55 |
return false; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
56 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
57 |
var temp = from.selectedIndex; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
58 |
SelectBox.filter(field_id + '_from', document.getElementById(field_id + '_input').value); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
59 |
from.selectedIndex = temp; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
60 |
return true; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
61 |
}, |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
62 |
filter_key_down: function(event, field_id) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
63 |
from = document.getElementById(field_id + '_from'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
64 |
// right arrow -- move across |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
65 |
if ((event.which && event.which == 39) || (event.keyCode && event.keyCode == 39)) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
66 |
var old_index = from.selectedIndex; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
67 |
SelectBox.move(field_id + '_from', field_id + '_to'); |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
68 |
from.selectedIndex = (old_index == from.length) ? from.length - 1 : old_index; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
69 |
return false; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
70 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
71 |
// down arrow -- wrap around |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
72 |
if ((event.which && event.which == 40) || (event.keyCode && event.keyCode == 40)) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
73 |
from.selectedIndex = (from.length == from.selectedIndex + 1) ? 0 : from.selectedIndex + 1; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
74 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
75 |
// up arrow -- wrap around |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
76 |
if ((event.which && event.which == 38) || (event.keyCode && event.keyCode == 38)) { |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
77 |
from.selectedIndex = (from.selectedIndex == 0) ? from.length - 1 : from.selectedIndex - 1; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
78 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
79 |
return true; |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
80 |
} |
03e267d67478
Major reorganization of the soc svn repo, to merge into a single App Engine
Todd Larsen <tlarsen@google.com>
parents:
diff
changeset
|
81 |
} |