|
bgneal@1
|
1 // Finds all fieldsets with class="collapse", collapses them, and gives each
|
|
bgneal@1
|
2 // one a "Show" link that uncollapses it. The "Show" link becomes a "Hide"
|
|
bgneal@1
|
3 // link when the fieldset is visible.
|
|
bgneal@1
|
4
|
|
bgneal@1
|
5 function findForm(node) {
|
|
bgneal@1
|
6 // returns the node of the form containing the given node
|
|
bgneal@1
|
7 if (node.tagName.toLowerCase() != 'form') {
|
|
bgneal@1
|
8 return findForm(node.parentNode);
|
|
bgneal@1
|
9 }
|
|
bgneal@1
|
10 return node;
|
|
bgneal@1
|
11 }
|
|
bgneal@1
|
12
|
|
bgneal@1
|
13 var CollapsedFieldsets = {
|
|
bgneal@1
|
14 collapse_re: /\bcollapse\b/, // Class of fieldsets that should be dealt with.
|
|
bgneal@1
|
15 collapsed_re: /\bcollapsed\b/, // Class that fieldsets get when they're hidden.
|
|
bgneal@1
|
16 collapsed_class: 'collapsed',
|
|
bgneal@1
|
17 init: function() {
|
|
bgneal@1
|
18 var fieldsets = document.getElementsByTagName('fieldset');
|
|
bgneal@1
|
19 var collapsed_seen = false;
|
|
bgneal@1
|
20 for (var i = 0, fs; fs = fieldsets[i]; i++) {
|
|
bgneal@1
|
21 // Collapse this fieldset if it has the correct class, and if it
|
|
bgneal@1
|
22 // doesn't have any errors. (Collapsing shouldn't apply in the case
|
|
bgneal@1
|
23 // of error messages.)
|
|
bgneal@1
|
24 if (fs.className.match(CollapsedFieldsets.collapse_re) && !CollapsedFieldsets.fieldset_has_errors(fs)) {
|
|
bgneal@1
|
25 collapsed_seen = true;
|
|
bgneal@1
|
26 // Give it an additional class, used by CSS to hide it.
|
|
bgneal@1
|
27 fs.className += ' ' + CollapsedFieldsets.collapsed_class;
|
|
bgneal@1
|
28 // (<a id="fieldsetcollapser3" class="collapse-toggle" href="#">Show</a>)
|
|
bgneal@1
|
29 var collapse_link = document.createElement('a');
|
|
bgneal@1
|
30 collapse_link.className = 'collapse-toggle';
|
|
bgneal@1
|
31 collapse_link.id = 'fieldsetcollapser' + i;
|
|
bgneal@1
|
32 collapse_link.onclick = new Function('CollapsedFieldsets.show('+i+'); return false;');
|
|
bgneal@1
|
33 collapse_link.href = '#';
|
|
bgneal@1
|
34 collapse_link.innerHTML = gettext('Show');
|
|
bgneal@1
|
35 var h2 = fs.getElementsByTagName('h2')[0];
|
|
bgneal@1
|
36 h2.appendChild(document.createTextNode(' ('));
|
|
bgneal@1
|
37 h2.appendChild(collapse_link);
|
|
bgneal@1
|
38 h2.appendChild(document.createTextNode(')'));
|
|
bgneal@1
|
39 }
|
|
bgneal@1
|
40 }
|
|
bgneal@1
|
41 if (collapsed_seen) {
|
|
bgneal@1
|
42 // Expand all collapsed fieldsets when form is submitted.
|
|
bgneal@1
|
43 addEvent(findForm(document.getElementsByTagName('fieldset')[0]), 'submit', function() { CollapsedFieldsets.uncollapse_all(); });
|
|
bgneal@1
|
44 }
|
|
bgneal@1
|
45 },
|
|
bgneal@1
|
46 fieldset_has_errors: function(fs) {
|
|
bgneal@1
|
47 // Returns true if any fields in the fieldset have validation errors.
|
|
bgneal@1
|
48 var divs = fs.getElementsByTagName('div');
|
|
bgneal@1
|
49 for (var i=0; i<divs.length; i++) {
|
|
bgneal@1
|
50 if (divs[i].className.match(/\berrors\b/)) {
|
|
bgneal@1
|
51 return true;
|
|
bgneal@1
|
52 }
|
|
bgneal@1
|
53 }
|
|
bgneal@1
|
54 return false;
|
|
bgneal@1
|
55 },
|
|
bgneal@1
|
56 show: function(fieldset_index) {
|
|
bgneal@1
|
57 var fs = document.getElementsByTagName('fieldset')[fieldset_index];
|
|
bgneal@1
|
58 // Remove the class name that causes the "display: none".
|
|
bgneal@1
|
59 fs.className = fs.className.replace(CollapsedFieldsets.collapsed_re, '');
|
|
bgneal@1
|
60 // Toggle the "Show" link to a "Hide" link
|
|
bgneal@1
|
61 var collapse_link = document.getElementById('fieldsetcollapser' + fieldset_index);
|
|
bgneal@1
|
62 collapse_link.onclick = new Function('CollapsedFieldsets.hide('+fieldset_index+'); return false;');
|
|
bgneal@1
|
63 collapse_link.innerHTML = gettext('Hide');
|
|
bgneal@1
|
64 },
|
|
bgneal@1
|
65 hide: function(fieldset_index) {
|
|
bgneal@1
|
66 var fs = document.getElementsByTagName('fieldset')[fieldset_index];
|
|
bgneal@1
|
67 // Add the class name that causes the "display: none".
|
|
bgneal@1
|
68 fs.className += ' ' + CollapsedFieldsets.collapsed_class;
|
|
bgneal@1
|
69 // Toggle the "Hide" link to a "Show" link
|
|
bgneal@1
|
70 var collapse_link = document.getElementById('fieldsetcollapser' + fieldset_index);
|
|
bgneal@1
|
71 collapse_link.onclick = new Function('CollapsedFieldsets.show('+fieldset_index+'); return false;');
|
|
bgneal@1
|
72 collapse_link.innerHTML = gettext('Show');
|
|
bgneal@1
|
73 },
|
|
bgneal@1
|
74
|
|
bgneal@1
|
75 uncollapse_all: function() {
|
|
bgneal@1
|
76 var fieldsets = document.getElementsByTagName('fieldset');
|
|
bgneal@1
|
77 for (var i=0; i<fieldsets.length; i++) {
|
|
bgneal@1
|
78 if (fieldsets[i].className.match(CollapsedFieldsets.collapsed_re)) {
|
|
bgneal@1
|
79 CollapsedFieldsets.show(i);
|
|
bgneal@1
|
80 }
|
|
bgneal@1
|
81 }
|
|
bgneal@1
|
82 }
|
|
bgneal@1
|
83 }
|
|
bgneal@1
|
84
|
|
bgneal@1
|
85 addEvent(window, 'load', CollapsedFieldsets.init);
|
