var myTempArgs = {};
var myInterval = null; //for interval
var hideDelayTimer = null; //for hover delay settimeout
var interValTimer = 300;

function PG1_NAG() {
    var unitHeight = $("ul.product_sub_nav li").outerHeight(); //li height	
    var outlineHeight = $("div.nb_sunmenu").outerHeight();
    var menubgHeight = 185; //menu bg height-padding bottem	
    var delayTimer = 100; //for hover delay 
    var moverLeft = 175;

    //date save
    myTempArgs.unitHeight = unitHeight;
    myTempArgs.menubgHeight = 185;

    //reset menu top
    $("ul.product_sub_nav").each(function() {

        var childrenNu = $(this).children("li").size();
        var totalHeight = $(this).outerHeight();
        $(this).data('totalHeight', totalHeight);
        $(this).data('childrenNu', childrenNu);

        //get menu level
        var allclass = $(this).attr('class');
        var menuLayer = allclass.match(new RegExp('li_item_.*', 'g')).toString().match(new RegExp('[0-9][0-9]?.*', 'gi')).toString().split("_");
        $(this).data('whereMenu', menuLayer);
        menuLevel = menuLayer.length;
        //add menuLevel class
        $(this).addClass('menu_' + menuLevel);
        $(this).css({ 'left': (menuLevel - 1) * moverLeft }).data('originalLeft', $(this).css('left'));
        $(this).hide();

        var firsShowMenu = $(this).filter('.li_item_1');
        firsShowMenu.show().addClass('showing');

        //set all ul count 
        $(this).data('countMenuNu', 0);
        showMenuButton(firsShowMenu);

        //let li remeber indexNu	
        for (i = 0; i <= childrenNu - 1; i++) {
            $(this).children("li").eq(i).data('indexNu', i);
        }

    });

    $("ul.product_sub_nav li").each(function() {

        var indexNu = $(this).data('indexNu') + 1;
        var whichParent = $(this).parents('ul.product_sub_nav:first');
        var parentClass = whichParent.attr('class').match(new RegExp('li_item(_[0-9][0-9]*)+', 'g')).toString();
        var whichChild = whichParent.nextAll('ul.' + parentClass + '_' + indexNu + ':first');

        if (whichChild.length != 0) {
            $(this).addClass('hasnext')
        }
        $(this).data('whoIsNext', whichChild);
    });

    $("ul.product_sub_nav li").click(function() {
        var whichChild = $(this).data('whoIsNext');
        var whichParent = $(this).parents('ul.product_sub_nav:first');
        //next level hide all
        if (whichChild.size() != 0) {
            var nextmenu = whichChild.data('whereMenu').length;
            $(this).parents('.allin:first').children('.menu_' + nextmenu).hide();

            //only show what we need	
            whichChild.show();
            whichParent.removeClass('showing');
            whichChild.addClass('showing');

            var goleft = ((whichChild.data('whereMenu')).length - 1) * moverLeft * -1;
            $(this).parents('div.allin:first').animate({ left: goleft }, { queue: false, duration: 500, complete: hasbackbutton(whichChild, $(this).text()) });
            showMenuButton(whichChild);
            whichChild.data('countMenuNu', 0);
            whichChild.css({ 'top': 0 });
        }
    });
    
    $('.backbutton a').click(function() {
        var theLink = $(this);
        var whichButton = theLink.parent('.backbutton');
        var whichSlide = theLink.parent('.backbutton').nextAll('div.limit_view:first').find('.allin');

        var whichShow = whichSlide.find('ul.showing:first');
        var whereMenu = whichShow.data('whereMenu');
        var showingLevel = whereMenu.length;

        var showingClass = 'li_item_' + whereMenu.join('_');

        var parentClass = 'li_item_' + whereMenu.slice(0, showingLevel - 1).join('_');

        //var nextShowText=''

        if (showingLevel > 2) {

            var nextNextShow = whichSlide.find('.li_item_' + whereMenu.slice(0, showingLevel - 2).join('_'));
            var nextShowText = nextNextShow.find('li a').eq(whereMenu[showingLevel - 2] - 1).text();

        }

        var goleft = (showingLevel - 2) * moverLeft * -1;
        whichSlide.animate({ left: goleft }, { queue: false, duration: 500, complete: function() {
            var nextShow = whichSlide.find('.' + parentClass)
            theLink.text(nextShowText);
            nextShow.addClass('showing');
            whichShow.removeClass('showing');
            if ((showingLevel - 2) <= 0) {
                whichButton.addClass('hide');
            }
            showMenuButton(nextShow);
        }
        }
			);

        return false;

    })

    $('div.nb_sunmenu').hover(function() {

        $(this).parents("li:first").find("a:first").addClass("menu_a_hover")
		.end().find("span").addClass("menu_span_hover");


    }, function(evt) {

        $(this).parents("li:first").find("a:first").removeClass("menu_a_hover")
		.end().find("span").removeClass("menu_span_hover");

        if (evt.relatedTarget == $(this).parent('li').find('span').get(0) || evt.toElement == $(this).parent('li').find('span').get(0)) {

        } else {

            resetall($(this));
        }
    }
	)

    $("div#product_nav ul li a span").mouseout(function(evt) {
        var sendTarget = $(this).parents('li:first').find('div.nb_sunmenu:first');

        if (evt.relatedTarget == sendTarget.find('img.nb_menu_bg').get(0) || evt.toElement == sendTarget.find('img.nb_menu_bg').get(0)) {

        } else {
            resetall(sendTarget);
        }

    });

    //上下滑動
    $('div.goup').add('div.godown').mouseover(function() {
        myTempArgs.whichBackButton = $(this);

        if (hideDelayTimer) {
            clearTimeout(hideDelayTimer);
        }
        if (myInterval) {
            clearInterval(myInterval)
        }

        hideDelayTimer = setTimeout('delaytest()', delayTimer)
    }).mouseout(function() {
        if (hideDelayTimer) {
            clearTimeout(hideDelayTimer);
        }
        if (myInterval) {
            clearInterval(myInterval)
        }
    });
}

