/* Used variables */
var strName,strAge,strCity,strCountry,strShoesize,strEmail,strNewsletter,strMoments,strShoe,strShoeName,strWhy;
var aMoments = new Array();
var errMsg;
var submitStr ="";
var divOpen = false;

$(document).ready(function(){

 // Position slides
 for (var i = 0; i<=6; i++){
  $('ul#contest li.step-'+i).css({'left': (i*780)+'px'});
 }
 // Bind click events
  $('ul#moments li.moment').click(function(){
    composeMoments( $(this).html(), $(this) );
  });
  // 
  $('ul#moments li').mouseover(function(){ $(this).toggleClass('active') });
  $('ul#moments li').mouseout(function(){ $(this).toggleClass('active') });

});

function contestStep(step)
{ 
 if (validateStep(step)){

  if (step==5){
   getContestValues();
	  makePOSTRequest('/content/exec/exec_contest.asp', submitStr);
   //alert('AJAX submit values: \n\n'+submitStr)
  }

  for (var i = 0; i<=6; i++){
   $('ul#contest li.step-'+i).css({'z-index': (i*10)});
  }
 
  $('ul#contest li.step-'+step).css({'z-index': 500});
  $('ul#contest li.step-'+step).animate({
   left : 0
  },1000);
 }else{
  alert(errMsg);
 }

}

function getContestValues()
{
 // Retrieve values
 strName = document.getElementById('Name').value;
 strAge = document.getElementById('Age').value;
 strCity = document.getElementById('City').value;
 strCountry = document.getElementById('Country').value;
 strShoesize = document.getElementById('Shoesize').value;
 strEmail = document.getElementById('Email').value;
 strNewsletter = document.getElementById('Newsletter').checked;
 strMoments = "" 
 for (var i=0; i<aMoments.length; i++){
  strMoments += aMoments[i]+" ";
 }
 //strShoe = document.getElementById('Shoe').value;
 strWhy = document.getElementById('Why').value;

 // Store values in string
 submitStr += 'Name='+ encodeURI( strName );
 submitStr += '&Age='+ encodeURI( strAge );
 submitStr += '&City='+ encodeURI( strCity );
 submitStr += '&Country='+ encodeURI( strCountry );
 submitStr += '&Shoesize='+ encodeURI( strShoesize );
 submitStr += '&Email='+ encodeURI( strEmail );
 submitStr += '&Newsletter='+ encodeURI( strNewsletter );
 submitStr += '&Moments='+ encodeURI( strMoments );
 submitStr += '&Shoe='+ encodeURI( strShoe + ' ('+ strShoeName +')'  );
 submitStr += '&Why='+ encodeURI( strWhy );
}

function validateStep(step)
{
 var errors = 0;
 if (step==2)
 {
  if ( document.getElementById('Name').value == '' )       errors++;
  if ( document.getElementById('Age').value == '' )        errors++;
  if ( document.getElementById('City').value == '' )       errors++;
  if ( document.getElementById('Country').value == '' )    errors++;
  if ( document.getElementById('Shoesize').value == '' )   errors++;
  if ( document.getElementById('Email').value == '' )      errors++;
  errMsg = "Please fill in the required form fields\n(marked with *)";
 }
 if (step==3)
 {
  if ( aMoments.length == 0 )                              errors++;
  errMsg = "Please make a selection of moments by clicking on them.";
 }
 if (step==4)
 {
  if (typeof(window['strShoe']) == "undefined")            errors++;
  errMsg = "Please select a shoe to match your moment.";
 }
 if (step==5)
 {
  if ( document.getElementById('Why').value == '' )        errors++;
  errMsg = "Please fill in the required form field\n(marked with *)";
 }

 if (errors==0){
  return true;
 }else{
  return false;
 }

}

function composeMoments(moment,e)
{
 var tmpStr ="";
 var iHits = 0;
 var iIndex;
 // search in array
 for (var i = 0; i<aMoments.length; i++)
 {
  if (aMoments[i] == moment) {
   tmpStr += "\nfound '"+moment+"' at index "+i+"\n";
   iIndex = i;
   iHits++;
  }else{
   tmpStr += "\nnot found '"+moment+"' at index "+i+"\n";
  }
 }

 if (iHits>0){
  tmpStr +="\nDelete index "+iIndex+"\n";
  aMoments.splice(iIndex,1);
  $(e).css({'color':'#818181','font-weight':'normal'});
 }else{
  tmpStr +="\nAdd moment "+ moment+"\n";
  aMoments.push(moment);
  $(e).css({'color':'#ff005c'});
 }
 //alert(tmpStr)

 // Store moment...
 var strYourMoment = "";
 for (var i=0; i<aMoments.length; i++){
  strYourMoment += aMoments[i]+" ";
 }
 $('.yourmoment').html(strYourMoment);
}

function chooseShoe(id,naam,afbeelding)
{
 if (typeof(window['strShoe']) != "undefined") {
  $('li#shoe_'+strShoe+' div').css({ 'border': '#fff 2px solid','outline':'none' }); 
 } 
 $('li#shoe_'+id+' div').css({ 'border': '#ff005c 2px solid','outline':'none' }); 
 strShoe = id;
 strShoeName = naam;

 $('.selectedShoe span').html('<img src="/viewdbimg.asp?id='+afbeelding+'&amp;maxbreedte=410&amp;maxhoogte=550" alt="'+naam+'"/>');
}

function showDiv(e)
{
 if (!divOpen){
  $(e).css({'display':'block'});
  divOpen = true;
 }
}

function closeDiv(e)
{
 $(e).css({'display':'none'});
  divOpen = false;
}

var http_request = false;
function makePOSTRequest(url, parameters) {
 http_request = false;
 if (window.XMLHttpRequest) { // Mozilla, Safari,...
  http_request = new XMLHttpRequest();
  if (http_request.overrideMimeType) {
   // set type accordingly to anticipated content type
   //http_request.overrideMimeType('text/xml');
   http_request.overrideMimeType('text/html');
   }
   } else if (window.ActiveXObject) { // IE
   try {
   http_request = new ActiveXObject("Msxml2.XMLHTTP");
   } catch (e) {
   try {
   http_request = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (e) {}
   }
  }
  if (!http_request) {
   alert('Cannot create XMLHTTP instance');
   return false;
 }
 
 http_request.onreadystatechange = alertContents;
 http_request.open('POST', url, true);
 http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 http_request.setRequestHeader("Content-length", parameters.length);
 http_request.setRequestHeader("Connection", "close");
 http_request.send(parameters);
}

function alertContents() {
 if (http_request.readyState == 4) {
  if (http_request.status == 200) {     
  } else {
   alert('There was a problem with the request.');
  }
 }
}