if(typeof console === "undefined") {console = { log: function() { } };}

/*
Steps
=====
- mouseover `navigator-base`
    - display next descendant level ul
        - adjust position next to prev pane + flush bottom
    - add listener to ul.pane(s) for leave
    - add listener to .pane > li > h5
        - check for following ul.pane container
*/

var GsdNavigator = function(){
    this.menuOpen = false;
    this.tierId = 0;        // keep track of current pane level
    this.liTopOffset = -6;
    this.bottomPadding = 20;
    this.depthClass = 'navigatordepth';
    this.pPaneKeys = [];
    this.paneHistory = [];
    this.itemHistory = [];
    this.pDepthIndex = 0;
    this.highestPaneDepth = 0;
    this.domNavButtonHl = null;
};

GsdNavigator.prototype.findPanes = function(element){
    //console.log('#findPanes');
    element = $(element);
    if ( !element.hasClass('pane') ) {
        // Stop if not correct element
        return;
    }
    
    // Get 1 level of `.pane` descendants
    var self = this;
    var panes = element.children('li').children('.pane');
    panes.each(function(i){
        var pane = $(this);
        //console.log(i);
        //console.log(pane);
        ////console.log(pane.position());
        
        // Get pane depth count pane elements to html node
        //var parent_panes = pane.parents('.pane');
        ////console.log(parent_panes.length);
        
        var pane_depth = pane.parents('.pane').length;
        ////console.log("Pane Depth: " + pane_depth);
        if (pane_depth > self.highestPaneDepth) {
            self.highestPaneDepth = pane_depth;
        }
        ////console.log("Heighest Pane Depth: " + self.highestPaneDepth);
        
        pane.attr(self.depthClass, pane_depth);
        
        // Reposition pane element to <li> || <h5>
        //pane.css('top', 0);
        var pane_root = pane.closest('li');
        //console.log(pane_root);
        ////console.log(pane_root.position());
        var target_offset = pane_root.position().top+self.liTopOffset;
        ////console.log( pane_root.position().top+self.liTopOffset);
        pane.css('top', target_offset + "px");
        
        
        // Check for bleeding height //Note: this won't work properly when firebug is docked
        /*
        console.log(
            "innerheight:" + pane.innerHeight(),
            "pane.offest: "+pane.offset().top,
            (pane.innerHeight()+pane.offset().top),
            $(window).height()
        );
        */
        
        var parent_pane = pane.parents('ul.pane');
        /*
        //console.log(parent_pane);
        //console.log($("#navigator"));
        //console.log($("#navigator").offset());
        */
        var pane_y = pane.innerHeight()+pane.offset().top;
        //var pane_abs_y = pane.innerHeight()+pane.position().top;
        var view_y = $(window).height()-self.bottomPadding;
        var diff_y = pane_y - view_y;
        var target_height = parent_pane.outerHeight() - pane.outerHeight();
       
        /* 
        console.log("parent pane height: "+parent_pane.outerHeight());
        console.log("pane height: "+pane.outerHeight());
        console.log("view_y: "+view_y) ;
        console.log("pane_y: "+pane_y) ;
        */
        
        if ( pane_y > view_y ) {
        //if ( target_offset+pane.outerHeight() > parent_pane.outerHeight() ) {
        //if ( pane_abs_y > $(window).height() ) {
        //if ( parent_pane.outerHeight() < pane.outerHeight() ) {
            ////console.log("targetheight: " + target_height);
            //pane.css('top', pane.offset().top-diff_y);
            //pane.css('top', view_y-pane_y + "px");
            
            //pane.css('top', -diff_y+"px");
            //pane.css('top', target_height+"px");
            //aligning it with pane-root
            var pane_root_pos = $(".pane-root").offset().top;
            var pane_root_height = $(".pane-root").innerHeight();
            //console.log("pane-root:" + pane_root_pos );
            //console.log("pane-root height:" + pane_root_height );
            if(pane_y > pane_root_pos+pane_root_height){
                pane.css('top', (pane.position().top + (pane_root_pos+pane_root_height) - pane_y) +"px");
                //console.log(pane);
                //console.log(pane.position());
                //console.log((pane.position().top + (pane_root_pos+pane_root_height) - pane_y));
                
            }
        }
        
        
        // Find `ul.pane`s down one ances level
        self.findPanes(pane);
    });
};


