// BOF - Zappo - Option Types v2 - Added for Form Field Progress Bar 
function textCounter(field,counter,maxlimit,linecounter) {
  // text width//
  var fieldWidth =  parseInt(field.offsetWidth);
  var charcnt = field.value.length;
  var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ;
  if (linecounter) {
    document.getElementById(counter).style.width =  parseInt((fieldWidth*percentage)/100)+"px";
    document.getElementById(linecounter).style.width =  parseInt(fieldWidth)+"px";
    document.getElementById(counter).innerHTML="<nobr>Max: "+percentage+"% - ("+charcnt+"/"+maxlimit+")</nobr>";
  } else {
    // trim the extra text
    if (charcnt > maxlimit) {
      field.value = field.value.substring(0, maxlimit);
    } else {
      // progress bar percentage
      document.getElementById(counter).style.width =  parseInt((fieldWidth*percentage)/100)+"px";
      document.getElementById(counter).innerHTML="<nobr>Max: "+percentage+"% - ("+charcnt+"/"+maxlimit+")</nobr>";
      // color correction on style from CCFFF -> CC0000
      document.getElementById(counter).style["background-color"] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)";
    }  
  }
}
// EOF - Zappo - Option Types v2 - Added for Form Field Progress Bar 
//-->

function validate_name(val){
 if(val.value.length > 9)
	{
	 alert('maximum length of Name allowed is: 9');
	 val.value = val.value.substr(0,9);
	 return false;
	}
 return true;
}

function validate_desc(val){
 if(val.value.length > 50)
	{
	 alert('maximum length of engraving allowed is: 50');
	 val.value = val.value.substr(0,50);
	 return false;
	}
 document.getElementById('engrave_text').innerHTML = val.value;
 document.getElementById('Engraving').innerHTML = '<span class="NameMeaning">"'+ val.value +'"</span>';
 return true;
}

function engrave_on_off(val){
 if(val.checked == true)
	{
     document.getElementById('engrave_text').style.display = "block";
     document.cart_quantity.id_name_desc.disabled=false;
	}
 else
	{
     document.getElementById('engrave_text').style.display = "none";
     document.cart_quantity.id_name_desc.disabled=true;
	}
}

function refreshImage(mode){
 message = document.getElementById("id_baby_name").value;
 if(message.length == 0)
 {
  alert("Please enter name of the baby");
  document.cart_quantity.id_baby_name.focus();
  return false;
 }
 document.getElementById('name_image').innerHTML = '<img src="images/frames/ajax_loader.gif">';
 
 xmlHttp=GetXmlHttpObject();
 if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  } 
 var name = document.forms["cart_quantity"].id_baby_name.value;
 var url="get_image.php";
 url=url+"?text="+name;
 myOption = 0;
 for (i=document.cart_quantity.id_color_choice.length-1; i > -1; i--) {
 if (document.cart_quantity.id_color_choice[i].checked) {
  myOption = i; i = -1;
  myOption =document.cart_quantity.id_color_choice[myOption].value;
  }
 }
 var font = 0;
 for (i=document.cart_quantity.id_font_choice.length-1; i > -1; i--) {
 if (document.cart_quantity.id_font_choice[i].checked) {
  font = i; i = -1;
  font =document.cart_quantity.id_font_choice[font].value;
  }
 }
 url=url+"&color="+myOption;
 url=url+"&font="+font;
 url=url+"&sid="+Math.random()*11;
 url = encodeURI(url);
 xmlHttp.onreadystatechange=refresh_image;
 // update the background before that.
 if(name.length < 5 )
	{
  document.getElementById('name_image_slate').className  = 'productsizeApreview';
  document.cart_quantity.id_baby_frame.value="A";
	}
 else if(name.length < 7 )
	{
  document.getElementById('name_image_slate').className  = 'productsizeBpreview';
  document.cart_quantity.id_baby_frame.value="B";
	}
 else if(name.length < 10 )
	{
  document.getElementById('name_image_slate').className  = 'productsizeCpreview';
  document.cart_quantity.id_baby_frame.value="C";
	}
 else if(name.length < 13 )
	{
  document.getElementById('name_image_slate').className  = 'productsizeDpreview';
  //document.getElementById('engrave_text').className  = 'engravingLongText';
  document.cart_quantity.id_baby_frame.value="D";
	}
 	if(name.length < 10)
	{
		document.getElementById('engrave_text').className  = 'engraving';
	}
	else
	{
		document.getElementById('engrave_text').className  = 'engraving-small-letters';
	}
	xmlHttp.open("GET",url,true);
	xmlHttp.send(null);
	get_meaning(mode);
}

function refresh_image(){
 if (xmlHttp.readyState==4)
 { 
  xmlstring = xmlHttp.responseText;
  document.getElementById('name_image').innerHTML = '<img src="temp/'+ xmlstring +'">';
  document.forms["cart_quantity"].products_custom_image.value = 'c_' + xmlstring;
  // alert('the value is : ' + document.forms["cart_quantity"].products_custom_image.value);
 }
}

function get_meaning(mode)
{
 // do the following only if there is no content already there
 
 if(mode == 0){ // means during initial load
  var orig_val = document.getElementById('id_name_desc').value;
  if(orig_val.length > 0 && orig_val != 'Please add custom text in the box.')
  {
   // set the essentials
   document.getElementById('Engraving').innerHTML ='<span class="NameMeaning">"'+ orig_val +'"</span>';
   document.getElementById('engrave_text').innerHTML = orig_val;
   return true;
  }
 }
 xmlHttp2=GetXmlHttpObject();
 var name = document.forms["cart_quantity"].id_baby_name.value;
 url="get_meaning.php";
 url=url+"?name="+name;
 xmlHttp2.onreadystatechange=refresh_meaning;
 xmlHttp2.open("GET",url,true);
 xmlHttp2.send(null);
}

function refresh_meaning(){
 if (xmlHttp2.readyState==4)
 { 
  xmlstring = xmlHttp2.responseText;
  // change engrave text
  document.getElementById('engrave_text').innerHTML = xmlstring;
  // change description text
  document.getElementById('Engraving').innerHTML ='<span class="NameMeaning">"'+ xmlstring +'"</span>';
  // change preview description
  // document.getElementById('name_meaning').innerHTML = xmlstring;
  // change the desc text
  document.getElementById('id_name_desc').value = xmlstring;
 }
}
// ajax base functions
function GetXmlHttpObject()
{
 var xmlHttp=null;
 try{ // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
 }catch (e){
  // Internet Explorer
  try{
   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }catch (e){
   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
 return xmlHttp;
}

function recreate_image()
{  
 message = document.getElementById("id_baby_name").value;
 if(message.length == 0)
 {
  alert("Please enter name of the baby");
  document.cart_quantity.id_baby_name.focus();
  return false;
 }
 // place any other field validations that you require here
 // validate myradiobuttons
 myOption = -1;
 for (i=document.cart_quantity.id_color_choice.length-1; i > -1; i--) {
 if (document.cart_quantity.id_color_choice[i].checked) {
  myOption = i; i = -1;
  myOption =document.cart_quantity.id_color_choice[myOption].value;
  }
 }
 if (myOption == -1) {
  alert("You must select a color choce");
  document.cart_quantity.id_color_choice.focus();
  return false;
 }
}