var fontSizeMenu;
if (!fontSizeMenu) fontSizeMenu = {};
else throw new Error("fontSizeMenu has already been defined");

fontSizeMenu.fontOffset = 2;
fontSizeMenu.baseFontSize = 10;
fontSizeMenu.topPaddingStart = 6;

fontSizeMenu.isHeaderLoaded =
    function() {
        return document.getElementById("headerMenu");
    };

fontSizeMenu.changeBaseFontSize =
    function(fontSize) {
        document.getElementsByTagName("body")[0].style.fontSize = fontSize + "px";
    };

fontSizeMenu.updateFontSizeAndMenu =
    function(fontSize) {
        var fontSizeButtons = document.getElementById("fontSizeButtons");
        var calculatedIndex = (fontSize - this.baseFontSize) / this.fontOffset;

        for (var i = 0; i < fontSizeButtons.childNodes.length; i++)
            fontSizeButtons.childNodes[i].style.backgroundColor = "transparent";

        fontSizeButtons.childNodes[calculatedIndex].style.backgroundColor = "#3e0063";

        this.setFontSizeCookie(fontSize);
        this.changeBaseFontSize(fontSize);
    };

fontSizeMenu.setFontSizeCookie =
    function(fontSize) {

        var exdate = new Date();

        exdate.setDate(exdate.getDate()+365);

        document.cookie = "fontSize=" + escape(fontSize) +
            ";expires=" + exdate.toGMTString() + ";path=/";
    };

fontSizeMenu.addFontSizeMenuToHeader =
    function(numberOfChoices) {

        var headerMenuDiv, fontMenuDiv;

        headerMenuDiv = document.getElementById("headerMenu"); //headerMenu

        fontMenuDiv = this.createFontSizeMenu(numberOfChoices);

        headerMenuDiv.appendChild(fontMenuDiv);
    };

fontSizeMenu.createFontSizeMenu =
    function(numberOfChoices) {

        var fontMenuDiv, leftSubDiv, middleSubDiv, rightSubDiv, fontSizeButton, i, j;
        var wrapperDiv, userSelectedFontSize, fontSizeTable, fontSizeTableBody, fontSizeTableTr, fontSizeTableTd, strongElement;

        wrapperDiv = this.createDivElement();
        wrapperDiv.id = "fontSizeMenuWrapper";

        fontSizeTable = document.createElement("table");
        fontSizeTable.style.borderCollapse = "collapse";

        fontSizeTableBody = document.createElement("tbody");
        fontSizeTableTr = document.createElement("tr");

        fontSizeTableTd = document.createElement("td");
        fontSizeTableTd.style.textAlign = "center";
        fontSizeTableTd.style.padding = 0;
        fontSizeTableTd.style.height = "49px";
        fontSizeTableTd.style.verticalAlign = "bottom";

        strongElement = document.createElement("strong");
        strongElement.appendChild(document.createTextNode("Change font size:"));
        strongElement.style.fontSize = "10px";
        strongElement.style.color = "#3e0063";

        fontSizeTableTd.appendChild(strongElement);
        fontSizeTableTr.appendChild(fontSizeTableTd);
        fontSizeTableBody.appendChild(fontSizeTableTr);

        fontMenuDiv = this.createDivElement(null, "24px");
        fontMenuDiv.style.marginLeft = "auto";
        fontMenuDiv.style.marginRight = "auto";

        leftSubDiv = this.createDivElement("20px", "24px", imageDirectory + "header_menu_left_rounded.png");
        leftSubDiv.style.cssFloat = "left";
        leftSubDiv.style.styleFloat = "left";

        fontMenuDiv.appendChild(leftSubDiv);

        middleSubDiv = this.createDivElement(null, "24px", imageDirectory + "header_menu_middle.png");
        middleSubDiv.id = "fontSizeButtons";

        userSelectedFontSize = this.getUserSelectedFontSize();

        for (i = 0, j = 0; i < numberOfChoices; i++, j += this.fontOffset) {

            if (i == (userSelectedFontSize-this.baseFontSize) / this.fontOffset)
                fontSizeButton = this.createFontSizeButton(j+this.baseFontSize, this.topPaddingStart-j, true);
            else fontSizeButton = this.createFontSizeButton(j+this.baseFontSize, this.topPaddingStart-j, false);

            if (i != numberOfChoices - 1)
                fontSizeButton.style.marginRight = "5px";

            middleSubDiv.appendChild(fontSizeButton);
        }

        this.styleMiddleSubMenu(middleSubDiv.style);

        fontMenuDiv.appendChild(middleSubDiv);

        rightSubDiv = this.createDivElement("20px", "24px", imageDirectory + "header_menu_right_rounded.png");
        rightSubDiv.style.styleFloat = "left";
        rightSubDiv.style.cssFloat = "left";

        fontMenuDiv.appendChild(rightSubDiv);

        this.styleFontSizeMenu(fontMenuDiv.style);

        fontSizeTableTr = document.createElement("tr");
        fontSizeTableTd = document.createElement("td");

        fontSizeTableTd.appendChild(fontMenuDiv);
        fontSizeTableTr.appendChild(fontSizeTableTd);
        fontSizeTableBody.appendChild(fontSizeTableTr);

        fontSizeTable.appendChild(fontSizeTableBody);

        wrapperDiv.appendChild(fontSizeTable);

        this.styleWrapperDiv(wrapperDiv.style, userSelectedFontSize);

        return wrapperDiv;
    };

