source: products/qPloneTabs/tags/0.2.1/skins/qPloneTabs/javascripts/qplonetabs.js @ 1591

Last change on this file since 1591 was 1, checked in by myroslav, 19 years ago

Building directory structure

File size: 7.4 KB
Line 
1var myrules = {
2  '#reorder' : function(el){
3    el.onclick = function(){
4      Element.classNames('app').set('sorting');
5      Sortable.create('tabslist', {handle: 'drag-handle'});
6      removeEdition(el);
7      return false;
8    }
9  },
10  '#save' : function(el){
11    el.onclick = function(){
12      var params = '';
13      $A($('tabslist').getElementsByTagName('INPUT')).findAll(function(h){return h.type=='hidden';}).each(function(f,idx){params += idx==0?'idxs='+f.value:'&idxs='+f.value;});
14      new Ajax.Request('qpt_reorder',
15        {method: 'post',
16         parameters: params,
17         onSuccess: function(request){
18           $A($('tabslist').getElementsByTagName('INPUT')).findAll(function(h){return h.type=='hidden';}).each(function(f,idx){f.value=idx;});
19           Element.classNames('app').set('viewing');
20           Sortable.destroy('tabslist');
21           new Effect.Highlight('tabslist',{});
22         },
23         onComplete: function(request){
24           $A($('tabslist').getElementsByTagName('LI')).each(function(li){new Element.ClassNames(li).remove('hover');});
25           Behaviour.apply();
26         }
27        }
28      );
29      return false;
30    }
31  },
32  '#cancel' : function(el){
33    el.onclick = function(){
34      new Ajax.Request('qpt_gettabslist',
35        {method: 'get',
36         onSuccess: function(request){Element.update('tabslist',request.responseText.replace(/collapsedOnLoad/g,'collapsedBlockCollapsible'));},
37         onComplete: function(request){Element.classNames('app').set('viewing');Behaviour.apply();}
38        }
39      );
40      Sortable.destroy('tabslist');
41      return false;
42    }
43  },
44  'app #tabslist li' : function(el){
45     if (el.attachEvent){
46      if (!el.hovers) el.hovers = {};
47      if (el.hovers['hover']) return;
48      el.hovers['hover'] = true;
49      el.attachEvent('onmouseover', function(){el.className += ' hover';});
50      el.attachEvent('onmouseout',  function(){el.className = el.className.replace((new RegExp('\\s+hover')),'');});
51     }
52  },
53  '.delete' : function(el){
54    el.onclick = function(ev){
55      var item = el.parentNode,
56          num = $A($('tabslist').getElementsByTagName('LI')).indexOf(item);
57      new Ajax.Request('qpt_delete',
58        {parameters:'idx='+num+'&id=' + item.id.replace('tabslist_', ''),
59         onComplete: function(request) {
60           new Effect.Fade(item, {duration: 0.7, afterFinish: function(){
61             Element.remove(item);
62             $A($('tabslist').getElementsByTagName('INPUT')).findAll(function(h){return h.type=='hidden';}).each(function(f,idx){f.value=idx;});
63           }});
64         }
65        }
66      );
67      return false;
68    }
69  },
70  'app #tabslist dt.collapsibleHeader' : function(el){el.onclick = toggleCollapsible;},
71  '#tabslist li span' : function(el){
72    el.onclick = function(ev){
73      var ev = ev?ev:window.event, li = Event.findElement(ev, 'LI');
74      Element.classNames('app').set('editing');
75      removeEdition(el);
76      Element.classNames(li).set('current');
77      li.getElementsByTagName('INPUT')[1].focus();
78    }
79  },
80  '#tabslist input.editsave' : function(el){
81    el.onclick = function(ev){
82      var ev = ev?ev:window.event, v = validateField,
83          li = Event.findElement(ev, 'LI'), tds = document.getElementsByTagName('INPUT');
84      if (v('actname',$F(tds[1])) && v('actid',$F(tds[3]))) {
85         var num = $A($('tabslist').getElementsByTagName('LI')).indexOf(li);
86         new Ajax.Request('qpt_edit',
87           {parameters:'num='+num+'&'+Form.serialize(Event.findElement(ev, 'FORM')),
88            onSuccess: function(request){
89              Element.update(li, request.responseText);
90              Element.classNames('app').set('viewing');
91              Element.classNames(li).set('');
92              li.id = 'tabslist_'+$F(tds[3]);
93           },
94           onFailure: function(request){
95             var message = (/Error Value\s*<\/dt>\s*<dd>(.*?)<\/dd>/i).exec(request.responseText);
96             window.alert(message[1]);
97           },
98           onComplete: function(){Behaviour.apply();}
99          }
100        );
101      };
102      return false;
103    }
104  },
105  '#tabslist input.editcancel' : function(el){
106    el.onclick = function(ev){Behaviour.apply();
107      var ev = ev ? ev:window.event;
108      new Ajax.Request('qpt_gettabslist',
109        {method: 'get',
110         onSuccess: function(request){
111           Element.update('tabslist',request.responseText.replace(/collapsedOnLoad/g,'collapsedBlockCollapsible'));
112           Element.classNames('app').set('viewing');
113           Element.classNames(Event.findElement(ev, 'LI')).set('');
114         },
115         onComplete: function(request){Behaviour.apply();}
116        }
117      );
118      return false;
119    }
120  },
121  '#actname' : function(el){
122    var re = new RegExp('[^a-zA-Z0-9-_~,.\$\(\)# ]','g'), initialVal = $F(el);
123    el.onfocus = function(){
124      Element.classNames('app').set('adding');
125      removeEdition(el);
126    };
127    el.onkeyup = function() {
128      var name = $F(el), id = $F('actid');
129      if (id == initialVal.replace(re,'') || id == name.replace(re,'')) {
130        $('actid').value = name.replace(re,'');
131        initialVal = name;
132      };
133    };
134  },
135  '#buttonadd' : function(el){
136    el.onclick = function(ev){
137      var ev = ev?ev:window.event, dl = Event.findElement(ev, 'FORM').getElementsByTagName('DL')[2],
138          v = validateField;
139      if (v('actname',$F('actname')) && v('actid',$F('actid'))) {
140        var idx = $('tabslist').getElementsByTagName('LI').length;
141        new Ajax.Request('qpt_add',
142          {parameters:'idx='+idx+'&'+Form.serialize('addaction'),
143           onSuccess: function(request){
144             new Insertion.Bottom('tabslist', request.responseText);
145             Form.reset('addaction');
146             Element.classNames('app').set('viewing');
147             dl.className = dl.className.replace(/expandedBlockCollapsible/g,'collapsedBlockCollapsible');
148             Behaviour.apply();
149           },
150           onFailure: function(request){
151             var message = (/Error Value\s*<\/dt>\s*<dd>(.*?)<\/dd>/i).exec(request.responseText);
152             window.alert(message[1]);
153           }
154          }
155        );
156      };
157      return false;
158    }
159  },
160  '#buttoncancel' : function(el){
161    el.onclick = function(ev){
162      var ev = ev ? ev : window.event, dl = Event.findElement(ev, 'FORM').getElementsByTagName('DL')[2];
163      Element.classNames('app').set('viewing');
164      Form.reset('addaction');
165      dl.className = dl.className.replace(/expandedBlockCollapsible/g,'collapsedBlockCollapsible');
166      Behaviour.apply();
167      return false;
168    }
169  },
170  '#generated_tabs' : function(el){
171    el.onclick = function(ev){new Ajax.Request('qpt_setproperty', {parameters:'generated_tabs='+el.checked});}
172  }
173};
174
175Behaviour.register(myrules);
176
177var globalHandlers = {
178  onCreate: function(){Element.addClassName('app', 'working');},
179  onComplete: function() {if(Ajax.activeRequestCount == 0) Element.removeClassName('app', 'working');}
180};
181
182Ajax.Responders.register(globalHandlers);
183
184function validateField(id, val) {
185  var re = new RegExp('[^a-zA-Z0-9-_~,.\$\(\)# ]','g');
186  if (!val) {
187    window.alert(id.replace(/act/,'') + ' field is required!');
188    return false;
189  }
190  else {
191    er = id != 'actid' ? true : val.search(re) == -1 ? true : false;
192    if (!er) window.alert(val+' is not a legal name.\n The following characters are invalid:' + val.match(re).toString());
193  }
194  return er;
195};
196
197function removeEdition(el) {
198  $A($('tabslist').getElementsByTagName('SPAN')).each(function(sp,idx){if(sp != el) sp.onclick='';});
199};
Note: See TracBrowser for help on using the repository browser.