koha-tmpl/intranet-tmpl/prog/js/basketgroup.js

   1 // Functions for drag-and-drop functionality
   2
   3 var Dom = YAHOO.util.Dom;
   4 var Event = YAHOO.util.Event;
   5 var DDM = YAHOO.util.DragDropMgr;
   6
   7 DDApp = {
   8     init: function() {
   9     var uls = document.getElementsByTagName('ul');
  10     var i,j;
  11     var ddtarget;
  12     for (i=0; i<uls.length;i=i+1) {
  13         if (uls[i].className == "draglist" || uls[i].className == "draglist_alt") {
  14             ddtarget = YAHOO.util.DragDropMgr.getDDById(uls[i].id);
  15 // The yahoo drag and drop is written (broken or not) in such a way, that if an element is subscribed as a target multiple times,
  16 // it has to be unlinked multiple times, so we need to test whether it is allready a target, otherwise we'll have a problem when closing the group
  17             if( ! ddtarget ) {
  18                 new YAHOO.util.DDTarget(uls[i].id);
  19             }
  20             var children = uls[i].getElementsByTagName('li');
  21             for( j=0; j<children.length; j=j+1) {
  22 // The yahoo drag and drop is (broken or not) in such a way, that if an element is subscribed as a target multiple times,
  23 // it has to be unlinked multiple times, so we need to test whether it is allready a target, otherwise we'll have a problem when closing the group
  24                 ddtarget = YAHOO.util.DragDropMgr.getDDById(children[j].id);
  25                 if( ! ddtarget ) {
  26                     new DDList(children[j].id);
  27                 }
  28             }
  29         }
  30     }
  31     }
  32 };
  33
  34
  35 // drag and drop implementation
  36
  37 DDList = function(id, sGroup, config) {
  38
  39     DDList.superclass.constructor.call(this, id, sGroup, config);
  40
  41     this.logger = this.logger || YAHOO;
  42     var el = this.getDragEl();
  43     Dom.setStyle(el, "opacity", 0.67); // The proxy is slightly transparent
  44
  45     this.goingUp = false;
  46     this.lastY = 0;
  47 };
  48
  49 YAHOO.extend(DDList, YAHOO.util.DDProxy, {
  50
  51     startDrag: function(x, y) {
  52         this.logger.log(this.id + " startDrag");
  53
  54         // make the proxy look like the source element
  55         var dragEl = this.getDragEl();
  56         var clickEl = this.getEl();
  57         Dom.setStyle(clickEl, "visibility", "hidden");
  58
  59         dragEl.innerHTML = clickEl.innerHTML;
  60
  61         Dom.setStyle(dragEl, "color", Dom.getStyle(clickEl, "color"));
  62         Dom.setStyle(dragEl, "backgroundColor", Dom.getStyle(clickEl, "backgroundColor"));
  63         Dom.setStyle(dragEl, "border", "2px solid gray");
  64     },
  65
  66     endDrag: function(e) {
  67
  68         var srcEl = this.getEl();
  69         var proxy = this.getDragEl();
  70
  71         // Show the proxy element and animate it to the src element's location
  72         Dom.setStyle(proxy, "visibility", "");
  73         var a = new YAHOO.util.Motion(
  74             proxy, {
  75                 points: {
  76                     to: Dom.getXY(srcEl)
  77                 }
  78             },
  79             0.2,
  80             YAHOO.util.Easing.easeOut
  81         )
  82         var proxyid = proxy.id;
  83         var thisid = this.id;
  84
  85         // Hide the proxy and show the source element when finished with the animation
  86         a.onComplete.subscribe(function() {
  87                 Dom.setStyle(proxyid, "visibility", "hidden");
  88                 Dom.setStyle(thisid, "visibility", "");
  89             });
  90         a.animate();
  91 // if we are in basketgrouping page, when finished moving, edit the basket's info to reflect new status
  92         if(typeof(basketgroups) != 'undefined') {
  93             a.onComplete.subscribe(function() {
  94                 var reg = new RegExp("[-]+", "g");
  95 // add a changed input to each moved basket, so we know which baskets to modify,
  96 // and so we don't need to modify each and every basket and basketgroup each time the page is loaded
  97 // FIXME: we shouldn't use getElementsByTagName, it's not explicit enough :-(
  98                 srcEl.getElementsByTagName('input')[1].value = "1";
  99                 if ( srcEl.parentNode.parentNode.className == "workarea" ) {
 100                     var dstbgroupid = srcEl.parentNode.parentNode.getElementsByTagName('input')[srcEl.parentNode.parentNode.getElementsByTagName('input').length-2].name.split(reg)[1];
 101                     srcEl.className="grouped";
 102                     srcEl.getElementsByTagName('input')[0].value = dstbgroupid;
 103 //FIXME: again, we shouldn't be using getElementsByTagName!!
 104                     srcEl.parentNode.parentNode.getElementsByTagName('input')[srcEl.parentNode.parentNode.getElementsByTagName('input').length-1].value = 1;
 105                 }
 106                 else if ( srcEl.parentNode.parentNode.className == "workarea_alt" ){
 107                         srcEl.className="ungrouped";
 108                         srcEl.getElementsByTagName('input')[0].value = "0";
 109                 }
 110             });
 111         }
 112     },
 113
 114     onDragDrop: function(e, id) {
 115
 116         // If there is one drop interaction, the li was dropped either on the list,
 117         // or it was dropped on the current location of the source element.
 118         if (DDM.interactionInfo.drop.length === 1) {
 119
 120             // The position of the cursor at the time of the drop (YAHOO.util.Point)
 121             var pt = DDM.interactionInfo.point;
 122
 123             // The region occupied by the source element at the time of the drop
 124             var region = DDM.interactionInfo.sourceRegion;
 125
 126             // Check to see if we are over the source element's location.  We will
 127             // append to the bottom of the list once we are sure it was a drop in
 128             // the negative space (the area of the list without any list items)
 129             if (!region.intersect(pt)) {
 130                 var destEl = Dom.get(id);
 131                 var destDD = DDM.getDDById(id);
 132                 destEl.appendChild(this.getEl());
 133                 destDD.isEmpty = false;
 134                 DDM.refreshCache();
 135             }
 136         }
 137     },
 138
 139     onDrag: function(e) {
 140
 141         // Keep track of the direction of the drag for use during onDragOver
 142         var y = Event.getPageY(e);
 143
 144         if (y < this.lastY) {
 145             this.goingUp = true;
 146         } else if (y > this.lastY) {
 147             this.goingUp = false;
 148         }
 149         this.lastY = y;
 150     },
 151
 152     onDragOver: function(e, id) {
 153
 154         var srcEl = this.getEl();
 155         var destEl = Dom.get(id);
 156
 157         // We are only concerned with list items, we ignore the dragover
 158         // notifications for the list.
 159         if (destEl.nodeName.toLowerCase() == "li") {
 160             var orig_p = srcEl.parentNode;
 161             var p = destEl.parentNode;
 162
 163             if (this.goingUp) {
 164                 p.insertBefore(srcEl, destEl); // insert above
 165             } else {
 166                 p.insertBefore(srcEl, destEl.nextSibling); // insert below
 167             }
 168
 169             DDM.refreshCache();
 170         }
 171     }
 172 });
 173
 174 //this traps enters in input fields
 175 function enterpressed(event){
 176     var keycode;
 177     if (window.event) keycode = window.event.keyCode;
 178     else if (event) keycode = event.which;
 179     else return false;
 180
 181     if (keycode == 13)
 182     {
 183         return true;
 184     }
 185     else return false;
 186 }
 187
 188
 189 //Closes a basketgroup
 190 function closebasketgroup(bgid) {
 191     var answer=confirm(MSG_CONFIRM_CLOSE_BASKETGROUP);
 192     if(! answer){
 193         return;
 194     }
 195     ulid = 'bg-'+bgid;
 196     var i = 0;
 197     tagname='basketgroup-'+bgid+'-closed';
 198     var ddtarget;
 199     var closeinput = document.getElementById(tagname);
 200     closeinput.value = 1;
 201     var changed = document.getElementById("basketgroup-"+bgid+"-changed");
 202     changed.value=1;
 203
 204     var div = document.getElementById(tagname).parentNode;
 205     var stufftoremove = div.getElementsByTagName('p')[0];
 206     var ul = document.getElementById(ulid);
 207     var lis = ul.getElementsByTagName('li');
 208     if (lis.length == 0 ) {
 209         alert(MSG_CLOSE_EMPTY_BASKET);
 210         return;
 211     }
 212     var cantprint = document.createElement('p');
 213
 214     div.className = "closed";
 215     ul.className="closed";
 216
 217     for(i=0; i<lis.length; ++i) {
 218         ddtarget = YAHOO.util.DragDropMgr.getDDById(lis[i].id);
 219         ddtarget.unreg();
 220     }
 221     ddtarget = YAHOO.util.DragDropMgr.getDDById(ul.id);
 222     ddtarget.unreg();
 223     div.removeChild(stufftoremove);
 224 // the print button is disabled because the page's content might (or is probably) not in sync with what the database contains
 225     cantprint.innerHTML = MSG_SAVE_BEFORE_PRINTING;
 226     cantprint.id = 'cantprint-' + bgid;
 227     var unclosegroup = document.createElement('a');
 228     unclosegroup.href='javascript:unclosegroup('+bgid+');';
 229     unclosegroup.innerHTML = MSG_REOPEN_BASKETGROUP;
 230     unclosegroup.id = 'unclose-' + bgid;
 231
 232     div.appendChild(cantprint);
 233     div.appendChild(unclosegroup);
 234 }
 235
 236 function closeandprint(bg){
 237     if(document.location = '/cgi-bin/koha/acqui/basketgroup.pl?op=closeandprint&amp;basketgroupid=' + bg ){
 238         setTimeout("window.location.reload();",3000);
 239     }else{
 240         alert(MSG_FILE_DOWNLOAD_ERROR);
 241     }
 242 }
 243
 244 //function that lets the user unclose a basketgroup
 245 //as long as they haven't submitted the changes to the page.
 246 function unclosegroup(bgid){
 247     var div = document.getElementById('basketgroup-'+bgid+'-closed').parentNode;
 248     var divtodel = document.getElementById('unclose-' + bgid);
 249     if (divtodel){
 250         div.removeChild(divtodel);
 251     }
 252     divtodel = document.getElementById('unclose-' + bgid);
 253     if (divtodel){
 254         div.removeChild(divtodel);
 255     }
 256     var closeinput = document.getElementById('basketgroup-'+bgid+'-closed');
 257     var ul = document.getElementById('bg-'+bgid);
 258
 259     var newclose = document.createElement('a');
 260     var newrename = document.createElement('a');
 261     var newp = document.createElement('p');
 262
 263     newclose.innerHTML="close";
 264     newclose.href="javascript: closebasketgroup('"+bgid+"', 'bg-"+bgid+"');";
 265
 266     newrename.href="javascript:" + "renameinit("+bgid+");";
 267     newrename.innerHTML="rename";
 268
 269     var todel = div.getElementsByTagName('p')[0];
 270     div.removeChild(todel);
 271
 272     var changed = document.getElementById("basketgroup-"+bgid+"-changed");
 273     changed.value=1;
 274
 275     newp.innerHTML=" [ ";
 276     newp.appendChild(newrename);
 277     newp.innerHTML+=" / ";
 278     newp.appendChild(newclose);
 279     newp.innerHTML+=" ]";
 280
 281     div.insertBefore(newp, ul);
 282     closeinput.value="0";
 283     div.className = "workarea";
 284     ul.className="draglist";
 285
 286 //rescan draglists, we have a new target (again :-)
 287     YAHOO.util.Event.onDOMReady(DDApp.init, DDApp, true);
 288 }
 289
 290
 291
 292 function renameinit(bgid){
 293     var ul = document.getElementById('bg-'+bgid);
 294     var div = ul.parentNode;
 295     var nameelm = div.getElementsByTagName('h3')[0];
 296     var p = div.getElementsByTagName('p')[0];
 297
 298
 299     var nameinput = document.createElement("input");
 300     nameinput.type = "text";
 301     nameinput.id="rename-"+bgid;
 302     nameinput.value = nameelm.innerHTML;
 303     nameinput.onkeypress = function(e){rename(e, bgid, document.getElementById('rename-'+bgid).value); };
 304 //    nameinput.setAttribute('onkeypress', 'rename(event, bgid, document.getElementById(rename-'+bgid+').value);');
 305
 306     div.removeChild(nameelm);
 307     div.insertBefore(nameinput, p);
 308 }
 309
 310 function rename(event, bgid, name){
 311     if (!enterpressed(event)){
 312         return false;
 313     }
 314     var ul = document.getElementById('bg-'+bgid);
 315     var div = ul.parentNode;
 316     var p = div.getElementsByTagName('p')[0];
 317     var nameinput = document.getElementById("rename-"+bgid);
 318     var changedinput = document.getElementById("basketgroup-"+bgid+"-changed");
 319     var newh3 = document.createElement("h3");
 320     var hiddenname = document.getElementById("basketgroup-"+bgid+"-name");
 321
 322     div.removeChild(nameinput);
 323
 324     newh3.innerHTML=name;
 325     hiddenname.value=name;
 326     changedinput.value = 1;
 327     div.insertBefore(newh3, p);
 328 }