var oHTTPObject =null;

var oCloseImagePath = "";
var oLoadingImagePath = "";
var oErrorImagePath = "";

var MAKE_TAB = 0;
var BODYSTYLE_TAB = 1;
var YEAR_TAB = 2;
var PRICERANGE_TAB = 3;

var divs = new Array(4);
divs[0] = divs[1] = divs[2] = divs[3] = "";

var divxpos = new Array(4);
divxpos[0] = divxpos[1] = divxpos[2] = divxpos[3] = 0;


function urlencode(str) {
return escape(str).replace(/\+/g,'%2B').replace(/%20/g, '+').replace(/\*/g, '%2A').replace(/\//g, '%2F').replace(/@/g, '%40');
}

function loadXMLString(txt){
  try{ //Internet Explorer
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async="false";
    xmlDoc.loadXML(txt);
    return xmlDoc; 
    }
  catch(e){
    try{ //Firefox, Mozilla, Opera, etc.
      parser=new DOMParser();
      xmlDoc=parser.parseFromString(txt,"text/xml");
      return xmlDoc;
      }
    catch(e) {/*alert(e.message)*/}
    }
  return null;
}

function getHTTPObject(){
  if (window.ActiveXObject)//Internet Explorer
     return new ActiveXObject("Microsoft.XMLHTTP");
  else if (window.XMLHttpRequest)//Firefox, Mozilla, Opera, etc.
       return new XMLHttpRequest();
  else {
       return null;
  }
}

function repositionDivs(widthofcenteredcontent){
  
  for(i=0;i<4;i++)
  {
    if(document.getElementById(divs[i])){
     if(document.getElementById(divs[i]).style.display == 'block'){
        var x = divxpos[i];

           var newX = ((document.body.clientWidth-widthofcenteredcontent)/2)+x;
           x = newX>=x?newX:x;
           document.getElementById(divs[i]).style.left = x+"px";
     }
    }
  }
}

function showHideDiv(strID, x, y){
  if(document.getElementById(strID)){
    
    for(i=0;i<4;i++){
      if(divs[i] == strID){
      divxpos[i] = x;
    }
    }
    //hide all first
    for(i=0;i<divs.length;i++){
      if(document.getElementById(divs[i]))
      document.getElementById(divs[i]).style.display = 'none';
    }
    document.getElementById(strID).style.left = x+"px";
    document.getElementById(strID).style.top = y+"px";
    document.getElementById(strID).style.display = "block";
  }
}

function showHideDivCentered(strID, x, y, widthofcenteredcontent){
  if(document.getElementById(strID)){
    
    for(i=0;i<4;i++){
      if(divs[i] == strID){
      divxpos[i] = x;
    }
    }

  var newX = ((document.body.clientWidth-widthofcenteredcontent)/2)+x;
  x = newX>=x?newX:x;

    //hide all first
    for(i=0;i<divs.length;i++){
      if(document.getElementById(divs[i]))
      document.getElementById(divs[i]).style.display = 'none';
    }
    document.getElementById(strID).style.left = x+"px";
    document.getElementById(strID).style.top = y+"px";
    document.getElementById(strID).style.display = "block";
  }
}

function fillDivError(strErrorMessage, strID, iTab){
var divMake = null;
divMake = document.getElementById(strID);
divMake.removeChild(document.getElementById(strID+"_load"));

var divLoad = document.createElement("div");
divLoad.id = strID+"_load";
divLoad.style.width=divMake.style.width;
divLoad.style.height=divMake.style.height;
divLoad.style.textAlign = 'center';
divLoad.innerHTML = '<BR><BR><BR><img src="'+oErrorImagePath+'"><BR>'+strErrorMessage;
divMake.appendChild(divLoad);
}

function fillDiv(xmlDoc, strID, iTab, iSingleColumn){
var divMake = null;
var usedtabs = null;
var newtabs = null;
var items = null;

 if(xmlDoc){
 divMake = document.getElementById(strID);
 var divColumnUsed = document.createElement("div");
 divColumnUsed.className = "column_used";
 divColumnUsed.innerHTML = "<b>Used Vehicles</b><BR><BR>";

 usedtabs = xmlDoc.getElementsByTagName("usedtabs")[0];

if(usedtabs)
  maketab = usedtabs.getElementsByTagName("tab")[iTab];

if(maketab)
  items = maketab.getElementsByTagName("item");

if(items){
  for(i=0; i<items.length; i++){
    var divItem = document.createElement("div");
    if(iSingleColumn == 0)
       divItem.className = i%2==0?"left":"right";
    else
       divItem.className = "normal";

    var linkanchor = document.createElement("a");
    var picture = document.createElement("img");

    var strName = "";
    var strCount = "";
    var strLink = "";
    var strPicture = "";
   
    var oName = items[i].getElementsByTagName("name")[0];
    if(oName)
       strName = oName.childNodes[0].nodeValue;

    var oCount = items[i].getElementsByTagName("count")[0];
    if(oCount)
       strCount = oCount.childNodes[0].nodeValue;

    var oLink = items[i].getElementsByTagName("link")[0];
    if(oLink)
       strLink = oLink.childNodes[0].nodeValue;
       
    var oPicture = items[i].getElementsByTagName("picture")[0];
    if(oPicture)
    {
      if(oPicture.childNodes.length>0)
       strPicture = oPicture.childNodes[0].nodeValue;
    }

    picture.src = strPicture;

    linkanchor.href = strLink;
    var anchortext = strName + " (" + strCount + ")";
    linkanchor.appendChild(document.createTextNode(anchortext));
    if(strPicture)
    {
      divItem.appendChild(picture);
      divItem.innerHTML+="<BR>";
    }
    divItem.appendChild(linkanchor);
    divColumnUsed.appendChild(divItem);
  }
}

var divColumnNew = document.createElement("div");
divColumnNew.className = "column_new";
divColumnNew.innerHTML = "<b>New Vehicles</b><BR><BR>";

newtabs = xmlDoc.getElementsByTagName("newtabs")[0];
if(newtabs)
      maketab = newtabs.getElementsByTagName("tab")[iTab];
if(maketab)
      items = maketab.getElementsByTagName("item");

if(items){
  for(i=0; i<items.length; i++){
    var divItem = document.createElement("div");
    if(iSingleColumn == 0)
       divItem.className = i%2==0?"left":"right";
    else
       divItem.className = "normal";
    var linkanchor = document.createElement("a");

    var strName = "";
    var strCount = "";
    var strLink = "";
   
    var oName = items[i].getElementsByTagName("name")[0];
    if(oName)
       strName = oName.childNodes[0].nodeValue;

    var oCount = items[i].getElementsByTagName("count")[0];
    if(oCount)
       strCount = oCount.childNodes[0].nodeValue;

    var oLink = items[i].getElementsByTagName("link")[0];
    if(oLink)
       strLink = oLink.childNodes[0].nodeValue;
       
    var oPicture = items[i].getElementsByTagName("picture")[0];
    if(oPicture)
    {
      if(oPicture.childNodes.length>0)
       strPicture = oPicture.childNodes[0].nodeValue;
    }

    picture.src = strPicture;
       
    linkanchor.href = strLink;
    var anchortext = strName + " (" + strCount + ")";
    linkanchor.appendChild(document.createTextNode(anchortext));
    
    if(strPicture)
    {
      divItem.appendChild(picture);
      divItem.innerHTML+="<BR>";
    }
    divItem.appendChild(linkanchor);
    divColumnNew.appendChild(divItem);

  }
}

divMake.removeChild(document.getElementById(strID+"_load"));
divMake.appendChild(divColumnUsed);
divMake.appendChild(divColumnNew);
}

 return divMake;
}

function createDiv(strTitle, strID, strClassName, iTab){
var divMake = null;
if(!document.getElementById(strID))
{
  divs[iTab] = strID;

  divMake = document.createElement("div");
  divMake.id = strID;
  divMake.className = strClassName;
  divMake.innerHTML = "";

  var divHeader = document.createElement("div");
  divHeader.className = "header";
      
  var imgClose = document.createElement("img");
  imgClose.className = "closeimage";
  imgClose.src = oCloseImagePath;
  imgClose.setAttribute("onclick", "document.getElementById('"+strID+"').style.display='none'");

  divHeader.appendChild(imgClose);
  divHeader.innerHTML += strTitle;

  divMake.appendChild(divHeader);

  var divLoad = document.createElement("div");
  divLoad.id = strID+"_load";
  divLoad.style.width=divMake.style.width;
  divLoad.style.height=divMake.style.height;
  divLoad.style.textAlign = 'center';
  divLoad.innerHTML = '<BR><BR><BR><img src="'+oLoadingImagePath+'"><BR>Please Wait...';
  divMake.appendChild(divLoad);
}

return divMake;
}


function getXML(){
  if(oHTTPObject.readyState ==4){
    var xmlDoc = loadXMLString(oHTTPObject.responseText);

    if(xmlDoc){
      if(xmlDoc.documentElement.tagName == "DataFeed"){//check to see if first tag is DataFeed as expected
        fillDiv(xmlDoc, divs[MAKE_TAB], MAKE_TAB, 0);
        fillDiv(xmlDoc, divs[BODYSTYLE_TAB], BODYSTYLE_TAB, 0);
        fillDiv(xmlDoc, divs[YEAR_TAB], YEAR_TAB, 0);
        fillDiv(xmlDoc, divs[PRICERANGE_TAB], PRICERANGE_TAB, 1);
    }else{//xml returned from web service is not expected format so display error message
          var strErrorMessage = "Web Service Unavailable. Please Try Again Later.";
          fillDivError(strErrorMessage, divs[MAKE_TAB], MAKE_TAB);
          fillDivError(strErrorMessage, divs[BODYSTYLE_TAB], BODYSTYLE_TAB);
          fillDivError(strErrorMessage, divs[YEAR_TAB], YEAR_TAB);
          fillDivError(strErrorMessage, divs[PRICERANGE_TAB], PRICERANGE_TAB);
        }
    }else{//could not load the xml returned from web service so display error message
      var strErrorMessage = "Web Service Unavailable. Please Try Again Later.";
      fillDivError(strErrorMessage, divs[MAKE_TAB], MAKE_TAB);
      fillDivError(strErrorMessage, divs[BODYSTYLE_TAB], BODYSTYLE_TAB);
      fillDivError(strErrorMessage, divs[YEAR_TAB], YEAR_TAB);
      fillDivError(strErrorMessage, divs[PRICERANGE_TAB], PRICERANGE_TAB);
    }
  }
}

function xmlFeed_Init(xmlfeedurl, xmlapipath, strcloseimagepath, strloadingimagepath, strerrorimagepath){
  oHTTPObject = getHTTPObject();

  oCloseImagePath = strcloseimagepath;
  oLoadingImagePath = strloadingimagepath;
  oErrorImagePath = strerrorimagepath;

    var divMake = createDiv('<b>Nearly every make and model to choose from</b>', 'make', 'popup', MAKE_TAB);
    document.body.appendChild(divMake);

    var divBodyStyle = createDiv('<b>What fits your lifestyle?</b>', 'bodystyle', 'popup', BODYSTYLE_TAB);
    document.body.appendChild(divBodyStyle);

    var divYear = createDiv('<b>Choose Your Year</b>', 'year', 'popup', YEAR_TAB);
    document.body.appendChild(divYear);
      
    var divPriceRange = createDiv('<b>How much are you planning to spend?</b>', 'pricerange', 'popup', PRICERANGE_TAB);
    document.body.appendChild(divPriceRange);



  if(oHTTPObject){
    oHTTPObject.onreadystatechange = getXML;
    oHTTPObject.open("GET", xmlapipath+"?url="+urlencode(xmlfeedurl), true);
    oHTTPObject.send(null);
  }
}