var winWidth;
var winHeight;
var init = false;
var nextPos;

$(document).ready(function() 
{
	
	pageResizeHandler();
	$('#content_slider').cycle({
		timeout: 6000,
		next: '.next_cycle', 
		prev: '.prev_cycle',
		fx: 'customFade',
		speed: 1000,
		pager: '.currentSlide', 
		/* nowrap: true,  */
		before: onGridCycleBefore, 
		after: onGridCycleAfter
	});
});


$.fn.cycle.transitions.customFade = function($cont, $slides, opts) {
		var newW = ($(window).width() >= 1000) ? $(window).width() : 1000;
		if ($(window).width() <= 640) { newW = $(window).width(); }
		$slides.not(':eq('+opts.currSlide+')').css('opacity',0);
		if (newW <= 640)
		{
			opts.before.push(function(curr,next,opts) {
				$.fn.cycle.commonReset(curr,next,opts);
				opts.cssBefore.opacity = 0;
				opts.cssBefore.width = newW;
				opts.cssBefore.height = 260;
			});
		}
		else
		{
			opts.before.push(function(curr,next,opts) {
				$.fn.cycle.commonReset(curr,next,opts);
				opts.cssBefore.opacity = 0;
				opts.cssBefore.width = newW;
				opts.cssBefore.height = 665;
			});
		}
		
		
		opts.animIn	   = { opacity: 1 };
		opts.animOut   = { opacity: 0 };
		opts.cssBefore = { top: 0, left: 0 };
	};

$(window).resize(function()
{
	pageResizeHandler();
});

function pageResizeHandler()
{
	
	winWidth = ($(window).width() >= 1000) ? $(window).width() : 1000;
	if ($(window).width() <= 640) { winWidth = $(window).width(); }
	$('#wrapper').css({width: winWidth});
	$('#content_slider').css({width: winWidth, height: 665});
	$('.content').css({width: winWidth, height: 665});
	$('.content_inner').css({width: 960, height: 665});
	$('#footerContainer').css({width: winWidth});
	if (winWidth <= 640) 
	{ 
	//	$('#wrapper').css({height: 300});
		$('#content_slider').css({height: 260});
		$('.content').css({height: 260});
		$('.content_inner').css({height: 260});
	//	alert('body ' + $('body').css('width'));
	}
}

function onGridCycleBefore(curr, next, opts)
{
	var currIndex = opts.currSlide+1;
	var nextIndex = opts.nextSlide+1;
	if (init == true)
	{
		$('h1.content_'+currIndex).after('<h1 class="content_'+nextIndex +'"><a href="/">Peter Mayer Advertising</a></h1>');
		$('h1.content_'+nextIndex).hide().css('z-index', 11).fadeIn(250, function() { $('h1').first().remove(); $('h1').css('z-index', 10); });
	}
	else
	{
		init = true;
	}
	
}

function onGridCycleAfter(curr, next, opts)
{
	
}