function getElementPosition(elemID) 
{
    var offsetTrail = document.getElementById(elemID);
    var offsetLeft = 0;
    var offsetTop = 0;
    while (offsetTrail) {
        offsetLeft += offsetTrail.offsetLeft;
        offsetTop += offsetTrail.offsetTop;
        offsetTrail = offsetTrail.offsetParent;
    }
    if (navigator.userAgent.indexOf("Mac") != -1 && 
        typeof document.body.leftMargin != "undefined") {
        offsetLeft += document.body.leftMargin;
        offsetTop += document.body.topMargin;
    }
    return {left:offsetLeft, top:offsetTop};
}

	function Select(code)
	{
	    var status = new Array();
	    var objs = new Array();
	    var count = 0;
	    
	    var objDiv = document.getElementById("popupContainer");
	    var name = "Checkbox_Option_";
	   
	    for(var i=0; i<objDiv.childNodes.length; i++)	    
	    {
	        try
	        {
	            if(objDiv.childNodes[i].id && objDiv.childNodes[i].id.toString().indexOf(name) != -1)
	            {	     
	                status[count] = document.getElementById(objDiv.childNodes[i].id).checked;
	                objs[count] =  document.getElementById(objDiv.childNodes[i].id);       
	                count++;
    	            
	                document.getElementById(objDiv.childNodes[i].id).checked = objDiv.childNodes[i].checked;            
	            }
            }
	        catch(e) { }
	    }	  
	    
	    //check the status of checkboxes.
	    //if status are equal no need to call Make Total
	    for(var j=0; j<status.length; j++)
	    {
	        try
	        {
	            var obj = objs[j];
	            var id = obj.id;
	            if(obj.checked != status[j])
	            {	
	                id = GetCode2(obj.id.toString());                  	            
	                //instead of innerText innerHTML as FF does not support innerText
	                 MakeTotal(obj,
	                    document.getElementById("Span_Invoice_"+id).innerHTML, 
	                    document.getElementById("Span_Msrp_"+id).innerHTML
	                 );           
	            }
            }
	        catch(e) { }
	    }    
	     
	    try
	    {
	        MakeTotal(document.getElementById("Checkbox_Option_"+code),
	                document.getElementById("Span_Invoice_"+code).innerHTML, 
	                document.getElementById("Span_Msrp_"+code).innerHTML
	        );	
	    }
	    catch(e) { }            
	        
	    
	    objDiv.innerHTML = "";
		objDiv.style.visibility = "hidden";	 
		IsDialogOpened = false;   
	}
	
	function GetCode2(str)
	{   
	     var id = str.replace("Checkbox_Option_","");           	     
         return id;
	}
	
/////////////////////////////////////////////////////////////////////////

var sCode;
var sStyleId;
var selCode;

