jQuery.fn.slidingPanel = function(showText, hideText) {
    return this.each(function() {
	//if(jQuery.browser.safari) // hide() and show() fail in Safari
	//    return;
	var closed = true;
	var $button = $(this).addClass("panel-up").removeClass('panel-down').css('cursor','pointer');
	var $link = $button.find('a:first');
	if($link.length == 0) {
	    // There is no hyperlink we can use for styling purposes 
	    $link = $button.css('color','blue');
	    $link.hover(
		function() {
		    $(this).css('color','red');
		},
		function() {
		    $(this).css('color', 'blue');
		});
	}
	$link.html(showText).prepend('<img src="../media/mountain/menu-collapsed.png" alt="collapsed-menu" title="expand" style="padding:3px;" />');

	// The sliding panel is assumed to be directly after the button
        var $panel = $button.next();
	//console.log("panel css1 = "+$panel.css('display'));
	$panel.addClass("panel-closed").hide("fast");

	$link.click(function() {
		//console.log("panel css2 = "+$panel.css('display'));
	    if(closed) {
		$button.addClass("panel-down").removeClass("panel-up");
		$link.html(hideText).prepend('<img src="../media/mountain/menu-expanded.png" alt="expanded-menu" title="collapse" style="padding:3px;" />');
		$panel.addClass("panel-open").removeClass("panel-closed").show("normal");
		closed=false;
	    }
	    else {
		$button.addClass("panel-up").removeClass("panel-down");
		$link.html(showText).prepend('<img src="../media/mountain/menu-collapsed.png" alt="collapsed-menu" title="expand" style="padding:3px;" />');
		$panel.addClass("panel-closed").removeClass("panel-open").hide("normal");
		closed=true;
	    }
	    return false; // cancel default link behaviour
	});

    });
}