// JScript File

var ajax1;
var ajax2;
var ajax3;
var ajax4;
var ajax5;
var ajax6;
var ajax7;
var ajax8;

var infoPanFadeDir = 0;
var infoPanOpacity = 0;
var infoPanFadeT;
var lastInfo;
var floorInfo;
var selectFloorcoveringCost;
var iDiv;

var ddlStep1_1;
var ddlStep1_2;
var ddlStep1_3;

var ddlStep2_1;
var ddlStep2_3;

var ddlStep3_1;
var ddlStep3_3;

/* Elements */
var hidFCCode;
var hidOBCode;
var hidIBCode;
var hidPCode;
var txtRugBorder;
var txtPiping;
var txtInnerBorder;
var innerBorderMap;
var hidFCInfo;
var hidFCMaxWidth;
var hidFloor;
var hidFCColour;
var hidFCColName;
var txtRugCentre;

var step1List;
var step2List;
var step3List;

var txtStep1Keyword;
var txtStep2Keyword;
var txtStep3Keyword;

var step1OrderXML;
var step2OrderXML;
var step3OrderXML;

var step1Hide;
var step2Hide;
var step3Hide;
var step4Hide;
var pageLock;

function borderColour( element ) {
    this.element = element;
    this.getValue = function() { return this.element.value; };
    this.setValue = function(value) { 
        this.element.value = value; 
        this.element.style.display = value.trim() == ""?"none":"block";
    };
}

function setVars(ePA1,ePA2,ePA3,ePA4) 
{
    hidFloor = document.getElementById("hidFloor");
    hidFCCode = document.getElementById("hidFCCode");
    hidOBCode = document.getElementById("hidOBCode");
    hidIBCode = document.getElementById("hidIBCode");
    hidPCode = document.getElementById("hidPCode");
    hidFCColour = document.getElementById("hidFCColour");
    hidFCColName = document.getElementById("hidFCColName");
    step2Disable = document.getElementById("step2Disable");
    step3Disable = document.getElementById("step3Disable");
    step4Disable = document.getElementById("step4Disable");
    txtRugBorder = document.getElementById("txtRugBorder");
    txtPiping = document.getElementById("txtPiping");
    txtInnerBorder = document.getElementById("txtInnerBorder");
    innerBorderMap = document.getElementById("innerBorderMap");
    hidFCInfo = document.getElementById("hidFCInfo");
    hidFCMaxWidth = document.getElementById("hidFCMaxWidth");
    txtRugCentre = document.getElementById("txtRugCentre");
    hidIBColour = document.getElementById("hidIBColour");
    
    hidOBColour = new borderColour(document.getElementById("hidOBColour"));
    
    
    step1Hide = document.getElementById("step1Hide");
    step2Hide = document.getElementById("step2Hide");
    step3Hide = document.getElementById("step3Hide");
    step4Hide = document.getElementById("step4Hide");
    
    step1OrderXML = document.createElement( "div" ); 
    step2OrderXML = document.createElement( "div" ); 
    step3OrderXML = document.createElement( "div" ); 
    
    step1List = document.getElementById("step1List");
    step2List = document.getElementById("step2List");
    step3List = document.getElementById("step3List");
    
    ddlStep1_1 = document.getElementById("ddlStep1_1");
    ddlStep1_2 = document.getElementById("ddlStep1_2");
    ddlStep1_3 = document.getElementById("ddlStep1_3");     
    txtStep1Keyword = document.getElementById("txtStep1Keyword");
    
    ddlStep2_1 = document.getElementById("ddlStep2_1");
    ddlStep2_3 = document.getElementById("ddlStep2_3");     
    txtStep2Keyword = document.getElementById("txtStep2Keyword");

    ddlStep3_1 = document.getElementById("ddlStep3_1");
    ddlStep3_3 = document.getElementById("ddlStep3_3");     
    txtStep2Keyword = document.getElementById("txtStep3Keyword");
    
    
    
    txtStep3Keyword = document.getElementById("txtStep3Keyword");  /***********************/
        

    ajax1 = ePA1;
    ajax2 = ePA2;   
    ajax3 = ePA3;   
    ajax4 = ePA4;       
}

if (this.addEventListener)
{
    //window.addEventListener("load", pageLoad, false);
} 
else if (this.attachEvent)
{
    //window.attachEvent("onload", pageLoad);
}

function pageLoad(e) {

    if (document.getElementById("freshPage").value == "0") {
        location.href = 'Default.aspx?fcode=' + hidFCCode.value + '&ocode=' + hidOBCode.value + '&icode=' + hidIBCode.value + '&floor=' + hidFloor.value + "&panel=" + $("#panel").attr("value");
    }


    document.getElementById("freshPage").value = "0";

    refreshLists = true;
    if (hidFCCode.value != "") {

        document.getElementById("floorcoveringMap").onmouseover = function() { showInfoPanel(hidFCCode.value, hidFCInfo.value); };
        if (txtRugCentre.value == "Nothing Selected") {
            refreshLists = false;
            loadInfo();
        }
    }
    if (hidOBCode.value != "") {
        document.getElementById("outerBorderMap").onmouseover = function() { showOutBorderPanel(txtRugBorder.value, hidOBCode.value); };
    }
    if (refreshLists) {
        populate_Step1();
    }

    pageLock = document.createElement("div");
    pageLock.className = "disablePage";
    document.body.insertBefore(pageLock, document.body.firstChild);

    redrawRug();
}

