//*********************************************************
//
// ContainerBase
//
//*********************************************************
function ContainerBase() {
    this._className = '';
}

ContainerBase.prototype.className = function(value) {
    if (value == undefined) {
        return this._className;
    }
    if (value == '') {
        this._container.removeClass(this._className);
    } else if (!this._container.hasClass(value)) {
        this._container.addClass(value);
    }
    this._className = value;
    return this;
}

//*********************************************************
//
// MenuItem
//
//*********************************************************
function MenuItem() {
    this._callback = null;
    this._parent = null;
    this._child = null;

    //this._hover = $('<div />').addClass('tophover').css({ 'overflow': 'hidden', 'position': 'absolute', 'display': 'none', 'z-index': '1000' }).appendTo('body');
    //this._hover.get(0).__self = this;
    //this._hover.get(0).onmouseover = this.hover_MouseOver;
    //this._hover.get(0).onmouseout = this.hover_MouseOut;
    //this._hover.get(0).onclick = this.hover_Click;

    this._container = $('<div />').css({ 'overflow': 'hidden' });
    this._container.get(0).__self = this;
    this._container.get(0).onmouseover = this.container_MouseOver;
    this._container.get(0).onmouseout = this.container_MouseOut;
    this._container.get(0).onclick = this.container_Click;

    this._showChildTimer = null;
}

MenuItem.prototype = new ContainerBase();

MenuItem.prototype.content = function(value) {
    if (value == undefined) {
        return this._container.html();
    }
    this._container.html(value);
    //this._hover.html(value);
    return this;
}

MenuItem.prototype.child = function(value) {
    if (value == undefined) {
        return this._child;
    }
    this._child = value;
    value._parent = this._parent;
    return this;
}

MenuItem.prototype.callback = function(value) {
    if (value == undefined) {
        return this._callback;
    }
    this._callback = value;
    return this;
}

MenuItem.prototype.onCallback = function() {
    if (this._callback != null) {
        if (this._callback instanceof Function) {
            this._callback();
        } else {
            window.location = this._callback;
        }
    }
}

MenuItem.prototype.addTo = function(menu) {
    this._container.appendTo(menu._container);
    this._parent = menu;
    if (this._child != null) {
        this._child._parent = menu;
    }
    return this;
}

MenuItem.prototype.container_MouseOver = function() {

    var self = this.__self;

    self.setShowChild();

    //self._parent.closeCurrentMenu();
    self._parent.closeCurrentItem();

    self._container.addClass('hover');
}

MenuItem.prototype.container_MouseOut = function() {
    var self = this.__self;
    self.clearShowChild();
    self._container.removeClass('hover');
}
MenuItem.prototype.container_Click = function() {
    this.__self.onCallback();
}

MenuItem.prototype.hover_MouseOver = function() {
    this.__self._parent.clearClose();
}

MenuItem.prototype.hover_MouseOut = function() {
    this.__self._parent.setClose();
}

MenuItem.prototype.hover_Click = function() {
    this.__self.onCallback();
}

MenuItem.prototype.showChild = function(self) {

    self._parent.closeCurrentMenu();
    self._parent.closeCurrentItem();

    if (self._child != null) {

        self._child.show(self);
        self._parent._currentMenu = self._child;

        //self._hover.css(offset).show();
        self._parent._currentItem = self;
    }
}

MenuItem.prototype.close = function() {
    //this._hover.hide();
}

MenuItem.prototype.clearShowChild = function() {
    clearTimeout(this._showChildTimer);
}

MenuItem.prototype.setShowChild = function() {
    var self = this;
    self._showChildTimer = setTimeout(function() { self.showChild(self) }, 70);
}

MenuItem.prototype.separator = function() {
    this._container.get(0).onmouseover = null;
    this._container.get(0).onmouseout = null;
    this._container.get(0).onclick = null;

    return this;
}

//*********************************************************
//
// Menu
//
//*********************************************************
function Menu(container) {

    this._parent = null;

    this._currentMenu = null;
    this._currentItem = null;

    this._offsetX = 0;
    this._offsetY = 0;

    this._container = container != undefined
        ? $(container).css({ 'overflow': 'hidden' })
        : $('<div />').css({ 'overflow': 'hidden', 'position': 'absolute', 'display': 'none' }).appendTo('body');

    this._container.get(0).__self = this;
    this._container.get(0).onmouseover = this.onMouseOver;
    this._container.get(0).onmouseout = this.onMouseOut;

    this._closeTimer = null;
}

Menu.prototype = new ContainerBase();

// Properties
Menu.prototype.offsetX = function(value) {
    if (value == undefined) {
        return this._offsetX;
    }
    this._offsetX = value;
    return this;
}

Menu.prototype.offsetY = function(value) {
    if (value == undefined) {
        return this._offsetY;
    }
    this._offsetY = value;
    return this;
}

Menu.prototype.zindex = function(value) {
    if (value == undefined) {
        return this._container.css('z-index');
    }
    this._container.css('z-index', value);
    return this;
}

Menu.prototype.root = function() {
    var root = this;
    while (root._parent != null) {
        root = root._parent;
    }
    return root;
}

// Methods
Menu.prototype.show = function(item) {
    var position = {
        'left': this._offsetX,
        'top': this._offsetY
    };
    if (item) {

        var container = item._container;

        var offset = container.offset();

        position.left += offset.left;
        position.top += offset.top + container.height();
    }
    this._container.css(position);
    this._container.show();
}

Menu.prototype.close = function() {

    this.closeCurrentMenu();
    this.closeCurrentItem();

    if (this._parent != null) {
        this._container.hide();
    }
}

Menu.prototype.closeCurrentItem = function() {
    if (this._currentItem != null) {
        this._currentItem.close();
        this._currentItem = null;
    }
}

Menu.prototype.closeCurrentMenu = function() {
    if (this._currentMenu != null) {
        this._currentMenu.close();
        this._currentMenu = null;
    }
}

Menu.prototype.setClose = function() {
    var root = this.root();
    root._closeTimer = setTimeout(function() { root.close(); }, 300);
}

Menu.prototype.onMouseOver = function(e) {
    this.__self.clearClose();
}

Menu.prototype.onMouseOut = function(e) {
    this.__self.setClose();
}

Menu.prototype.clearClose = function() {
    clearTimeout(this.root()._closeTimer);
}