﻿// JScript File
var HtmlDivControl = 'div';
var HtmlTableControl = 'table';
var MinAllowedWidth = 0;
var MaxAllowedWidth = 0;  
var DivPaddingValue = 10;
//Used to resolve default horizatol scrollbar problem of Theme3 
var Theme3ContentPadding = 20; 
//Theme 1 has content area as 91% of page so need to set more padding to avoid overlapping of div 
var Theme1ContentPadding = 0;
//Applied to Theme4 bacuse it has entirely different design with lots of padding in header area
var Theme4PaddingWidth = 90;
var TableContentWidth = 0;
//Used where we have border around content area [Theme2 & Theme5]
var PageWidth = 600;
var HeadDiv;

// Set min-width to different Div of page contents for login pages  
function SetBrowserWidthForLoginPages(LogoImageControlID, BannerImageControlID, CurrentTheme)
{
    // Get Min width for header div	
    GetHeaderMinWidth(LogoImageControlID, BannerImageControlID, CurrentTheme, null);
    
    // Set min-width to different div with respect to header div to resolve browser resizing issue
    SetWidthForBrowserResizeFix(CurrentTheme);
}

// Set min-width to different Div of page contents for login pages  
function SetBrowserWidthForFeaturePages(LogoImageControlID, BannerImageControlID, CrossSellImage, CurrentTheme, MenuWidth)
{
    var CrossSell = document.getElementById(CrossSellImage + "_CSDiv"); 
    Theme1ContentPadding = 60;
    // Get Min width for header div		    
    GetHeaderMinWidth(LogoImageControlID, BannerImageControlID, CurrentTheme, CrossSell);
    
    // Set min-width to different div with respect to header div to resolve browser resizing issue        
    SetWidthForBrowserResizeFix(CurrentTheme);  
}

// Get min-width and max-width for Header div with respect to Logo, Banner, Global Nav and CrossSell.   
function GetHeaderMinWidth(LogoImageControlID, BannerImageControlID, CurrentTheme, CrossSell)
{
    var LogoWidth = 0; 
    var BannerWidth = 0; 
    var GlobalNavTableWidth = 0;
    var ContentTable = document.getElementsByTagName(HtmlTableControl)['ContentTable'];
    var LogoImg = document.getElementById(LogoImageControlID); 
    var BannerImg = document.getElementById(BannerImageControlID); 
    var GlobalNavTable = document.getElementsByTagName(HtmlTableControl)['GlobalNavTable'];
    HeadDiv = document.getElementsByTagName(HtmlDivControl)['HeaderDiv'];
    
    // Get Logo Image width
    if(LogoImg != null)
    {
        LogoWidth = LogoImg.offsetWidth; 
        //Set Logo Div min-width to resolve image overlapping problem 
	    if(LogoWidth > 1)
            document.getElementsByTagName(HtmlDivControl)['LogoDiv'].style.minWidth = LogoWidth + 'px';
    }
    
    // Get Banner Image width
    if(BannerImg != null)
    {
        BannerWidth = BannerImg.offsetWidth;
        // Set Banner Div min-width to resolve image overlapping problem 
	    if(BannerWidth > 2)
	    {
	        if(CurrentTheme == "Theme2" && LogoWidth < 2)
	        {
	            BannerWidth = BannerWidth + Theme4PaddingWidth; 
                document.getElementsByTagName(HtmlDivControl)['BannerDiv'].style.minWidth = BannerWidth + Theme4PaddingWidth + 'px';
                document.getElementsByTagName(HtmlDivControl)['BannerDiv'].style.marginLeft = Theme4PaddingWidth + 'px';
                //alert(BannerWidth);
            }
        }
    }
    
    // Get Global Nav table width
    if(GlobalNavTable != null)
        GlobalNavTableWidth = GlobalNavTable.offsetWidth 
    
    // Calculate Min Width for header dive with respect to crosssell	
    if (CrossSell != null)
    {   
        //Cross sell Max allowed width as 290 will be added for Theme1 & theme4
        //For all other themes the Cross sell Max allowed width will be set to 530 
        if(CurrentTheme == 'Theme1' || CurrentTheme == 'Theme4')
            MinAllowedWidth = LogoWidth + 290 + GlobalNavTableWidth;
        else
            MinAllowedWidth = LogoWidth + 530 + GlobalNavTableWidth;    
        
        //Vertically Align Header Contents
        SetTopMarginToHeaderContents(LogoImg, null, GlobalNavTable, CurrentTheme);
    }
    else
    { 
        MinAllowedWidth = LogoWidth + BannerWidth + GlobalNavTableWidth + DivPaddingValue;
        //Vertically Align Header Contents
        SetTopMarginToHeaderContents(LogoImg, BannerImg, GlobalNavTable, CurrentTheme);
    }
    //Get Max width with respect to content table     
    if(ContentTable != null)
    {
        TableContentWidth = parseInt(ContentTable.offsetWidth);
        if(MinAllowedWidth < parseInt(TableContentWidth))
            MaxAllowedWidth = TableContentWidth;
        else
            MaxAllowedWidth = MinAllowedWidth; 
    }
    //Mininmum Allowed Width will not be more than 1024 in any case. 
    if(MaxAllowedWidth >1024)
        MaxAllowedWidth =1024;   
}