function hideLists() 
{
    document.getElementById( "helpPanel").style.display = "none";
    step1List.style.display = "none";
    step2List.style.display = "none";
    step3List.style.display = "none";
}

function loadInfo() 
{
    ajax4.loadXMLRequest("WebServices/Crucial.asmx/LoadRugInfo", "fcode=" + hidFCCode.value + "&obcode=" + hidOBCode.value + "&ibcode=" + hidIBCode.value, true, loadinfo_Callback);
}

function loadinfo_Callback() {
    if( ajax4.GetRequest().readyState == 4 ) 
    {
        if( ajax4.GetRequest().responseXML.documentElement.firstChild ) 
        {            
            fc = ajax4.GetRequest().responseXML.documentElement.getElementsByTagName( "floorCovering")[0];
            oBorder = ajax4.GetRequest().responseXML.documentElement.getElementsByTagName( "outerBorder")[0];
            iBorder = ajax4.GetRequest().responseXML.documentElement.getElementsByTagName( "innerBorder")[0];

            step1Hide.style.display="none";
            step2Hide.style.display="none";
            step3Hide.style.display="none";
            step4Hide.style.display="none";
            step2Hide.innerHTML = "<br /><br />Loading...";
            step3Hide.innerHTML = "<br /><br />Loading...";
            step2Hide.className = "loading";
            step3Hide.className = "loading";
            
            ddlStep1_1.innerHTML = "";
            ddlStep1_1.appendChild( document.createElement( "option" ));
            ddlStep1_1.appendChild( document.createElement( "option" ));
            ddlStep1_1.childNodes[1].setAttribute("value", fc.getAttribute("collectionID"));
            ddlStep1_1.childNodes[1].innerHTML = "<br /><br />Loading...";
            ddlStep1_1.selectedIndex=1;
            step1_1Changed();

            ddlStep2_1.innerHTML = "";
            ddlStep2_1.appendChild( document.createElement( "option" ));
            ddlStep2_1.appendChild( document.createElement( "option" ));
            ddlStep2_1.childNodes[1].setAttribute("value", oBorder.getAttribute("collectionID"));
            ddlStep2_1.childNodes[1].innerHTML = "Loading...";
            ddlStep2_1.selectedIndex=1;
            step2_1Changed();
            
            txtRugBorder.value = oBorder.getAttribute("collection") + " " + oBorder.getAttribute("colourway");

            if( iBorder ) 
            {
                ddlStep3_1.innerHTML = "";
                ddlStep3_1.appendChild( document.createElement( "option" ));
                ddlStep3_1.appendChild( document.createElement( "option" ));
                ddlStep3_1.childNodes[1].setAttribute("value", iBorder.getAttribute("collectionID"));
                ddlStep3_1.childNodes[1].innerHTML = "Loading...";
                ddlStep3_1.selectedIndex=1;
                step3_1Changed();
                
                txtInnerBorder.value = iBorder.getAttribute("collection") + " " + iBorder.getAttribute("colourway");
                innerBorderMap.coords="118,450,118,118,450,118,450,165,165,165,165,450";    
                innerBorderMap.Title = "Inner Border";
                
                document.getElementById("innerBorderMap").onmouseover= mouseOverInnerBorder;                
            } else {
                innerBorderMap.coords="0,0,0,0,0,0,0,0,0,0,0,0";
                populate_Step3();
            }

            txtRugCentre.value = fc.getAttribute("collection") + " " + fc.getAttribute("design");
            hidFCInfo.value = "<h5>" + fc.getAttribute("design") + " " + fc.getAttribute("colourway") + 
                "</h5><p><em>Collection: </em>" + fc.getAttribute("collection") + 
                "</p><p><em>Design: </em>" + fc.getAttribute("design") + 
                "</p><p><em>Colour: </em>" + fc.getAttribute("colourway") + 
                "</p><p><em>Reference: </em>" + fc.getAttribute("code") + 
                "</p><p><em>Width in metres: </em>" + fc.getAttribute("width") + 
                "</p><p><em>Fibre: </em>" + fc.getAttribute("fibre") + 
                "</p><p><em>Price (Per Sqm): </em>£" + Number(fc.getAttribute("ssp")).toFixed(2) + 
                "</p><p class='moreDetails'><a>Click for change options</a></p>";
            hidFCMaxWidth.value = fc.getAttribute("maxWidth");
            hidFCColName.value = fc.getAttribute("collection") ;
            hidFCColour.value = fc.getAttribute("colour");
            
        }
    }
}


function resetRug() 
{
    location.href="Default.aspx";
}

function showHelp() {
hideLists();
    document.getElementById( "helpPanel").style.display = "block";
}

function saveRugSelection() {
    Crucial.SetCurrentRug( currentSelection, function(results) {}, function(err) {} );
}

function loadRugSelection() {
    Crucial.GetCurrentRug( function(results) { currentSelection = results; }, function(err) {} );
}

/**************   Step 1 ********************/

