// JavaScript Document

$(document).ready(function() 
  {
	
	if (jQuery.browser.version != '6.0') {
		
	  $('#transfert').backgroundCanvas();
	  $('#formation').backgroundCanvas();
	  $('#projection').backgroundCanvas();
	  $('#branding').backgroundCanvas();
	  $('#main_content').backgroundCanvas();
	  $('div.title_link').backgroundCanvas();
	  $('#mariage').backgroundCanvas();
	  $('#boutique').backgroundCanvas();
	 $('#lien_mariage').backgroundCanvas();
	  $('#entete_mariage').backgroundCanvas();
	   $('#entete_regie').backgroundCanvas();
	  $('#regie').backgroundCanvas();
	  $('#lien_regie').backgroundCanvas();
	  $('#modelisme').backgroundCanvas();
	}
	  jQuery.ajax(
	   {
			type:'POST',
			dataType:'text',
			data:{dir:'photos/slide_index'},
			url:'slide_index.php',
			success:slideIndex
		}
	  );
  }
);

$(window).load(function() 
  {
	 DrawBackground();
  }
);

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

function DrawBackground()
{
	$("#transfert").backgroundCanvasPaint(BackgroundPaintFkt); 
	$('#formation').backgroundCanvasPaint(BackgroundPaintFkt);
	$('#projection').backgroundCanvasPaint(BackgroundPaintFkt);
	$('div.title_link').backgroundCanvasPaint(BackgroundPaintTitleLink)
	$('#branding').backgroundCanvasPaint(BackgroundPaintTopRounded);
	$('#main_content').backgroundCanvasPaint(BackgroundPaintBottomRounded);
	$('#mariage').backgroundCanvasPaint(BackgroundPaintMariage);
	$('#lien_mariage').backgroundCanvasPaint(BackgroundPaintLienMariage);
	$('#entete_mariage').backgroundCanvasPaint(BackgroundPaintBtPhoto);
	
	$('#boutique').backgroundCanvasPaint(BackgroundPaintBoutique);
	$('#entete_regie').backgroundCanvasPaint(BackgroundPaintEtRegie);
	$('#regie').backgroundCanvasPaint(BackgroundPaintRegie);
	$('#lien_regie').backgroundCanvasPaint(BackgroundPaintLienRegie);
	$('#modelisme').backgroundCanvasPaint(BackgroundPaintModelisme);
}

function BackgroundPaintFkt(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{

		var options = {x:0, height: height, width: width, radius:14,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#cccccc');
		backgroundGradient.addColorStop(1, '#333333');
		context.fillStyle = "#ffffff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}

function BackgroundPaintTitleLink(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
	
		var options = {x:0, height: height, width: width, radius:14,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#ffffff');
		backgroundGradient.addColorStop(1, '#cccccc');
		//context.fillStyle = "#ff9900";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}

function BackgroundPaintTopRounded(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:14,radiusTR:14,radiusBL:0,radiusBR:0,border: 0 };
		//var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		context.fillStyle = "#660000";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		$.canvasPaint.roundedRect(context,options);
}

function BackgroundPaintBottomRounded(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:0,radiusTR:0,radiusBL:14,radiusBR:14,border: 0 };
		//var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		context.fillStyle = "#660000";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintMariage(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:0,radiusTR:0,radiusBL:14,radiusBR:14,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#FFD2D2');
		backgroundGradient.addColorStop(1, '#800000');
		//context.fillStyle = "#ffccff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		context.fillStyle = backgroundGradient;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintLienMariage(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radius:8,  border: 0 };
		//var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		//backgroundGradient.addColorStop(0 ,'#ff66ff');
		//backgroundGradient.addColorStop(1, '#cc00ff');
		context.fillStyle = "#ffffff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		//context.fillStyle = backgroundGradient;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintBoutique(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
	
		var options = {x:0, height: height, width: width, radius:14,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#800000');
		backgroundGradient.addColorStop(1, '#FFD2D2');
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		// Draw the gradient filled inner rectangle
		options.border = 0;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintBtPhoto(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:14,radiusTR:14,radiusBL:0,radiusBR:0,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#800000');
		backgroundGradient.addColorStop(1, '#FFD2D2');
		//context.fillStyle = "#ffccff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		context.fillStyle = backgroundGradient;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintRegie(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:0,radiusTR:0,radiusBL:14,radiusBR:14,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		//backgroundGradient.addColorStop(0 ,'#ff9900');
		//backgroundGradient.addColorStop(1, '#cc3300');
		backgroundGradient.addColorStop(0 ,'#cccccc');
		backgroundGradient.addColorStop(1, '#333333');
		//context.fillStyle = "#ffccff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		context.fillStyle = backgroundGradient;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintEtRegie(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radiusTL:14,radiusTR:14,radiusBL:0,radiusBR:0,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		//backgroundGradient.addColorStop(0 ,'#cc3300');
		//backgroundGradient.addColorStop(1, '#ff9900');
		backgroundGradient.addColorStop(0 ,'#333333');
		backgroundGradient.addColorStop(1, '#cccccc');
		//context.fillStyle = "#ffccff";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 0;
		context.fillStyle = backgroundGradient;
		$.canvasPaint.roundedRect(context,options);
}
function BackgroundPaintLienRegie(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radius:14,  border: 0 };
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		// Draw the gradient filled inner rectangle
		options.border = 0;
        context.fillStyle = "#ffffff";
		$.canvasPaint.roundedRect(context,options);
}



function BackgroundPaintModelisme(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
	
		var options = {x:0, height: height, width: width, radius:14,  border: 0 };

		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 1;
		
		context.fillStyle = "#ffffff";
		$.canvasPaint.roundedRect(context,options);
}
function slideIndex(data,status) {
	if (data != '' ) {
		images=data.split(",");
		src=Array();
		for (i=0; i< images.length;i++) {
			src[i]=images[i];
		}
	
		$('#slide_index').crossSlide({
            sleep: 2,
            fade: 1
        }, [
             {src: src[0] },
			 {src: src[1] },
			 {src: src[2] },
			 {src: src[3] },
			 {src: src[4] },
			 {src: src[5] },
			 {src: src[6] },
			 {src: src[7] }
           ]
		);
	 }
}