/*
* Create a navigator 
* Copyright by Trung Huynh
* Contact trunghlt@gmail.com for legal license 
*/

navArr = [];
slidingStatusArr = [];
nNav = 0;

/********************************************************************
* Create a navigator using jQuery
* @param parentId:      id of the parent which contains childrens (no "#" please)
* @param prevButtonId:  id of the button for previous navigating
* @param nextButton:    id of the button for next navigating
*********************************************************************/
function make_navigator(parentId, prevButtonId, nextButtonId, dir, async) {
    var navId = nNav;    
    nNav++;
    navArr[navId] = 0;
    setSlidingStatus(navId, false);
    jQuery("#"+parentId+">*:not(:first)").hide();
    nChild = jQuery("#"+parentId+">*").length;

    jQuery("#"+nextButtonId).bind("click", {parentId: parentId, navId: navId, nChild: nChild, dir: dir, async: async}, function(e) {
        if (e.data.async || !slidingStatusArr[e.data.navId]) {
            if (navArr[e.data.navId] < nChild - 1) {
                prev = jQuery("#"+parentId+">*:eq("+navArr[e.data.navId]+")");

                setSlidingStatus(e.data.navId, true);

                if (dir == "left") {
                    prev.animate({marginLeft: -2*prev.width()-prev.outerWidth()});    
                }
                else if (dir == "up") {
                    prev.animate({marginTop: -prev.height()});
                }

                navArr[e.data.navId]++;
                next = jQuery("#"+parentId+">*:eq("+navArr[e.data.navId]+")");
                
                if (dir == "left") {
                    next.css("marginLeft", next.outerWidth())
                    next.show();   
                    next.animate({marginLeft: 0}, function() { setSlidingStatus(e.data.navId, false);} );         
                }
                else if (dir == "up") {
                    next.css("marginTop", next.height() + next.outerHeight())
                    next.show();   
                    next.animate({marginTop: 0}, function() { setSlidingStatus(e.data.navId, false);} );
                }
            }
        }
    });

    jQuery("#"+prevButtonId).bind("click", {parentId: parentId, navId: navId, nChild: nChild, dir: dir}, function(e) {
        if (e.data.async || !slidingStatusArr[e.data.navId]) {
            if (navArr[e.data.navId] > 0) {
                prev = jQuery("#"+parentId+">*:eq("+navArr[e.data.navId]+")");

                setSlidingStatus(e.data.navId, true);
                
                if (dir == "left") {
                    prev.animate({marginLeft: prev.outerWidth()});
                } 
                else if (dir == "up") {
                    prev.animate({marginTop: prev.height() + prev.outerHeight()});                
                }

                navArr[e.data.navId]--;
                next = jQuery("#"+parentId+">*:eq("+navArr[e.data.navId]+")");

                if (dir == "left") {
                    next.css("marginLeft", -next.width())
                    next.show();   
                    next.animate({marginLeft: 0}, function() { setSlidingStatus(e.data.navId, false);});  
                }
                else if (dir == "up") {
                    next.css("marginTop", -next.outerHeight() - next.height());
                    next.show();
                    next.animate({marginTop: 0}, function() { setSlidingStatus(e.data.navId, false);});
                }
            }
        }
    });
}

function setSlidingStatus(navId, val) {
    slidingStatusArr[navId] = val;
}