jQuery.fn.initBoxThreeCols = (function($) {
  return function(params) {
    this.each(function(i){
      var jThis = $j(this), 
            cssObj ={}, jNav, 
            jTop = (jThis.hasClass(params.boxTopClass) || false);
      
      // apart from creating basic local variables, 
      // I check wether the box has a second class that enabled the top selling view
      
      // if jTop is true, I create a list displayed as a top selling count
      if (jTop) { jNav = $j('<ul class="top-numbers"></ul>'); }
      
      // for each list item in the first col
      jThis.find(".cols:first li").each(function(i) {
        var jThisLi = $j(this).find(".prd-container"),
              jHeight = jThisLi.height(),
              finalHeight = jHeight, jCountLI;
        
        // I'll get the corresponding list items inside others cols
        // and retrieve their heights
        jHeight2 = jThisLi.closest(".box-content").find(".cols").eq(1).find(".prd-container").eq(i).height();
        jHeight3 = jThisLi.closest(".box-content").find(".cols").eq(2).find(".prd-container").eq(i).height();
        
        // then I'll compare
        if (jHeight > jHeight2) {
          if (jHeight > jHeight3) {
            finalHeight = jHeight;
          } else {
            finalHeight = jHeight3;
          }
        } else {
          if (jHeight2 > jHeight3) {
            finalHeight = jHeight2;
          } else {
            finalHeight = jHeight3;
          }
        }
        
        // browser check. If IE6, modify the height. If not, just the min-height
        if ($j.browser.msie && $j.browser.version == "6.0") {
          cssObj = {
            "height":finalHeight
          };
        } else {
          cssObj = {
            "min-height":finalHeight,
            "height":"auto !important"
          };
        }
        
        // then, I'll force the final height on the list item and its corresponding list items inside the other cols
        jThisLi.css(cssObj);
        jThisLi.closest(".box-content").find(".cols").eq(1).find(".prd-container").eq(i).css(cssObj);
        jThisLi.closest(".box-content").find(".cols").eq(2).find(".prd-container").eq(i).css(cssObj);
       
        // If jTop is true, add a list item to the count.
        if (jTop) {
          jCountLI = $j("<li>"+(i+1)+"</li>").css(cssObj = {
            "line-height":(finalHeight+3)+"px",
            "padding":"10px 0"
          });
          jNav.append(jCountLI);
        }
        
      });
      
      // this part deals with the hover eyecandy on the top selling box
      if (jTop) {
        // if there is a jNav object, prepend it.
        if (jNav) jNav.prependTo(jThis.find(".box-content"));
        
        var prdBox = jThis.find(".prd");
        
        prdBox.each(function(i) {
          var jThisBox = $j(this),
                jThisNum =  jThisBox.index();
      
          jThisBox.bind("mouseenter",function(e){
            var jThis = $j(this).addClass("hover");
            
            jNav.find("li:eq("+jThisNum+")").addClass("hover");
          });
          
          prdBox.bind("mouseleave",function(e){
            var jThis = $j(this).removeClass("hover");
             
            jNav.find("li:eq("+jThisNum+")").removeClass("hover");
          });
        });
      }
      
    });
    
    return this;
  }
  
}(jQuery));