jQuery(function($) {

      var init = function (maxParentHeight) {
      
        var marginTop = 10;
        var layoutGrid = document.getElementById('layout-grid');
        
        if(null == layoutGrid) {
          return;
        }
        
        var totalHeight = layoutGrid.offsetHeight;
        var tdCount = $('#layout-grid.portlet-layout tr td').length;
        
        var px = marginTop + 'px';
        $('#column-1 .portlet-dropzone > div:gt(0)').css({'margin-top': px, 'position': 'relative'});
        $('#column-2 .portlet-dropzone > div:gt(0)').css({'margin-top': px, 'position': 'relative'});
        $('#column-3 .portlet-dropzone > div:gt(0)').css({'margin-top': px, 'position': 'relative'});
        
        $('#column-1 .portlet-dropzone > div').append('<div></div>');
        $('#column-1 .portlet-dropzone > div:last > div:last').addClass('l-corner');
        
        $('#column-3 .portlet-dropzone > div').append('<div></div>');
        $('#column-3 .portlet-dropzone > div:last > div:last').addClass('r-corner');
        
        /**
        * Add class appBorder to all application container.
        */
        for(var i = 1; i < (tdCount + 1); i++) {
          var column = '#column-' + i + ' .portlet-dropzone';
          $(column).css('position', 'relative');
          column = column + ' > div';
          $(column).addClass('appBorder');
        }
        
        /**
        * The total height of all div container/element in a column
        *
        */
        var column1AllDivHeight = getHeightOfDivs('#column-1 .portlet-dropzone > div');
        var column2AllDivHeight = getHeightOfDivs('#column-2 .portlet-dropzone > div');
        var column3AllDivHeight = getHeightOfDivs('#column-3 .portlet-dropzone > div');
        
        /**
        * The amount/count of divs in a column
        *
        */
        var divCountColumn1 = $('#column-1 .portlet-dropzone > div').length;
        var divCountColumn2 = $('#column-2 .portlet-dropzone > div').length;
        var divCountColumn3 = $('#column-3 .portlet-dropzone > div').length;
        
        /**
        * Correct div corners for ie6 in case of one application container and many.
        */
        var version = '' + $.browser.version.string;   
        if($.browser.msie && (-1 != version.indexOf('6.'))) {
            
            $('#column-1 .l-corner').removeAttr('margin-bottom');
            $('#column-1 .l-corner').removeAttr('margin-left');
            $('#column-3 .r-corner').removeAttr('margin-bottom');
            $('#column-3 .r-corner').removeAttr('margin-left');
            
            if(1 == divCountColumn1) {
              $('#column-1 .portlet-dropzone > div:first').css({'position': 'relative'});
              $('#column-1 .l-corner').css('margin-bottom', '-1px');
              $('#column-1 .l-corner').css('margin-left', '-1px');
            } else {
              $('#column-1 .l-corner').css('margin-bottom', '-1px');
              $('#column-1 .l-corner').css('margin-left', '-1px');
            }
            
            if(1 == divCountColumn3) {
              $('#column-3 .portlet-dropzone > div:first').css({'position': 'relative'});
              $('#column-3 .r-corner').css('margin-bottom', '-1px');
              $('#column-3 .r-corner').css('margin-right', '-2px');
            } else {
                $('#column-3 .r-corner').css('margin-bottom', '-1px');
                $('#column-3 .r-corner').css('margin-right', '-2px');
            }
            
        } else {

            if(1 == divCountColumn1) {
              $('#column-1 .l-corner').css('margin-bottom', '0px');
              $('#column-1 .l-corner').css('margin-left', '-1px');
            } else {
              $('#column-1 .l-corner').css('margin-bottom','-1px');
              $('#column-1 .l-corner').css('margin-left','-1px');
            }
            
            if(1 == divCountColumn3) {
              $('#column-3 .r-corner').css('margin-bottom', '0px');
              $('#column-3 .r-corner').css('margin-right', '-2px');
            } else {
              $('#column-3 .r-corner').css('margin-bottom','-1px');
              $('#column-3 .r-corner').css('margin-right','-1px');
            }
            
        }
        
        /**
        * Consider the top margins in the calculation of height of all divs.
        * 
        */
        column1AllDivHeight = column1AllDivHeight + ((divCountColumn1 - 1) * marginTop);
        column2AllDivHeight = column2AllDivHeight + ((divCountColumn2 - 1) * marginTop);
        column3AllDivHeight = column3AllDivHeight + ((divCountColumn3 - 1) * marginTop);
        
        var maxHeight = Math.max(column1AllDivHeight, column2AllDivHeight, column3AllDivHeight);
        maxHeight = Math.max(maxHeight, maxParentHeight);
        
        /**
        * Correct the corner for ie6 in case of the middle column have a lot of content.
        * 
        */
        if(maxHeight == column2AllDivHeight) {
          var version = new String(jQuery.browser.version);
          if(-1 != version.indexOf('6.')) {
            $('#column-1 .l-corner').css('margin-bottom','-2px');
            $('#column-3 .r-corner').css('margin-bottom','-2px');
          }
        }
        
        var newHeightColumn1 = maxHeight - column1AllDivHeight;
        var newHeightColumn2 = maxHeight - column2AllDivHeight;
        var newHeightColumn3 = maxHeight - column3AllDivHeight;
      
        /**
        * Increase the heights of the last applications containers in order that
        * all divs have the same border height.
        */
        increaseLastDivsHeight('#column-1 .portlet-dropzone > div', newHeightColumn1);
        increaseLastDivsHeight('#column-2 .portlet-dropzone > div', newHeightColumn2);
        increaseLastDivsHeight('#column-3 .portlet-dropzone > div', newHeightColumn3);
      
        /**
        * Correct the position of the corners after increasing the height of the divs for ie6.
        * 
        */
        if($.browser.msie && (-1 != version.indexOf('6.'))) {
            if(1 == divCountColumn1) {
              var div = $('#column-1 .portlet-dropzone > div:first');
              var offsetHeight = div[0].offsetHeight;
              offsetHeight = offsetHeight - (marginTop + 1);
              $('#column-1 .l-corner').css('top', offsetHeight);
            }
         }

      };

    /**
    * Return the height of all application containers (div) in td > portlet-dropzone > div.
    * @param appContainer '#column-1 .portlet-dropzone > div' all application containers within > div
    */
    function getHeightOfDivs(appContainer) {
        
      var divsHeight = 0;
      $(appContainer).each(function(index) {
          
        divsHeight += this.offsetHeight;
        
      });
      
      return divsHeight;
    }

    /**
    * Increase the height of the last application container.
    * @param appContainer '#column-1 .portlet-dropzone > div' all application containers within > div
    * @param increaseHeight the height to be added
    */
    function increaseLastDivsHeight(appContainer, increaseHeight) {
        
        var divCount = $(appContainer).length;
        $(appContainer).each(function(index) {
        
          if(index == (divCount - 1)) {
          
            var divHeight = this.offsetHeight;
            this.height = divHeight + increaseHeight;
            this.style.height = divHeight + increaseHeight + 'px';
            
            if(0 == increaseHeight) {
              var divHeight = (divHeight < this.offsetHeight) ? divHeight : this.offsetHeight;
              this.height = divHeight;
              this.style.height = divHeight + 'px';
            }
            
          }
          
        });
      
    }

    /**
    * Invoked when page is rendered - dom is loaded
    */
    $(window).load(function () {
        
        var maxParentHeight = getMaxHeightOfParent();
        init(maxParentHeight);
        setFirstColumnHeight();
    });
    
    /**
    * After DOM is loaded, get the height of the parent/(top) element that
    * is in this case the table.
    * @return the max height of one of the columns
    */
    function getMaxHeightOfParent() {
        
        var column1 = $('#column-1');
        var column1OffsetHeight = column1[0].offsetHeight;
        var column1ScrollHeight = column1[0].scrollHeight;
        var column1MaxHeight = Math.max(column1OffsetHeight, column1ScrollHeight);
        
        var column2 = $('#column-2');
        var column2OffsetHeight = column1[0].offsetHeight;
        var column2ScrollHeight = column1[0].scrollHeight;
        var column2MaxHeight = Math.max(column2OffsetHeight, column2ScrollHeight);
        
        var column3 = $('#column-3');
        var column3OffsetHeight = column1[0].offsetHeight;
        var column3ScrollHeight = column1[0].scrollHeight;
        var column3MaxHeight = Math.max(column3OffsetHeight, column3ScrollHeight);
        
        return Math.max(column1MaxHeight, column2MaxHeight, column3MaxHeight);
    }
    
    /**
    * Logging
    */
    function trace(s) {
    
      try { console.log(s) } catch (e) { alert(s) }
      
    };
    
    /**
    * Set height of first and last column.
    */
    function setFirstColumnHeight() {
      var column2 = document.getElementById('layout-column_column-2');
      var offsetHeightColumn2 = column2.offsetHeight;
      var scrollHeightColumn2 = column2.scrollHeight;
      var clientHeightColumn2 = column2.clientHeight;
      
      var column1 = document.getElementById('layout-column_column-1');
      var column3 = document.getElementById('layout-column_column-3');
      
      column1.style.height = clientHeightColumn2 + "px";
      column3.style.height = clientHeightColumn2 + "px";
    }

});