fontSizeMenu.getUserSelectedFontSize =
    function() {

        var cookieName = "fontSize";

        if (document.cookie.length > 0) {
          c_start = document.cookie.indexOf(cookieName + "=");

          if (c_start != -1) {
            c_start = c_start + cookieName.length + 1;
            c_end = document.cookie.indexOf(";", c_start);

            if (c_end == -1) c_end = document.cookie.length;
            return unescape(document.cookie.substring(c_start,c_end));

          }
        }

        return this.baseFontSize;
    };

fontSizeMenu.createDivElement =
    function(width, height, backgroundImageURL) {

        var newDiv = document.createElement("div");

        if (width) newDiv.style.width = width;
        if (height) newDiv.style.height = height;
        if (backgroundImageURL) {
            this.setElementBackground(newDiv, backgroundImageURL);
        }

        return newDiv;
    };

fontSizeMenu.createFontSizeButton =
    function(fontSize, topPadding, isSelected) {

        var fontSizeDiv, strongElement;

        // this function provides a closure so that the value of i is used when
        // the changeBaseFontSize function is called, rather than using i's last value.
        function handler(n) {
            return function() {
                fontSizeMenu.updateFontSizeAndMenu(n);
            };
        }

        fontSizeDiv = document.createElement("div");
        fontSizeDiv.style.cssFloat = "left";
        fontSizeDiv.style.styleFloat = "left";
        fontSizeDiv.style.height = 20 - topPadding + "px";
        fontSizeDiv.style.paddingTop = topPadding + "px";
        fontSizeDiv.style.textAlign = "center";
        fontSizeDiv.style.width = "20px";
        fontSizeDiv.style.fontSize = fontSize + "px";
        fontSizeDiv.style.marginTop = "3px";

        this.setElementBackground(fontSizeDiv, imageDirectory + "font_size_button_box.png");

        //if (isSelected) fontSizeDiv.style.backgroundColor = "#3e0063";

        fontSizeDiv.style.cursor = "pointer";

        //fontSizeDiv.style.border = "1px solid red";

        strongElement = document.createElement("strong");
        strongElement.appendChild(document.createTextNode("A"));

        fontSizeDiv.appendChild(strongElement);
        fontSizeDiv.onclick = handler(fontSize);

        return fontSizeDiv;
    };

fontSizeMenu.setElementBackground =
    function(element, backgroundImageURL) {
        if (navigator.appName == "Microsoft Internet Explorer" &&
            parseFloat(navigator.appVersion) >= 4) {
            element.style.display = "inline-block";
            element.style.cssText = element.style.cssText + ";" + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='" + backgroundImageURL + "', sizingMethod='scale')";
        }
        else {
            element.style.backgroundImage = "url('" + backgroundImageURL + "')";
            element.style.backgroundRepeat = "no-repeat";
        }
    };

fontSizeMenu.styleWrapperDiv =
    function(styleObject, fontSize) {

        styleObject.color = "#3e0063";
        styleObject.cssFloat = "right";
        styleObject.styleFloat = "right";
        styleObject.position = "relative";
        styleObject.top = "-53px";
        styleObject.marginBottom = "-53px";
        styleObject.marginRight = "19px";
    };

fontSizeMenu.styleFontSizeMenu =
    function(styleObject) {
        styleObject.margin = "3px 0 0";
    };

fontSizeMenu.styleMiddleSubMenu =
    function(styleObject){
        styleObject.cssFloat = "left";
        styleObject.styleFloat = "left";
        styleObject.backgroundRepeat = "repeat-x";
        styleObject.color = "#ffffff";
    };