function Call_Server(styleid, code, serializedValue, selectedCodes) 
{ 	    
    sCode = code;    
    sStyleId = styleid;
    	
    var uPath = document.getElementById("hdnUrl").value;
    var browser = document.getElementById("hdnBrowserName").value;
    
    var url = uPath + "web/Ajax/PriceOptionsAjax.aspx?toggleOption=1&styleid=" + styleid + "&code=" + escape(code) + "&serValue="+ escape(serializedValue) + "&selCodes="+ escape(selectedCodes);
    
    var xmlHttpObjVehicle = false;
    if (window.XMLHttpRequest) 
    {	    
	    xmlHttpObjVehicle = new XMLHttpRequest(); 
	    if (xmlHttpObjVehicle.overrideMimeType) 
	    { 
		    xmlHttpObjVehicle.overrideMimeType('text/xml');     		
	    } 
		
    } 
    else if (window.ActiveXObject) 
    { 
	    // IE 
    try 
    { 
	    xmlHttpObjVehicle = new ActiveXObject("Msxml2.XMLHTTP");
    } 
    catch (e) 
    { 
    try 
    { 
	    xmlHttpObjVehicle = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    catch (e) 
    {} 
    } 
    } 
	    if (!xmlHttpObjVehicle) 
	    { 
		    //return false; 
	    } 	   		    
        
	    xmlHttpObjVehicle.onreadystatechange = function() { getToggleOption(xmlHttpObjVehicle); };
	    if(browser == "IE")
	        xmlHttpObjVehicle.open('POST', url, true);
	    else 
	        xmlHttpObjVehicle.open('GET', url, true);
		    
		this.transferComplete = false;
	    xmlHttpObjVehicle.send(null);	
	    ShowLoading();    
}

		
/////////////////////////////////////////////////////////////////////////

//

var sTrace = "";

// arrays to contain data 
var deleteOptions;
var requiredOptions; 
var includedOptions;
var selectedOptions;
var unselectedOptions;
var oneSelectOption;

var iDelIndex = 0; // delete option index
var iReqIndex = 0; // required option index
var iIncIndex = 0; // include option index
var iSelIndex = 0; // selected option index
var iUnselIndex = 0; // unselected option index
var iOneSelIndex = 0;
var oldMsrp = 0;
var oldTip = 0;
var oldOptionsPrice = 0;

// this function will get the toggle Options
function getToggleOption(xmlHttpObjVehicle) 
{   
  if (xmlHttpObjVehicle.readyState == 4 && xmlHttpObjVehicle.status == 200) 
  {          
       HideLoading();  
       var option = "";       
       option = xmlHttpObjVehicle.responseText;       
       
       if(option == "")
            return "";
            
       if(option == "error")
       {
           alert("Sorry! your request could not be processed. Server too busy. Please try later.");
           try
           {
                 document.getElementById("Checkbox_Option_"+ sCode).disabled = false; 
                 document.getElementById("Checkbox_Option_"+ sCode).checked = !(document.getElementById("Checkbox_Option_"+ sCode));
           }
           catch(e) {}
           IsInProcess = false;
           return "";
       }
             
       var options = option.split("|");
       
       // the first value at index 0 is serialized value
       document.getElementById("hdnSerializedValue").value = options[0];       
       oldMsrp = document.getElementById(document.getElementById("hdnTotalCost").value).innerHTML;
       oldOptionsPrice = document.getElementById("optionTotalPrice").innerHTML;
       oldTip = document.getElementById(document.getElementById("hdnTotalTip").value).innerHTML;
       
       document.getElementById(document.getElementById("hdnTotalCost").value).innerHTML =  "$" + options[1];       
       document.getElementById("optionTotalPrice").innerHTML = "$" + options[3];
       
       UpdateTipPrice(options[1]);
       
            
       // now get the option and their description       
       var cols;
       
       var strRemove = "";
       var strSelectOne = "";
       
       var strTableHtml = "<table border='0' cellSpacing='2' cellPadding='1' class=\"tbl_popup\">";
       strTableHtml += "<tr><td colSpan='2' align='left' valign='middle'><strong>&nbsp;&nbsp;OPTIONS:</strong></td></tr>";
       strTableHtml += "<tr><td colSpan='2'>&nbsp;</td></tr>";
       
       // to contain the data.
       deleteOptions = new Array();
       requiredOptions = new Array();
       includedOptions = new Array();
       selectedOptions = new Array();
       unselectedOptions = new Array();
       oneSelectOption = new Array();
       
       // reset the index
       iReqIndex = 0;
       iIncIndex = 0;
       iDelIndex = 0;
       iSelIndex = 0;
       iUnselIndex = 0;
       iOneSelIndex = 0;
       
       selCode = "";
       
       var uPath = document.getElementById("hdnUrl").value;
       
       for(var i=4; i<options.length; i++)
       {
            cols = options[i].split("@");
            
            var optionCode = cols[0];
            var optionName = cols[1];
            var optionState = cols[2];
            
            // code @ optionName @ selectionState
                   
            if(optionState.toLowerCase() == "selected")
            {
                selectedOptions[iSelIndex++] = optionCode;
            }
            else if(optionState.toLowerCase() == "included")
            {
                includedOptions[iIncIndex++] = optionCode;                    
            }
            else if(optionState.toLowerCase() == "required")
            {
                requiredOptions[iReqIndex++] = optionCode;
            }
                           
            else if(optionState.toLowerCase() == "unselected")  
            {   
                unselectedOptions[iUnselIndex++] = optionCode;
            }    
            else if(optionState.toLowerCase() == "excluded")            
            {
                try
                {
                    if(document.getElementById("Checkbox_Option_" + cols[0]).checked)
                    {
                        strRemove += "<tr><td valign=\"top\">&nbsp;&nbsp;<img src=\"" + uPath + "web/images/remove.jpg\" alt=\"remove\" />&nbsp;&nbsp;</td>";
                        strRemove += "<td><span id='delete_" + cols[0] +"' name='optionDeleteGroup'>" + document.getElementById("Span_Detail_"+ cols[0]).innerHTML + ".</span></td></tr>";                        
                        deleteOptions[iDelIndex++] = optionCode;
                    }
                }
                catch(e) { }               
            }
         
            else if(optionState == "SELECT_ONE")
            {
                try
                {
                    strSelectOne += "<tr><td><input type='radio' id='radio_" + optionCode + "' name='optionGroup1' /></td>";
                    strSelectOne += "<td>"+ document.getElementById("Span_Detail_"+optionCode).innerHTML + ".</td></tr>";                                    
                    oneSelectOption[iOneSelIndex++] = optionCode;
                }
                catch(e) { }                
            }
            else if(optionState == "REMOVE")
            {
                strRemove += " ";               
            }
       }
       
       if(strSelectOne != "")
            strSelectOne = "<tr><td colSpan='2' align='center'>Choose any ONE from these options:</td></tr>" + strSelectOne ;
            
       else if(deleteOptions.length > 0)
            strRemove = "<tr><td colSpan='2' align='center'>Following option(s) will be REMOVED: </td></tr>" + strRemove;
       
       var strButton = "";
       
       if(oneSelectOption.length > 0 != "" || deleteOptions.length > 0 != "")  
       {
           strButton = "<tr><td colSpan='2' align='center'>&nbsp;</td></tr>";
           strButton += "<tr><td colSpan='2' align='center'><a href='javascript:Accept();'><strong>Accept</strong></a>&nbsp;&nbsp;<a href='javascript:Cancel();'><strong>Cancel</strong></a></td></tr>";
       
           var objDiv = document.getElementById("popupContainer");
           objDiv.innerHTML = strTableHtml + strSelectOne +  strRemove + strButton + "</table>";
           objDiv.style.display = "";
           IsDialogOpened = true;         
       }
       else
       {
            EnforceSelectedOptions();
            EnforceUnselectedOptions();            
            EnforceIncludedOptions();
            EnforceRequiredOptions();
       }
       
       try
       {
             document.getElementById("Checkbox_Option_"+ sCode).disabled = false; 
       }
       catch(e) {}
       IsInProcess = false;
       
       GetAllObjects();
             
  }
}

////////////////////////////////////////////////
    function Accept()
    {               
        //try
        {   
            EnforceSelectedOptions();
            EnforceUnselectedOptions();            
            EnforceDeletedOptions();
            EnforceIncludedOptions();
            EnforceRequiredOptions();
            EnforceOneSelectedOption();
            
            if(selCode != "")
            {   
                try
                {
                    Call_Server(sStyleId, selCode, document.getElementById("hdnSerializedValue").value,
                    GetSelectedCodes("Checkbox_Option_"+selCode, true));
                }
                catch(e) { }
            }            
        }        
        
        var objDiv = document.getElementById("popupContainer");
        objDiv.innerHTML = "";
        objDiv.style.display = "none"; 
        
        IsDialogOpened = false;
        
        GetAllObjects();
    }

    function Cancel()
    {
        try
        {
            var objDiv = document.getElementById("popupContainer");
            objDiv.innerHTML = "";
            objDiv.style.display = "none";
            
            document.getElementById("Checkbox_Option_"+ sCode).checked = !(document.getElementById("Checkbox_Option_"+ sCode).checked);
            IsDialogOpened = false;
            GetAllObjects();
            
            document.getElementById(document.getElementById("hdnTotalCost").value).innerHTML =  oldMsrp;            
            document.getElementById("optionTotalPrice").innerHTML = oldOptionsPrice;
            document.getElementById(document.getElementById("hdnTotalTip").value).innerHTML = oldTip;
            
            var uPath = document.getElementById("hdnUrl").value;            
            var url = uPath + "web/Ajax/PriceOptionsAjax.aspx?undo=true";
            var browser = document.getElementById("hdnBrowserName").value;
            DoAsyncCall(url, "", browser);
    
            
        }
        catch(e) { }
    }

////////////////////////////////////////////

    // is called by check boxes
    function CallToggleOptions(obj, styleId)
	{
	    var selectedCodes = GetSelectedCodes(obj.id, true);
	    try
	    {
	        Call_Server(styleId, 
	        obj.id.replace("Checkbox_Option_",""), document.getElementById("hdnSerializedValue").value,
	                selectedCodes);            
	   }
       catch(e) { }
	}
	
	// to get the codes of all the selected options 
	function GetSelectedCodes(id, includeThisObj)
	{
	    var codes = "";
	    var objs = document.getElementsByName("CheckboxOption");
	    //var objs = document.getElementsByName("CheckboxOption");
	    
	    if(includeThisObj)
	    {    	    
	        for(var elem=0; elem<objs.length; elem++)
	        {
	            try
	            {
	                if(objs[elem].checked && objs[elem].id != id)
	                {
	                    codes += objs[elem].id.replace("Checkbox_Option_","") + ", ";
	                }
                }
                catch(e) { }
	        }
	    }
	    else
	    {	            	    
	        for(var elem=0; elem<objs.length; elem++)
	        {
	            try
	            {
	                if(objs[elem].checked)
	                {
	                    codes += objs[elem].id.replace("Checkbox_Option_","") + ", ";
	                }
                }
                catch(e) { }
	        }
	    }
	    
	    // remove , from last
	    if(codes.indexOf(", ") != -1)
	        codes = codes.substring(0, codes.length - 2);
	        
	    return codes;
	}
	
	///////////////////////    ENFORCE THE CHECK BOX'S SELECTION AND DE-SELECTION   ////////////////////////
	
	// Unchecked the options
	function EnforceDeletedOptions()
	{
	    if(deleteOptions && deleteOptions.length > 0)
	    {
	        for(var delObj = 0; delObj < deleteOptions.length; delObj++)
	        {
	            try
	            {
	                var obj = document.getElementById("Checkbox_Option_" + deleteOptions[delObj]);
	                if(obj.checked)
	                {
	                    obj.checked = false;
	                }
	            }
	            catch(e){ }
	        } 
	    }
	}
	
	// Checked the required options
	function EnforceRequiredOptions()
	{
	    if(requiredOptions && requiredOptions.length > 0)
	    {
	        for(var iObj = 0; iObj < requiredOptions.length; iObj++)
	        {
	            try
	            {
	                var obj = document.getElementById("Checkbox_Option_" + requiredOptions[iObj]);	                
	                if(!obj.checked)
	                {
	                    obj.checked = true;
	                }
	                
	            }
	            catch(e)
	            { 
	               
	            }	
	        } 
	    }
	}
	
	// Checked the included options
	function EnforceIncludedOptions()
	{
	    if(includedOptions && includedOptions.length > 0)
	    {
	        for(var iObj = 0; iObj < includedOptions.length; iObj++)
	        {
	            try
	            {
	                var obj = document.getElementById("Checkbox_Option_" + includedOptions[iObj]);
	                if(!obj.checked)
	                {
	                    obj.checked = true;
	                }
	                
	            }
	            catch(e)
	            { 
	                
	            }
	        } 
	    }
	}
	
	// Checked the included options
	function EnforceUnselectedOptions()
	{
	    if(unselectedOptions && unselectedOptions.length > 0)
	    {
	        for(var iObj = 0; iObj < unselectedOptions.length; iObj++)
	        {
	            try
	            {
	                 var obj = document.getElementById("Checkbox_Option_" + unselectedOptions[iObj]);
	                 
	                 if(obj.checked)
	                 {
	                    obj.checked = false;
	                 }
	            }
	            catch(e)
	            { 
	                
	            }
	        } 
	    }
	}
	
	// Checked the included options
	function EnforceSelectedOptions()
	{
	    if(selectedOptions && selectedOptions.length > 0)
	    {
	        for(var iObj = 0; iObj < selectedOptions.length; iObj++)
	        {
	            try
	            {
	                var obj = document.getElementById("Checkbox_Option_" + selectedOptions[iObj]);
	                if(!obj.checked)
	                {
	                    obj.checked = true;	                    
	                }
	            }
	            catch(e)
	            { 
	                
	            }	            
	        } 
	    }
	}
	
	// to choose one option resolving of conflict
	function EnforceOneSelectedOption()
	{	    
        if(oneSelectOption && oneSelectOption.length > 0)
	    {
	        for(var iObj = 0; iObj < oneSelectOption.length; iObj++)
	        {
	            try
	            {
	                if(document.getElementById("radio_" + oneSelectOption[iObj]).checked)
	                {
	                    var obj = document.getElementById("Checkbox_Option_" + oneSelectOption[iObj]);
	                    if(!obj.checked)
	                    {
	                        obj.checked = true;
	                    }
	                    selCode = oneSelectOption[iObj];
	                    break;
	                }
	            }
	            catch(e)
	            { 
	                 
	            }	            
	        } 
	    }
	}	
	
	function UpdateMyOptions(objSrc, code)
	{
	    //var objParent = document.getElementById('optionsTable');
	    var objDetail = document.getElementById('Span_Detail_' + code);
	    var objPrice = document.getElementById('Span_Msrp_' + code);
	    
	    if(objSrc.checked)
	    {
	        AppendRow(code, objDetail.innerHTML, objPrice.innerHTML);	        
	    }
	}
	
	function AppendRow(code, detail, price)
	{

        var objText = document.getElementById('optionsTableText');
        
        objText.innerHTML += "<div class=\"m456-row\"><div class=\"m456-col1\" id=Span_Detail_" + code +">" + detail +"</div><div class=\"m456-col2\" id=Span_Msrp_" + code +">" + price +"</div></div>"
	}	 
	
	function CheckOption(code)
	{
	    try
	    {
	        document.getElementById("Checkbox_Option_" + code).checked = true;
	    }
	    catch(e){}
	}
	
	function UpdateTotalOptionCost(cost)
	{
	    document.getElementById("optionTotalPrice").innerHTML = cost;
	}	
	
	function DeleteRows()
	{
////	     var objParent = document.getElementById('optionsTable');
////	     var length = objParent.rows.length - 1;
////	     for(var i=0; i<length; i++)
////	     {
////	        objParent.deleteRow(objParent.rows[i]);
////	     }

        var objText = document.getElementById('optionsTableText');
        //var objPrice = document.getElementById('optionsTablePrice');
        objText.innerHTML = "";
        //objPrice.innerHTML = "";
	}
	
	function GetAllObjects()
	{
	    var objs = document.getElementsByName("Checkbox_Option");	    
	    DeleteRows();
	    
	    for(var i=0; i<objs.length; i++)
	    {
	          UpdateMyOptions(objs[i], objs[i].id.replace("Checkbox_Option_", ""));
	    }
	}
	
    function UpdateTipPrice(optionCost)
    {
        if(optionCost == null || optionCost == "")
            return;
            
        var objOrgTip = document.getElementById("hdnOrgTip");
        var objOrgMsrp = document.getElementById("hdnOrgMsrp");
        if(objOrgTip != null && objOrgMsrp != null)
        {
            if(objOrgTip.value != "" && objOrgMsrp.value != "")
            {
                var t = parseInt(objOrgTip.value);
                var m = parseInt(objOrgMsrp.value);
                var d = 1;

                if(m != 0)
                    d = t/m;
       
                if(optionCost.indexOf(",") != -1)
                {
                    var index = optionCost.indexOf(",");
                    while(index != -1)
                    {
                        optionCost = optionCost.replace(",", "");
                        index = optionCost.indexOf(",");
                    }
                }
                
                optionCost = optionCost.replace("$", "");

                var newTip = d * optionCost;
                
                var objTip = document.getElementById(document.getElementById("hdnTotalTip").value);
                objTip.innerHTML = "$" + ToMoney(Math.round(newTip));
            }
        }
    }
    
    function GetTip(msrp)
    {
        var objOrgTip = document.getElementById("hdnOrgTip");
        var objOrgMsrp = document.getElementById("hdnOrgMsrp");
        var d = 1;
        if(objOrgTip != null && objOrgMsrp != null)
        {
            if(objOrgTip.value != "" && objOrgMsrp.value != "")
            {
                var t = parseInt(objOrgTip.value);
                var m = parseInt(objOrgMsrp.value);               

                if(m != 0)
                    d = t/m;
            }
        }
        
        if(msrp.indexOf(",") != -1)
        {
            var index = msrp.indexOf(",");
            while(index != -1)
            {
                msrp = msrp.replace(",", "");
                index = msrp.indexOf(",");
            }
        }
        
        msrp = msrp.replace("$", "");
                
        return Math.round(msrp * d).toString();
    }
	
/////////////////////////////////////////////////////////////////

function ShowLoading()
{
    var obj = document.getElementById("showLoading");
    obj.style.display = "";
}

function HideLoading()
{
    var obj = document.getElementById("showLoading");
    obj.style.display = "none";
}