YAHOO.namespace("SaucyClient");  

(function() {

var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var DDM = YAHOO.util.DragDropMgr;

YAHOO.SaucyClient.DDApp = {
    init: function() {
    

	        var targets = YAHOO.util.Dom.getElementsByClassName('list-ul');
            for(i = 0; i < targets.length; i++)
            {
                new YAHOO.util.DDTarget(targets[i]);
                new YAHOO.SaucyClient.DDList(targets[i]);
            }

	        var ddItems = YAHOO.util.Dom.getElementsByClassName('list-li');
            for(i = 0; i < ddItems.length; i++)
            {
                new YAHOO.SaucyClient.DDList(ddItems[i]);
            }
            
    }
  
};

YAHOO.SaucyClient.DDList = function(id, sGroup, config) {

    YAHOO.SaucyClient.DDList.superclass.constructor.call(this, id, sGroup, config);

    var el = this.getDragEl();
    Dom.setStyle(el, "opacity", 0.67); // The proxy is slightly transparent

    this.goingUp = false;
    this.lastY = 0;
};

YAHOO.extend(YAHOO.SaucyClient.DDList, YAHOO.util.DDProxy, {

    startDrag: function(x, y) {

        var dragEl = this.getDragEl();
        var clickEl = this.getEl();
        Dom.setStyle(clickEl, "visibility", "hidden");

        dragEl.innerHTML = clickEl.innerHTML;
        dragEl.className = "rearrange-meal-li";
        Dom.setStyle(dragEl, "text-align", "left");
        Dom.setStyle(dragEl, "border", "2px dashed gray");
        
        Dom.setStyle(dragEl, "color", "#996");
    },

    endDrag: function(e) {

        var srcEl = this.getEl();
        var proxy = this.getDragEl();

        Dom.setStyle(proxy, "visibility", "");
        var a = new YAHOO.util.Motion( 
            proxy, { 
                points: { 
                    to: Dom.getXY(srcEl)
                }
            }, 
            0.2, 
            YAHOO.util.Easing.easeOut 
        )
        var proxyid = proxy.id;
        var thisid = this.id;

        a.onComplete.subscribe(function() {
                Dom.setStyle(proxyid, "visibility", "hidden");
                Dom.setStyle(thisid, "visibility", "");
            });
        a.animate();
    },

    onDragDrop: function(e, id) {

        if (DDM.interactionInfo.drop.length === 1) {

            var pt = DDM.interactionInfo.point; 

            var region = DDM.interactionInfo.sourceRegion; 

            if (!region.intersect(pt)) {
                var destEl = Dom.get(id);
                var destDD = DDM.getDDById(id);
                destEl.appendChild(this.getEl());
                destDD.isEmpty = false;
                DDM.refreshCache();
            }

        }
    },

    onDrag: function(e) {

        var y = Event.getPageY(e);

        if (y < this.lastY) {
            this.goingUp = true;
        } else if (y > this.lastY) {
            this.goingUp = false;
        }

        this.lastY = y;
    },
    
    onDragOver: function(e, id) {
    
        var srcEl = this.getEl();
        var destEl = Dom.get(id);

        if (destEl.nodeName.toLowerCase() == "li") {
            var orig_p = srcEl.parentNode;
            var p = destEl.parentNode;
            
            if (this.goingUp) {
                p.insertBefore(srcEl, destEl); // insert above
            } else {
                p.insertBefore(srcEl, destEl.nextSibling); // insert below
            }

            DDM.refreshCache();
        }
    }
});

Event.onDOMReady(YAHOO.SaucyClient.DDApp.init, YAHOO.SaucyClient.DDApp, true);

})();