//Conteneur de valeur de parametre
var parameterList = new Array();

// variable to handle expansion, so we can't skip steps!!
var isReady = 1;
var getPrice = 0;

function stepItemParameter( lmname, lmvalue )
{
this.paramName  = lmname;
this.paramValue = lmvalue;
}

/**
*
* Permet de gerer la liste des etapes. ( parametres collectes + depli / repli des etapes )
* 
**/
function StepList()
{
this.parameterList = new Array();
this.steps         = new Array();
this.steps[0]      = 'TpStepStyle';
this.steps[1]      = 'TpStepChoixFormat';
this.steps[2]      = 'TpStepNbreFace';
this.steps[3]      = 'TpStepUploadImageTableauPerso';
this.steps[4]      = 'TpStepAssocPictures';
this.steps[5]      = 'TpStepFrame';
this.steps[6]      = 'TpStepChoixOptions';
this.steps[7]      = 'TpStepConfigFlaTableauPerso';
this.steps[8]      = 'TpStepTableauPersoFin';
this.currentStep   = this.steps[0];

	//Ajoute un parametre lparamName avec pour valeur lparamValue a la liste 
	this.addParameter = function( lparamName, lparamValue ){
	
		var currentP    = new stepItemParameter( lparamName, lparamValue );
		var paramnumber = this.getParameterNumber( lparamName );
		
		if( paramnumber != -1 )
		{
		window['parameterList'][ paramnumber ] = currentP;
		}
		else
		{
		window['parameterList'].push( currentP );
		}
	}

	//Retourne vrai si la liste contient lpname
	this.hasParameter = function( lpname ){
	
		for( var i=0; i< window['parameterList'].length; i++ )
		{
			if( window['parameterList'][i].paramName == lpname )
			{
			return true;
			}
		}
		
		return false;
	}
	
	//Retourne la valeur d'un parametre lpname ou false si le parametre nexiste pas
	this.getParameter = function( lpname ){
		
		for( var i=0; i< window['parameterList'].length; i++ )
		{
			if( window['parameterList'][i].paramName == lpname )
			{
			return window['parameterList'][i].paramValue;
			}
		}
		
		return false;
	}
	
	//Retourne le numero d'un parametre paramname
	this.getParameterNumber = function( paramname ){
		
		for( var i=0; i< window['parameterList'].length; i++ )
		{
			if( window['parameterList'][i].paramName == paramname )
			{
			return i;
			}
		}
	
	return -1;
	}
	
	//Retourne la valeur d'un parametre pour le numero lNUMP
	this.getParameterValueForNo = function( lNUMP ){
		if( lNUMP < this.getNbParameter() )
		{
		return window['parameterList'][lNUMP].paramValue ;
		}
		else
		{
		return false;
		}
	}
	
	//Retourne le nombre de parametre de la liste
	this.getNbParameter= function()	{
	return window['parameterList'].length;
	}
	
	//Transforme la liste en URL
	this.makeAsUrl = function(){
	
	var lcurrentStr ="";
	
		for( var i=0; i< window['parameterList'].length; i++ )
		{
		var separator = ( i < ( window['parameterList'].length - 1 ) ) ? '&' : '';
		lcurrentStr += window['parameterList'][i].paramName+"="+escape( window['parameterList'][i].paramValue )+separator;
		
		}
		
	return lcurrentStr;
	}
	
	this.getCurrentStepNum = function()	{
	
		for( var d =0; d < this.steps.length; d++ )
		{
			if( this.currentStep == this.steps[d] )
			{
			return d;
			}
		}
		
		return -1;
	}
	
	this.gotoNextStep = function(){
  	if(isReady == 1) {
  	  isReady = 0;
  	  var nextStepName = this.getNextStepName();
  		if( nextStepName != false )
  		{
  		cl($(this.currentStep+'-content'));
  		cc($(this.currentStep+'-header'),'');
  	
  		ex($(nextStepName+'-content'));
  		n=$(nextStepName+'-header');
  		cc(n,'__');
  		n.className=n.className+' '+n.tc;
  		$(this.currentStep+"-statusIcon").className = "stepStatusIconOk";
  
  		// invalider ici si impacte sur la suite
      if( this.currentStep != "TpStepStyle") {
        this.invalidateNextSteps( this.currentStep );
      }
      		
  		this.currentStep = nextStepName;
      dspRightPanText(nextStepName);
  		  		

  		// adding status "in progress"
      if( $( this.currentStep+"-statusIcon").className != "stepStatusIconOk" ) {
        $( this.currentStep+"-statusIcon").className = "stepStatusIconEnCours";
  		}
  		
  		}
  	}
  	
    // Recharge le bouton sur la requete ajax de l'étape final pour l'aperçut du prix du
    // produit en cour de création 
    // recharge que quand arriv� � la fin  
		if( this.getCurrentStepNum() == (this.steps.length - 1) || getPrice == 1 ) {
      getCurrentProductPriceValue();
      getPrice = 1;
    }
    	ActualiseBuildedProduct();

  	}
	
	
	this.gotoPrevStep = function(){
	/*
	var prevStepName = this.currentStep;
	
		if( nextStepName != false )
		{
		cl($(this.currentStep+'-content'));
		cc($(this.currentStep+'-header'),'');
		
		ex($(prevStepName+'-content'));
		n=$(prevStepName+'-header');
		cc(n,'__');
		n.className=n.className+' '+n.tc;
		$(this.currentStep+"-statusIcon").className = "stepStatusIconOk";
		this.currentStep = nextStepName;
		}*/
	}
	
	this.getNextStepName = function(){
	
	var sNum = this.getCurrentStepNum();
		
		if( ( sNum + 1 ) < this.steps.length )
		{
		return this.steps[sNum + 1];
		}
		
	return false;
	}
	
	this.setCurrentStep  = function( lstepname ){
	this.currentStep = lstepname;
	}
	
	this.expandFirstStep = function(){
	
	var nextStepName = this.steps[0];
	
	cl($(this.currentStep+'-content'));
	cc($(this.currentStep+'-header'),'');
	
	ex($(nextStepName+'-content'));
	n=$(nextStepName+'-header');
	cc(n,'__');
	n.className=n.className+' '+n.tc;
	
	this.currentStep = nextStepName;
	dspRightPanText(nextStepName);
	
	$( this.currentStep+"-statusIcon").className = "stepStatusIconEnCours";
	}
	
	this.getStepPos = function( stepName ){
	
		for( var d =0; d < this.steps.length; d++ )
		{
			if( this.steps[d] == stepName )
			{
			return d;
			}
			//getStepPos
		}
		
	return false;
	}
	
  this.invalidateNextSteps = function( stepname ){

  var posOfStep = this.getStepPos( stepname );
  var nbOfParams = this.getNbParameter();
  var tempArray = new Array();
  var j = 0;

  if( nbOfParams > (posOfStep + 1) ) {
    for( var i= 0; i<= posOfStep; i++ )
    {
      tempArray[j] = window['parameterList'][i];
            j++;
    }
    window['parameterList'] = tempArray;
  }
  
    for( var de = (posOfStep + 1); de <= this.steps.length ; de++ )
    {
      if($( this.steps[de]+"-statusIcon")) $( this.steps[de]+"-statusIcon").className = "stepStatusIconNoOk";
    }
  }
  
	this.getCurrentStepName = function(){
	
	return this.currentStep;
	
	}
}


