﻿var menu = new Class({
    _current: false,
    _initialized: [],
    _holdCurrent: false,
    _inte: false,
    _call: function (e) {
        switch (e.a) {
            case "open":
                this._openMenu(e);
                break;
            case "close":
                this._closeCurrent();
                break;
        }
    },
    initialize: function () {
        site.addEvent("menu", function (e) { this._call(e); } .bind(this));
        window.addEvent("resize", this._windowResized.bind(this));
        $("menu").addEvent("click", this._closeCurrent.bind(this));
        $$("a.rollSub").each(function (menuLink) {
            var obj = JSON.decode(menuLink.get("rel"));
            menuLink.addEvents({
                "mouseenter": this._openMenu.pass({ i: menuLink.get("id"), c: obj.c, p: obj.p }, this),
                "mouseleave": function () { this._inte = this._closeCurrent.delay(500, this); } .bind(this)
            });
            // close on rollout of the sub menu
            $(obj.c).getElement("div.popWarp").addEvents({
                "mouseleave": this._closeCurrent.bind(this),
                "mouseenter": function () { clearTimeout(this._inte); } .bind(this)
            });
        }, this);
//        $$("a.noRollSub").each(function (menuLink) {
//            menuLink.addEvents({
//                "mouseenter": this._closeCurrent.bind(this)
//            });
//        }, this);

    },
    Hold: function () {
        this._holdCurrent = true;
    },
    Unhold: function () {
        this._holdCurrent = false;
    },
    _openMenu: function (e) {
        this.Unhold();
        clearTimeout(this._inte);
        this._closeCurrent();
        if (!$(e.i))
            return;
        if (!this._initialized.contains(e.i))
            this._initMenu(e);
        $(e.c).setStyle("display", "block");
        $(e.i).addClass("active");
        this._current = e;
    },
    _windowResized: function () {
        this._closeCurrent();
        this._initialized = [];
    },
    _closeCurrent: function () {
        if (this._current && !this._holdCurrent)
            this._closeMenu(this._current);
    },
    _closeMenu: function (e) {
        $(e.c).setStyle("display", "none");
        $(e.i).removeClass("active");
    },
    _getPosition: function (e) {
        var obj = {};
        switch (e.p) {
            case "footer":
                obj["offset"] = { x: 0, y: 0 };
                obj["edge"] = "centerBottom";
                obj["position"] = "centerTop";
                break;
            case "info":
                obj["offset"] = { x: 0, y: -10 };
                obj["edge"] = "centerTop";
                obj["position"] = "centerBottom";
                break;
            case "currency":
                obj["offset"] = { x: -5, y: -4 };
                obj["edge"] = "rightTop";
                obj["position"] = "rightBottom";
                break;
            case "country":
                obj["offset"] = { x: 0, y: -4 };
                obj["edge"] = "centerTop";
                obj["position"] = "centerBottom";
                break;
            default:
                obj["offset"] = { x: 0, y: 0 };
                obj["edge"] = "centerTop";
                obj["position"] = "centerBottom";
                break;
        }
        return obj;
    },
    _initMenu: function (e) {
        var positionObj = Object.merge({
            "relativeTo": $(e.i)
        }, this._getPosition(e));
        $(e.c)
            .setStyles({ "display": "block", "visibility": "hidden" })
            .addEvent("click", this._closeMenu.pass(e, this))
            .getElement("div.popWarp").position(positionObj)
            .addEvent("click", function (e) { e.stopPropagation(); });
        $(e.c).setStyles({ "display": "none", "visibility": "visible" });
        this._initialized.push(e.i)
    }
});
