/***********************************************
* Cool DHTML tooltip script II- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var offsetfromcursorX=12 //Customize x offset of tooltip
var offsetfromcursorY=10 //Customize y offset of tooltip

var offsetdivfrompointerX=10 //Customize x offset of tooltip DIV relative to pointer image
var offsetdivfrompointerY=14 //Customize y offset of tooltip DIV relative to pointer image. Tip: Set it to (height_of_pointer_image-1).

document.write('<div id="dhtmltooltip"></div>') //write out tooltip DIV
document.write('<img id="dhtmlpointer" src="'+path+'images/arrow2.gif">') //write out pointer image

var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

var pointerobj=document.all? document.all["dhtmlpointer"] : document.getElementById? document.getElementById("dhtmlpointer") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function ddrivetip(thetext, thewidth, thecolor){
if (ns6||ie){
if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.innerHTML=thetext
enabletip=true
return false
}
}

function positiontip(e){
if (enabletip){
var nondefaultpos=false
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var winwidth=ie&&!window.opera? ietruebody().clientWidth : window.innerWidth-20
var winheight=ie&&!window.opera? ietruebody().clientHeight : window.innerHeight-20

var rightedge=ie&&!window.opera? winwidth-event.clientX-offsetfromcursorX : winwidth-e.clientX-offsetfromcursorX
var bottomedge=ie&&!window.opera? winheight-event.clientY-offsetfromcursorY : winheight-e.clientY-offsetfromcursorY

var leftedge=(offsetfromcursorX<0)? offsetfromcursorX*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth){
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=curX-tipobj.offsetWidth+"px"
nondefaultpos=true
}
else if (curX<leftedge)
tipobj.style.left="5px"
else{
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetfromcursorX-offsetdivfrompointerX+"px"
pointerobj.style.left=curX+offsetfromcursorX+"px"
}

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight){
tipobj.style.top=curY-tipobj.offsetHeight-offsetfromcursorY+"px"
nondefaultpos=true
}
else{
tipobj.style.top=curY+offsetfromcursorY+offsetdivfrompointerY+"px"
pointerobj.style.top=curY+offsetfromcursorY+"px"
}
tipobj.style.visibility="visible"
if (!nondefaultpos)
pointerobj.style.visibility="visible"
else
pointerobj.style.visibility="hidden"
}
}

function hideddrivetip(){
if (ns6||ie){
enabletip=false
tipobj.style.visibility="hidden"
pointerobj.style.visibility="hidden"
tipobj.style.left="-1000px"
tipobj.style.backgroundColor=''
tipobj.style.width=''
}
}

document.onmousemove=positiontip

function v()
{}

//*************************************************************************************************************
////////////////////////////////////////////  START SLIDER EVENT CAPTURE    ///////////////////////////////////

var arrImages = new Array();

// to hold the styles and years for comparing vehicles.
var arrStyles = new Array();
var arrYears = new Array();
var arrCompare = new Array();

function ShowImage(e, index)
{
	if(!e)	e = window.event || event;
	
	var objDiv = document.getElementById("divImage");		
	var path = document.getElementById("hdnUrl").value;		
	if(arrImages[index])
	{
	    objDiv.appendChild(arrImages[index]);	    
	    
	}
	else
	    objDiv.innerHTML = "Loading...";	
	objDiv.style.left= e.clientX + ietruebody().scrollLeft + 15;
	objDiv.style.top = e.clientY + ietruebody().scrollTop;
	objDiv.style.display = "block";
		
    var obj = (e.srcElement) ? e.srcElement : e.target; 
    obj.style.cursor = "pointer";   
}

function HideImage(obj)
{
	var objDiv = document.getElementById("divImage");
	if(objDiv.lastChild)
	    objDiv.removeChild(objDiv.lastChild);
	objDiv.innerHTML = "";
	objDiv.style.display = "none";
	
	document.body.style.cursor = '';
}

function ChangeColor(obj, change)
{ 
    if(change)
    {
        obj.bgColor = "#CCC0C0";
    }
    else
    {
        obj.bgColor = "";
    }
}

// this function is used to restrict the vehicles for comparison.
// as there is limit of 4 vehicles to be compare.
function CheckLimit(obj)
{
    if(obj.checked)
    {
        var TotalChecked = 0;
        var objs = document.getElementsByName("chkBxComparisonGroup");
        for(var i=0; i<objs.length; i++)
        {
            if(objs[i].checked)
                TotalChecked++;
                
            if(TotalChecked > 3)
            {
                alert("Only three vehicles can be compared at one time.");
                obj.checked = false;
                break;
            }
        }
       
    }
}

// this function sends redirects the page for comparison

function GoToCompare()
{
    var objs = document.getElementsByName("chkBxComparisonGroup");
    var siteUrl = document.getElementById("hdnUrl").value;
    var index = 0;
    var year1 = null, make1 = null, model1 = null, year2 = null, make2 = null, model2 = null,
        year3 = null, make3 = null, model3 = null;
    
    for(var i=0; i<objs.length; i++)
    {
        if(objs[i].checked)
        {
            compare = arrCompare[i].split('|');
            
            if(year1 == null || make1 == null || model1 == null){
                year1 = compare[0]; make1 = compare[1]; model1 = compare[2];
            }
            else if(year2 == null || make2 == null || model2 == null){
                year2 = compare[0]; make2 = compare[1]; model2 = compare[2];
            }
            else if(year3 == null || make3 == null || model3 == null){
                year3 = compare[0]; make3 = compare[1]; model3 = compare[2];
            }

            compare = null;
            index++;
        }
    }
    
    if(index <= 1)
        alert("There should be minimum two vehicles to compare.");
    else 
        window.location.href = getCompareURL(siteUrl, year1, make1, model1, year2, make2, model2, year3, make3, model3);     
}

function GetSelectedSliders()
{
    // these names are same as of DB
    var arrSliderName = new Array(
                                "Safety",
                                "Reliability",
                                "Mileage",
                                "Style",
                                "Price",
                                "Cost-of-Ownership",
                                "Fit and Finish",
                                "Drive System",
                                "Electronics",
                                "Performance",
                                "Warranty",
                                "Drivability & Comfort",
                                "Child Friendly",
                                "Fuel Selection",
                                "Towing Capacity"
                                );
                                
    
    var sSelectedSliders = "";
    // to get the selectd sliders    
    var objs = document.getElementsByName("slider_option");    
    var objHdn = document.getElementById("hdnSlider_data");    
    for(var i=0; i<objs.length; i++)
    {   try
        {
            // check if option is selected and its data really found in hidden variable.
            if(objs[i].checked && objHdn.value.indexOf(objs[i].id) != -1)
            {            
                // then get the id of slider
                var no = objs[i].id.replace("CheckBox_slider_","");
                no = no.substring(no.indexOf("_")+1, no.length );
                sSelectedSliders += arrSliderName[no-1] + ", ";
            }
        }
        catch(e){ }
   }
   
   if(sSelectedSliders.indexOf(", ") != -1)
        sSelectedSliders = sSelectedSliders.substring(0, sSelectedSliders.length - 2);
        
   // now replace the last ", " with " and "
   if(sSelectedSliders != "")
   {       
       var arrData = sSelectedSliders.split(", ");
       sSelectedSliders = "";
       for(var i=0; i<arrData.length - 1; i++)
            sSelectedSliders += arrData[i] + ", ";
            
       if(sSelectedSliders.indexOf(", ") != -1)
            sSelectedSliders = sSelectedSliders.substring(0, sSelectedSliders.length - 2);
            
       sSelectedSliders += " and " + arrData[arrData.length-1];
       sSelectedSliders = "Results are based on the following sliders you choosed:<br/> " + sSelectedSliders;
   }  
   return sSelectedSliders;
}

function PrintResults()
{    
    if(document.getElementById("TableGridRow").innerHTML == "" || document.getElementById("TableGridRow").innerHTML.toLowerCase().indexOf("no record") != -1)
    {
        alert("There are no results to print.");
        return;
    }
    var objIframe = document.getElementById("ifPrintResult");
    var html = "<html><head><title>Results</title><style> .style17 {font-size: 11px} </style></head><body>";
    
    html += "<div style='width:100%'><img align='right' src='images/popup-bak.gif' alt='logo' /></div><br/>";
    
    html += window.location.href + "<br/><br/>";
    html += "Life style : " + document.getElementById("spnStlName").innerHTML + "<br/>";
    html += "Price range : <b>$" + ToMoney(document.getElementById("hdnFromValue").value) + "</b> - <b>$" + ToMoney(document.getElementById("hdnToValue").value) + "</b><br/><br/>";
    html += GetSelectedSliders() + ".<br/><br/>";
    objIframe.contentWindow.document.body.innerHTML =  html + document.getElementById("hdnData").value+ "</body></html>";    
    
    frames["ifPrintResult"].focus();
    frames["ifPrintResult"].print();    
}

function EmailResults()
{
    var objTr = document.getElementById("trEmailData");
    if(objTr.style.display == "none")
    {
        objTr.style.display = "";
    }
    else
    {
        objTr.style.display = "none";        
    }   
}


  
function SliderEvent()
{    
    var xmlHttp = false;
    this.BuildQuery = BuildQuery;
    
    function BuildQuery()
    {       
                
        // get the menu's checked options on that basis get the hidden fields
        // on the basis of that generate the criteria
        
        // as in this, data is seperated with | sign.
        var objHdnSlider= document.getElementById("hdnSlider_data");
        
        // to remove last occurance of  |
        var objHdnSliderData = objHdnSlider.value.substring(0, objHdnSlider.value.length - 3);
        
        var arrSliderData = objHdnSliderData.split(" | ");
        
        var hdnFieldName = null;
        
        var queryStr = "";
        
        for(var i=0; i<arrSliderData.length; i++)
        {
            hdnFieldName = arrSliderData[i].replace("CheckBox_slider_","");
           
            // part between CheckBox_slider_ and _Number is the name of hidden field
            var name = hdnFieldName.substring(0, hdnFieldName.indexOf("_"));
            hdnFieldName = "hdn"+name;
            
            // get the no. use in query
            var no = arrSliderData[i].replace("CheckBox_slider_","");
            no = no.substring(no.indexOf("_")+1, no.length);  
            
            var value = "";
            
            try
            {
                value = document.getElementById(hdnFieldName).value;
            }
            catch(e) { }
            
            // values to be passed for parsing will be @ sign delimited.
            // it will become as sliderId = sliderValue @ ....
            queryStr += no + "="+ GetKey(value) + " @ ";  
            
            // as its removed know the key & value pair. there is just value.
            //queryStr += no + "="+ value + " @ ";  
        } 
        
        if(queryStr.indexOf(" @ ") != -1)
            queryStr = queryStr.substring(0, queryStr.length - 3);
                
        var sFrom = document.getElementById("hdnFromValue");
        var sTo = document.getElementById("hdnToValue");
        
        var from = sFrom.value;
        var to = sTo.value;
               
        var path = document.getElementById("hdnUrl").value;
        
        var sBodyStyles = GetBodyStyles();
        
        var url = path + "AJAX/AJAXHandler.aspx?wsgv=1&wsmiv=" + escape(from) + "&wsmxv="+ escape(to) +"&wsqs="+escape(queryStr) + "&wsbodystyles=" + escape(sBodyStyles)+"&keyindicator="+ escape(document.getElementById("hdnKEY__INDICATOR").value);  
        
        //document.getElementById("TableGridRow").innerHTML = "<img src=\"images/loading.gif\" />";
        document.getElementById("divLoading").style.display = "block";
        CallServer(url, getVehicles);        
        
    }
    
    function GetKey(value)
    {
        if( value == "") 
            return;
        
        // as values in hidden field is in order of key & value split it
        
        value = value.split(" & ");
        
        // at 0th index its the key.
        //return value[0];  
        
        // now we need percentage of importance         
        return value[1];
    }
    
     
    function getVehicles() 
    {   
        try
        {
          if (xmlHttp.readyState == 4) 
          {     
                // request fulfilled.           
                
                var vehicles = "";
            
                vehicles = xmlHttp.responseText;
               
                 // if no data is present then return.
                if(vehicles == "" || vehicles == null)
                {
                    EnableBodyStyles();  
                    document.getElementById("TableGridRow").innerHTML = "No Record Present.";
                }     
                else
                {
                    var sUrl = document.getElementById("hdnUrl").value;
                    var sExtRev = document.getElementById("hdnExtReview").value;
                    var sExt = document.getElementById("hdnExt").value;
                    // to contain the html

                    var gridHtml = "<table width=\"100%\" border=\"0\" cellSpacing=\"3\" cellPadding=\"3\">";
                    gridHtml += "<tr><td height=\"25px\" bgcolor=\"#999999\" class=\"style26\">VEHICLE</td>";
                    gridHtml += "<td bgcolor=\"#999999\" class=\"style26\">BASE PRICE</td>";
                    gridHtml += "<td bgcolor=\"#999999\" class=\"style26\">GAS MILEAGE</td>";
                    gridHtml += "<td bgcolor=\"#999999\" class=\"style26\">GET TIP™ DEALER QUOTE</td>";
                    gridHtml += "<td bgcolor=\"#999999\" class=\"style26\">COMPARE</td></tr>";
                    
                    var gridHtml2 = "<table width=\"100%\" border=\"0\" cellSpacing=\"3\" cellPadding=\"0\">";
                    gridHtml2 += "<tr><td height=\"25px\" bgcolor=\"#999999\" class=\"style26\">VEHICLE</td>";
                    gridHtml2 += "<td bgcolor=\"#999999\" class=\"style26\">BASE PRICE</td>";
                    gridHtml2 += "<td bgcolor=\"#999999\" class=\"style26\">GAS MILEAGE</td></tr>";
                    
                    

                    //as data come @ delimited cols and | delimited rows       

                    var vehRows = vehicles.split("|");

                    var vehCols = null;
                    var bgColor = "";

                    // for paging purpose
                    pageContainer = new Array(); // reinitialize array
                    var pageCount = 0; 
                    var pageNo = 0;

                    for(var i=0; i<vehRows.length; i++)
                    {  
                           if( i % 2 == 0)
                           { 
                                bgColor = "#E1E1E1";
                           }
                           else
                           {
                                bgColor = "";
                           }
                           
                            // make @ model @ trim @ msrp @ imageName @ fuel Economoy @ year @styleid
                            
                          vehCols = vehRows[i].split("@");
                          
                          gridHtml2 += "<tr bgColor=\""+bgColor+"\" onmouseover=\"this.bgColor='#FFCC00';\" onmouseout=\"this.bgColor='"+bgColor+"';\">";    
                          gridHtml2 += "<td align=\"left\" onmousemove=\"ShowImage(event," + i +");\" onmouseout=\"HideImage(this);\" onmouseover=\"this.cursor='pointer';\"><strong>" + vehCols[6] + " " + vehCols[0]+" "+ vehCols[1] + "</strong></td>";
                          gridHtml2 += "<td align=\"left\"><span class=\"style17\">"+vehCols[3]+"</span></td>";
                          gridHtml2 += "<td align=\"left\"><span class=\"style17\">"+ vehCols[5] +"</span></td>";               
                          gridHtml2 += "</tr>";
                                            
                          // to load images
                          arrImages[i] = new Image();                  
                          arrImages[i].src = sUrl + "images/jpg_v2_" + vehCols[6] + "_Med/"+ vehCols[4];
                          
                          arrStyles[i] = vehCols[7];
                          arrYears[i] =  vehCols[6];
                          
                          arrCompare[i]= vehCols[6]+"|"+vehCols[0]+"|"+vehCols[1];
                          
                          if(pageCount < PAGE_SIZE - 1)
                          {	
                              pageCount++;
                              
                              gridHtml += "<tr bgColor=\""+bgColor+"\" onmouseover=\"this.bgColor='#FFCC00';\" onmouseout=\"this.bgColor='"+bgColor+"';\">";    
                              gridHtml += "<td align=\"left\" onmousemove=\"ShowImage(event," + i +");\" onmouseout=\"HideImage(this);\" onmouseover=\"this.cursor='pointer';\"><strong><a href=\""+ getYearMakeModelReviewURL(sUrl,vehCols[6], vehCols[0], vehCols[1]) + "\" class=\"style17\">" + vehCols[6] + " " + vehCols[0]+" "+ vehCols[1] + "</a></strong></td>";
                              gridHtml += "<td align=\"left\"><span class=\"style17\">$"+vehCols[3]+"</span></td>";
                              gridHtml += "<td align=\"left\"><span class=\"style17\">"+ vehCols[5] +"</span></td>";
                              gridHtml += "<td align=\"left\"><a href=\""+ getYearMakeModelURL(sUrl, vehCols[6], vehCols[0], vehCols[1]) + "\" ><img src=\"images/price-quote.gif\" width=\"120\" height=\"16\" /></a></td>";
                              gridHtml += "<td align=\"center\"><input type=\"checkbox\" id=\"chkComp" + i + "\" name=\"chkBxComparisonGroup\" onclick=\"CheckLimit(this);\" /></span></td>";
                              gridHtml += "</tr>";
                              
                          }
                          else
                          {
                              gridHtml += "<tr bgColor=\""+bgColor+"\" onmouseover=\"this.bgColor='#FFCC00';\" onmouseout=\"this.bgColor='"+bgColor+"';\">";                              
                              gridHtml += "<td align=\"left\" onmousemove=\"ShowImage(event," + i +");\" onmouseout=\"HideImage(this);\" onmouseover=\"this.cursor='pointer';\"><strong><a href=\""+ getYearMakeModelReviewURL(sUrl,vehCols[6], vehCols[0], vehCols[1]) +"\" class=\"style17\">" + vehCols[6] + " " + vehCols[0]+" "+ vehCols[1] + "</a></strong></td>";
                              gridHtml += "<td align=\"left\"><span class=\"style17\">$"+vehCols[3]+"</span></td>";
                              gridHtml += "<td align=\"left\"><span class=\"style17\">"+ vehCols[5] +"</span></td>";                          
                              gridHtml += "<td align=\"left\"><a href=\""+ getYearMakeModelURL(sUrl, vehCols[6], vehCols[0], vehCols[1]) + "\" ><img src=\"images/price-quote.gif\" width=\"120\" height=\"16\" /></a></td>";
                              gridHtml += "<td align=\"center\"><input type=\"checkbox\" id=\"chkComp" + i + "\" name=\"chkBxComparisonGroup\" onclick=\"CheckLimit(this);\" /></span></td>";
                              gridHtml += "</tr>";
                              gridHtml += "</table>";
                              
                              // to add a GO button at the end.
                              gridHtml += "<table width=\"100%\" border=\"0\" cellSpacing=\"0\" cellPadding=\"0\">";
                              gridHtml += "<tr><td width=\"30%\">&nbsp;</td><td width=\"15%\">&nbsp;</td><td width=\"15%\">&nbsp;</td><td width=\"30%\">&nbsp;</td><td width=\"10%\" align=\"center\">&nbsp;<input type=\"button\" value=\" GO \" onclick=\"GoToCompare();\" \></td></tr>";
                              gridHtml += "</table>";
                              
                              pageContainer[pageNo++] = gridHtml;
                              gridHtml = "<table width=\"100%\" border=\"0\" cellSpacing=\"3\" cellPadding=\"3\">";
                              pageCount = 0;							
                         }
                    }	                         

                    if(pageCount > 0 && pageCount < PAGE_SIZE)
                    {                 
                        gridHtml += "</table>";
                        // to add a GO button at the end.
                        gridHtml += "<table width=\"100%\" border=\"0\" cellSpacing=\"0\" cellPadding=\"0\">";
                        gridHtml += "<tr><td width=\"30%\">&nbsp;</td><td width=\"15%\">&nbsp;</td><td width=\"15%\">&nbsp;</td><td width=\"30%\">&nbsp;</td><td width=\"10%\" align=\"center\"><input type=\"button\" value=\" GO \" onclick=\"GoToCompare();\" \></td></tr>";
                        gridHtml += "</table>";
                                          
                        pageContainer[pageNo++] = gridHtml;
                        pageCount = 0;
                    }                 
                    
                    gridHtml2 += "</table>";
                           
                    document.getElementById("TableGridRow").innerHTML = PageManager(); 
                    document.getElementById("hdnData").value = gridHtml2;
                                    
                    EnableBodyStyles();  
                }
                document.getElementById("divLoading").style.display = "none";
            }
        }
        catch(e){}
    }
    
    
     function CallServer(url, funcName) 
     { 	    	
        var br=document.getElementById("hdnBrowserName").value; 
        
        if (window.XMLHttpRequest) 
        {	        
	        xmlHttp = new XMLHttpRequest(); 
	        if (xmlHttp.overrideMimeType) 
	        { 
		        xmlHttp.overrideMimeType('text/xml');     		
	        } 
    		
        } 
        else if (window.ActiveXObject) 
        { 
	        // IE 
        try 
        { 
	        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");	        
        } 
        catch (e) 
        { 
        try 
        { 
	        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 	        
        } 
        catch (e) 
        {} 
        } 
        } 
	        if (!xmlHttp) 
	        { 
		        //return false; 
	        } 	   		    
           
	        xmlHttp.onreadystatechange = funcName;
	        if(br=="IE")
	            xmlHttp.open('POST', url, true);
	        else
	            xmlHttp.open('GET', url, true);
    		    
		    this.transferComplete = false;
		    
		    bRequestStatus = true;
	        xmlHttp.send(null); 	        
    }
    
    function GetBodyStyles()
    {
        /* 
           The name of all check boxes are same that is chk_BodyStyles.
           The naming convention of body styles is as
           checkbox id = chk_stylename 
           'space' is replaced by '_spc_'
           '/' is replaced by '_or_'
           so beaware to get the original style.
        */
    
        var objChks = document.getElementsByName("chk_BodyStyle");
        var sStyles = "";
        var sBodyStyle = "";
        
        for(var i = 0; i < objChks.length; i++)
        {
            if(objChks[i].checked)
            {
                sBodyStyle = objChks[i].id.replace("chk_", "");
                sBodyStyle = StringReplace(sBodyStyle, "_or_", "/");
                sBodyStyle = StringReplace(sBodyStyle , "_spc_", " ");
                
                sStyles += "'" + sBodyStyle + "',";    
            }    
        }
        
        if(sStyles.indexOf(",") != -1)
            sStyles = sStyles.substring(0, sStyles.length - 1);
          
        return sStyles;
    }
    
    function StringReplace(sText, sOld, sNew)
    {
        if(sText == null || sOld == null || sNew == null)
            return sText;
            
        var index = sText.indexOf(sOld);
        while(index != -1)
        {
            sText = sText.replace(sOld, sNew);
            index = sText.indexOf(sOld);
        }
        
        return sText;
    }                  
    
} 

function BodyStyleChange(obj)
{
    DisableBodyStyles();
    var sliderEvent = new SliderEvent();
    sliderEvent.BuildQuery();
}

function DisableBodyStyles()
{
    var objs = document.getElementsByName("chk_BodyStyle");
    
    for(var i=0; i<objs.length; i++)
    {        
       objs[i].disabled = true;
    }
}

function EnableBodyStyles()
{
    var objs = document.getElementsByName("chk_BodyStyle");
    for(var i=0; i<objs.length; i++)
    {
        objs[i].disabled = false;
    }
}

////////////////////////////////////////////  END SLIDER EVENT CAPTURE    /////////////////////////////////////
//*************************************************************************************************************