//global var
var liveview;
var vohs;
var currentVoHIndex;
var currentInfo;
var currentDesignEnv=[];

//voh
function vohAction() {
  var args = nextAction.arguments;
  ajaxObject = createAjaxObj();
  ajaxObject.onreadystatechange=function() {
  if (ajaxObject.readyState == 4) { 
        if (ajaxObject.status==200) {
            parasVoHData(); 
        }
        else {
            alert( "error: " + ajaxObject.status );
        }
    }
  }
  var submitURL = "extvoh.action";
  ajaxObject.open('GET', submitURL, true);
  ajaxObject.send(null); 
//  openVoHCV();
}
function parasVoHData() {
   var xmlData = ajaxObject.responseXML;
   var root = xmlData.getElementsByTagName("root")[0];
   if ( root != null ) {
        var houses = getXMLValue( root, "houses" );
        vohs = eval( houses );
        if ( vohs == null || vohs.length == 0 ) {
            alert( "No available home view for this configuration." );
        }
        else {
            openVoHCV();
        }
   }
   else {
        location.reload();
   }
}
function openVoHCV() {
    var elmt = document.getElementById( "ctnVoHCV" );
    var elmt2 = document.getElementById( "ctnVoHSelectContentInner" );
    var elmt3 = document.getElementById( "ctnComponentsVoHCV" );
    var elmt_btnFV = document.getElementById( "btnFVVoHCV" );
    result = "";

    result += '<ul>';
    for( var i = 0; i < vohs.length; i++ ) {
        result += '<li><a href="javascript:showVoHCV(' + i + ')"><img src="' + rpath + 'homeview/' + vohs[i].code + '_s.jpg' + '" alt="' + vohs[i].name + '" width="125" height="90" border="0" /><br>' + vohs[i].name + '</a></li>';
    }
    result += '</ul>';
    elmt2.innerHTML = result;

    var originalComponents = document.getElementById( "view" ).childNodes;
    for ( var i = originalComponents.length - 1; i >= 0 ; i-- ) {
        elmt3.appendChild( originalComponents[i] );
    }
    if ( currentVoHIndex != -1 ) {
        showVoHCV( currentVoHIndex );
    }
    else {
        MM_showHideLayers('btnFVVoHCV','','hide');
    }
    showBarVoH( "barVoHCV", currentVoHIndex );

    var desc = getInfoDesc( currentInfo );
    var elmt4 = document.getElementById( "txtDescVoHCV" );
    var elmt5 = document.getElementById( "txtDescVoHFV" );
    elmt4.innerHTML = desc;
    elmt5.innerHTML = desc;

    switchDesignPage( "OFF" );
    elmt.style.display = "block";
}
function showVoHCV( index ) {
    var elmt = document.getElementById( "ctnHouseVoHCV" );

    currentVoHIndex = index;

    var currhomeview = vohs[index];

    showBarVoH( "barVoHCV", index );

    var elmtLoad = document.getElementById( "ctnVoHCVLoad" );
    elmtLoad.style.display = "block";

    var img = new Image();
    img.onload = function() {
        elmt.innerHTML = '<img src="' + rpath + 'homeview/' + currhomeview.code + '_c.png" border="0" width="401" height="484"  />';
/*        with (elmt) {
            if ( firstChild ) {
                removeChild( firstChild );
            }
            appendChild( img );
        } */

        var deployCV = currhomeview.deploy[0];
        deployCVComp( deployCV[0], liveview, "door" );
        deployCVComp( deployCV[1], liveview, "doorR" );
        deployCVComp( deployCV[2], liveview, "stlt" );
        deployCVComp( deployCV[3], liveview, "stltR" );
        deployCVComp( deployCV[4], liveview, "t" );
    
        elmtLoad.style.display = "none";
        MM_showHideLayers('btnFVVoHCV','','show');
    }
    img.onError = function() {
        alert( "Failed to load image." );
        closeVoHCV();
    }
    img.onAbort = function() {
        alert( "Abort image loading." );
        closeVoHCV();
    }
    img.src = rpath + 'homeview/' + currhomeview.code + '_c.png';
}
/*
function showVoHCV( index ) {
    var elmt = document.getElementById( "ctnHouseVoHCV" );

    currentVoHIndex = index;

    var currhomeview = vohs[index];

    showBarVoH( "barVoHCV", index );

    elmt.innerHTML = '<img src="' + rpath + 'homeview/' + currhomeview.code + '_c.png" border="0" width="401" height="484"  />';

    var deployCV = currhomeview.deploy[0];
    deployCVComp( deployCV[0], liveview, "door" );
    deployCVComp( deployCV[1], liveview, "doorR" );
    deployCVComp( deployCV[2], liveview, "stlt" );
    deployCVComp( deployCV[3], liveview, "stltR" );
    deployCVComp( deployCV[4], liveview, "t" );

    MM_showHideLayers('btnFVVoHCV','','show');
} */
function closeVoHCV() {
    var container = document.getElementById( "ctnVoHCV" );
    var elmt = document.getElementById( "ctnHouseVoHCV" );
    var elmt2 = document.getElementById( "ctnComponentsVoHCV" );
    elmt.innerHTML = '';
    elmt2.innerHTML = '';
    refreshComponents( liveview );
    switchDesignPage( "ON" );
    container.style.display = "none";
}
function openVoHFV() {
    var currhomeview = vohs[currentVoHIndex];
    var container = document.getElementById( "ctnVoHFV" );
    var elmt = document.getElementById( "ctnHouseVoHFV" );    
    var elmt2 = document.getElementById( "ctnComponentsVoHFV" );

    showBarVoH( "barVoHFV", currentVoHIndex );

    var elmtLoad = document.getElementById( "ctnVoHFVLoad" );
    elmtLoad.style.display = "block";

    container.style.display = "block";

    var img = new Image();
    img.onload = function() {
        elmt.innerHTML = '<img src="' + rpath + 'homeview/' + currhomeview.code + '_f.png" border="0" />';
/*        with (elmt) {
            if ( firstChild ) {
                removeChild( firstChild );
            }
            appendChild( img );
        } */
        var leftoffset = eval( ( parseInt( getCSSProp( elmt, "width" ) ) - img.width)/2 );
        var deployFV = currhomeview.deploy[1];
        var result = "";
        result += deployFVComp( deployFV[0], liveview, "door", leftoffset );
        result += deployFVComp( deployFV[1], liveview, "doorR", leftoffset );
        result += deployFVComp( deployFV[2], liveview, "stlt", leftoffset );
        result += deployFVComp( deployFV[3], liveview, "stltR", leftoffset );
        result += deployFVComp( deployFV[4], liveview, "t", leftoffset );

        elmt2.innerHTML = result;
    
        switchVoHCVPage( "OFF" );
        elmtLoad.style.display = "none";
    }
    img.onError = function() {
        alert( "Failed to load image." );
        closeVoHFV();
    }
    img.onAbort = function() {
        alert( "Abort image loading." );
        closeVoHFV();
    }
    img.src = rpath + 'homeview/' + currhomeview.code + '_f.png';
}
function closeVoHFV() {
    var container = document.getElementById( "ctnVoHFV" );
    switchVoHCVPage( "ON" );
    container.style.display = "none";
}
function switchBtnVoH( status ) {
      var elmt3 = document.getElementById( "btnVoH" );
      if ( "ON" == status ) {
          elmt3.style.display = "block";
      }
      else {
          elmt3.style.display = "none";
      }
}
function switchDesignPage( status ) { //solve ie print problem by hiding
      var elmts = ["tab1container","tab2container","control","tab3","text","ro","price","filepath","livedisplay"];
      var elmt;
      if ( "ON" == status ) {
          while ( currentDesignEnv.length > 0 ) {
             elmt = document.getElementById( currentDesignEnv.pop() );
             elmt.style.display = "block";
          }
      }
      else {          
          for ( var i = 0; i < elmts.length; i++ ) {
             elmt = document.getElementById( elmts[i] );
             if ( elmt != null && elmt.style.display != "none" ) {
                elmt.style.display = "none";
                currentDesignEnv.push( elmts[i] );
             }
          }
      }
}
/*
function switchDesignPage( status ) { //solve ie print problem by hiding
      var elmt1 = document.getElementById( "tab1container" );
      var elmt2 = document.getElementById( "tab2container" );
      var elmt3 = document.getElementById( "control" );
      var elmt4 = document.getElementById( "tab3" );
      var elmt5 = document.getElementById( "text" );
      var elmt6 = document.getElementById( "ro" );
      var elmt7 = document.getElementById( "price" );
      var elmt8 = document.getElementById( "filepath" );
      var elmt9 = document.getElementById( "livedisplay" );
      if ( "ON" == status ) {
          elmt1.style.display = "block";
          elmt2.style.display = "block";
          elmt3.style.display = "block";
          elmt4.style.display = "block";
          elmt5.style.display = "block";
          elmt6.style.display = "block";
          elmt7.style.display = "block";
          elmt8.style.display = "block";
          elmt9.style.display = "block";
      }
      else {          
          elmt1.style.display = "none";
          elmt2.style.display = "none";
          elmt3.style.display = "none";
          elmt4.style.display = "none";
          elmt5.style.display = "none";
          elmt6.style.display = "none";
          elmt7.style.display = "none";
          elmt8.style.display = "none";
          elmt9.style.display = "none";
      }
} */
function switchVoHCVPage( status ) { //solve ie print problem by hiding
      var elmt1 = document.getElementById( "ctnVoHCV" );
      if ( "ON" == status ) {
          elmt1.style.display = "block";
      }
      else {
          elmt1.style.display = "none";
      }
}
/*
function refreshExtView( view, step, viewstatus ) {
    var components = getXMLNodes( view, "component" );
    switch ( step ) {
        case "CBINFO_CONF": currentVoHIndex = -1;
                            break;
        case "CBINFO_STYLE":
        case "CBINFO_GLASS": liveview = components;   
                             break;
    }

    if ( step == 'CBINFO_GLASS' || step == '999' ) {
       switchBtnVoH( "OFF" )
       var divid = [];
       var img = [];
       var hide = "";
       var hideE, load;
       var components = getXMLNodes( view, "component" );

       load = document.getElementById( "load" );
       load.style.display = "block";
       for (var i=0;i<components.length;i++) {
           divid[i] = getXMLValue( components[i], "divid" );
           img[i] = getXMLValue( components[i], "img" );
           hide += '<img src="' + rpath + img[i] + '" border="0" />';
       }
       hideE = document.getElementById( "hide" );
       hideE.innerHTML = hide;

       window.setTimeout( _refreshExtViewDelay( view, viewstatus ), 2000 );
    }
    else {
       refreshView( view );
       refreshViewstatus( viewstatus );
    }
}
function _refreshExtViewDelay( view, viewstatus ) {
    return function() { refreshView( view ); refreshViewstatus( viewstatus ); }
}*/
function refreshExtView( view, step, viewstatus ) {
    var components = getXMLNodes( view, "component" );
    switch ( step ) {
        case "CBINFO_CONF": currentVoHIndex = -1;
                            break;
        case "999": currentVoHIndex = -1;
        case "CBINFO_STYLE":
        case "CBINFO_GLASS":
        case "CBINFO_PREPAINT": liveview = components;   
                                break;
    }

    if ( step == 'CBINFO_GLASS' || step == '999' ) {
        var imgs = [];
        var load;
        load = document.getElementById( "load" );
        load.style.display = "block";

        for (var i=0;i<components.length;i++) {
            imgs[i] = rpath + getXMLValue( components[i], "img" );
        }
        var imgLoader = new ImagePreloader( imgs, 
            function() {
                refreshView( view );
                refreshViewstatus( viewstatus );
            }
        );
    }
    else {
       refreshView( view );
       refreshViewstatus( viewstatus );
    }
}