var stepListObject = new StepList();

function openPopupStyleDetail(lstyleid)
{
	
	var lpopup_width  = parseFloat( $('contentPopupStyleDetail').style.width.replace( 'px', '' ) );
	var lpopup_height = parseFloat( $('contentPopupStyleDetail').style.height.replace( 'px', '' ) );
	
		
	var popupManager = new TpGenericPopupManager();
	popupManager.startPlacingPopup( lpopup_width+10, lpopup_height+10 );
	
	popupManager.addPopupItemHorizontal( $('contentPopupStyleDetail'), lpopup_width, lpopup_height );
	popupManager.endPlacingPopup();
	popupManager.setCloseBehavior( true );
	popupManager.customDisplayItemMethod = function( elt ){
				$(elt).style.display = 'block';
	}
	popupManager.customHideItemMethod = function( elt ){
					$(elt).style.display = 'none';
	}
	
	new Ajax.Request(
		'/TpStepManagement/GetPopupStyleDetail',
		{
			method: 'get',
			parameters: {style_id: lstyleid},
			onComplete: function(xhr){

				$('contentPopupStyleDetail').innerHTML = xhr.responseText;
				
				popupManager.showItems();

			}
		}
	);
}//consthtml : HtmlTpStepStyle
//consthtml : HtmlTpStepChoixFormat
//consthtml : HtmlTpStepChoixFace

callbackFunctionAfterLogin = function(){			
	
	//if( stepListObject)
	$('divConnectionUploadImage').innerHTML = '<a href="/MySpace/MyPics" class="my_galerie" onclick="userIsLoggedAndDontWantToUploadPic();return false;">Je souhaite utiliser des images issues uniquement de ma galerie</a>';

	
}
			