function step1_Click() 
{
    collectionID=0;
    designID=0;
    colourID=0;
    keywords = '';
    
    if( ddlStep1_1 ) 
    {
        if( ddlStep1_1.selectedIndex > 0 )
            collectionID = ddlStep1_1.options[ddlStep1_1.selectedIndex].value;    
        if( ddlStep1_2.selectedIndex > 0 )
            designID = ddlStep1_2.options[ddlStep1_2.selectedIndex].value;    
        if( ddlStep1_3.selectedIndex > 0 )
            colourID = ddlStep1_3.options[ddlStep1_3.selectedIndex].value;
        keywords = txtStep1Keyword.value;
     }
    
    hideLists();
   
        step1List.style.display="block";
    
}

function populate_Step1() 
{
    step1Hide.style.display="block";
    collectionID=0;
    designID=0;
    colourID=0;
    keywords='';
    step1Hide.className = "loading";
    
    if( ddlStep1_1 ) 
    {
        if( ddlStep1_1.selectedIndex > 0 )
            collectionID = ddlStep1_1.options[ddlStep1_1.selectedIndex ].value;    
        if( ddlStep1_2.selectedIndex > 0 )
            designID = ddlStep1_2.options[ddlStep1_2.selectedIndex ].value;    
        if( ddlStep1_3.selectedIndex > 0 )
            colourID = ddlStep1_3.options[ddlStep1_3.selectedIndex ].value;
        keywords = txtStep1Keyword.value;
     }  
    ajax1.loadXMLRequest("WebServices/Crucial.asmx/GetStep1Ddls", "collectionID=" + collectionID + "&designID=" + designID + "&colourID=" + colourID + "&sequence=<sequence>" + step1OrderXML.innerHTML + "</sequence>&keywords=" + keywords, true, populate_Step1_Callback);    
}

function populate_Step1_Callback() {
    

    if( ajax1.GetRequest().readyState == 4 ) {
    
         newLogItems = ajax1.applyXSLTransform( ajax1.GetRequest().responseXML, "XSL/SelectARugCentre.xsl" );
         document.getElementById( "ddlsRugFilters" ).innerHTML = newLogItems;    
         
         ddlStep1_1 = document.getElementById("ddlStep1_1");
         ddlStep1_2 = document.getElementById("ddlStep1_2");
         ddlStep1_3 = document.getElementById("ddlStep1_3");     
         txtStep1Keyword = document.getElementById("txtStep1Keyword");
         populate_RugCentreList();
         
         step1Hide.style.display="none";
    }
}

function step1_1Changed() 
{
    txtStep1Keyword.value = '';
    if( ddlStep1_1.selectedIndex > 0 ) {
        sItem = document.createElement( "collection" );
        if( step1OrderXML.getElementsByTagName( "collection" ).length == 0 )     
        step1OrderXML.appendChild(sItem);
    } else {
        step1OrderXML.removeChild( step1OrderXML.getElementsByTagName( "collection" )[0]  );
    }
    populate_Step1();
}

function step1_2Changed() 
{
    txtStep1Keyword.value = '';
    if( ddlStep1_2.selectedIndex > 0 ) {
        sItem = document.createElement( "design" );
        if( step1OrderXML.getElementsByTagName( "design" ).length == 0 )     
        step1OrderXML.appendChild(sItem);
    } else {
        step1OrderXML.removeChild( step1OrderXML.getElementsByTagName( "design" )[0] );
    }
    populate_Step1();
}

function step1_3Changed() 
{
    txtStep1Keyword.value = '';
    if( ddlStep1_3.selectedIndex > 0 ) {
        sItem = document.createElement( "colour" );   
        if( step1OrderXML.getElementsByTagName( "colour" ).length == 0 )     
            step1OrderXML.appendChild(sItem);
    } else {
        step1OrderXML.removeChild( step1OrderXML.getElementsByTagName( "colour" )[0] );
    }
    populate_Step1();
}

function btnStep1Search_Click() 
{
    ddlStep1_1.selectedIndex = 0;
    ddlStep1_2.selectedIndex = 0;
    ddlStep1_3.selectedIndex = 0;
    step1OrderXML.innerHTML = "";
    populate_Step1();
}

function populate_RugCentreList() 
{    
    collectionID=0;
    designID=0;
    colourID=0;
    keywords="";
    
    if( ddlStep1_1 ) 
    {
        if( ddlStep1_1.selectedIndex > 0 )
            collectionID = ddlStep1_1.options[ddlStep1_1.selectedIndex ].value;    
        if( ddlStep1_2.selectedIndex > 0 )
            designID = ddlStep1_2.options[ddlStep1_2.selectedIndex ].value;    
        if( ddlStep1_3.selectedIndex > 0 )
            colourID = ddlStep1_3.options[ddlStep1_3.selectedIndex ].value;
        keywords = txtStep1Keyword.value;
        if( keywords == "Keyword" ) keywords = "";
     }
    hideLists();
    
    step1List.style.display="block";    
    
    ajax1.loadXMLRequest("WebServices/Crucial.asmx/GetRugCentres", "collectionID=" + collectionID + "&designID=" + designID + "&colourID=" + colourID + "&keywords=" + keywords + "&usage=rug", true, populate_RugCentreList_Callback);
}

