Bug 17725: Same for textarea when cloning a field
[koha.git] / koha-tmpl / intranet-tmpl / prog / js / cataloging.js
1 /*
2  * Unified file for catalogue edition
3  */
4
5 /* Functions developed for addbiblio.tt and authorities.tt */
6
7 // returns the fieldcode based upon tag div id
8 function getFieldCode(tagDivId){
9     // format : tag_<tagnumber>_...
10     return tagDivId.substr(3+1,3);
11 }
12
13 //returns the field and subfieldcode based upon subfield div id
14 function getFieldAndSubfieldCode(subfieldDivId){
15  // format : subfield<tagnumber><subfieldnumber>...
16     return subfieldDivId.substr(8,3+1);
17 }
18
19 //returns the subfieldcode based upon subfieldid writing
20 function getSubfieldCode(tagsubfieldid){
21     // 3 : tag +3 : tagnumber +4 : number of _ +8 subfield -1 begins at 0
22     return tagsubfieldid.substr(3+3+4+8-1,1);
23 }
24
25 // Take the base of tagsubfield information (removing the subfieldcodes and subfieldindexes)
26 // returns the filter
27 function getTagInputnameFilter(tagsubfieldid){
28     var tagsubfield=tagsubfieldid.substr(0,tagsubfieldid.lastIndexOf("_"));
29     var tagcode=tagsubfield.substr(tagsubfield.lastIndexOf("_"));
30     tagsubfield=tagsubfield.substr(0,tagsubfield.lastIndexOf("_"));
31     tagsubfield=tagsubfield.substr(0,tagsubfield.lastIndexOf("_"));
32     tagsubfield=tagsubfield+"_."+tagcode;
33     return tagsubfield;
34 }
35
36 // if source is "auth", we are editing an authority otherwise it is a biblio
37 function openAuth(tagsubfieldid,authtype,source) {
38     // let's take the base of tagsubfield information (removing the indexes and the codes
39     var element=document.getElementById(tagsubfieldid);
40     var tagsubfield=getTagInputnameFilter(tagsubfieldid);
41     var elementsubfcode=getSubfieldCode(element.name);
42     var mainmainstring=element.value;
43     var mainstring = new Array();
44     var inputs = element.parentNode.parentNode.getElementsByTagName("input");
45
46     for (var myindex =0; myindex<inputs.length;myindex++){
47         if (inputs[myindex].name && inputs[myindex].name.match(tagsubfield)){
48             var subfieldcode=getSubfieldCode(inputs[myindex].name);
49             if (isNaN(parseInt(subfieldcode)) && inputs[myindex].value != "" && subfieldcode!=elementsubfcode){
50                 mainstring.push(inputs[myindex].value);
51             }
52         }
53     }
54     mainstring = mainstring.join(' ');
55     newin=window.open("../authorities/auth_finder.pl?source="+source+"&authtypecode="+authtype+"&index="+tagsubfieldid+"&value_mainstr="+encodeURI(mainmainstring)+"&value_main="+encodeURI(mainstring), "_blank",'width=700,height=550,toolbar=false,scrollbars=yes');
56 }
57
58 function ExpandField(index) {
59     var original = document.getElementById(index); //original <div>
60     var divs = original.getElementsByTagName('div');
61     for(var i=0,divslen = divs.length ; i<divslen ; i++){   // foreach div
62         if(divs[i].getAttribute('id').match(/^subfield/)){  // if it s a subfield
63             if (!divs[i].style.display) {
64                 // first time => show all subfields
65                 divs[i].style.display = 'block';
66             } else if (divs[i].style.display == 'none') {
67                 // show
68                 divs[i].style.display = 'block';
69             } else {
70                 // hide
71                 divs[i].style.display = 'none';
72             }
73         }
74     }
75 }
76
77 var Select2Utils = {
78   removeSelect2: function(element) {
79     var selects = element.getElementsByTagName('select');
80     for (var i=0; i < selects.length; i++) {
81       $(selects[i]).select2('destroy');
82     }
83   },
84
85   initSelect2: function(element) {
86     var selects = element.getElementsByTagName('select');
87     for (var i=0; i < selects.length; i++) {
88       $(selects[i]).select2();
89     }
90   }
91 };
92
93 /**
94  * To clone a field
95  * @param hideMarc '0' for false, '1' for true
96  * @param advancedMARCEditor '0' for false, '1' for true
97  */
98 function CloneField(index, hideMarc, advancedMARCEditor) {
99     var original = document.getElementById(index); //original <div>
100     Select2Utils.removeSelect2(original);
101
102     var clone = original.cloneNode(true);
103     var new_key = CreateKey();
104     var new_id  = original.getAttribute('id')+new_key;
105
106     clone.setAttribute('id',new_id); // setting a new id for the parent div
107
108     var divs = clone.getElementsByTagName('div');
109
110     // if hide_marc, indicators are hidden fields
111     // setting a new name for the new indicator
112     for(var i=0; i < 2; i++) {
113         var indicator = clone.getElementsByTagName('input')[i];
114         indicator.setAttribute('name',indicator.getAttribute('name')+new_key);
115     }
116
117     // settings all subfields
118     for(var i=0,divslen = divs.length ; i<divslen ; i++){      // foreach div
119         if(divs[i].getAttribute("id").match(/^subfield/)){  // if it s a subfield
120
121             // set the attribute for the new 'div' subfields
122             divs[i].setAttribute('id',divs[i].getAttribute('id')+new_key);
123
124             var inputs   = divs[i].getElementsByTagName('input');
125             var id_input = "";
126
127             for( j = 0 ; j < inputs.length ; j++ ) {
128                 if(inputs[j].getAttribute("id") && inputs[j].getAttribute("id").match(/^tag_/) ){
129                     inputs[j].value = "";
130                 }
131             }
132             var textareas = divs[i].getElementsByTagName('textarea');
133             for( j = 0 ; j < textareas.length ; j++ ) {
134                 if(textareas[j].getAttribute("id") && textareas[j].getAttribute("id").match(/^tag_/) ){
135                     textareas[j].value = "";
136                 }
137             }
138
139             inputs[0].setAttribute('id',inputs[0].getAttribute('id')+new_key);
140             inputs[0].setAttribute('name',inputs[0].getAttribute('name')+new_key);
141             var id_input;
142             try {
143                 id_input = inputs[1].getAttribute('id')+new_key;
144                 inputs[1].setAttribute('id',id_input);
145                 inputs[1].setAttribute('name',inputs[1].getAttribute('name')+new_key);
146             } catch(e) {
147                 try{ // it s a select if it is not an input
148                     var selects = divs[i].getElementsByTagName('select');
149                     id_input = selects[0].getAttribute('id')+new_key;
150                     selects[0].setAttribute('id',id_input);
151                     selects[0].setAttribute('name',selects[0].getAttribute('name')+new_key);
152                 }catch(e2){ // it is a textarea if it s not a select or an input
153                     var textaeras = divs[i].getElementsByTagName('textarea');
154                     id_input = textaeras[0].getAttribute('id')+new_key;
155                     textaeras[0].setAttribute('id',id_input);
156                     textaeras[0].setAttribute('name',textaeras[0].getAttribute('name')+new_key);
157                 }
158             }
159             if( $(inputs[1]).hasClass('framework_plugin') ) {
160                 var olddiv= original.getElementsByTagName('div')[i];
161                 var oldcontrol= olddiv.getElementsByTagName('input')[1];
162                 AddEventHandlers( oldcontrol,inputs[1],id_input );
163             }
164
165             if (advancedMARCEditor == '0') {
166                 // when cloning a subfield, re set its label too.
167                 var labels = divs[i].getElementsByTagName('label');
168                 labels[0].setAttribute('for',id_input);
169             }
170
171             if(hideMarc == '0') {
172                 // updating javascript parameters on button up
173                 var imgs = divs[i].getElementsByTagName('img');
174                 imgs[0].setAttribute('onclick',"upSubfield(\'"+divs[i].getAttribute('id')+"\');");
175             }
176
177             // setting its '+' and '-' buttons
178             try {
179                 var anchors = divs[i].getElementsByTagName('a');
180                 for (var j = 0; j < anchors.length; j++) {
181                     if(anchors[j].getAttribute('class') == 'buttonPlus'){
182                         anchors[j].setAttribute('onclick',"CloneSubfield('" + divs[i].getAttribute('id') + "','" + advancedMARCEditor + "'); return false;");
183                     } else if (anchors[j].getAttribute('class') == 'buttonMinus') {
184                         anchors[j].setAttribute('onclick',"UnCloneField('" + divs[i].getAttribute('id') + "'); return false;");
185                     }
186                 }
187             }
188             catch(e){
189                 // do nothig if ButtonPlus & CloneButtonPlus don t exist.
190             }
191
192             // button ...
193             var spans=0;
194             try {
195                 spans = divs[i].getElementsByTagName('a');
196             } catch(e) {
197                 // no spans
198             }
199             if(spans){
200                 var buttonDot;
201                 if(!CloneButtonPlus){ // it s impossible to have  + ... (buttonDot AND buttonPlus)
202                     buttonDot = spans[0];
203                     if(buttonDot){
204                         // 2 possibilities :
205                         try{
206                             if( $(buttonDot).hasClass('framework_plugin') ) {
207                                 var olddiv= original.getElementsByTagName('div')[i];
208                                 var oldcontrol= olddiv.getElementsByTagName('a')[0];
209                                 AddEventHandlers(oldcontrol,buttonDot,id_input);
210                             } else {
211                                 if(buttonDotOnClick.match('Dopop')) {  // -2- It's a auth value
212                                     var re1 = /&index=.*',/;
213                                     var re2 = /,.*\)/;
214
215                                     buttonDotOnClick = buttonDotOnClick.replace(re1,"&index="+inputs[1].getAttribute('id')+"',");
216                                     buttonDotOnClick = buttonDotOnClick.replace(re2,",'"+inputs[1].getAttribute('id')+"')");
217
218                                     if(buttonDotOnClick){
219                                             buttonDot.setAttribute('onclick',buttonDotOnClick);
220                                     }
221                                 }
222                             }
223                             try {
224                                 // do not copy the script section.
225                                 var script = spans[0].getElementsByTagName('script')[0];
226                                 spans[0].removeChild(script);
227                             } catch(e) {
228                                 // do nothing if there is no script
229                             }
230                         }catch(e){}
231                     }
232                 }
233             }
234             if(hideMarc == '0') {
235                 var buttonUp = divs[i].getElementsByTagName('img')[0];
236                 buttonUp.setAttribute('onclick',"upSubfield('" + divs[i].getAttribute('id') + "')");
237             }
238
239         } else { // it's a indicator div
240             if(divs[i].getAttribute('id').match(/^div_indicator/)){
241
242                 // setting a new id for the indicator div
243                 divs[i].setAttribute('id',divs[i].getAttribute('id')+new_key);
244
245                 var inputs = divs[i].getElementsByTagName('input');
246                 inputs[0].setAttribute('id',inputs[0].getAttribute('id')+new_key);
247                 inputs[1].setAttribute('id',inputs[1].getAttribute('id')+new_key);
248
249                 var CloneButtonPlus;
250                 try {
251                     var anchors = divs[i].getElementsByTagName('a');
252                     for (var j = 0; j < anchors.length; j++) {
253                         if (anchors[j].getAttribute('class') == 'buttonPlus') {
254                             anchors[j].setAttribute('onclick',"CloneField('" + new_id + "','" + hideMarc + "','" + advancedMARCEditor + "'); return false;");
255                         } else if (anchors[j].getAttribute('class') == 'buttonMinus') {
256                             anchors[j].setAttribute('onclick',"UnCloneField('" + new_id + "'); return false;");
257                         } else if (anchors[j].getAttribute('class') == 'expandfield') {
258                             anchors[j].setAttribute('onclick',"ExpandField('" + new_id + "'); return false;");
259                         }
260                     }
261                 }
262                 catch(e){
263                     // do nothig CloneButtonPlus doesn't exist.
264                 }
265
266             }
267         }
268     }
269
270     // insert this line on the page
271     original.parentNode.insertBefore(clone,original.nextSibling);
272
273     Select2Utils.initSelect2(original);
274     Select2Utils.initSelect2(clone);
275 }
276
277
278 /**
279  * To clone a subfield
280  * @param index
281  * @param advancedMARCEditor '0' for false, '1' for true
282  */
283 function CloneSubfield(index, advancedMARCEditor){
284     var original = document.getElementById(index); //original <div>
285     Select2Utils.removeSelect2(original);
286     var clone = original.cloneNode(true);
287     var new_key = CreateKey();
288     // set the attribute for the new 'div' subfields
289     var inputs     = clone.getElementsByTagName('input');
290     var selects    = clone.getElementsByTagName('select');
291     var textareas  = clone.getElementsByTagName('textarea');
292     var linkid;
293
294     // input
295     var id_input = "";
296     for(var i=0,len=inputs.length; i<len ; i++ ){
297         id_input = inputs[i].getAttribute('id')+new_key;
298         inputs[i].setAttribute('id',id_input);
299         inputs[i].setAttribute('name',inputs[i].getAttribute('name')+new_key);
300         if(inputs[i].getAttribute("id") && inputs[i].getAttribute("id").match(/^tag_/) ){
301             inputs[i].value = "";
302         }
303         linkid = id_input;
304     }
305
306     // Plugin input
307     if( $(inputs[1]).hasClass('framework_plugin') ) {
308         var oldcontrol= original.getElementsByTagName('input')[1];
309         AddEventHandlers( oldcontrol, inputs[1], linkid );
310     }
311
312     // select
313     for(var i=0,len=selects.length; i<len ; i++ ){
314         id_input = selects[i].getAttribute('id')+new_key;
315         selects[i].setAttribute('id',selects[i].getAttribute('id')+new_key);
316         selects[i].setAttribute('name',selects[i].getAttribute('name')+new_key);
317     }
318
319     // textarea
320     for(var i=0,len=textareas.length; i<len ; i++ ){
321         id_input = textareas[i].getAttribute('id')+new_key;
322         textareas[i].setAttribute('id',textareas[i].getAttribute('id')+new_key);
323         textareas[i].setAttribute('name',textareas[i].getAttribute('name')+new_key);
324         if(textareas[i].getAttribute("id") && textareas[i].getAttribute("id").match(/^tag_/) ){
325             textareas[i].value = "";
326         }
327         linkid = id_input;
328     }
329
330     // Handle click event on buttonDot for plugin
331     var links  = clone.getElementsByTagName('a');
332     if( $(links[0]).hasClass('framework_plugin') ) {
333         var oldcontrol= original.getElementsByTagName('a')[0];
334         AddEventHandlers( oldcontrol, links[0], linkid );
335     }
336
337     if(advancedMARCEditor == '0') {
338         // when cloning a subfield, reset its label too.
339         var label = clone.getElementsByTagName('label')[0];
340         label.setAttribute('for',id_input);
341     }
342
343     // setting a new id for the parent div
344     var new_id  = original.getAttribute('id')+new_key;
345     clone.setAttribute('id',new_id);
346
347     try {
348         var buttonUp = clone.getElementsByTagName('img')[0];
349         buttonUp.setAttribute('onclick',"upSubfield('" + new_id + "')");
350         var anchors = clone.getElementsByTagName('a');
351         if(anchors.length){
352             for(var i = 0 ,lenanchors = anchors.length ; i < lenanchors ; i++){
353                 if(anchors[i].getAttribute('class') == 'buttonPlus'){
354                     anchors[i].setAttribute('onclick',"CloneSubfield('" + new_id + "','" + advancedMARCEditor + "'); return false;");
355                 } else if (anchors[i].getAttribute('class') == 'buttonMinus') {
356                     anchors[i].setAttribute('onclick',"UnCloneField('" + new_id + "'); return false;");
357                 }
358             }
359         }
360     }
361     catch(e){
362         // do nothig if ButtonPlus & CloneButtonPlus don't exist.
363     }
364     // insert this line on the page
365     original.parentNode.insertBefore(clone,original.nextSibling);
366
367     //Restablish select2 for the cloned elements.
368     Select2Utils.initSelect2(original);
369     Select2Utils.initSelect2(clone);
370
371     // delete data of cloned subfield
372     clone.querySelectorAll('input.input_marceditor').value = "";
373 }
374
375 function AddEventHandlers (oldcontrol, newcontrol, newinputid ) {
376 // This function is a helper for CloneField and CloneSubfield.
377 // It adds the event handlers from oldcontrol to newcontrol.
378 // newinputid is the id attribute of the cloned controlling input field
379 // Note: This code depends on the jQuery data for events; this structure
380 // is moved to _data as of jQuery 1.8.
381     var ev= $(oldcontrol).data('events');
382     if(typeof ev != 'undefined') {
383         $.each(ev, function(prop,val) {
384             $.each(val, function(prop2,val2) {
385                 $(newcontrol).off( val2.type );
386                 $(newcontrol).on( val2.type, {id: newinputid}, val2.handler );
387             });
388         });
389     }
390 }
391
392  /**
393  * This function removes or clears unwanted subfields
394  */
395 function UnCloneField(index) {
396     var original = document.getElementById(index);
397     var canUnclone = false;
398     if ($(original).hasClass("tag")) {
399         // unclone a field, check if there will remain one field
400         var fieldCode = getFieldCode(index);
401         // tag divs with id begining with original field code
402         var cloneFields = $('.tag[id^="tag_'+fieldCode+'"]');
403         if (cloneFields.length > 1) {
404             canUnclone = true;
405         }
406     } else {
407         // unclone a subfield, check if there will remain one subfield
408         var subfieldCode = getFieldAndSubfieldCode(index);
409         // subfield divs of same field with id begining with original field and subfield field code
410         var cloneSubfields = $(original).parent().children('.subfield_line[id^="subfield'+subfieldCode+'"]');
411         if (cloneSubfields.length > 1) {
412             canUnclone = true;
413         }
414     }
415     if (canUnclone) {
416         // remove clone
417         original.parentNode.removeChild(original);
418     } else {
419         // clear inputs, but don't delete
420         $(":input.input_marceditor", original).each(function(){
421             // thanks to http://www.learningjquery.com/2007/08/clearing-form-data for
422             // hint about clearing selects correctly
423             var type = this.type;
424             var tag = this.tagName.toLowerCase();
425             if (type == 'text' || type == 'password' || tag == 'textarea') {
426                 this.value = "";
427             } else if (type == 'checkbox' || type == 'radio') {
428                 this.checked = false;
429             } else if (tag == 'select') {
430                 this.selectedIndex = -1;
431                 // required for Select2 to be able to update its control
432                 $(this).trigger('change');
433             }
434         });
435         $(":input.indicator", original).val("");
436     }
437 }
438
439 /**
440  * This function create a random number
441  */
442 function CreateKey(){
443     return parseInt(Math.random() * 100000);
444 }
445
446 /**
447  * This function allows to move a subfield up by clickink on the 'up' button .
448  */
449 function upSubfield(index) {
450     try{
451         var line = document.getElementById(index); // get the line where the user has clicked.
452     } catch(e) {
453         return; // this line doesn't exist...
454     }
455     var tag = line.parentNode; // get the dad of this line. (should be "<div id='tag_...'>")
456
457     // getting all visible subfields for this tag
458     var subfields = tag.querySelectorAll("div.subfield_line:not( [style*='display:none;'] )");
459     var subfieldsLength = subfields.length;
460
461     if(subfieldsLength<=1) return; // nothing to do if there is just one subfield.
462
463     // among all subfields
464     for(var i=0;i<subfieldsLength;i++){
465         if(subfields[i].getAttribute('id') == index){ //looking for the subfield which is clicked :
466             if(i==0){ // if the clicked subfield is on the top
467                 tag.appendChild(subfields[0]);
468                 return;
469             } else {
470                 var lineAbove = subfields[i-1];
471                 tag.insertBefore(line,lineAbove);
472                 return;
473             }
474         }
475     }
476 }
477
478 // FIXME :: is it used ?
479 function unHideSubfield(index,labelindex) {
480     subfield = document.getElementById(index);
481     subfield.style.display = 'block';
482     label = document.getElementById(labelindex);
483     label.style.display='none';
484 }
485
486 /* Functions developed for additem.tt */
487
488 /**
489  * To clone a subfield.<br>
490  * @param original subfield div to clone
491  */
492 function CloneItemSubfield(original){
493     Select2Utils.removeSelect2(original);
494     var clone = original.cloneNode(true);
495     var new_key = CreateKey();
496
497     // set the attribute for the new 'div' subfields
498     var inputs     = clone.getElementsByTagName('input');
499     var selects    = clone.getElementsByTagName('select');
500     var textareas  = clone.getElementsByTagName('textarea');
501
502     // input (except hidden type)
503     var id_input = "";
504     for(var i=0,len=inputs.length; i<len ; i++ ){
505         if (inputs[i].getAttribute('type') != 'hidden') {
506             id_input = inputs[i].getAttribute('id')+new_key;
507             inputs[i].setAttribute('id',id_input);
508         }
509     }
510
511     // select
512     for(var i=0,len=selects.length; i<len ; i++ ){
513         id_input = selects[i].getAttribute('id')+new_key;
514         selects[i].setAttribute('id',selects[i].getAttribute('id')+new_key);
515     }
516
517     // textarea
518     for(var i=0,len=textareas.length; i<len ; i++ ){
519         id_input = textareas[i].getAttribute('id')+new_key;
520         textareas[i].setAttribute('id',textareas[i].getAttribute('id')+new_key);
521     }
522
523     // when cloning a subfield, reset its label too.
524     var label = clone.getElementsByTagName('label')[0];
525     label.setAttribute('for',id_input);
526
527     // setting a new if for the parent div
528     var new_id = original.getAttribute('id')+new_key;
529     clone.setAttribute('id',new_id);
530
531     // insert this line on the page
532     original.parentNode.insertBefore(clone,original.nextSibling);
533     Select2Utils.initSelect2(original);
534     Select2Utils.initSelect2(clone);
535 }
536
537 /**
538  * Check mandatory subfields of a cataloging form and adds <code>missing</code> class to those who are empty.<br>
539  * @param p the parent object of subfields to check
540  * @return the number of empty mandatory subfields
541  */
542 function CheckMandatorySubfields(p){
543     var total = 0;
544     $(p).find(".subfield_line input[name='mandatory'][value='1']").each(function(i){
545         var editor = $(this).siblings("[name='field_value']");
546         if (!editor.val()) {
547             editor.addClass("missing");
548             total++;
549         }
550     });
551     return total;
552 }
553
554  $(document).ready(function() {
555     $("input.input_marceditor, input.indicator").addClass('noEnterSubmit');
556 });