$(document).ready(function() {


$('.allmodels-container').wrap('<div class="slidingPanel" />');
var slidingPanel = $('.slidingPanel');

$('.wrapper').append('<div class="overlay">&nbsp;</div>');
var overlay = $('.wrapper .overlay');
var overlayed = false;

slidingPanel.appendTo('.wrapper');						   
slidingPanel.append('<a href="#" class="close">'+ sbLofiCloseLabel +'</a>');
btnClose = $('.slidingPanel a.close');
btnClose.hide();

$('a.all-models, .slidingPanel a.close').click(function() { 
	overlay.css('height', $(document).height() + px);
	togglePanel(); 
	return false; 
});

overlay.click(function() { if (overlayed) togglePanel() });

togglePanel = function()
	{
	
	$('a.all-models').parent().toggleClass('active');
	var videoObjects = $('object');
	
	var wrapperHeight = $('.wrapper').height();//Match height of All models overlay with height of wrapper div;
	$('.overlay').css('height', wrapperHeight)
	
	if (overlayed)
	{
		btnClose.hide();
		overlay.fadeOut(800);
		overlayed = false;
		
		if($.browser.msie)
		setTimeout(function() {videoObjects.css('visibility', 'visible')}, 800);
	
	} else {
		overlay.fadeTo(800,0.8, function() { btnClose.show() } );
		overlayed = true;
		
		if($.browser.msie)
		videoObjects.css('visibility', 'hidden');
		
		}
	slidingPanel.animate({width: 'toggle'}, 800);	
	}

  }
)

