﻿//
// Initialises the web page (called in onload event of body element).
// 
function InitialisePage()
{
    ReflectDocumentHeight();
}

//
// Depending on the document's height the controls are resized accordingly.
// This method must be called as a response to the onload and onresize events.
// 
//
// Remarks:
//   When the height of an elemement is defined in an external CSS file it can't
//   be read by using "element.style.height"; it can be done by using
//   element.offsetHeight!
// 
function ReflectDocumentHeight()
{               
    //get document height
    var documentHeight = document.documentElement.clientHeight;
       
    //get reference to all height-related elements
    var mainTable = document.getElementById( "idMainTable" );            
    var topTable = document.getElementById( "idTopTable" );
    var middleTable = document.getElementById( "idMiddleTable" );
    var bottomTable = document.getElementById("idBottomTable");
    var margins = 6; //margin top = 3px, margin bottom = 3px
    var horizontalLines = 2;
    var calculatedHeight = 0;
             
    //get relevant heights
    var heightTopTable = topTable.offsetHeight;
    var heightSum = heightTopTable + bottomTable.offsetHeight;  //height footer = 24    
       
    //calculate heights
    mainTable.style.height = documentHeight + "px"; //px has to be added for FireFox                
    calculatedHeight = documentHeight - heightSum - margins - horizontalLines;
    
    if ( calculatedHeight > 0 )
    {
        middleTable.style.height = calculatedHeight + "px"; //px has to be added for FireFox                        
    }  
    
    var categories = document.getElementById( "ctl00_placeHolderContent_idCategories" );            
    var information = document.getElementById( "ctl00_placeHolderContent_idInformation" );
    var informationContainer = document.getElementById( "idInformationContainer" );
    
    if (  categories != null )
    {    
        var informationHeight = calculatedHeight - categories.offsetHeight;
        if ( (informationHeight - 10) < 128 ) 
        {
            informationHeight = 128;
        }
   
        information.style.height = (informationHeight - 10) + "px";
        informationContainer.style.height = informationHeight + "px";   
    }
}

//
// Positions the floating menu and logo.
// 
//
// Remarks:
//   The floating menu is positioned relative to the footer:
//   - Y direction: (top side of footer) - (3 x height of menu item) + (overlap with footer) -> X + 72 - 10
//   - X direction: (left side of footer) + (width of products menu) - (width of floating menu) -> X + 166 - 128
//   The floating log is positioned relative to the header:
//   - Y direction: (top side of header) + (offset) -> X + 15
//   - X direction: (left side of header) + (offset) -> X + 10
//
function PositionFloatingElements()
{
    //floating menu
    var floatingMenu = document.getElementById( "idFloatingMenuContainer" );   
    var idFooter = document.getElementById( "idFooter" );  
    var floatingMenuItem = document.getElementById("ctl00_idFloatingMenuItem1"); 
    var productsMenu = document.getElementById("idProducts");
      
    floatingMenu.style.top = (GetPostionY(idFooter) - (3*floatingMenuItem.offsetHeight) + 10) + "px";
    floatingMenu.style.left = (GetPostionX(idFooter) + productsMenu.offsetWidth - floatingMenu.offsetWidth) + "px";
    floatingMenu.style.position = "absolute";
    
    //floating logo
    var floatingLogo = document.getElementById( "idFloatingLogo" );
    var idHeader = document.getElementById( "idHeader" );
         
    floatingLogo.style.top = (GetPostionY(idHeader) + 15) + "px";
    floatingLogo.style.left = (GetPostionX(idHeader) + 10) + "px";
    floatingLogo.style.position = "absolute"; 
}

//
// Get absolute Y position of element.
//
function GetPostionY( element )
{
    var position = 0;
    
    while( element != null ) 
    {
        position += element.offsetTop;
        element = element.offsetParent;
    }
    
    return position;
}

//
// Get absolute X position of element.
//
function GetPostionX( element )
{
    var position = 0;
    
    while( element != null ) 
    {
        position += element.offsetLeft;
        element = element.offsetParent;
    }
    
    return position;
}