function userHasPaperImage()
{
	parameterChoosed( 'images_format_papier', '1' );
	
	new Ajax.Request(
	'http://www.tableauphoto.com/TpStepManagement/AjaxFormatPapierChoosed',
		{
			method: 'get',
			parameters: {guide_id:stepListObject.getParameter( 'guide_id' )},
			onSuccess: function(){
				parameterChoosed( 'images_uploaded', '1' );
				stepListObject.gotoNextStep();
			}
		}
	);
}

function startUploadPhotos()
{
	//$('infos').innerHTML += '<br />start upload photos<br />';
}

function stopUploadPhotos()
{
	parameterChoosed( 'images_uploaded', '1' );
	stepListObject.gotoNextStep();
}

function createGuidePlaceDropBox()
{
	var urlreq = 'http://www.tableauphoto.com/TpStepManagement/AjaxGetDropBoxForGuide';
	
	new Ajax.Updater(
	'fileUploadDiv',
	urlreq,
		{
			method: 'get',
			parameters: {guide_id:stepListObject.getParameter( 'guide_id' )},
			onSuccess: function(){
			
			personalSpaceLinkFollow( '/MySpace/PicUpPics' );	
			
			setTimeout( "makePicturesDraggable();", 1000 );
			setTimeout( "makeDropBoxDropable();", 1000 );
			
			
			}
		}
	);
}

function makeDropBoxDropable()
{
	
	var ldropboxGroup = document.getElementsByClassName('DropBoxPhoto');
	
	alert( $('testici').innerHTML );
	
	//new Draggable( 'putaindemerde', { revert:true, zindex:1000 } );
	
			Droppables.add( 'testici' , {
			accept: 'vignette',
			hoverclass: 'hoverDropBox',
				onDrop: function(element,autre) {
					alert( element.toString() );
					//ImgHasBeenDroppedInBox( element.id, ldropboxGroup[i].id );
					return true;
				},
				onHover: function(ldg, ldpbl, lpercent){
					alert('ICI hover test');
					return true;
				}
			} 
		);
	
	for( var i = 0; i < ldropboxGroup.length; i++ )
	{
		//alert(' '+ldropboxGroup[i].id+' droppable ');
			Droppables.add( ldropboxGroup[i] , {
			accept: 'vign_option',
			hoverclass: 'hoverDropBox',
				onDrop: function(element,autre) {
					alert( element.id.toString() );
					ImgHasBeenDroppedInBox( element.id, ldropboxGroup[i].id );
					return true;
				},
				onHover: function(ldg, ldpbl, lpercent){
					alert('ICI hover');
				}
			} 
		);
	}

}

function makePicturesDraggable()
{
	var limgGroup    = document.getElementsByClassName('vignette');
	
	for( var i = 0; i < limgGroup.length; i++ )
	{
		new Draggable( limgGroup[i].id, { revert:false, zindex:99 } );
	}
	
	alert('Cliquez sur une de vos image, et glissez la dans la zone bleu ');
}

function ImgHasBeenDroppedInBox( imgid, boxid )
{
	alert(imgid+' ImgHasBeenDroppedInBox '+boxid);
}


function userDroppedAllPics()
{
	parameterChoosed( 'images_uploaded', '1' );
}//consthtml : HtmlTpStepUploadPhotoTP

var selectedAssignableArea = false;

function showPopupChoosePhotoForAreas()
{
	var popupManager = new TpGenericPopupManager();
	popupManager.startPlacingPopup( 500, 500 );
	
	popupManager.addPopupItemHorizontal( $('MyAssignablePictures'), 500, 500 );
	popupManager.endPlacingPopup();
	popupManager.setCloseBehavior( true );
	popupManager.customDisplayItemMethod = function( elt ){
		$(elt).style.display = 'block';
	}
	popupManager.customHideItemMethod = function( elt ){
		$(elt).style.display = 'none';
	}
	
	new Ajax.Updater(
	'MyAssignablePictures',
	'/TpStepManagement/AjaxGetAssignablePictures',
		{
			method: 'get',
			onComplete: function(xhr){
				
					popupManager.showItems();
			}
		}
	);
	
}


