Added image.php to permit fully dynamic image path
[ldapsaisie.git] / public_html / includes / js / LSformElement_select_object_field.js
1 var LSformElement_select_object_field = new Class({
2     initialize: function(ul){
3       this.ul=ul;
4       this.dd=ul.getParent();
5       this.name = ul.id;
6       this.params = varLSdefault.LSjsConfig[this.name];
7       if ($type(this.params)) {
8         this.initializeLSformElement_select_object();
9       }
10     },
11     
12     initializeLSformElement_select_object: function() {
13       // Class of UL
14       if (this.params.multiple) {
15         this.ul.addClass('LSformElement_select_object_edit');
16       }
17       
18       // Delete btns
19       this.ul.getElements('a.LSformElement_select_object').each(function(a){
20         this.addDeleteBtn(a);
21       },this);
22       
23
24       
25       if (this.params.multiple) {
26         // li
27         this.ul.getElements('li').each(function(li){
28           li.addClass('LSformElement_select_object');
29         },this);
30         
31         // Head
32         this.li = new Element('li');
33         this.li.addClass('LSformElement_select_object_addBtn');
34         
35         this.addBtn = new Element('span');
36         this.addBtn.addClass('btn');
37         this.addBtn.set('html',this.params.addBtn);
38         this.addBtn.addEvent('click',this.onAddBtnClick.bindWithEvent(this));
39         this.addBtn.injectInside(this.li);
40         varLSdefault.addHelpInfo(this.addBtn,'LSformElement_select_object','add');
41         
42         this.li.inject(this.ul,'top');
43       }
44       else {
45         this.addSingleAddBtn(this.ul.getFirst());
46       }
47       
48       this._searchAddOpen = 0;
49       document.addEvent('click',this.closeIfOpenSearchAdd.bind(this));
50       this.addSearchAddBtn();
51     },
52     
53     addDeleteBtn: function(a) {
54       var btn = new Element('img');
55       btn.addClass('btn');
56       btn.setProperties({
57         src:    varLSdefault.imagePath('delete'),
58         alt:    this.params.deleteBtns
59       });
60       btn.addEvent('click',this.onDeleteBtnClick.bind(this,btn));
61       btn.injectAfter(a);
62       varLSdefault.addHelpInfo(btn,'LSformElement_select_object','delete');
63     },
64     
65     addSingleAddBtn: function(insideEl) {
66       this.addBtn = new Element('img');
67       this.addBtn.setProperty('src',varLSdefault.imagePath('modify'));
68       this.addBtn.addClass('btn');
69       this.addBtn.addEvent('click',this.onAddBtnClick.bindWithEvent(this));
70       this.addBtn.injectInside(insideEl);
71       varLSdefault.addHelpInfo(this.addBtn,'LSformElement_select_object','add');
72     },
73     
74     addSearchAddBtn: function() {
75       this.searchAddBtn = new Element('img');
76       this.searchAddBtn.setProperty('src',varLSdefault.imagePath('add'));
77       this.searchAddBtn.addClass('btn');
78       this.searchAddBtn.addEvent('click',this.onSearchAddBtnClick.bindWithEvent(this));
79       this.searchAddBtn.injectAfter(this.addBtn);
80       varLSdefault.addHelpInfo(this.searchAddBtn,'LSformElement_select_object','searchAdd');
81     },
82     
83     onAddBtnClick: function(event) {
84       new Event(event).stop();
85       
86       values = new Array();
87       var inputname=this.name+'[]';
88       this.ul.getElements('input.LSformElement_select_object').each(function(el) {
89         if (el.name==inputname) {
90           values.push(el.getProperty('value'));
91         }
92       }, this);
93       
94       var data = {
95         template:   'LSselect',
96         action:     'refreshSession',
97         objecttype: this.params['object_type'],
98         values:     JSON.encode(values)
99       };
100       
101       data.imgload=varLSdefault.loadingImgDisplay(this.addBtn,'inside');
102       new Request({url: 'index_ajax.php', data: data, onSuccess: this.onAddBtnClickComplete.bind(this)}).send();
103     },
104     
105     onAddBtnClickComplete: function(responseText, responseXML) {
106       var data = JSON.decode(responseText);
107       if ( varLSdefault.checkAjaxReturn(data) ) {
108         varLSsmoothbox.asNew();
109         varLSsmoothbox.addEvent('valid',this.onLSsmoothboxValid.bind(this));
110         varLSsmoothbox.displayValidBtn();
111         varLSsmoothbox.openURL('select.php?LSobject='+this.params['object_type']+((this.params['multiple'])?'&multiple=1':''),{width: 635});
112       }
113     },
114     
115     onLSsmoothboxValid: function() {
116       var data = {
117         template:   'LSformElement_select_object',
118         action:     'refresh',
119         attribute:  this.name,
120         objecttype: varLSform.objecttype,
121         objectdn:   varLSform.objectdn,
122         idform:     varLSform.idform
123       };
124       data.imgload=varLSdefault.loadingImgDisplay(this.addBtn);
125       new Request({url: 'index_ajax.php', data: data, onSuccess: this.onLSsmoothboxValidComplete.bind(this)}).send();
126     },
127     
128     onLSsmoothboxValidComplete: function(responseText, responseXML) {
129       var data = JSON.decode(responseText);
130       if ( varLSdefault.checkAjaxReturn(data) ) {
131         this.clearUl();
132         if ($type(data.objects)) {
133           var objs = new Hash(data.objects);
134           objs.each(this.addLi,this);
135         }
136         this.addNoValueLabelIfEmpty();
137       }
138     },
139     
140     clearUl: function() {
141       if (this.params.multiple) {
142         this.ul.getElements('li.LSformElement_select_object').each(function(li){
143           li.destroy();
144         });
145       }
146       else {
147         var a = this.ul.getElement('a.LSformElement_select_object');
148         if ($type(a)) {
149           a.set('html',this.params.noValueLabel);
150           a.removeClass('LSformElement_select_object_deleted');
151           var input = this.ul.getElement('input.LSformElement_select_object');
152           input.value = "";
153         }
154       }
155     },
156     
157     clearUlIfNoValue: function() {
158       if (!$type(this.ul.getElement('a.LSformElement_select_object'))) {
159         this.clearUl();
160       }
161     },
162     
163     addLi: function(name,dn) {
164       if (this.params.multiple) { // Multiple
165         var current = 0;
166         this.ul.getElements("input[type=hidden]").each(function(input){
167           if ((input.value==dn)&&(input.name != this.name+'[]')) {
168             current=input;
169           }
170         },this);
171         if (current) {
172           this.toggleDeleteLi(current.getParent());
173           return true;
174         }
175         var li = new Element('li');
176         li.addClass('LSformElement_select_object');
177         
178         var a = new Element('a');
179         a.addClass('LSformElement_select_object');
180         a.href="view.php?LSobject="+this.params['object_type']+"&dn="+dn;
181         a.set('html',name);
182         a.injectInside(li);
183         
184         var input = new Element('input');
185         input.setProperties({
186           type:   'hidden',
187           value:  dn,
188           name:   this.name+'[]'
189         });
190         input.addClass('LSformElement_select_object');
191         input.injectAfter(a);
192         
193         this.addDeleteBtn(a);
194         
195         li.injectInside(this.ul);
196       }
197       else { // Non Multiple
198         var a = this.ul.getElement('a');
199         if ($type(a)) { // Deja initialise
200           a.href="view.php?LSobject="+this.params['object_type']+"&dn="+dn;
201           a.set('html',name);
202           a.removeClass('LSformElement_select_object_deleted');
203         
204           var input = this.ul.getElement('input');
205           input.setProperties({
206             value:  dn,
207             name:   this.name+'[]'
208           });
209         }
210         else { // Non initialise (No Value)
211           this.ul.empty();
212           var li = new Element('li');
213           
214           var a = new Element('a');
215           a.addClass('LSformElement_select_object');
216           a.href="view.php?LSobject="+this.params['object_type']+"&dn="+dn;
217           a.set('html',name);
218           a.injectInside(li);
219           
220           var input = new Element('input');
221           input.setProperties({
222             type:   'hidden',
223             value:  dn,
224             name:   this.name+'[]'
225           });
226           input.addClass('LSformElement_select_object');
227           input.injectAfter(a);
228           
229           this.addDeleteBtn(a);
230           li.injectInside(this.ul);
231           this.addSingleAddBtn(li);
232           this.addSearchAddBtn();
233         }
234       }
235     },
236     
237     addNoValueLabelIfEmpty: function() {
238       if (this.params.multiple) {
239         if (!$type(this.ul.getElement('a.LSformElement_select_object'))) {
240           var li = new Element('li');
241           li.addClass('LSformElement_select_object');
242           li.addClass('LSformElement_select_object_noValue');
243           li.set('html',this.params.noValueLabel);
244           li.injectInside(this.ul);
245         }
246       }
247       else {
248         var a = this.ul.getElement('a.LSformElement_select_object');
249         if ($type(a)) {
250           if (a.hasClass("LSformElement_select_object_deleted")) {
251             a.set('html',this.params.noValueLabel);
252             a.removeClass('LSformElement_select_object_deleted');
253             var input = this.ul.getElement('input.LSformElement_select_object');
254             input.value = "";
255           }
256         }
257       }
258     },
259     
260     onDeleteBtnClick: function(img) {
261       var li = img.getParent();
262       this.toggleDeleteLi(li);
263     },
264     
265     toggleDeleteLi: function(li) {
266       var a = li.getFirst('a');
267       var input = li.getFirst('input');
268       if (input.value!="") {
269         if (a.hasClass('LSformElement_select_object_deleted')) {
270           input.name=this.name+'[]';
271           a.removeClass('LSformElement_select_object_deleted');
272         }
273         else {
274           input.name=($random(1,10000));
275           a.addClass('LSformElement_select_object_deleted');
276         }
277       }
278     },
279     
280     onSearchAddBtnClick: function(event) {
281       if (this._searchAddOpen==0) {
282         this._searchAddOpen = 1;
283         if (!$type(this.searchAddInput)) {
284           this.tr = this.ul.getParent().getParent();
285           
286           this.td2 = new Element('td');
287           this.td2.addClass('LSformElement_select_object_searchAdd');
288           this.td2.injectInside(this.tr);
289           
290           this.searchAddInput = new Element('input');
291           this.searchAddInput.addClass('LSformElement_select_object_searchAdd');
292           this.searchAddInput.addEvent('keydown',this.onKeyUpSearchAddInput.bindWithEvent(this));
293           this.searchAddInput.injectInside(this.td2);
294         }
295         else {
296           this.searchAddInput.value = "";
297         }
298
299         this._lastSearch = "";
300         this.searchAddInput.setStyle('display','inline');
301         this.searchAddInput.focus();
302       }
303     },
304     
305     onKeyUpSearchAddInput: function(event) {
306       event = new Event(event);
307       
308       if ((event.key=='enter')||(event.key=='tab')) {
309         event.stop();
310         if (this.searchAddInput.value!="") {
311           this.launchSearchAdd();
312         }
313       }
314       
315       if (event.key=='esc') {
316         this.closeSearchAdd();
317       }
318     },
319     
320     launchSearchAdd: function() {
321       if (this._lastSearch!=this.searchAddInput.value) {
322         this._lastSearch=this.searchAddInput.value;
323         var data = {
324           template:   'LSformElement_select_object',
325           action:     'searchAdd',
326           attribute:  this.name,
327           objecttype: varLSform.objecttype,
328           idform:     varLSform.idform,
329           pattern:    this.searchAddInput.value
330         };
331         data.imgload=varLSdefault.loadingImgDisplay(this.searchAddInput);
332         new Request({url: 'index_ajax.php', data: data, onSuccess: this.onSearchAddComplete.bind(this)}).send();
333       }
334     },
335     
336     onSearchAddComplete: function(responseText, responseXML) {
337       var data = JSON.decode(responseText);
338       if ( varLSdefault.checkAjaxReturn(data) ) {
339         if (!$type(this.searchAddUl)) {
340           this.searchAddUl = new Element('ul');
341           this.searchAddUl.addClass('LSformElement_select_object_searchAdd');
342           this.searchAddUl.injectAfter(this.searchAddInput);
343         }
344         this.searchAddUl.empty();
345         if (data.objects) {
346           var objs = new Hash(data.objects);
347           objs.each(this.addSearchAddLi,this);
348         }
349         this.addSearchAddNoValueLabelIfEmpty();
350         
351         this.searchAddUl.setStyle('display','block');
352       }
353     },
354     
355     addSearchAddLi: function(name,dn) {
356       var current = 0;
357       this.ul.getElements("input[type=hidden]").each(function(input){
358         if ((input.value==dn)&&(input.name == this.name+'[]')) {
359           current=1;
360         }
361       },this);
362       
363       var li = new Element('li');
364       li.addClass('LSformElement_select_object_searchAdd');
365       li.id = dn;
366       li.set('html',name);
367       li.addEvent('mouseenter',this.onSearchAddLiMouseEnter.bind(this,li));
368       li.addEvent('mouseleave',this.onSearchAddLiMouseLeave.bind(this,li));
369       if (current) {
370         li.addClass('LSformElement_select_object_searchAdd_current');
371       }
372       else {
373         li.addEvent('click',this.onSearchAddLiClick.bind(this,li));
374       }
375       li.injectInside(this.searchAddUl);
376     },
377     
378     addSearchAddNoValueLabelIfEmpty: function() {
379       if (!$type(this.searchAddUl.getElement('li.LSformElement_select_object_searchAdd'))) {
380         var li = new Element('li');
381         li.addClass('LSformElement_select_object_searchAdd');
382         li.set('html',this.params.noResultLabel);
383         li.injectInside(this.searchAddUl);
384       }
385     },
386     
387     onSearchAddLiMouseEnter: function(li) {
388       li.addClass('LSformElement_select_object_searchAdd_over');
389     },
390     
391     onSearchAddLiMouseLeave: function(li) {
392       li.removeClass('LSformElement_select_object_searchAdd_over');
393     },
394     
395     onSearchAddLiClick: function(li) {
396       this.clearUlIfNoValue();
397       this.addLi(li.innerHTML,li.id);
398     },
399     
400     closeIfOpenSearchAdd: function(event) {
401       event = new Event(event);
402       if (this._searchAddOpen == 1 && event.target!=this.searchAddBtn && event.target!=this.searchAddInput && event.target!=this.searchAddUl) {
403         this.closeSearchAdd();
404       }
405     },
406     
407     closeSearchAdd: function() {
408       this.searchAddInput.setStyle('display','none');
409       if ($type(this.searchAddUl)) {
410         this.searchAddUl.setStyle('display','none');
411       }
412       this._searchAddOpen = 0;
413     }
414 });