function $old(id) {
    return document.getElementById(id);
}


/* http://www.dustindiaz.com/getelementsbyclass/ */
function getElementsByClassName(searchClass, node, tag) {
    var classElements = new Array();
    if (node == null)
        node = document;
    if (tag == null)
        tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("(^|\\s)" + searchClass + "(\\s|$)");
    for (i = 0, j = 0; i < elsLen; i++) {
        if (pattern.test(els[i].className)) {
            classElements[j] = els[i];
            j++;
        }
    }
    return classElements;
}



/** ArrangeElements By Shjærven Interactive 
An object with methods to evenly distribute elements without the use of tables
*/

var ArrangeElements = {
    getElementsData: function(elements, removepadding) {
        var elementsarray = [];
        var contentwidth = elements[0].parentNode.offsetWidth;
        var totalwidth = 0;
        for (var y = 0; y < elements.length; y++) {
            if (removepadding) {
                elements[y].style.paddingLeft = "0";
                elements[y].style.paddingRight = "0";
            }
            var width = elements[y].offsetWidth;
            elementsarray.push({ "node": elements[y], "width": width });
            totalwidth += width;
        }
        var differenceinwidth = contentwidth - totalwidth;
        return { "elements": elementsarray, "contentwidth": contentwidth, "totalwidth": totalwidth, "differenceinwidth": differenceinwidth };
    },
    center: function(elements) {
        var data = this.getElementsData(elements);
        if (data.differenceinwidth < 60) {
            this.distribute(elements, "width", true);
        } else {
            data.elements[0].node.style.marginLeft = data.differenceinwidth / 2 + "px";
        }
    },
    distribute: function(elements, style, removepadding) {
        var data = this.getElementsData(elements, removepadding);
        if (style == "width") {
            var newcurrentwidth = 0;
            // These two variebles is kept outside the loop for the last correction
            var width = 0;
            var node = null;
            for (var x = 0; x < data.elements.length; x++) {
                width = data.elements[x].width;
                var percentwidth = width / data.totalwidth; // get the elements percent value of the current width
                var portionofdifference = Math.floor(data.differenceinwidth * percentwidth);
                var width = width + portionofdifference;
                data.elements[x].width = width // put the updated value back for later use;
                newcurrentwidth += width;
                node = data.elements[x].node;
                node.style.width = width + "px";
            }

            // The last used values of node and rest is used
            if (newcurrentwidth < data.contentwidth) {
                var rest = data.contentwidth - newcurrentwidth;
                var i = data.elements.length - 1;
                for (; ; ) {
                    if (!rest--) break;
                    data.elements[i].node.style.width = data.elements[i].width + 1 + "px";
                    i--;
                }
                //node.style.width = width + rest + "px";
            }
        } else {
            var portionofdifference = data.differenceinwidth / (elements.length - 1);
            for (var x = 0; x < data.elements.length - 1; x++) {
                data.elements[x].node.style.marginRight = portionofdifference + "px";
            }
        }
    }
}




var Element = function(tag, properties) {
    var el = document.createElement(tag);
    for (var name in properties) {
        el.setAttribute(name, properties[name]);
    }
    return el;
}

$(function() {
    ArrangeElements.distribute(getElementsByClassName("Menu", $old("topmenus"))[0].getElementsByTagName("a"), "width");
    if (menu = getElementsByClassName("Menu", $old("topmenus"))[1]) {
        ArrangeElements.center(menu.getElementsByTagName("a"));
    }
    if (menu = getElementsByClassName("brands", $old("content"))) {
        for (var x = 0; x < menu.length; x++) {
            ArrangeElements.distribute(menu[x].getElementsByTagName("div"));
        }
    }
    if (menu = getElementsByClassName("more", $old("content"))[0]) {
        ArrangeElements.distribute(menu.getElementsByTagName("div"));
    }

    $('table.striped tr:odd').addClass('odd');
    $('table.striped tr:even').addClass('even');


    /* Stores selector */
    $.ajax({
        type: "POST",
        url: "/Templates/Pages/Stores.aspx/GetStoreLocations",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            var data = '';
            $.each(msg, function() {
                $.each(this, function(index) {
                    data += '<option value="' + this.pageID + '">' + this.pageName + '</option>';
                });
            });

            $('#location').append(data);
        }
    });

    $('#location').change(function() {
        var pageID = this.value;
        $('#stores').empty();

        $.ajax({
            type: "POST",
            url: "/Templates/Pages/Stores.aspx/GetStores",
            data: "{'pageId' : '" + pageID + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg) {
                var data = '';
                data += '<option>Velg butikk</option>';
                $.each(msg, function() {
                    $.each(this, function(index) {
                        data += '<option value="' + this.linkUrl + '">' + this.pageName + '</option>';
                    });
                });

                $('#stores').append(data);
            }
        });
    });

    $('#stores').change(function() {
        window.location = this.value;
    });

});


var Tips = {
    popup: function(id) {
        if (tips = $old("tips")) {
            tips.remove();
        }
        var display = document.viewport.getDimensions();
        var offset = document.viewport.getScrollOffsets();
        var left = (display.width + offset.left - 277) / 2;
        var top = (display.height + offset.top - 348) / 2;
        var box = new Element("div", { "id": "tips", "class": "tips", "style": "top:" + top + "px; left:" + left + "px;" })
        var content = new Element("div", { "class": "content" });
        var header = new Element("div", { "class": "header" }).update("TIPS EN VENN");
        var closepopup = new Element("div", { "class": "close" }).update("Lukk");
        closepopup.onclick = function() {
            this.parentNode.parentNode.parentNode.remove();
        }
        header.appendChild(closepopup);
        content.appendChild(header);
        var message = new Element("div", { "class": "message" }).update('Din epost:<br /><input type="text" /><br />1.Mottakers epost:<br /><input type="text" /><br />2.Mottakers epost:<br /><input type="text" /><br />Melding til mottaker:<br /><textarea></textarea><br /><a class="button" href="#" onclick="__doPostBack(\'__Page\', \'julenissen\']);" href="#"><span>Send</span></a>');
        content.appendChild(message);
        box.appendChild(content);
        document.body.insertBefore(box, document.body.firstChild);
    }
}