function delaytest() {
    myInterval = setInterval('intervalway()', interValTimer);
}

function intervalway(){
	
	var uporDown='';	
	var functionTemp=myTempArgs.whichBackButton.parent('div.nb_sunmenu').find('div.allin').children('ul.showing:first');
	var functionTempLiNu=''

	if(myTempArgs.whichBackButton.hasClass('goup') ){
		functionTempLiNu=functionTemp.data('countMenuNu')*-1+7-(8-functionTemp.data("overHeightNu"));
		
		uporDown='+=';
	}else if(myTempArgs.whichBackButton.hasClass('godown')){
		
		functionTempLiNu=functionTemp.data('countMenuNu')*-1+8-(8-functionTemp.data("overHeightNu"));
		
		uporDown='-=';
	}

	
	var functionTempLi=functionTemp.children('li:eq('+functionTempLiNu+')');
	var functionTempLiHeight=functionTempLi.outerHeight();
		
		functionTemp.animate({
			top: uporDown + functionTempLiHeight
		}, {queue: false, duration: interValTimer,easing:'linear',complete:countmenu(functionTemp) });
		
	//}
}


function countmenu(e) {
    //加減

    var tempNu = e.data('countMenuNu');

    if (myTempArgs.whichBackButton.hasClass('goup')) {
        tempNu += 1;

    } else if (myTempArgs.whichBackButton.hasClass('godown')) {
        tempNu -= 1;

    }
    e.data('countMenuNu', tempNu);

    //加減後動作	
    menuupdown(e);
}

function menuupdown(e) {
   	e.stop( false,true);//for fixbug un and down
	var tempNu=e.data('countMenuNu');	
	var howManyLi=e.data('childrenNu');
	
	var goupBu=myTempArgs.whichBackButton.parent('div.nb_sunmenu').find('div.goup');
	var godownBu=myTempArgs.whichBackButton.parent('div.nb_sunmenu').find('div.godown');
	
		
	var overNu=8-(8-e.data("overHeightNu"));
	if(((howManyLi+tempNu)>overNu) && ((howManyLi+tempNu)<howManyLi)){
		goupBu.show();
		godownBu.show();
		
		
	}else if (howManyLi+tempNu<=overNu){
		
		
		goupBu.show();
		godownBu.hide();
		
		if(myInterval){
			e.stop(true,true);
			clearInterval(myInterval)
		}
		
		
		
	}else {		
		
		goupBu.hide();
		godownBu.show();
		
		if(myInterval){
			e.stop(true,true);
			clearInterval(myInterval);
		}	
		
	}
}

function hasbackbutton(e, chagetext) {
    var whichMenu = e.parents('div.nb_sunmenu:first');
    whichMenu.find("div.backbutton:first").removeClass("hide").find('a').text(chagetext);
};

function showMenuButton(e) {
    //e must be ul.product_sub_nav
var scope=e.parents('.nb_sunmenu:first');
	var upButton=scope.find('div.goup');
	var downButton=scope.find('div.godown');
	var allLi=e.data('childrenNu');
	var currentNu=e.data('countMenuNu');
	var thisHeight=e.outerHeight();


	var intTotalHeight=0;
	var whichNu=0;
	
	while(intTotalHeight<=184){

		if(e.children("li").eq(whichNu).outerHeight()==null){	break;	};
		intTotalHeight=intTotalHeight+e.children("li").eq(whichNu).outerHeight();
		
		if(intTotalHeight>184){
			e.data("overHeightNu",whichNu);
			/****************/
		}
		
		 whichNu++;	

	}
	
	
    
	if(thisHeight>185){
		
		if(currentNu==0){
			upButton.hide()
			downButton.show();
		}else if((allLi+currentNu)<=8){
			upButton.show();
			downButton.hide();
		}else{
			upButton.show();
			downButton.show();
		}
		
	}else{
		upButton.hide();
		downButton.hide();
	}

	
};

function resetall(e) {
    var which_sunmenu = e
    var all_menu = e.find('ul.product_sub_nav');
    var firstMenu = e.find('.li_item_1');
    var whichSlid = e.find('div.allin')
    var backBtn = e.find('div.backbutton');

    if (hideDelayTimer) { clearTimeout(hideDelayTimer); };
    if (myInterval) { clearInterval(myInterval) };
    all_menu.removeClass('showing');
    firstMenu.addClass('showing');

    whichSlid.css({ left: 0 });

    all_menu.each(function() {
        $(this).css({ 'top': 0, 'left': $(this).data('originalLeft') })
        $(this).data('countMenuNu', 0);
    })

    backBtn.addClass('hide');
    showMenuButton(firstMenu);

};