function assignPictureToArea( pictureId )
{
	if( selectedAssignableArea == false )
	{
		return false;
	}
	
	var picsrc = $( 'picture_src_'+pictureId ).value;
	$('assignedImageInput'+selectedAssignableArea ).value=pictureId;
	
	//Vide la zone
	while( $('bp_guide_place_'+selectedAssignableArea ).lastChild )
	{
		$('bp_guide_place_'+selectedAssignableArea ).removeChild( $('bp_guide_place_'+selectedAssignableArea ).lastChild );
	}
	
	var limage = document.createElement('img');
	limage.src = picsrc;
	$('bp_guide_place_'+selectedAssignableArea ).appendChild( limage );
	
	currentGenericPopup.hideAllItems();
}

function clickOnAssignableArea( lplaceId )
{
  if(isReady == 1) {
		selectedAssignableArea = lplaceId;
		showPopupChoosePhotoForAreas();
		//MyAssignablePictures 
		//alert('click dans '+lplaceId);
	}	
}


function mouseOutAssignable( lplaceId )
{
	$('bp_guide_place_'+lplaceId).style.backgroundImage='url(/images/ajout.gif)';
}

function mouseOverAssignable( lplaceId )
{
	$('bp_guide_place_'+lplaceId).style.backgroundImage='url(/images/ajout2.gif)'; 
}


function userFinishAssignPhoto()
{
var formInfos  = $('formWithAssignedImage').serialize();


	new Ajax.Request(
	'/TpStepManagement/ReceiveImageAssigned',
		{
			method: 'get',
			parameters: { assignation: formInfos},
			onComplete: function(xhr){
				
			var msgFull    = xhr.responseText;
			var msgSuccess = msgFull.substring( 0, "SUCCESS".length );
			//alert(msgFull.substring( 0, "SUCCESS".length ));
				if( msgSuccess == 'SUCCESS')
				{
					parameterChoosed('photo_associed_to_face', 1);
					stepListObject.gotoNextStep();	
				}
				else
				{
					alert( msgFull );
				}
			}
		}
	);
	
}

function fermeture(){
	currentGenericPopup.hideAllItems();
}//consthtml : HtmlTpStepAssocPictures
//consthtml : HtmlTpStepChoixFrame
function optVueChezVousClick(status)
{
//vueChezVousDetail
//lOptVueChezVous
	if( status == 'yes' )
	{
	window.open( '/TpStepManagement/ShowPopupOptVueChezVous',"nom_popup","menubar=no, status=no, scrollbars=no, menubar=no, width=400, height=400");
	}
	else
	{
		parameterChoosed( 'opt_vue_chez_vous_checked', 0 );
	}
}


function optRetirageClick(status)
{
	if( status == "yes" )
	{
		parameterChoosed( 'opt_retirage_choosed', 1 );
	}
	else
	{
		parameterChoosed( 'opt_retirage_choosed', 0 );
	}
}


function optNumeriqueClick(status)
{
  if( status == 'yes' )
	{
		parameterChoosed( 'opt_numerique_choosed', 1 );
		alert('numerique choisit ');
	}
	else
	{
		parameterChoosed( 'opt_numerique_choosed', 0 );
	}
}

//Fonction appele lorsque la popup vue chez vous se ferme
function confirmVueChezVousImageReception()
{
	parameterChoosed( 'opt_vue_chez_vous_checked', 1 );
	//alert('confirmVueChezVousImageReception');
}//consthtml : HtmlTpStepChoixOptions
function openConfigFlaSwf()
{
	
 window.open( '/TpStepManagement/BadPopupFla' ,"nom_popup","menubar=no, status=yes, scrollbars=yes, menubar=no, width=900, height=700");
	
}




function showConfigfla()
{
	var flashWidth  = 890;
	var flashHeight = 730;
	
	var docSize = returnDocumentSize();
		
	var pposx = ( ( docSize[0] / 2 ) - ( flashWidth / 2 ) );
	// ( + 100px car le swf contient une grande zone vide )
	var pposy = ( ( ( docSize[1] / 2 ) - ( flashHeight / 2 ) ) ) + 100 ;
	
	var lfuckingDiv = $('leDivPourLeConfigurateurFlash');
	lfuckingDiv.style.position   = 'absolute';
	lfuckingDiv.style.width      = flashWidth+'px';
	lfuckingDiv.style.height     = flashHeight+'px';
	lfuckingDiv.style.display    = 'block';
	lfuckingDiv.style.top        = pposy+'px';
	lfuckingDiv.style.left       = pposx+'px';
	lfuckingDiv.style.zIndex     = '99';

	swfobject.embedSWF("/swf/configurateur.swf", "configFlatest", (flashWidth - 30), (flashHeight - 30), "9.0.0", '/swf/expressInstall.swf', {xml_path:'/Configurators/GenXmlFlaTableauPerso/bpid/