function populate_RugCentreList_Callback() 
{
    if( ajax1.GetRequest().readyState == 4 ) 
    {
         newLogItems = ajax1.applyXSLTransform( ajax1.GetRequest().responseXML, "XSL/RugCentreList.xsl" );
         step1List.innerHTML = newLogItems;     
             
    }
}


function clearRug() {    
    hidFCCode.value = "";
    hidFCColName.value = "";
    hidFCColour.value = "";
    document.getElementById("txtRugCentre").value = "Nothing Selected";
    redrawRug();
}

function applyRugCentre( code, colName, colour, info, cost, maxWidth, design ) 
{

    hidFCCode.value = code;
    hidFCColName.value = colName;
    hidFCColour.value = colour;
    document.getElementById("txtRugCentre").value = colName + " " + design;
    redrawRug();
    
    hidFCInfo.value = info;
    document.getElementById("floorcoveringMap").onmouseover =  function() {showInfoPanel(code,info);};
    selectFloorcoveringCost = cost;
    hidFCMaxWidth.value = maxWidth;

    if (step2Hide.innerHTML.replace(/[ \t\r\n\r]/g, "") == '')
        populate_Step2();
}

/*************  End Step 1 *********************/

/**************   Step 2 ********************/

function step2_Click() 
{
    hideLists();    
    step2List.style.display="block"; 
}

function populate_Step2() 
{
    step2Hide.style.display="block";
    step2Hide.innerHTML = "Loading...";    
    step2Hide.className = "loading";
    collectionID=0;
    colourID=0;
    keywords='';
    
    if( ddlStep2_1 ) 
    {
        if( ddlStep2_1.selectedIndex > 0 )
            collectionID = ddlStep2_1.options[ddlStep2_1.selectedIndex ].value;   
        if( ddlStep2_3.selectedIndex > 0 )
            colourID = ddlStep2_3.options[ddlStep2_3.selectedIndex ].value;
        keywords = txtStep2Keyword.value;
     }  
    ajax2.loadXMLRequest("WebServices/Crucial.asmx/GetStep2Ddls", "collectionID=" + collectionID + "&colourID=" + colourID + "&sequence=<sequence>" + step2OrderXML.innerHTML + "</sequence>&keywords=" + keywords, true, populate_Step2_Callback);    
}

function populate_Step2_Callback() 
{
    if( ajax2.GetRequest().readyState == 4 ) 
    {
         newLogItems = ajax2.applyXSLTransform( ajax2.GetRequest().responseXML, "XSL/SelectABorder.xsl" );
         document.getElementById( "ddlsOuterBorderFilters" ).innerHTML = newLogItems;    
         
         ddlStep2_1 = document.getElementById("ddlStep2_1");
         ddlStep2_3 = document.getElementById("ddlStep2_3");     
         txtStep2Keyword = document.getElementById("txtStep2Keyword");
         
         step2Hide.style.display="none";   
         
         populate_Step2List();
//         hideLists();        
//         document.getElementById("helpPanel").style.display="block";              
            
    }
}

function step2_1Changed() 
{
    txtStep2Keyword.value = '';
    if( ddlStep2_1.selectedIndex > 0 ) {
        sItem = document.createElement( "collection" );
        if( step2OrderXML.getElementsByTagName( "collection" ).length == 0 )     
        step2OrderXML.appendChild(sItem);
    } else {
        step2OrderXML.removeChild( step2OrderXML.getElementsByTagName( "collection" )[0]  );
    }
    populate_Step2();
}

function step2_3Changed() 
{
    txtStep2Keyword.value = '';
    if( ddlStep2_3.selectedIndex > 0 ) {
        sItem = document.createElement( "colour" );   
        if( step2OrderXML.getElementsByTagName( "colour" ).length == 0 )     
            step2OrderXML.appendChild(sItem);
    } else {
        step2OrderXML.removeChild( step2OrderXML.getElementsByTagName( "colour" )[0] );
    }
    populate_Step2();
}

function btnStep2Search_Click() 
{
    ddlStep2_1.selectedIndex = 0;
    ddlStep2_3.selectedIndex = 0;
    step2OrderXML.innerHTML = "";
    populate_Step2();
}

function populate_Step2List() 
{
    collectionID=0;
    colourID=0;
    keywords="";
    
    if( ddlStep1_1 ) 
    {
        if( ddlStep2_1.selectedIndex > 0 )
            collectionID = ddlStep2_1.options[ddlStep2_1.selectedIndex ].value;      
        if( ddlStep2_3.selectedIndex > 0 )
            colourID = ddlStep2_3.options[ddlStep2_3.selectedIndex ].value;
        keywords = txtStep2Keyword.value;
        if( keywords == "Keyword" ) keywords = "";
     }
    ajax2.loadXMLRequest("WebServices/Crucial.asmx/GetBorders", "borderCollectionID=" + collectionID+ "&colourID=" + colourID + "&keywords=" + keywords + "&piping=false", true, populate_Step2List_Callback);

    step2List.innerHTML = "<div style=\"text-align:center;margin:50px auto 50px auto; font-size:20px;\">Loading...</div>";        
    //hideLists();
    //step2List.style.display = "block";
}

function populate_Step2List_Callback() 
{
    if( ajax2.GetRequest().readyState == 4 ) 
    {
         newLogItems = ajax2.applyXSLTransform( ajax2.GetRequest().responseXML, "XSL/OuterBorderList.xsl" );
         step2List.innerHTML = newLogItems;         
    }
}

