function cabinetsCabinetOver( cabinet )
{
    if( cabinet.getAttribute( "selected" ) == "true" ) return;
    new Silk( cabinet, "opacity", null, 0.5, null, 0.1, null );
}
function cabinetsCabinetOut( cabinet )
{
    if( cabinet.getAttribute( "selected" ) == "true" ) return;
    new Silk( cabinet, "opacity", null, 1, null, 0.1, null );
}
function drawersCabinetOver( drawer )
{
    if( drawer.getAttribute( "selected" ) == "true" ) return;
    new Silk( drawer, "opacity", null, 0.5, null, 0.1, null );
}
function drawersCabinetOut( drawer )
{
    if( drawer.getAttribute( "selected" ) == "true" ) return;
    new Silk( drawer, "opacity", null, 1, null, 0.1, null );
}
function orderLoad()
{
    var cabinetsCard = document.getElementById( "cabinets_card" );
    
    cardSelect( cabinetsCard );
}
function completeOrder()
{
    var confirmCard = document.getElementById( "confirm_card" );
    
    cardSelect( confirmCard );
}
function cardSelect( card )
{
    var cards = new Array( document.getElementById( "cabinets_card" ), document.getElementById( "drawers_card" ), document.getElementById( "confirm_card" ) );

    var done = function()
    {
        card.style.left = "800px";
        card.style.display = "block";
        new Silk( card, "left", null, 10, "px", 100, function()
        {
            new Silk( card, "left", null, 0, "px", 1, function()
            {
            } );
        } );
    };
    
    var i = 0
    for( ; i < cards.length; i ++ )
        if( cards[ i ].style.display == "block" )
        {
            var hideCard = cards[ i ];
            hideCard.style.left = "0px";
            new Silk( hideCard, "left", null, -hideCard.scrollWidth, "px", 100, function()
            {
                hideCard.style.display = "none";
                done();
            } );
            break;
        }
    if( i == cards.length ) done();
}
function cabinetsSelect( cabinet )
{
    var container = document.getElementById( "cabinets_container" );
    var drawersCard = document.getElementById( "drawers_card" );
    var drawersCabinet = document.getElementById( "drawers_cabinet" );
    var drawersContainer = document.getElementById( "drawers_container" );
    var confirmItems = document.getElementById( "confirm_items" );
    var confirmItemTemplate = document.getElementById( "cabinet_confirm_item_template" );
    var drawerTemplate = document.getElementById( "drawers_drawer_template" );

    new Silk( cabinet, "opacity", null, 0.5, null, 0.1, null );
    drawersCabinet.setAttribute( "height", ( parseInt( cabinet.getAttribute( "containerheight" ) ) * 0.25 ) );
    drawersCabinet.trueHeight = parseInt( cabinet.getAttribute( "containerheight" ) );
    drawersCabinet.style.height = ( drawersCabinet.trueHeight * 0.25 ) + "px";
    var confirmItem = confirmItemTemplate.cloneNode( true );
    confirmItems.appendChild( confirmItem );
    confirmItem.getElementsByTagName( "td" )[ 0 ].appendChild( document.createTextNode( "Cabinet" ) );
    confirmItem.getElementsByTagName( "td" )[ 1 ].appendChild( document.createTextNode( cabinet.getAttribute( "name" ) ) );
    confirmItem.getElementsByTagName( "td" )[ 2 ].appendChild( document.createTextNode( cabinet.getAttribute( "width_mm" ) + "mm" ) );
    confirmItem.getElementsByTagName( "td" )[ 3 ].appendChild( document.createTextNode( cabinet.getAttribute( "height_mm" ) + "mm" ) );
    confirmItem.id = "";
    drawersClear();
    while( drawersContainer.getElementsByTagName( "div" ).length > 0 ) drawersContainer.removeChild( drawersContainer.getElementsByTagName( "div" )[ 0 ] );
    loadingShow();
    ajaxSend( "/ajax.aspx", "<request><command>Get Compatible Drawers</command><width_mm>" + cabinet.getAttribute( "containerwidth" ) + "</width_mm><depth_mm>" + cabinet.getAttribute( "containerdepth" ) + "</depth_mm></request>", function( response )
    {
        loadingHide();
        for( var i = 0; i < response.getElementsByTagName( "drawer" ).length; i ++ )
        {
            var nameValue = response.getElementsByTagName( "drawer" )[ i ].getElementsByTagName( "name" )[ 0 ].firstChild.nodeValue;
            var widthValue = parseInt( response.getElementsByTagName( "drawer" )[ i ].getElementsByTagName( "width_mm" )[ 0 ].firstChild.nodeValue );
            var heightValue = parseInt( response.getElementsByTagName( "drawer" )[ i ].getElementsByTagName( "height_mm" )[ 0 ].firstChild.nodeValue );
            var depthValue = parseInt( response.getElementsByTagName( "drawer" )[ i ].getElementsByTagName( "depth_mm" )[ 0 ].firstChild.nodeValue );
            var imageValue = response.getElementsByTagName( "drawer" )[ i ].getElementsByTagName( "image" )[ 0 ].firstChild.nodeValue;
                
            var drawer = drawerTemplate.cloneNode( true );
            drawersContainer.appendChild( drawer );
            drawer.getElementsByTagName( "img" )[ 0 ].src = "/resources/uploads/" + imageValue;
            drawer.getElementsByTagName( "div" )[ 0 ].appendChild( document.createTextNode( nameValue ) );
            drawer.getElementsByTagName( "div" )[ 1 ].appendChild( document.createTextNode( widthValue + "mm x " + heightValue + "mm x " + depthValue + "mm" ) );
            drawer.setAttribute( "name", nameValue );
            drawer.setAttribute( "width_mm", widthValue );
            drawer.setAttribute( "height_mm", heightValue );
            drawer.id = "";
        }
        cardSelect( drawersCard );
    } );
}
function drawersClear()
{
    var cabinet = document.getElementById( "drawers_cabinet" );
    var continue_ = document.getElementById( "drawers_continue" );

    while( cabinet.getElementsByTagName( "div" ).length > 0 )
        cabinet.removeChild( cabinet.getElementsByTagName( "div" )[ 0 ] );
    continue_.disabled = true;
}
function drawersAdd( drawer )
{
    var continueButton = document.getElementById( "drawers_continue" );
    var cabinet = document.getElementById( "drawers_cabinet" );    
    var confirmItems = document.getElementById( "confirm_items" );
    var cabinetDrawerTemplate = document.getElementById( "drawers_cabinet_drawer_template" );
    var confirmItemTemplate = document.getElementById( "drawer_confirm_item_template" );
    
    var confirmItem = confirmItemTemplate.cloneNode( true );
    confirmItem.getElementsByTagName( "td" )[ 0 ].appendChild( document.createTextNode( "Drawer" ) );
    confirmItem.getElementsByTagName( "td" )[ 1 ].appendChild( document.createTextNode( drawer.getAttribute( "name" ) ) );
    confirmItem.getElementsByTagName( "td" )[ 2 ].appendChild( document.createTextNode( drawer.getAttribute( "width_mm" ) + "mm" ) );
    confirmItem.getElementsByTagName( "td" )[ 3 ].appendChild( document.createTextNode( drawer.getAttribute( "height_mm" ) + "mm" ) );
    confirmItem.id = "";
    var fill = 0;
    for( var i = 0; i < cabinet.getElementsByTagName( "div" ).length; i ++ ) fill += parseInt( cabinet.getElementsByTagName( "div" )[ i ].trueHeight );
    var cabinetDrawer = cabinetDrawerTemplate.cloneNode( true );
    cabinetDrawer.trueHeight = parseInt( drawer.getAttribute( "height_mm" ) );
    cabinetDrawer.style.height = ( cabinetDrawer.trueHeight * 0.25 ) + "px";
    if( ( fill + cabinetDrawer.trueHeight ) <= cabinet.trueHeight )
    {
        confirmItems.appendChild( confirmItem );
        cabinetDrawer.id = "";
        cabinet.appendChild( cabinetDrawer );
        cabinetDrawer.appendChild( document.createTextNode( drawer.getAttribute( "name" ) ) );
        cabinetDrawer.style.top = ( ( parseInt( cabinet.style.height.replace( "px", "" ) ) - ( fill * 0.25 ) - parseInt( cabinetDrawer.clientHeight ) ) ) + "px";
        fill += cabinetDrawer.trueHeight;
    }
    if( fill == cabinet.trueHeight ) continueButton.disabled = false;
    else continueButton.disabled = true;
}
function drawersRemove( drawer )
{
    var confirmItems = document.getElementById( "confirm_items" );
    var continueButton = document.getElementById( "drawers_continue" );
    var cabinet = document.getElementById( "drawers_cabinet" );
    
    var cabinetRowIndex = -1;
    for( var i = confirmItems.getElementsByTagName( "tr" ).length - 1; i > -1; i -- )
        if( confirmItems.getElementsByTagName( "tr" )[ i ].getElementsByTagName( "td" )[ 0 ].firstChild.nodeValue == "Cabinet" )
        {
            cabinetRowIndex = i;
            break;
        }
    for( var i = 0; i < cabinet.getElementsByTagName( "div" ).length; i ++ )
        if( drawer == cabinet.getElementsByTagName( "div" )[ i ] )
            confirmItems.removeChild( confirmItems.getElementsByTagName( "tr" )[ cabinetRowIndex + i + 1 ] );
    cabinet.removeChild( drawer );
    var drawers = new Array();
    for( var i = 0; i < cabinet.getElementsByTagName( "div" ).length; i ++ ) drawers.push( cabinet.getElementsByTagName( "div" )[ i ] );
    while( cabinet.getElementsByTagName( "div" ).length > 0 ) cabinet.removeChild( cabinet.getElementsByTagName( "div" )[ 0 ] );
    var fill = 0;
    for( var i = 0; i < drawers.length; i ++ )
    {
        cabinet.appendChild( drawers[ i ] );
        drawers[ i ].style.top = ( ( parseInt( cabinet.style.height.replace( "px", "" ) ) - ( fill * 0.25 ) - parseInt( drawers[ i ].clientHeight ) ) ) + "px";
        fill += drawers[ i ].trueHeight;
    }
}
function drawersCabinetDrawerOver( drawer )
{
    new Silk( drawer, "opacity", null, 0.5, null, 0.1, null );
}
function drawersCabinetDrawerOut( drawer )
{
    new Silk( drawer, "opacity", null, 1, null, 0.1, null );
}
function drawersDrawerOver( drawer )
{
    new Silk( drawer, "opacity", null, 0.5, null, 0.1, null );
}
function drawersDrawerOut( drawer )
{
    new Silk( drawer, "opacity", null, 1, null, 0.1, null );
}
function drawersBack()
{
    var cabinetsCard = document.getElementById( "cabinets_card" );

    cardSelect( cabinetsCard );
}
function drawersContinue()
{
    var confirmCard = document.getElementById( "confirm_card" );

    cardSelect( confirmCard );
}
function cabinetDelete( cabinet )
{
    var parent = cabinet.parentNode;
    for( var i = 0; ; i ++ )
        if( parent.getElementsByTagName( "tr" )[ i ] == cabinet )
        {
            parent.removeChild( parent.getElementsByTagName( "tr" )[ i ] );
            for( ; i < parent.getElementsByTagName( "tr" ).length; )
                if( parent.getElementsByTagName( "tr" )[ i ].getElementsByTagName( "td" )[ 0 ].firstChild.nodeValue == "Cabinet" ) return;
                else parent.removeChild( parent.getElementsByTagName( "tr" )[ i ] );
            return;
        }
}
function confirmSubmit()
{
    var name = document.getElementById( "confirm_name" );
    var phone = document.getElementById( "confirm_phone" );
    var email = document.getElementById( "confirm_email" );
    var confirmItems = document.getElementById( "confirm_items" );
    var ordersEmail = document.getElementById( "orders_email" );
    
    var order = "";
    for( var i = 0; i < confirmItems.getElementsByTagName( "tr" ).length; i ++ )
    {
        for( var t = 0; t < confirmItems.getElementsByTagName( "tr" )[ i ].getElementsByTagName( "td" ).length; t ++ )
            order += ( confirmItems.getElementsByTagName( "tr" )[ i ].getElementsByTagName( "td" )[ t ].hasChildNodes() ? confirmItems.getElementsByTagName( "tr" )[ i ].getElementsByTagName( "td" )[ t ].firstChild.nodeValue : "" ) + "\t";
        order += i == confirmItems.getElementsByTagName( "tr" ).length - 1 ? "" : "\r\n";
    }
    loadingShow();
    ajaxSend( "/ajax.aspx", "<request><command>Submit Order</command><name>" + xmlEncode( name.value ) + "</name><phone>" + xmlEncode( phone.value ) + "</phone><email>" + xmlEncode( email.value ) + "</email><order>" + xmlEncode( order ) + "</order></request>", function( response )
    {
        loadingHide();
        alert( "Thankyou for your order. Phoenix will contact you as soon as possible.\r\nAn order summary has been sent to your email." );
        confirmClear();
        location.href = "/AboutUs";
    } );
}
function confirmClear()
{
    var name = document.getElementById( "confirm_name" );
    var phone = document.getElementById( "confirm_phone" );
    var email = document.getElementById( "confirm_email" );
    
    name.value = "";
    phone.value = "";
    email.value = "";
}
function confirmBack()
{
    var drawersCard = document.getElementById( "drawers_card" );
    
    cardSelect( drawersCard );
}
function nextCabinet()
{
    var cabinetsCard = document.getElementById( "cabinets_card" );

    cardSelect( cabinetsCard );
}