// Set these in your calling HTML code to the pair (or both) that
// your page has visible
//var sc_id = "shippingcountry";
//var ss_id = "shippingstate";
//var bc_id = "billingcountry";
//var bs_id = "billingstate";
//var inputclass = "inputbox12lf";
//var sc_fieldname = "scountry";
//var ss_fieldname = "sstate";
//var bc_fieldname = "scountry";
//var bs_fieldname = "bstate";


function updateState(countryOption, selectName, targetSelectID, preValue) {
  var contentOutput = '';
  // this is the id of the dymanic pull down, states in our case (either shipping or billing)
  selObj = MM_findObj(targetSelectID);
  // If for some reason the user "un"selects the country, reset the state pull down
  if (countryOption.search(/Select/i) > 0) {
    selObj.innerHTML='';
    selObj.innerHTML ='<select name="'+selectName+'" id="'+selectName+'" class="'+inputclass+'"><option value="SelectSomething">--Select Country First--</option>';
    return false;
  }
  // Do we have a list of "states" to output for this country?
  if (countries[countryOption].states) {
    contentOutput = '<select name="'+selectName+'" id="'+selectName+'" class="'+inputclass+'"><option value="SelectSomething">-Select State or Province-</option>';
    for (stateLoop in countries[countryOption].states) {
      if ((preValue == countries[countryOption].states[stateLoop]) || (preValue == stateLoop)) {
        contentOutput+='<option selected value="'+countries[countryOption].states[stateLoop]+'">'+stateLoop+'</option>\n';
      } else {
        contentOutput+='<option value="'+countries[countryOption].states[stateLoop]+'">'+stateLoop+'</option>\n';
      }
    }
    contentOutput+='</select>\n';
    selObj.innerHTML='';
    selObj.innerHTML=contentOutput;
  } else { // This country has no state list in our system yet
    if ((preValue.length > 0) && (preValue.search(/Type your region/i) < 0)) {
      contentOutput = '<input type="text" value="'+preValue+'" "name="'+selectName+'" id="'+selectName+'" size="27" maxlength="42" class="'+inputclass+'">';
    } else {
      contentOutput = '<input type="text" onFocus="this.value=\'\'" value="(Type your region name here)" name="'+selectName+'" id="'+selectName+'" size="27" maxlength="42" class="'+inputclass+'">';
    }
    selObj.innerHTML='';
    selObj.innerHTML=contentOutput;
  } 
  return false;
}

function makeSelectRegions(cgisc, cgiss, cgibc, cgibs) {
  // Must fetch these cgi values in case we're visiting this page again
  // and the user has already filled them out
  var contentOutput = '';
  var contentOutputSC = '';
  var contentOutputBC = '';

  // retrieve all the relevant object references
  if (sc_id) {
    scObj = MM_findObj(sc_id);
  }
  if (ss_id) {
    ssObj = MM_findObj(ss_id);
  }
  if (bc_id) {
    bcObj = MM_findObj(bc_id);
  }
  if (bs_id) {
    bsObj = MM_findObj(bs_id);
  }

  // zero the HTML between their span tags
  if (sc_id) {
    scObj.innerHTML = '';
  }
  if (ss_id) {
    ssObj.innerHTML = '';
  }
  if (bc_id) {
    bcObj.innerHTML = '';
  }
  if (bs_id) {
    bsObj.innerHTML = '';
  }

  // set the states to be nothing but a message to pick a country first
  if (ss_id) {
    ssObj.innerHTML ='<select name="'+ss_fieldname+'" id="'+ss_fieldname+'" class="'+inputclass+'"><option value="SelectSomething" selected>-Select A Country First-';
  }
  if (bs_id) {
    bsObj.innerHTML ='<select name="'+bs_fieldname+'" id="'+bs_fieldname+'" class="'+inputclass+'"><option value="SelectSomething" selected>-Select A Country First-';
  }

  // These variables / objects are set in allPlaceList output set up the country pull downs

  if (sc_id) {
    contentOutputSC='<select name="'+sc_fieldname+'" id="'+sc_fieldname+'" class="'+inputclass+'" onChange="updateState(this.options[this.selectedIndex].text, ss_fieldname, ss_id,\'\');"><option value="SelectSomething">----------Select A Country---------</option>\n';
  }
  if (bc_id) {
    contentOutputBC='<select name="'+bc_fieldname+'" id="'+bc_fieldname+'"  class="'+inputclass+'" onChange="updateState(this.options[this.selectedIndex].text, bs_fieldname, bs_id,\'\');"><option value="SelectSomething">----------Select A Country----------</option>\n';
  }

  var fx = 0;
  for (countryLoop in countries) {
    fx = 0;
    if ((cgisc == countries[countryLoop].abbr) || (cgisc == countryLoop)) {
      contentOutputSC+='<option selected value="'+countries[countryLoop].abbr+'">'+countryLoop+'</option>\n';
      if (bc_id) {
        contentOutputBC+='<option value="'+countries[countryLoop].abbr+'">'+countryLoop+'</option>\n';
      }
      updateState(countryLoop, ss_fieldname, ss_id, cgiss);
      fx = 1;
    } 
    if ((cgibc == countries[countryLoop].abbr) || (cgibc == countryLoop)) {
      contentOutputBC+='<option selected value="'+countries[countryLoop].abbr+'">'+countryLoop+'</option>\n';
      if (sc_id) {
        contentOutputSC+='<option value="'+countries[countryLoop].abbr+'">'+countryLoop+'</option>\n';
      }
      updateState(countryLoop, bs_fieldname, bs_id, cgibs);
      fx = 1;
    } 
    if (fx == 0) {
      contentOutput+='<option value="'+countries[countryLoop].abbr+'">'+countryLoop+'</option>\n';
    }
  }

  contentOutput+='</select>\n';
  if (sc_id) {
    scObj.innerHTML=contentOutputSC+contentOutput
  }
  if (bc_id) {
    bcObj.innerHTML=contentOutputBC+contentOutput;
  }
  return false;
}