/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

var collapsing_site_navigation={
$items:'',
cnt_items:0,
folded: false,
menu_time:0,
execute:function(){
//console.log('in execute van collapsing_site_navigation');
collapsing_site_navigation.$items = $('#cc_menu .cc_item');
    //number of menu items
collapsing_site_navigation.cnt_items= collapsing_site_navigation.$items.length;
collapsing_site_navigation.$items.unbind('mouseenter')
    .bind('mouseenter',collapsing_site_navigation.m_enter)
    .unbind('mouseleave')
    .bind('mouseleave',collapsing_site_navigation.m_leave)
    .find('.cc_submenu > ul > li')
    .bind('click',function(){
        var $li_e = $(this);
        //console.log($li_e);
        //if the menu is already folded,
        //just replace the content
        if(collapsing_site_navigation.folded){
            collapsing_site_navigation.hideContent();
            collapsing_site_navigation.showContent($li_e.attr('class'));
        }
        else //fold and show the content
            collapsing_site_navigation.fold($li_e);
    });
    $('#cc_back').bind('click',collapsing_site_navigation.unfold);
},
 m_enter: function (){
     //console.log(this);
        var $this = $(this);
        clearTimeout(collapsing_site_navigation.menu_time);
        collapsing_site_navigation.menu_time = setTimeout(function(){
            //img
            //$this.find('img').stop().animate({'top':'0px'},400);
            $this.find('img').stop().fadeIn(500);
            //cc_submenu ul
            $this.find('.cc_submenu > ul').stop().animate({
                'height':'200px'
            },400);
        },200);
    },

    //mouseleave function for the items
    m_leave:function (){
        var $this = $(this);
        clearTimeout(collapsing_site_navigation.menu_time);
        //img
        //$this.find('img').stop().animate({'top':'-600px'},400);
        $this.find('img').stop().fadeOut(500);

        //cc_submenu ul
        $this.find('.cc_submenu > ul').stop().animate({
            'height':'0px'
        },400);
    },

    //back to menu button - unfolds the menu
    

    /**
            hides all the menu items except the clicked one
            after that, the content is shown
            */
   fold:function($li_e){
        var $item= $li_e.closest('.cc_item');
        //console.log($item);
        var d = 100;
        var step = 0;
        collapsing_site_navigation.$items.unbind('mouseenter mouseleave');
        collapsing_site_navigation.$items.not($item).each(function(){
            //console.log(this);
            var $item = $(this);
            //console.log($item);
            //plaats hier de waarde van cc_menu left + de breedte  van het plaatje (=140px)
            $item.stop().animate({
                'marginLeft':'-<? echo $left + $img_width; ?>px'
            },d += 200,function(){
                ++step;
                //console.log($item.attr('marginLeft'));
                if(step == collapsing_site_navigation.cnt_items-1){
                    collapsing_site_navigation.folded = true;
                    collapsing_site_navigation.showContent($li_e.attr('class'));
                }
            });

        });

        $item.stop().animate({
            //plaats hier de waarde van cc_menu left;
            'marginLeft':'-<? echo $left; ?>px'
        },d += 200,function(){
            ++step;
            if(step == collapsing_site_navigation.cnt_items-1){
                collapsing_site_navigation.folded = true;
                collapsing_site_navigation.showContent($li_e.attr('class'));
            }
        });
    },




    /**
            shows all the menu items
            also hides any item's image / submenu
            that might be displayed
            */
   unfold: function unfold(){
       var result=slider_gallery.closeGallery();
       //alert(result);
       //console.log('in unfold');
        collapsing_site_navigation.hideContent();
        $('#cc_content').stop().animate({
            'width':'0px',
            'height':'600px'
        },600,function(){
            var d = 100;
            var step = 0;
            collapsing_site_navigation.$items.each(function(){
                var $item = $(this);

                $item.find('img')
                .stop()
                .fadeOut(500)
                .andSelf()
                .find('.cc_submenu > ul')
                .stop()
                .animate({
                    'height':'0px'
                },200);

                $item.stop().animate({
                    'marginLeft':'0px'
                },d += 200,function(){
                    ++step;
                    if(step == collapsing_site_navigation.cnt_items-1){
                        collapsing_site_navigation.folded = false;
                        collapsing_site_navigation.$items.unbind('mouseenter')
                        .bind('mouseenter',collapsing_site_navigation.m_enter)
                        .unbind('mouseleave')
                        .bind('mouseleave',collapsing_site_navigation.m_leave);
                    }
                });
            });
        });
    },

    //function to show the content
    showContent: function (idx){
        $('#cc_content').stop().animate({
            'width':'700px'
        },200,function(){
            $(this).find('.'+idx).fadeIn();
        });
    },

    //function to hide the content
    hideContent: function (){
        $('#cc_content').find('div').hide();
    }
}