//====================================================================================================================	

	var sectionDuration = 1000;
	var sectionWidth = 192;
	var sectionCount = 0;
	var slidingSections  = false;
	
	$(document).ready(initDynamicSections);
	
//====================================================================================================================	

	function initDynamicSections()
	{	
		$('#categories #mask ul').css('width', (sectionWidth*$('.category').length)+'px').css('left','-'+(sectionWidth*$('.category').length)+'px');
		$('#categories #mask ul').show().animate({'left':0}, sectionDuration*2, 'easeInOutQuart');
		
		sectionCount = $('.category').length;
		$('.category').each(function()
		{	
			var url = $(this).css('background-image').replace('url("','').replace('")','');
			$(this).css('background','url(/_sys/images/loading.gif) center center');
			$(this).show();
			objImage = new Image();
			objImage.onLoad = sectionLoaded($(this), url);
			objImage.src=url;
		});
		
	}
	
//====================================================================================================================	

	function sectionLoaded(el, url)
	{
		var html;
		if(url.substr(0,3)=='url') html = '<div style="background-image:' + url + ';"></div>';
		else html = '<div style="background-image:url(' + url + ');"></div>';
		$(el.prepend(html));
		$(el).children('div').fadeIn(sectionDuration);
	}
	
//====================================================================================================================	

	function slideSectionsLeft()
	{
		if(!slidingSections)
		{
			if($('#categories #mask ul').position().left<0)
			{
				slidingSections = true;
				$('#categories #mask ul').animate({'left':'+=' + sectionWidth}, sectionDuration, 'easeInOutQuart', function(){slidingSections = false});
		
			}
		}
	}
	
//====================================================================================================================	

	function slideSectionsRight()
	{
		if(!slidingSections)
		{
			if($('#categories #mask ul').position().left>((sectionCount-6)*sectionWidth*-1))
			{
				slidingSections = true;
				$('#categories #mask ul').animate({'left':'-=' + sectionWidth}, sectionDuration, 'easeInOutQuart', function(){slidingSections = false});
			}
		}
	}
	
//====================================================================================================================