function clearRugBorder() {
    hidOBCode.value = "";
    txtRugBorder.value = "Nothing Selected";
    hidOBColour.setValue("");
    redrawRug();
}

function applyOuterBorder( imageName, borderName, colourWay ) 
{
    hidOBCode.value = imageName;
    txtRugBorder.value = borderName;
    hidOBColour.setValue(colourWay);
    redrawRug();
    step4Hide.style.display="none";

    if (step3Hide.innerHTML.replace(/[ \t\r\n\r]/g, "") == '')
        populate_Step3();
        
    document.getElementById("outerBorderMap").onmouseover = function() {showOutBorderPanel(txtRugBorder.value,hidOBCode.value);};
}

/**************** End Step 2 ********************/

/**************   Step 3 ********************/

function step3_Click() 
{
    hideLists();
    step3List.style.display="block";    
}

function populate_Step3() 
{
    step3Hide.style.display="block";
    step3Hide.innerHTML = "Loading...";
    step3Hide.className = "loading";
    collectionID=0;
    colourID=0;
    keywords='';
    
    if( ddlStep3_1 ) 
    {
        if( ddlStep3_1.selectedIndex > 0 )
            collectionID = ddlStep3_1.options[ddlStep3_1.selectedIndex ].value;   
        if( ddlStep3_3.selectedIndex > 0 )
            colourID = ddlStep3_3.options[ddlStep3_3.selectedIndex ].value;
        keywords = txtStep3Keyword.value;
     }  
    ajax3.loadXMLRequest("WebServices/Crucial.asmx/GetStep3Ddls", "collectionID=" + collectionID + "&colourID=" + colourID + "&sequence=<sequence>" + step3OrderXML.innerHTML + "</sequence>&keywords=" + keywords, true, populate_Step3_Callback);    
}

function populate_Step3_Callback() 
{
    if( ajax3.GetRequest().readyState == 4 ) 
    {
         newLogItems = ajax3.applyXSLTransform( ajax3.GetRequest().responseXML, "XSL/SelectAInnerBorder.xsl" );
         document.getElementById( "ddlsInnerBorderFilters" ).innerHTML = newLogItems;    
         
         ddlStep3_1 = document.getElementById("ddlStep3_1");
         ddlStep3_3 = document.getElementById("ddlStep3_3");     
         txtStep3Keyword = document.getElementById("txtStep3Keyword");
         
         step3Hide.style.display="none";  
         populate_Step3List();
//         hideLists();         
//         document.getElementById("helpPanel").style.display="block";       
    }
}

function step3_1Changed() 
{
    txtStep3Keyword.value = '';
    if( ddlStep3_1.selectedIndex > 0 ) {
        sItem = document.createElement( "collection" );
        if( step3OrderXML.getElementsByTagName( "collection" ).length == 0 )     
        step3OrderXML.appendChild(sItem);
    } else {
        step3OrderXML.removeChild( step3OrderXML.getElementsByTagName( "collection" )[0]  );
    }
    populate_Step3();
}

function step3_3Changed() 
{
    txtStep3Keyword.value = '';
    if( ddlStep3_3.selectedIndex > 0 ) {
        sItem = document.createElement( "colour" );   
        if( step3OrderXML.getElementsByTagName( "colour" ).length == 0 )     
            step3OrderXML.appendChild(sItem);
    } else {
        step3OrderXML.removeChild( step3OrderXML.getElementsByTagName( "colour" )[0] );
    }
    populate_Step3();
}

function btnStep3Search_Click() 
{
    ddlStep3_1.selectedIndex = 0;
    ddlStep3_3.selectedIndex = 0;
    step3OrderXML.innerHTML = "";
    populate_Step3();
}

function populate_Step3List() 
{
    collectionID=0;
    colourID=0;
    keywords="";
    
    if( ddlStep1_1 ) 
    {
        if( ddlStep3_1.selectedIndex > 0 )
            collectionID = ddlStep3_1.options[ddlStep3_1.selectedIndex ].value;      
        if( ddlStep3_3.selectedIndex > 0 )
            colourID = ddlStep3_3.options[ddlStep3_3.selectedIndex ].value;
        keywords = txtStep3Keyword.value;
        if( keywords == "Keyword" ) keywords = "";
     }
    ajax3.loadXMLRequest("WebServices/Crucial.asmx/GetBorders", "borderCollectionID=" + collectionID+ "&colourID=" + colourID + "&keywords=" + keywords + "&piping=true", true, populate_Step3List_Callback);

    step3List.innerHTML = "<div style=\"text-align:center;margin:50px auto 50px auto; font-size:20px;\">Loading...</div>";        
    //hideLists();
    //step3List.style.display = "block";
}

function populate_Step3List_Callback() 
{
    if( ajax3.GetRequest().readyState == 4 ) 
    {
         newLogItems = ajax3.applyXSLTransform( ajax3.GetRequest().responseXML, "XSL/InnerBorderList.xsl" );
         step3List.innerHTML = newLogItems;         
    }
}

function clearRugInnerBorder() {
    hidIBCode.value = "";
    txtInnerBorder.value = "Nothing Selected";
    hidIBColour.value = "";
    redrawRug();
}