function getInfoDesc( info ) {
   var name = [];
   var lines = getXMLNodes( info, "line" );
   var desc1 = "";
   var desc2 = "";

   for (var i=0;i<lines.length;i++) {
       name[i] = getXMLValue( lines[i], "name" );
       if ( name[i] == "GLASS SPECS" ) {
          desc1 = getXMLValue( lines[i], "value" );
       }
       if ( name[i] == "DOOR SPECS" ) {
          desc2 = getXMLValue( lines[i], "value" );
       }
   }
   return (desc1==""?"":desc1+", ") + desc2;
}
function refreshComponents( components ) {
   var divid = [];
   var img = [];
   var result = "";
   var elmt;
   for (var i=0;i<components.length;i++) {
       divid[i] = getXMLValue( components[i], "divid" );
       img[i] = getXMLValue( components[i], "img" );
       result += '<div id="' + divid[i] + '"><img src="' + rpath + img[i] + '" border="0" /></div>';
   }
   if ( result.length > 0 ) {
      elmt = document.getElementById( "view" );
      elmt.innerHTML = result;
   }
}
function getComponentByType( components, type ) {
    var rege;
    var divid;
    switch ( type ) {
        case "door": rege = /_door$|_doorL$/;
                     break;
        case "doorR": rege = /.+_doorR$/;
                      break;
        case "stlt": rege = /_stlt$|_stltL$/;
                     break;
        case "stltR": rege = /_stlt$|_stltR$/;
                      break;
        case "t": rege = /^t|^h\d+t\d/
                  break;
        default: return null;
    }
    for (var i=0;i<components.length;i++) {
        divid = getXMLValue( components[i], "divid" );
        if ( rege.test( divid ) ) {
            return { divid:divid, img:getXMLValue( components[i], "img" ) };
        }
    }
    return null;
}
function deployCVComp( deploy, components, type ) {
    var comp, elmt_comp, img;
    if ( deploy.t == -1 ) return;
    comp = getComponentByType( components, type );
    if ( comp != null ) {
       elmt_comp = document.getElementById( comp.divid );
       elmt_comp.style.top = deploy.t + "px";
       elmt_comp.style.left = deploy.l + "px";
       elmt_comp.style.width = deploy.w + "px";
       img = elmt_comp.firstChild;
       img.style.width = deploy.w + "px";
       img.style.height = deploy.h + "px";
    }
}
function deployFVComp( deploy, components, type,leftoffset ) {
    var comp, elmt_comp, img;
    if ( deploy.t == -1 ) return '';
    comp = getComponentByType( components, type );
    if ( comp != null ) {
       return '<img src="' + rpath + comp.img + '" style="position:absolute; left:' + eval( leftoffset + deploy.l ) + 'px; top:' + deploy.t + 'px; width:' + deploy.w + 'px; height:' + deploy.h + 'px" />'; 
    }
    else {
       return '';
    }
}
function refreshViewstatus( status ) {
    if ( status == '99' ) { // final view
        switchBtnVoH( "ON" );
    }
    else {
        switchBtnVoH( "OFF" )
    }
}
function showBarVoH( divid, index ) {
    elmt = document.getElementById( divid );
    if ( index == -1 ) {
        elmt.innerHTML = "&nbsp;HOME VIEW";
    }
    else {
        elmt.innerHTML = "&nbsp;HOME VIEW - <i>" + vohs[index].name + "</i>";
    }
}
/* used for change doors on house
function replaceComponents( components ) {
   var divid = [];
   var img = [];
   var elmt;
   var component;
   for (var i=0;i<components.length;i++) {
       divid[i] = getXMLValue( components[i], "divid" );
       img[i] = getXMLValue( components[i], "img" );
       component = document.getElementById( divid[i] );
       if ( component != null && img[i] != null ) {
          component.firstChild.src = rpath + img[i];
       }
   }
} */

