// $Id$

function Layer(id, left, top, width, height, display, className) {
    this.id     = id;
    this.div    = $(id);

    if(this.div) {
        this.left   = (left)?   left:       (parseInt(this.div.style.left)      || this.div.offsetLeft);
        this.top    = (top)?    top:        (parseInt(this.div.style.top)       || this.div.offsetTop);
        this.width  = (width)?  width:      (parseInt(this.div.style.width)     || this.div.offsetWidth);
        this.height = (height)? height:     (parseInt(this.div.style.height)    || this.div.offsetHeight);
        this.z = 100;
        this.alpha  = 100;

        this.display = display || false;


        this.div.style.position = 'absolute';
        this.div.className = className || '';

        this.moveTo(this.left, this.top);
        this.resizeTo(this.width, this.height);
        this.toggle(this.display);
        this.zIndex(this.z);

        this._dragStartHandler  = this.dragStart.bindAsEventListener(this);
        this._dragHandler       = this.drag.bindAsEventListener(this);
        this._dragStopHandler   = this.dragStop.bindAsEventListener(this);

        this.document = this.fixIEListboxBug();
    }
}

Layer.prototype.setContent = function _Layer_setContent(content, override) {
    override = override || false;
    if(this.document != null && content != null) {
        if(override)
            this.document.innerHTML = content;
        else
            this.document.innerHTML += content;
    }
}

Layer.prototype.moveTo = function _Layer_moveTo(x, y) {
    if(this.div && this.div.style) {
        this.div.style.left = x + 'px';
        this.div.style.top  = y + 'px';

        this.left = x;
        this.top = y;
    }
}

Layer.prototype.moveBy = function _Layer_moveBy(Dx, Dy) {
    this.moveTo(this.left + Dx, this.top + Dy);
}

Layer.prototype.resizeTo = function _Layer_resizeTo(w, h) {
    if(this.div && this.div.style) {
        this.div.style.width    = Math.max(w, 0) + 'px';
        this.div.style.height   = Math.max(h, 0) + 'px';

        if(this.document) this.document.style.height = Math.max(h - 30, 0) + 'px';

        this.width = w;
        this.height = h;
    }
}

Layer.prototype.floatHeight = function _Layer_floatHeight() {
    if(this.document && this.document.style) {
        this.document.style.height = 'auto';
        if(this.iframe) this.iframe.style.height = this.document.offsetHeight + 'px';
    }
}

Layer.prototype.floatWidth = function _Layer_floatWidth() {
    if(this.document && this.document.style) {
        this.div.style.width = 'auto';
        this.document.style.width = 'auto';
        if(this.iframe) {
            this.iframe.style.width = this.document.offsetWidth + 'px';
            this.iframe.style.height    = this.document.offsetHeight + 'px';
        }
        //alert(this.document.iframe);
    }
}

Layer.prototype.floatSize = function _Layer_floatSize() {
    if(this.document && this.document.style) {
        this.document.style.width = 'auto';
        this.document.style.height = 'auto';

        if(this.iframe) {
            this.iframe.style.width     = this.document.offsetWidth + 'px';
            this.iframe.style.height    = this.document.offsetHeight + 'px';
        }
    }
}

Layer.prototype.zIndex  = function _Layer_zIndex(zIndex) {
    if(this.div && this.div.style) {
        if(zIndex != null)  {
            this.div.style.zIndex = zIndex;
            this.z = zIndex;
        }
        return parseInt(this.div.style.zIndex) || 0;
    }
}

Layer.prototype.center = function _Layer_center(andShow) {
    if(this.div) {
        if(andShow) this.show();
        var w = this.width;
        var h = this.height;
        var W = 0;
        var H = 0;
        var Dx = 0;
        var Dy =0;

        if( document.body.clientWidth != null && document.body.clientWidth != null) {
            W = document.body.clientWidth;
            H = document.body.clientHeight;
        }

        if(document.documentElement != null && document.documentElement.clientWidth != null && document.documentElement.clientHeight) {
            W = document.documentElement.clientWidth;
            H = document.documentElement.clientHeight;
        }

        if( window.innerWidth != null && window.innerHeight != null) {
            W = window.innerWidth;
            H = window.innerHeight;
        }

        if(document.body.scrollLeft != null && document.body.scrollTop != null) {
            Dx = document.body.scrollLeft;
            Dy = document.body.scrollTop;
        }

        if(document.documentElement != null && document.documentElement.scrollLeft != null && document.documentElement.scrollTop) {
            Dx = document.documentElement.scrollLeft;
            Dy = document.documentElement.scrollTop;
        }

        if(window.pageXOffset != null && window.pageYOffset) {
            Dx = window.pageXOffset;
            Dy = window.pageYOffset;
        }

        this.moveTo(Math.ceil((W - w)/2) + Dx, Math.ceil((H - h)/2 ) + Dy);
    }
}

Layer.prototype.show = function _Layer_show() {
    this.toggle(true);
}

Layer.prototype.hide = function _Layer_hide() {
    this.toggle(false);
}

Layer.prototype.toggle = function _Layer_toggle(display) {
    if(this.div) {
        if(display != null) this.display = display;
        else                this.display = !this.display;

        this.div.style.display = (this.display)?'':'none';
    }
}

Layer.prototype.collapse = function _Layer_collapse() {
    this.moveTo(0,0);
    this.resizeTo(1,1);
    this.show();
}

