include/javascript/yui/ygDDList.js

   1
   2 /* Copyright (c) 2006 Yahoo! Inc. All rights reserved. */
   3
   4 /**
   5  * @class a YAHOO.util.DDProxy implementation. During the drag over event, the
   6  * dragged element is inserted before the dragged-over element.
   7  *
   8  * @extends YAHOO.util.DDProxy
   9  * @constructor
  10  * @param {String} id the id of the linked element
  11  * @param {String} sGroup the group of related DragDrop objects
  12  */
  13 function ygDDList(id, sGroup) {
  14
  15         if (id) {
  16                 this.init(id, sGroup);
  17                 this.initFrame();
  18                 //this.logger = new ygLogger("ygDDList");
  19         }
  20
  21         var s = this.getDragEl().style;
  22         s.borderColor = "transparent";
  23         s.backgroundColor = "#f6f5e5";
  24         s.opacity = 0.76;
  25         s.filter = "alpha(opacity=76)";
  26 }
  27
  28 ygDDList.prototype = new YAHOO.util.DDProxy();
  29
  30 ygDDList.prototype.borderDiv = null;
  31 ygDDList.prototype.originalDisplayProperties = Array();
  32
  33 ygDDList.prototype.startDrag = function(x, y) {
  34         //this.logger.debug(this.id + " startDrag");
  35
  36         var dragEl = this.getDragEl();
  37         var clickEl = this.getEl();
  38
  39         dragEl.innerHTML = clickEl.innerHTML;
  40         dragElObjects = dragEl.getElementsByTagName('object');
  41
  42
  43         dragEl.className = clickEl.className;
  44         dragEl.style.color = clickEl.style.color;
  45         dragEl.style.border = "1px solid #aaa";
  46
  47         // save the style of the object
  48         clickElRegion = YAHOO.util.Dom.getRegion(clickEl);
  49
  50         this.borderDiv = document.createElement('div'); // create a div to display border
  51         this.borderDiv.style.height = (clickElRegion.bottom - clickElRegion.top) + 'px';
  52         this.borderDiv.style.border = '2px dashed #cccccc';
  53
  54         for(i in clickEl.childNodes) { // hide contents of the target elements contents
  55                 if(typeof clickEl.childNodes[i].style != 'undefined') {
  56                         this.originalDisplayProperties[i] = clickEl.childNodes[i].style.display;
  57                         clickEl.childNodes[i].style.display = 'none';
  58                 }
  59
  60         }
  61         clickEl.appendChild(this.borderDiv);
  62 };
  63
  64 ygDDList.prototype.endDrag = function(e) {
  65         // disable moving the linked element
  66         var clickEl = this.getEl();
  67
  68         clickEl.removeChild(this.borderDiv); // remove border div
  69
  70         for(i in clickEl.childNodes) { // show target elements contents
  71                 if(typeof clickEl.childNodes[i].style != 'undefined') {
  72                         clickEl.childNodes[i].style.display = this.originalDisplayProperties[i];
  73                 }
  74         }
  75
  76         if(this.clickHeight)
  77             clickEl.style.height = this.clickHeight;
  78         else
  79                 clickEl.style.height = '';
  80
  81         if(this.clickBorder)
  82             clickEl.style.border = this.clickBorder;
  83         else
  84                 clickEl.style.border = '';
  85
  86         dragEl = this.getDragEl();
  87         dragEl.innerHTML = '';
  88
  89         this.afterEndDrag(e);
  90 };
  91
  92 ygDDList.prototype.afterEndDrag = function(e) {
  93
  94 }
  95
  96 ygDDList.prototype.onDrag = function(e, id) {
  97
  98 };
  99
 100 ygDDList.prototype.onDragOver = function(e, id) {
 101         // this.logger.debug(this.id.toString() + " onDragOver " + id);
 102         var el;
 103
 104     if ("string" == typeof id) {
 105         el = YAHOO.util.DDM.getElement(id);
 106     } else {
 107         el = YAHOO.util.DDM.getBestMatch(id).getEl();
 108     }
 109
 110         dragEl = this.getDragEl();
 111         elRegion = YAHOO.util.Dom.getRegion(el);
 112
 113 //    this.logger.debug('id: ' + el.id);
 114 //    this.logger.debug('size: ' + (elRegion.bottom - elRegion.top));
 115 //    this.logger.debug('getPosY: ' + YAHOO.util.DDM.getPosY(el));
 116         var mid = YAHOO.util.DDM.getPosY(el) + (Math.floor((elRegion.bottom - elRegion.top) / 2));
 117 //    this.logger.debug('mid: ' + mid);
 118
 119 //    this.logger.debug(YAHOO.util.DDM.getPosY(dragEl) + " <  " + mid);
 120 //    this.logger.debug("Y: " + YAHOO.util.Event.getPageY(e));
 121
 122         if (YAHOO.util.DDM.getPosY(dragEl) < mid ) { // insert on top triggering item
 123                 var el2 = this.getEl();
 124                 var p = el.parentNode;
 125                 p.insertBefore(el2, el);
 126         }
 127         if (YAHOO.util.DDM.getPosY(dragEl) >= mid ) { // insert below triggered item
 128                 var el2 = this.getEl();
 129                 var p = el.parentNode;
 130                 p.insertBefore(el2, el.nextSibling);
 131         }
 132 };
 133
 134 ygDDList.prototype.onDragEnter = function(e, id) {
 135         // this.logger.debug(this.id.toString() + " onDragEnter " + id);
 136         // this.getDragEl().style.border = "1px solid #449629";
 137 };
 138
 139 ygDDList.prototype.onDragOut = function(e, id) {
 140     // I need to know when we are over nothing
 141         // this.getDragEl().style.border = "1px solid #964428";
 142 }
 143
 144 /////////////////////////////////////////////////////////////////////////////
 145
 146 function ygDDListBoundary(id, sGroup) {
 147         if (id) {
 148                 this.init(id, sGroup);
 149                 //this.logger = new ygLogger("ygDDListBoundary");
 150                 this.isBoundary = true;
 151         }
 152 }
 153
 154 ygDDListBoundary.prototype = new YAHOO.util.DDTarget();