GsdNavigator.prototype.initCurrPane = function(element){
    //console.log('#findPanes');
    element = $(element);
    if ( !element.hasClass('pane') ) {
        // Stop if not correct element
        return;
    }
    
    // Get 1 level of `.pane` descendants
    var self = this;
    var panes = element.children('li').children('.pane');
    panes.each(function(i){
        var pane = $(this);
        //console.log(i);
        //console.log(pane);
        ////console.log(pane.position());
        
        // Get pane depth count pane elements to html node
        //var parent_panes = pane.parents('.pane');
        ////console.log(parent_panes.length);
        
        var pane_depth = pane.parents('.pane').length;
        ////console.log("Pane Depth: " + pane_depth);
        if (pane_depth > self.highestPaneDepth) {
            self.highestPaneDepth = pane_depth;
        }
        ////console.log("Heighest Pane Depth: " + self.highestPaneDepth);
        
        pane.attr(self.depthClass, pane_depth);
        
        // Reposition pane element to <li> || <h5>
        //pane.css('top', 0);
        var pane_root = pane.closest('li');
        //console.log(pane_root);
        ////console.log(pane_root.position());
        var target_offset = pane_root.position().top+self.liTopOffset;
        ////console.log( pane_root.position().top+self.liTopOffset);
        pane.css('top', target_offset + "px");
        
        
        // Check for bleeding height //Note: this won't work properly when firebug is docked
        /*
        console.log(
            "innerheight:" + pane.innerHeight(),
            "pane.offest: "+pane.offset().top,
            (pane.innerHeight()+pane.offset().top),
            $(window).height()
        );
        */
        
        var parent_pane = pane.parents('ul.pane');
        /*
        //console.log(parent_pane);
        //console.log($("#navigator"));
        //console.log($("#navigator").offset());
        */
        var pane_y = pane.innerHeight()+pane.offset().top;
        //var pane_abs_y = pane.innerHeight()+pane.position().top;
        var view_y = $(window).height()-self.bottomPadding;
        var diff_y = pane_y - view_y;
        var target_height = parent_pane.outerHeight() - pane.outerHeight();
       
        /* 
        console.log("parent pane height: "+parent_pane.outerHeight());
        console.log("pane height: "+pane.outerHeight());
        console.log("view_y: "+view_y) ;
        console.log("pane_y: "+pane_y) ;
        */
        
        if ( pane_y > view_y ) {
        //if ( target_offset+pane.outerHeight() > parent_pane.outerHeight() ) {
        //if ( pane_abs_y > $(window).height() ) {
        //if ( parent_pane.outerHeight() < pane.outerHeight() ) {
            ////console.log("targetheight: " + target_height);
            //pane.css('top', pane.offset().top-diff_y);
            //pane.css('top', view_y-pane_y + "px");
            
            //pane.css('top', -diff_y+"px");
            //pane.css('top', target_height+"px");
            //aligning it with pane-root
            var pane_root_pos = $(".pane-root").offset().top;
            var pane_root_height = $(".pane-root").innerHeight();
            //console.log("pane-root:" + pane_root_pos );
            //console.log("pane-root height:" + pane_root_height );
            if(pane_y > pane_root_pos+pane_root_height){
                pane.css('top', (pane.position().top + (pane_root_pos+pane_root_height) - pane_y) +"px");
                //console.log(pane);
                //console.log(pane.position());
                //console.log((pane.position().top + (pane_root_pos+pane_root_height) - pane_y));
                
            }
        }
        
        
        // Find `ul.pane`s down one ances level
        //self.findPanes(pane);
    });
};




GsdNavigator.prototype.blinkNavButton = function(){
    ////console.log( $('#navigator-button-hl') );
    var nav_button = $('#navigator-button-hl');
    //return false;
    
    nav_button.animate({
        'opacity': 0.3
    }, 600, function(){
        nav_button.animate({'opacity': 0}, 900);
    });
};


var menu_button_timer = null;