//Drop Down Panel script (March 29th, 08'): By JavaScript Kit: http://www.javascriptkit.com  
// Modified by Barry Roodt (September 08) : http://calisza.wordpress.com  
  
var jkpanel={  
    controltext: 'About',  
    $mainpanel: null, contentdivheight: 0,  
    $contentdiv: null, $controldiv: null,  
  
    openclose:function($){  
        this.$mainpanel.stop() //stop any animation  
        if (this.$mainpanel.attr('openstate')=='closed'){  
            this.$mainpanel.animate({bottom: 0}, 500).attr({openstate: 'open'});  
            this.$controldiv.show();  
        } else {  
            this.$mainpanel.animate({bottom: -this.contentdivheight+'px'}, 500).attr({openstate: 'closed'});  
            //this.$controldiv.hide();  
        }  
    },  
  
    loadfile:function($, file, height, openpanel){  
        jkpanel.$contentdiv.load(file, '', function($){  
                    var heightattr=isNaN(parseInt(height))? 'auto' : parseInt(height)+'px';  
                    jkpanel.$contentdiv.css({height: heightattr});  
                    jkpanel.contentdivheight=parseInt(jkpanel.$contentdiv.get(0).offsetHeight);  
                    jkpanel.$mainpanel.css({bottom:-jkpanel.contentdivheight+'px', visibility:'visible'});  
                    jkpanel.$controldiv.css({cursor:'hand', cursor:'pointer'});  
                    if (openpanel){  
                        jkpanel.openclose($);  
                    }  
                    return true;  
        })  
  
        return false;  
    },  
  
    init:function(file, height, speed){  
        jQuery(document).ready(function($){  
            jkpanel.$mainpanel=$('<div id="dropdownpanel"><div id="slideUpWrap"><div id="left"><a href="http://www.royalenfieldla.com" title="Royal Enfield of Los Angeles: Temporary Website">Latest Project</a></div><div id="validation"><p><span class="cssXhtml"><a href="http://jigsaw.w3.org/css-validator/validator?uri=www.parkercde.com&profile=css3&usermedium=all&warning=1&lang=en" title="Valid CSS">CSS</a></span><span class="cssXhtml"><a href="http://validator.w3.org/check?uri=referer" title="Valid XHTML">XHTML</a></span></p></div><div id="jkcontrol">'+jkpanel.controltext+'</div><div id="jkcontentdiv"></div></div></div>').prependTo('body');  
            jkpanel.$contentdiv=jkpanel.$mainpanel.find('#jkcontentdiv');  
            jkpanel.$controldiv=jkpanel.$mainpanel.find('#jkcontrol').css({cursor: 'wait'});  
            jkpanel.loadfile($,file, height, false);  
            jkpanel.$mainpanel.attr('openstate', 'closed');  
            $('#jkcontrol').click(function(){jkpanel.openclose($)});  
            $('.panelbutton').click(function(){  
                var pfile = this.href;  
                var pheight = this.rel || false;  
                jkpanel.loadfile($,pfile, pheight, true);  
                return false;  
            });    

        })  
    }  
}

//Initialize script: supanel.init('path_to_content_file', 'height of content DIV in px', animation_duration)
jkpanel.init('about.html', '240', 200)