function applyInnerBorder( imageName, borderName,colourWay ) 
{
    hidIBCode.value = imageName;
    txtInnerBorder.value = borderName;
    hidIBColour.value = colourWay;
    
    redrawRug();
    
}


/**************** End Step 3 ********************/




function mouseOverInnerBorder() {
showInBorderPanel(document.getElementById('txtInnerBorder').value,document.getElementById('hidIBCode').value);
}


function mouseOverPiping() {
    showPipPanel(document.getElementById('txtPiping').value,hidPCode.value);
}


function redrawRug() 
{
    document.getElementById("imgRug").src = 
        "CreateARugImage.aspx?floorcovering=" + hidFCCode.value + 
        "&outborder=" + hidOBCode.value +
        "&inborder=" + hidIBCode.value +
        "&floor=" + document.getElementById("hidFloor").value;   
        
        
    
    if(hidIBCode.value.length==0) {
        innerBorderMap.coords="0,0,0,0,0,0,0,0,0,0,0,0";    
    } 
    else if( hidIBCode.value.length > 3 && hidIBCode.value.substring(0,3) == "COR" ) 
    {
        //innerBorderMap.onmouseover = mouseOverPiping;  
        innerBorderMap.onmouseover= mouseOverInnerBorder; 
       
        innerBorderMap.coords="118,450,118,118,450,118,450,131,131,131,131,450";    
        innerBorderMap.title = "Piping";
    }
    else
    { 
        innerBorderMap.onmouseover= mouseOverInnerBorder; 
        innerBorderMap.coords="118,450,118,118,450,118,450,165,165,165,165,450";    
        innerBorderMap.Title = "Inner Border";         
    }  
  
}

function applyFloor( floorFileN ) 
{
    
    document.getElementById("hidFloor").value = floorFileN;
    redrawRug();
}

function showPipPanel( borderName, ref) 
{
    var rugInfoPanel= document.getElementById("rugInfoPanel");
    rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[0].style.backgroundImage = "url(Resources/Piping/" + ref + ".png)";
    showBorderPanel( borderName, ref);    
}

function showOutBorderPanel( borderName, ref) 
{
    var rugInfoPanel= document.getElementById("rugInfoPanel");
    rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[0].style.backgroundImage = "url(Resources/BorderSwatches/75_75/" + ref + ".jpg)";
    showBorderPanel( borderName, ref);    
}

function showInBorderPanel( borderName, ref) 
{
    var rugInfoPanel= document.getElementById("rugInfoPanel");
    rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[0].style.backgroundImage = "url(Resources/BorderSwatches/75_75/" + ref + ".jpg)";
    showBorderPanel( borderName, ref);
}

function showBorderPanel( borderName, ref) 
{
    clearTimeout( showInfoDelay );
    showInfoDelay = setTimeout( function() {
        var rugInfoPanel= document.getElementById("rugInfoPanel");
        
        rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[1].innerHTML=
        "<h5>" + borderName + "</h5>";
        
        document.getElementById( "rugInfoPanel" ).style.height = "85px";
        document.getElementById( "rugInfoPanel" ).style.width = "300px";
        document.getElementById( "infoPanBack" ).style.height = "85px";
        document.getElementById( "infoPanBack" ).style.width = "300px";
        document.getElementById( "infoPanImage" ).style.height = "75px";
        document.getElementById( "infoPanImage" ).style.width = "75px";
        
        rugInfoPanel.style.visibility="hidden";
        rugInfoPanel.style.display="block";
        setInfoPannelPos();
        rugInfoPanel.style.visibility="visible";
        }, 1000 );
}

var showInfoDelay;
var hideInfoDelay;
function showInfoPanel( code, infoHTML ) 
{
    lastInfo = infoHTML;        
    clearTimeout( showInfoDelay );
    showInfoDelay = setTimeout( function() {
        var rugInfoPanel= document.getElementById("rugInfoPanel");
        
        rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[0].style.backgroundImage = "url(Resources/FloorCoverings/203_203/"+code + ".jpg)";
        rugInfoPanel.getElementsByTagName("div")[1].getElementsByTagName("div")[1].innerHTML=infoHTML;
        
        document.getElementById( "rugInfoPanel" ).style.height = "";
        document.getElementById( "rugInfoPanel" ).style.width = "";
        document.getElementById( "infoPanBack" ).style.height = "";
        document.getElementById( "infoPanBack" ).style.width = "";
        document.getElementById( "infoPanImage" ).style.height = "";
        document.getElementById( "infoPanImage" ).style.width = "";
        
        rugInfoPanel.style.display="block";
        rugInfoPanel.style.visibility="hidden";
        setInfoPannelPos();
        rugInfoPanel.style.visibility="visible";
     }, 1000 );
}

function hideInfoPanel() 
{
    clearTimeout( showInfoDelay );
    //infoPanFadeDir = -0.2;
    //infoPanFade();
    
    document.getElementById("rugInfoPanel").style.display="none";  
}

function infoPanFade() 
{
   //clearTimeout( infoPanFadeT );
   //infoPanFadeT = setTimeout( "infoPanFadeGo()", 100);
}

