﻿function ToggleCategory(button) {
    var menu = document.getElementById('more-top-nav');
    var text = document.getElementById("category-toggle-text");
    
    if (menu.className == "") {
        // show menu
        menu.className = "shown";
        text.innerText = "Less Occasions";

        for (var i = 0; i < button.childNodes.length; i++) {
            if (button.childNodes[i].tagName == "IMG") {
                button.childNodes[i].src = button.childNodes[i].src.replace( "arrow.png","arrow-up.png");
            }
        }
       }
    else {
        // hide menu
        menu.className = "";
        text.innerText = "More Occasions";

        for (var i = 0; i < button.childNodes.length; i++) {
            if (button.childNodes[i].tagName == "IMG") {
                button.childNodes[i].src = button.childNodes[i].src.replace( "arrow-up.png","arrow.png");
            }
        }
    }
}

function AlignContent(divLeft, divCentre, divRight) {
    var totalHeight;
    var DivElements = new Array(3);
    
    DivElements[0] = document.getElementById(divLeft);
    DivElements[1] = document.getElementById(divCentre);
    DivElements[2] = document.getElementById(divRight);

    //get greatest total height
    totalHeight = GetGreatestHeight(DivElements);

    for (var i = 0; i < 3; i++) {
        SetNewElementHeight(DivElements[i], totalHeight);
    }    
}

function GetGreatestHeight(Elements) {
    var greatestHeight = 0;
    for (var i = 0; i < 3; i++) {
        var elementHeight = Elements[i].offsetHeight + getOffset(Elements[i]);

        if (elementHeight > greatestHeight)
            greatestHeight = elementHeight;
    }
    return greatestHeight;
}

function SetNewElementHeight(Element, totalHeight) {
    var currentHeight = Element.offsetHeight + getOffset(Element);

    if (totalHeight > currentHeight) {
        //need to increate height
        Element.style.height = ((totalHeight - getOffset(Element))) + 'px';
    }
    else {
        Element.style.height = ((currentHeight - getOffset(Element))) + 'px';
    }
}

function getOffset(element) {
    var top = 0;
    while (element.offsetParent) {
        //add on this elements offset
        top += element.offsetTop;

        //search parent element
        element = element.offsetParent;
    }
    //add final elements offset/or add on base element as there is no parent
    top += element.offsetTop;
    return top;
}