// Set min-width to Header, Content and bottom Div to resolve browser resizing issue
function SetWidthForBrowserResizeFix(CurrentTheme)
{
    //Apply changes only if header div is available
    if(HeadDiv != null)
    {
        var ContentDiv = document.getElementsByTagName(HtmlDivControl)['ContentDiv'];
        var BottomDiv = document.getElementsByTagName(HtmlDivControl)['BottomDiv'];
        
        switch(CurrentTheme)
        {
            case 'Theme1':
            {
                HeadDiv.style.minWidth = MinAllowedWidth + 'px';
                ContentDiv.style.minWidth = MaxAllowedWidth + Theme1ContentPadding + 'px';
                break;
            }
            case 'Theme3':
            {
                ContentDiv.style.minWidth = MaxAllowedWidth - Theme3ContentPadding  + 'px';
                BottomDiv.style.minWidth = MaxAllowedWidth - Theme3ContentPadding + 'px';
                HeadDiv.style.minWidth = MinAllowedWidth + 'px'
            }
            case 'Theme4':
            {
                HeadDiv.style.minWidth = MinAllowedWidth + Theme4PaddingWidth + 'px';
                break;
            }
            case 'Theme2':
            case 'Theme5':
            {
                // To show border around page content...
                // Apply min-width to 95% of MaxAllowedWidth if it is more than 600px 
                // Else normal settings will be applied.  
                if(MaxAllowedWidth > TableContentWidth && MaxAllowedWidth > PageWidth )
                {
                    ContentDiv.style.minWidth = 0.95 * MaxAllowedWidth + 'px';
                    BottomDiv.style.minWidth = 0.95 * MaxAllowedWidth + 'px'; 
                }
                else
                {
                    ContentDiv.style.minWidth = MaxAllowedWidth + 'px';
                    BottomDiv.style.minWidth = MaxAllowedWidth + 'px';
                }
                HeadDiv.style.minWidth = MinAllowedWidth + 'px';
                break;
            }
            case 'Theme8':
            {
                ContentDiv.style.minWidth = MaxAllowedWidth + 'px';
                HeadDiv.style.minWidth = MinAllowedWidth + 'px';
                break;
            }
            default:
            {
                ContentDiv.style.minWidth = MaxAllowedWidth  + 'px';
                BottomDiv.style.minWidth = MaxAllowedWidth + 'px';
                HeadDiv.style.minWidth = MinAllowedWidth + 'px';
            }   
        } 
    } 
}

//Set Top Margin to vertically align header contents
function SetTopMarginToHeaderContents(LogoImg, BannerImg, GlobalNavTable, CurrentTheme)
{
    //Find the max height amongs all
    var MaxHeight = LogoImg.offsetHeight
    if(BannerImg != null && BannerImg.offsetHeight > MaxHeight)
        MaxHeight = BannerImg.offsetHeight;
    if (GlobalNavTable.offsetHeight > MaxHeight)    
        MaxHeight = GlobalNavTable.offsetHeight;
    
    if(HeadDiv !=null && CurrentTheme != 'Theme4' && CurrentTheme != 'Theme7')
    {    
        if(CurrentTheme == 'Theme5' && HeadDiv.offsetHeight > MaxHeight)
            MaxHeight = HeadDiv.offsetHeight;
        //Set Logo & Banner top margin     
        LogoImg.style.marginTop = parseInt((MaxHeight - LogoImg.offsetHeight)/2) + 'px';
        if(BannerImg != null)
            BannerImg.style.marginTop = parseInt(GetTopMargin(MaxHeight,BannerImg.offsetHeight)) + 'px';
        //Set Global Navigation Top margin
        var GlobalNavDiv = document.getElementsByTagName(HtmlDivControl)['GlobalNavDiv'];        
        if(CurrentTheme != 'Theme1')  
            GlobalNavDiv.style.marginTop = parseInt(GetTopMargin(MaxHeight, GlobalNavTable.offsetHeight)) + 'px';   
    }
}

function GetTopMargin(MaximumHeight, ControlHeight)
{
    var TopMargin = parseInt((MaximumHeight - ControlHeight)/2);
    if(TopMargin < 3)
        return 3;
    else
        return TopMargin;
}
