var _currentDropdown=false;
var _onbar=false,_onitem=false;
var DropdownMenu = function() {
    this.initialize.apply(this, arguments);
}
function ddmWatch(){
	if(!_onbar && !_onitem){
	    if(_currentDropdown)
	    _currentDropdown.style.display='none';	
    }
    setTimeout('ddmWatch()',300);
}

DropdownMenu.prototype = {
    initialize: function(menuId, containerId, basePath, defaultBar, struct) {
        var ddm_conf = struct;
        this.container = document.getElementById(containerId);
        this.basePath = basePath;
        var _div = document.createElement('div');
        _div.className = 'ddmenu';
        this.container.appendChild(_div);
        this._ph = _div;
        for (var i = 0; i < ddm_conf.length; i++) {
            if (i > 0) {
                var _sep = document.createElement('img');
                _sep.className = 'sep';
                _sep.src = this.basePath + 'menu/css/img/marg.gif';
                _div.appendChild(_sep);
            }

            var div = document.createElement('div');
            div.className = 'bar';
            div.unselectable = 'on';
            if (!ddm_conf[i].TextMode) {
                var img = document.createElement('img');
                img.src = basePath + 'menu/img/' + ddm_conf[i].ImageNormal;
                //img.style.align='absmiddle';
                img.style.marginTop = '5px';
                div.appendChild(img);
            } else {
                var span = document.createElement('span');
                span.appendChild(document.createTextNode(ddm_conf[i].ItemText));
                div.appendChild(span);
            }
            div.ItemLink = ddm_conf[i].ItemLink;
            div.Children = ddm_conf[i].Children;
            _div.appendChild(div);
            var me = this;
            div.onmouseover = function(e) { _onbar = true; me.barOver(e); }
            //Event.observe(div, 'mouseover', function(e) { _onbar = true; me.barOver(e); Event.stop(e) });
            div.onmouseout = function(e) { _onbar = false; }
            div.onclick = function(e) {
                var _url = this.ItemLink;
                if (_url) window.location.href = me.basePath + _url;
            }

        }
        setTimeout('ddmWatch()', 300);
    },
    barOver: function(e) {
        var _e = window.event ? window.event : e;
        var src = _e.srcElement || _e.target;
        while (src.tagName != 'DIV') src = src.parentNode;
        this._createDropdown(src);
        if (_currentDropdown) _currentDropdown.style.display = 'none';
        if (src.Dropdown) {
            src.Dropdown.style.display = '';
            _currentDropdown = src.Dropdown;
        }

    },
    _createDropdown: function(src) {
        var _children = src.Children;
        var me = this;
        if (_children && _children.length > 0) {
            //var _position = Position.cumulativeOffset(src);
            var _position = this._cumulativeOffset(src);
            if (!src.Dropdown) {
                var _dropdown = document.createElement('div');
                _dropdown.className = 'dropdown';
                _dropdown.unselectable = 'on';
                this.container.appendChild(_dropdown);
                for (var i = 0; i < _children.length; i++) {
                    var _item = document.createElement('div');
                    _item.className = 'menuitem';
                    _item.onmouseover = function(e) { this.className = 'menuitemOn'; }
                    _item.onmouseout = function(e) { this.className = 'menuitem'; }
                    var _span = document.createElement('span');
                    _span.appendChild(document.createTextNode(_children[i].ItemText));
                    _item.appendChild(_span);
                    _dropdown.appendChild(_item);
                    _item.Link = _children[i].ItemLink;
                    _item.onclick = function(e) {
                        var _url = this.Link;
                        if (_url) window.location.href = me.basePath + _url;
                    }
                }
                src.Dropdown = _dropdown;
                _dropdown.onmouseout = function(e) { me.mouseout(e, _dropdown); }
                //Event.observe(_dropdown, 'mouseout', function(e) { me.mouseout(e, _dropdown); });
                _dropdown.onmouseover = function() { _onitem = true; }

            }
            src.Dropdown.style.left = _position[0] + 'px';
            src.Dropdown.style.top = _position[1] + 33 + 'px';
        }
    },
    mouseout: function(e, target) {
        var _e = window.event ? window.event : e;
        var checkTarget = this._isMouseLeaveOrEnter(_e, target);
        if (checkTarget) {
            _onitem = false;
        }
    },
    _isMouseLeaveOrEnter: function(event, target) {
        var relatedTarget = event.relatedTarget ? event.relatedTarget : event.type == 'mouseout' ? event.toElement : event.fromElement;
        if (typeof relatedTarget == 'undefined') return false;
        while (relatedTarget && relatedTarget != target) relatedTarget = relatedTarget.parentNode;
        return relatedTarget != target;
    },
    _cumulativeOffset: function(element) {
        var valueT = 0, valueL = 0;
        do {
            valueT += element.offsetTop || 0;
            valueL += element.offsetLeft || 0;
            element = element.offsetParent;
        } while (element);
        return [valueL, valueT];
    },
    _ph: false,
    basePath: false
}