function displayComprables(){
  /******vv 010001 vv******/
  if(styleObj && styleObj.ttCompType && styleObj.ttCompType[0].ttCompDetail){
    $.each(styleObj.ttCompType,function(i){
      styleObj.ttCompType[i].ttCompDetail.sort(function(a,b){ return a.compSort - b.compSort }); //Ensure array is Sorted by compSort
    });
  }
  /******^^ 010001 ^^******/
  var vCompHTML = "";
  var vCompPrice = 0.00;
  if (vComparableDir == "horizontal"){
    $.each(styleObj.ttCompType,function(i){
      if (i == 0)
        vCompHTML += "<div class='compTypeTitleH compSelected' onclick='switchComp(\"comp" + i + "\",this);'>" + styleObj.ttCompType[i].typeDesc + "</div>";
      else
        vCompHTML += "<div class='compTypeTitleH' onclick='switchComp(\"comp" + i + "\",this);'>" + styleObj.ttCompType[i].typeDesc + "</div>";
    });
    $.each(styleObj.ttCompType,function(i){
      vCompHTML += "<div class='compTypeContainerH' id='comp" + i + "'";
      if(i!=0) vCompHTML += " style='display:none;'";
      vCompHTML += "><div class='compInnerH'>";
      $.each(styleObj.ttCompType[i].ttCompDetail,function(j){
        vCompHTML += "<div class='compDetailH' onclick='goStyle(\"" + styleObj.ttCompType[i].ttCompDetail[j].compStyleCode + "\");'>";
        vCompHTML += "<img class='compDetailImg' src='" + styleObj.ttCompType[i].ttCompDetail[j].compImage + "' alt='" + styleObj.ttCompType[i].ttCompDetail[j].compStyleCode + "' onerror='top.ImageError(this,\"thumb\")' />"; /* 010001 */
        vCompHTML += "<div class='compDetailDesc'>" + styleObj.ttCompType[i].ttCompDetail[j].compDesc + "</div>";
        if (styleObj.ttCompType[i].ttCompDetail[j].regPrice > 0){  /* 010010 */
           if(styleObj.ttCompType[i].ttCompDetail[j].salePrice <= 0 ){
             vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].regPrice);
             vCompPrice =  vCompPrice.toFixed(2);
             vCompHTML += '<div class="compDetailRegPriceDiv"><span class="compDetailRegPriceLabel"></span><span class="compDetailRegPrice">$' + vCompPrice + '</span></div>';
           }
           else{
             vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].regPrice);
             vCompPrice =  vCompPrice.toFixed(2);
             vCompHTML += '<div class="compDetailRegPriceDiv"><span class="compDetailRegPriceLabel"></span><span class="compDetailRegPriceStrike">$' + vCompPrice + '</span></div>';
             vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].salePrice);
             vCompPrice =  vCompPrice.toFixed(2);
             vCompHTML += '<div class="compDetailSalePriceDiv"><span class="compDetailSalePriceLabel">' + styleObj.ttCompType[i].ttCompDetail[j].saleLabel + '</span><span class="compDetailSalePrice">$' + vCompPrice + '</span></div>';
           }
        }
        vCompHTML += "</div>";
      });
      vCompHTML += "</div></div>";
    });
    $(".prodComparable").addClass("prodComparableH");

  }
  else { // vComparableDir == "vertical" (default)
    $.each(styleObj.ttCompType,function(i){
      vCompHTML += "<div class='compTypeTitle'>" + styleObj.ttCompType[i].typeDesc + "</div>";
      vCompHTML += "<div class='compTypeContainer'>";
      $.each(styleObj.ttCompType[i].ttCompDetail,function(j){
        vCompHTML += "<div class='compDetail' onclick='goStyle(\"" + styleObj.ttCompType[i].ttCompDetail[j].compStyleCode + "\");'>";
        vCompHTML += "<img class='compDetailImg' src='" + styleObj.ttCompType[i].ttCompDetail[j].compImage + "' alt='" + styleObj.ttCompType[i].ttCompDetail[j].compStyleCode + "' onerror='top.ImageError(this,\"thumb\")' />"; /* 010001 */
        vCompHTML += "<div class='compDetailDesc'>" + styleObj.ttCompType[i].ttCompDetail[j].compDesc + "</div>";
        if (styleObj.ttCompType[i].ttCompDetail[j].regPrice > 0) { /* 010010 */
          if(styleObj.ttCompType[i].ttCompDetail[j].salePrice <= 0 ){
            vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].regPrice);
            vCompPrice =  vCompPrice.toFixed(2);
            vCompHTML += '<div class="compDetailRegPriceDiv"><span class="compDetailRegPriceLabel"></span><span class="compDetailRegPrice">$' + vCompPrice + '</span></div>';
          }
          else{
            vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].regPrice);
            vCompPrice =  vCompPrice.toFixed(2);
            vCompHTML += '<div class="compDetailRegPriceDiv"><span class="compDetailRegPriceLabel"></span><span class="compDetailRegPriceStrike">$' + vCompPrice + '</span></div>';
            vCompPrice = parseFloat(styleObj.ttCompType[i].ttCompDetail[j].salePrice);
            vCompPrice =  vCompPrice.toFixed(2);
            vCompHTML += '<div class="compDetailSalePriceDiv"><span class="compDetailSalePriceLabel">' + styleObj.ttCompType[i].ttCompDetail[j].saleLabel + '</span><span class="compDetailSalePrice">$' + vCompPrice + '</span></div>';
          }
        }
        vCompHTML += "</div>";
      });
      vCompHTML += "</div>";
    });
    $(".prodDesc").width($(".prodDesc").width() - $(".prodComparable").outerWidth() );
    $(".prodComparable").removeClass("prodComparableH");
  }
  $(".prodComparable").html(vCompHTML);
  $(".prodComparable").show();

  var vTmpWidth = 0;
  $(".compInnerH > .compDetailH").each(function(){ vTmpWidth += $(this).outerWidth(); });
  $(".compInnerH").width(vTmpWidth);

} // displayComparables

function goStyle(vStyleCode,vStyleColor){
   golink("b2c/product.w?product=" + vStyleCode + "&color=" + vStyleColor + vBrowseParam,"main");
}