function infoPanFadeGo() 
{
//        
//    if(infoPanOpacity <= 0 &&  infoPanFadeDir < 0) 
//    {
//    }
//    else if (infoPanOpacity >= 1 && infoPanFadeDir > 0)
//    {
//    }
//    else 
//    {
//        infoPanOpacity += infoPanFadeDir;
//        if( document.getElementById("rugInfoPanel").style.filter == null )
//            document.getElementById("rugInfoPanel").style.opacity=infoPanOpacity;
//        else
//            document.getElementById("rugInfoPanel").style.filter= "alpha(opacity=" +(infoPanOpacity*100) + ")";
//        infoPanFadeT = setTimeout( "infoPanFadeGo()", 10);
//    }
//    
//    if(infoPanOpacity > 0 ) {
//        document.getElementById("rugInfoPanel").style.display="block";        
//    } else {
//        document.getElementById("rugInfoPanel").style.display="none";       
//    }
    
    
}

$(window).load( function() { 
    var qs = new Querystring();
    if(qs.get("panel")=="quote")
        getAQuoteClick()  
    });

function getAQuoteClick() 
{
    $("#panel").attr("value", "quote");
    
    fCode = hidFCCode.value;
    fDesign = document.getElementById("hidFCColour" ).value;
    fName = document.getElementById("txtRugCentre" ).value;
    oCode = hidOBCode.value;
    oDesign = document.getElementById("hidOBColour" ).value;
    oName = document.getElementById("txtRugBorder" ).value;
    iCode = hidIBCode.value;
    iDesign = document.getElementById("hidIBColour" ).value;
    iName = document.getElementById("txtInnerBorder" ).value;
    //pCode = hidPCode.value;
    //pName = document.getElementById("txtPiping" ).value;
    
    if( fCode == "" || oCode == "" )
    {
        alert( "You must at least select a floor covering and an outer border" );
        return;
    }
    
     calculateCost();
     
    document.getElementById("divRugConfig").style.display="none";
    document.getElementById("divGetAQuote").style.display="block";
    
    pRugCentreHTML = "<div class=\"img\" style=\"background-Image:url(Resources/Floorcoverings/75_75/" + fCode + ".jpg);\"></div><span style='font-weight:bold;color:black'>Rug Centre:</span><br />" + fName + "<br />" + fDesign;       
    document.getElementById("pRugCentre").innerHTML = pRugCentreHTML;
    document.getElementById("pRugBorder").innerHTML = "<div class=\"img\" style=\"background-Image:url(Resources/BorderSwatches/75_75/" + oCode + ".jpg);\"></div><span style='font-weight:bold;color:black'>Outer Border:</span><br />" + oName + "<br />" + oDesign;       
   
   if( iCode != "" )
    document.getElementById("pInnerBorder").innerHTML = "<div class=\"img\" style=\"background-Image:url(Resources/BorderSwatches/75_75/" + iCode + ".jpg);\"></div><strong>Inner Border:</strong><br />" + iName + "<br />" + iDesign;       
   
   document.getElementById("pInnerBorder").style.display=( iCode != ""?"block":"none" );
   document.getElementById("StripeBackground").style.backgroundImage="url(Images/RubBuilderBack2.png)";
      /* */  
   
}


function createANewRug_Click() {
       location.href="Default.aspx";

}

function calculateCost() 
{
    tWidth = document.getElementById("txtWidth");
    tLength = document.getElementById("txtLength");
    if( tWidth.value.substring(0,1) == "." )
        tWidth.value = "0" + tWidth.value;
    if( tLength.value.substring(0,1) == "." )
        tLength.value = "0" + tLength.value;
    cWidth = tWidth.value;
    cLength =  tLength.value;  
       
    if( checknumber(cWidth)) 
    {
        if( cWidth > Number(hidFCMaxWidth.value) ) {
            alert( "The maximum width for this floorcovering is " + hidFCMaxWidth.value + "m" );
            document.getElementById("txtWidth").value = hidFCMaxWidth.value;
            cWidth = hidFCMaxWidth.value;
        }
        
        document.getElementById("txtWidth").value = Math.round(cWidth*100)/100
    }    
    if( checknumber(cLength)) 
    {
        if( cLength > 7 ) 
        {
            alert( "The maximum length for any rug is 7m" );
            document.getElementById("txtLength").value = "7";
            cLength = 7;
        }
        document.getElementById("txtLength").value = Math.round(cLength*100)/100
    } 
    
    if( checknumber(cWidth) && checknumber(cLength) ) 
    {  
        ajax1.loadXMLRequest("WebServices/Crucial.asmx/CalculateRugCost", "width=" + cWidth + "&length=" + cLength + "&floorcovering=" + hidFCCode.value + "&outerBorder=" + hidOBCode.value + "&innerBorder=" + hidIBCode.value, true, calculateCost_Callback);
    } 
    else 
    {
        document.getElementById("txtCost").value= "";
    }
}

function calculateCost_Callback() 
{
    if( ajax1.GetRequest().readyState == 4 ) 
    {     
    
    if( ajax1.GetRequest().responseXML.documentElement.firstChild )
        /* multiply by conversion factor*/
        document.getElementById("txtCost").value= Number(document.getElementById("txtConversionRate").value * ajax1.GetRequest().responseXML.documentElement.firstChild.nodeValue).toFixed(2);
        
        
    }
}