Layer.prototype.fixIEListboxBug = function _Layer_fixIEListboxBug() {
    if(document.all && !window.opera) {
        var content = this.div.innerHTML;
        this.div.innerHTML = '<iframe frameborder="0" style="position:absolute; left:0; top:0; width:100%; height:100%; margin:0; padding:0; background:transparent; filter:alpha(opacity=0);"></iframe>';

        this.iframe = this.div.firstChild;

        child = document.createElement('DIV');
        this.div.appendChild(child);
        child.style.position = 'absolute';
        child.style.left = '0px';
        child.style.top = '0px';
        child.style.width = '100%';
        child.style.height = '100%';
        child.innerHTML = content;

        child.className = this.div.className;
        this.div.className = '';

        return child;

    }
    else {
        return this.div;
    }
}

Layer.prototype.setupAsWindow = function _Layer_setupAsWindow(title, isClose) {
    var element = this.document;
    var content = element.innerHTML;

    var style = (isClose ==  false)?'display:none':'';

    element.innerHTML = '<div class="title"><p></p><img src="/images/skin/close.gif" width="15" height="15" style="' + style + '"></div><div class="content" id="' + this.id + '"></div>'
    if(this.div !== this.document ) this.div.id = this.id + '_document';

    this.header         = element.firstChild.firstChild;
    this.closeBotton    = element.firstChild.lastChild;
    this.document       = element.lastChild;

    this.resizeTo(this.width, this.height + 14);

    this.header.onmousedown = this._dragStartHandler

    this.closeBotton.onclick = this.hide.bind(this);

    this.header.innerHTML   = title || '';
    this.setContent(content);
}

Layer.prototype.dragStart   = function _Layer_dragStart(event) {
    this._position = { x: Event.pointerX(event), y: Event.pointerY(event) };

    Event.observe(document, 'mousemove',    this._dragHandler, true);
    Event.observe(document, 'mouseup',      this._dragStopHandler, true);
}

Layer.prototype.drag        = function _Layer_drag(event) {
    this.moveBy(Event.pointerX(event) - this._position.x, Event.pointerY(event) - this._position.y);
    this._position = { x: Event.pointerX(event), y: Event.pointerY(event) };

    Event.stop(event);
}

Layer.prototype.dragStop    = function _Layer_dragStop(event) {
    Event.stopObserving(document, 'mousemove',  this._dragHandler, true);
    Event.stopObserving(document, 'mouseup',    this._dragStopHandler, true);
}

var Tooltip = {
    setup:  function _Tooltip_setup() {
        Tooltip.tooltip = new Layer('hintPrototype', 0, 0, 200, null, false, 'hint');
    },

    process:    function _Tooltip_process() {
        for(var i=0; i<arguments.length; i++) {
            var elements = document.getElementsByTagName(arguments[i]);
            for(var j=0; j<elements.length; j++) Tooltip.link(elements[j]);
        }
    },

    link:   function _Tooltip_link(element, title) {
        title = title || element.getAttribute('title');
        element.tooltipText = title;
        element.setAttribute('title', '');

        element.tooltip = Tooltip.tooltip;

        Event.observe(element, 'mouseover', Tooltip.showTooltip.bindAsEventListener(Tooltip));
        Event.observe(element, 'mouseout',  Tooltip.hideTooltop.bindAsEventListener(Tooltip));
    },

    unlink: function _Tooltip_unlink(tooltip) {
    },

    showTooltip:    function _Tooltip_showTooltip(event) {
        var element = Event.element(event);

        if(element.tooltip && element.tooltipText && element.tooltipText != '' && element.tooltip.display == false) {
            element.tooltip.setContent(element.tooltipText, true);
            element.tooltip.moveTo(Event.pointerX(event) + 10, Event.pointerY(event));
            element.tooltip.show();
            element.tooltip.floatSize();
        }
    },

    hideTooltop:    function _Tooltip_hideTooltop(event) {
        var element = Event.element(event);
        if(element.tooltip) {
            element.tooltip.toggle(false);
        }
    }
};

Singles.Lib.onLoad(function() { Tooltip.setup(); });

var ErrorHint = {
    setup:  function _ErrorHint_setup() {
        ErrorHint.hint = new Layer('errorPrototype', 0, 0, null, 30, false);
    },

    link:   function _ErrorHint_link(element) {
        element.errorHint = ErrorHint.hint;

        element.onfocus = ErrorHint.showHint.bindAsEventListener(ErrorHint);
        element.onblur  = ErrorHint.hideHint.bindAsEventListener(ErrorHint);
        Event.observe(element, 'change', ErrorHint.unlink.bindAsEventListener(ErrorHint));
    },

    unlink: function _ErrorHint_link(event) {
        var element = Event.element(event);

        ErrorHint.hideHint(event);
        if(element.errorHint) element.errorHint = null;
    },

    showHint:   function _ErrorHint_showHint(event) {
        var element = Event.element(event);

        if(element.errorHint && element.meta) {
            ErrorHint.setContent(element.meta.message);
            element.errorHint.moveTo(element.meta.position[0], element.meta.position[1] - 30);
            element.errorHint.show();
            element.errorHint.floatWidth();
            if(element.errorHint.document.firstChild.offsetHeight > 30) element.errorHint.moveTo(element.meta.position[0], element.meta.position[1] - element.errorHint.document.firstChild.offsetHeight - 8);
        }
    },

    hideHint:   function _ErrorHint_hideHint(event) {
        var element = Event.element(event);

        if(element.errorHint) {
            element.errorHint.hide();
        }
    },

    setContent: function _ErrorHint_setContent(content) {
        if(content && ErrorHint.hint && ErrorHint.hint.document && ErrorHint.hint.document.firstChild)
            ErrorHint.hint.document.firstChild.innerHTML = content;
    }
};

Singles.Lib.onLoad(function() { ErrorHint.setup(); });