function saveRugDetails_Click() 
{
     
    fCode = hidFCCode.value;
    oCode = hidOBCode.value;
    iCode = hidIBCode.value;
    cWidth = document.getElementById("txtWidth").value;
    cLength = document.getElementById("txtLength").value;
    
    if( checknumber(cWidth) && checknumber(cLength) ) 
    {
        if( !iDiv ) 
        {
            pageLock.style.display="block";
            
            iDiv = document.createElement( "div" );
            iFrm = document.createElement( "iframe" );
            iDiv.appendChild(iFrm)
            document.body.appendChild( iDiv );
            iFrm.style.position = "absolute";
            iFrm.style.zIndex=101;
            iFrm.style.top = "400px";
            iDiv.style.width = "350px";
            iFrm.style.width = "350px";
            iFrm.style.height = "120px";
            iFrm.style.overflow = "hidden";
            iFrm.style.border = "solid 2px #ad85ad";
            iFrm.style.backgroundColor = "#FFFFFF";
            iDiv.style.margin = "100px auto 100px auto;";
            iFrm.src="AddToBasket.aspx?fcode=" + fCode + "&ocode=" + oCode+ "&icode=" +iCode+ "&width=" + cWidth + "&length=" + cLength + "&floor=" + hidFloor.value + "&rnd=" + Math.random() * 9999;
        }
    } else {
        alert( "Please enter valid numbers in the length and width fields" );
    }
}

function submitQuoteRequest_Click() 
{    
    fCode = hidFCCode.value;
    oCode = hidOBCode.value;
    iCode = hidIBCode.value;
    cWidth = document.getElementById("txtWidth").value;
    cLength = document.getElementById("txtLength").value;
    wRugCentreCollection = document.getElementById("txtRugCentre").value;
    wRugCenterDesign = document.getElementById("hidFCColour").value;
    wRugBorder = document.getElementById("txtRugBorder").value;
    wRugBorderDesign = document.getElementById("hidOBColour").value;
    wRugInner = document.getElementById("txtInnerBorder").value;
    wRugInnerDesign = document.getElementById("hidIBColour").value;
    wCost = document.getElementById("txtCost").value;

    if (checknumber(cWidth) && checknumber(cLength)) {
        //Crucial.AddToSessionVaribles(fCode, oCode, iCode, cWidth, cLength);
        // It may be better to post this information
        
        location.href = "../process.aspx?mode=ADDRUG&rugcentrecollection=" + wRugCentreCollection + "&rugcentredesign=" + wRugCenterDesign + "&rugcentregpc=0&rugcentreid=0&rugcentreref=0&rugbordercollection=" + wRugBorder + "&rugborderdesign=" + wRugBorderDesign + "&rugbordergpc=0&rugborderid=0&rugborderref=0&ruginnercollection=" + wRugInner + "&ruginnerdesign=" + wRugInnerDesign + "&ruginnergpc=0&ruginnerid=0&ruginnerref=0&rugwidth=" + cWidth + "&ruglength=" + cLength + "&rugcost=" + wCost;
    } else {
        alert( "Please enter valid numbers in the length and width fields" );
    }
}

function checknumber(x)
{
    var anum=/(^\d+$)|(^\d+\.\d+$)/;
    if (anum.test(x))
        testresult=true;
    else{
        testresult=false;
    }
    return (testresult);
}

function orderASample_Click(types) 
{
    ib=true;
    ob=true;
    fc=true;
    
    if(types == null ) {}
    else if( types == "borders" ) {
        fc = false;
    }
    
    if( !iDiv ) {
        
       
        pageLock.style.display="block";
        
        iDiv = document.createElement( "div" );
        iFrm = document.createElement( "iframe" );
        iDiv.appendChild(iFrm)
        document.body.appendChild( iDiv );
        iFrm.style.position = "absolute";
        iFrm.style.zIndex=101;
        iFrm.style.top = "400px";
        iDiv.style.width = "350px";
        iFrm.style.width = "350px";
        iFrm.style.height = "120px";
        iFrm.style.overflow = "hidden";
        iFrm.style.border = "solid 2px #ad85ad";
        iFrm.style.backgroundColor = "#FFFFFF";
        iDiv.style.margin = "100px auto 100px auto;";
        iFrm.src="AddToSampleBasket.aspx?" + (fc?"code=" + hidFCCode.value + "&colname=" + hidFCColName.value + "&colour=" + hidFCColour.value:"")
            + "&obc=" + hidOBCode.value + "&obcol=" + txtRugBorder.value + "&obclr=" + hidOBColour.getValue()
            + "&ibc=" + hidIBCode.value + "&ibcol=" + txtInnerBorder.value + "&ibclr=" + hidIBColour.value
            + "&rnd=" + Math.random() * 9999;
        
        
    }
}

function closeSampleAdder() 
{    
    setTimeout( "closeiDiv()", 100 );
}

function closeiDiv() 
{
    document.body.removeChild( iDiv );
    pageLock.style.display="none";
    iDiv = null;
}

function innerBorderMap_click() 
{
    step3_Click();
   
}

function outerBorderMap_click() {
    step2_Click();
    
}

function floorcoveringMap_click() 
{
    step1_Click();
}