Renderer = function () {};
Renderer.prototype.fade = function (element, dir, fps, stepping, stopOpacity, remove) {
    if (typeof element.rendererFadeInterval != 'undefined') {
        window.clearInterval(element.rendererFadeInterval);
    }
    element.fading = true;
    var opacity = cssHandler.getOpacity(element);
    dir = dir || (opacity===0 ? 'in' : 'out');
    fps = fps || this.defaultEffectSettings.fade.fps;
    stepping = stepping || this.defaultEffectSettings.fade.stepping;
    stopOpacity = !isNaN(stopOpacity) ? stopOpacity : this.defaultEffectSettings.fade.stopOpacity[dir];
    element.rendererFadeInterval = window.setInterval(function () {
        opacity = dir=='out' ? opacity-stepping : opacity+stepping;
        opacity = opacity < 1 ? opacity < 0.000001 ? 0 : opacity : 1;
        if ((dir=='in' && opacity >= stopOpacity)
            || (dir=='out' && opacity <= stopOpacity)) {
            cssHandler.setOpacity(element, stopOpacity);
            window.clearInterval(element.rendererFadeInterval);
            if (typeof element.onfadeready == 'function') {
                element.onfadeready();
            }
            if (typeof element.oneffectready == 'function') {
                element.oneffectready();
            }
            element.fading = undefined;
            if (remove) {
                element.remove.finalize(element);
            }
        } else {
            if (opacity < 0.000001) opacity = 0;
            cssHandler.setOpacity(element, opacity);
        }
    }, Math.round(1000/fps));
};
Renderer.prototype.move = function (element, stopPos, easing, stepping, fps, remove) {
    if (typeof element.rendererMoveInterval != 'undefined') {
        window.clearInterval(element.rendererMoveInterval);
    }
    element.moving = true;
    fps = fps || this.defaultEffectSettings.move.fps;
    stepping = stepping || this.defaultEffectSettings.move.stepping;
    easing = easing || this.defaultEffectSettings.move.easing;
    var startpos, currentPos;
    startPos = {
        'x':parseInt(cssHandler.getCSSValue(element,'left'), 10),
        'y':parseInt(cssHandler.getCSSValue(element,'top'), 10)
    };
    currentPos = {
        'x':parseInt(cssHandler.getCSSValue(element,'left'), 10),
        'y':parseInt(cssHandler.getCSSValue(element,'top'), 10)
    };
    var deltaX = Math.max(startPos.x, stopPos.x) - Math.min(startPos.x, stopPos.x);
    var deltaY = Math.max(startPos.y, stopPos.y) - Math.min(startPos.y, stopPos.y);
    var dirX = startPos.x > stopPos.x ? 'left' : 'right';
    var dirY = startPos.y > stopPos.y ? 'up' : 'down';
    
    var vector = deltaX >= deltaY ? 'x' : 'y';
    
    var v = deltaX >= deltaY ? deltaY/deltaX : deltaX/deltaY;
    
    var newPos = startPos;
    var getNewPos = function () {
        var x,y;
        if (deltaX > deltaY) { // move it along the X-Axis
            x = dirX == 'right' ? currentPos.x += stepping : x = currentPos.x -= stepping;
            y = dirY == 'down' ?  currentPos.y += stepping * v : currentPos.y -= stepping * v;
        } else { // move it along the Y-Axis
            y = dirY == 'down' ? currentPos.y += stepping : y = currentPos.y -= stepping;
            x = dirX == 'right' ? currentPos.x += stepping * v : currentPos.x -= stepping * v;
        }
        return {'x':Math.round(x),'y':Math.round(y)};
    };
    var ed = 0;
    var stmp = stepping;
    while (stmp/2 > 0) {
        ed += stmp;
        stmp = Math.floor(stmp/2);
    }
    stmp = stepping;
    var stepIndex = 0;
    element.rendererMoveInterval = window.setInterval (function () {
        var delta = Math.max(Math.abs(newPos[vector]), Math.abs(stopPos[vector])) - Math.min(Math.abs(newPos[vector]), Math.abs(stopPos[vector]));
        
        if (easing === true && delta < ed) {
            var tmp = Math.ceil(stepping / 2);
            if (stepping == stmp) {
                stepping = stepping-(ed-delta) > tmp ? stepping-(ed-delta) : tmp;
            } else {
                tmp = Math.ceil(delta / 2);
                stepping = tmp>=1 ? tmp : 1;
            }
        }
        if (delta <= (easing === true?1:stepping)) {
            window.clearInterval(element.rendererMoveInterval);
            element.style.left = stopPos.x + 'px';
            element.style.top = stopPos.y + 'px';
            if (typeof element.onmoveready == 'function') {
                element.onmoveready();
            }
            if (typeof element.oneffectready == 'function') {
                element.oneffectready();
            }
            element.moving = undefined;
            if (remove) {
                element.remove.finalize(element);
            }
        } else {
            newPos = getNewPos();
            element.style.left = newPos.x + 'px';
            element.style.top = newPos.y + 'px';
            newPos.stepIndex = stepIndex++;
            newPos.stepWidth = stepping;
            newPos.delta = delta;
            if (typeof element.onmove == 'function') {
                element.onmove(newPos);
            }
        }
    }, Math.round(1000/fps));
};

Renderer.prototype.grow = function (element, steps, fps) {
    // get dimensions
    /*
    var width = element.getCSSValue('width', 'int')+element.getCSSValue('paddingLeft', 'int')+element.getCSSValue('paddingRight', 'int');
    var height = element.getCSSValue('height', 'int')+element.getCSSValue('paddingTop', 'int')+element.getCSSValue('paddingBottom', 'int'), steppingA, steppingB;
    */
    var width = element.offsetWidth+element.getCSSValue('paddingLeft', 'int')+element.getCSSValue('paddingRight', 'int');
    var height = element.offsetHeight+element.getCSSValue('paddingTop', 'int')+element.getCSSValue('paddingBottom', 'int'), steppingA, steppingB;
    
    // set clipping to max Values, render element invisible
    var clipTop = Math.floor(height/2);
    var clipRight = Math.floor(width/2);
    var clipBottom = Math.ceil(height/2);
    var clipLeft = Math.ceil(width/2);
    //console.log(element.getCSSValue('width', 'int'));
    element.style.clip = 'rect('+clipTop+'px, '+clipRight+'px, '+clipBottom+'px, '+clipLeft+'px)';
    
    // calculate stepping
    steppingA = (width > height ? width : height) / steps;
    steppingB = Math.ceil((steppingA * (width > height ? height : width) / (width > height ? width : height)) / 2);
    steppingA = Math.ceil(steppingA/2);
    
    // animate
    element.rendererGrowInterval = window.setInterval(function () {
        if (clipTop - (width > height ? steppingB : steppingA) > 0) {
            clipTop -= (width > height ? steppingB : steppingA);
        } else {
            clipTop = 0;
        }
        if (clipRight + (width > height ? steppingA : steppingB) < width) {
            clipRight += (width > height ? steppingA : steppingB);
        } else {
            clipRight = width;
        }
        if (clipBottom + (width > height ? steppingB : steppingA) < height) {
            clipBottom += (width > height ? steppingB : steppingA);
        } else {
            clipBottom = height;
        }
        if (clipLeft - (width > height ? steppingA : steppingB) > 0) {
            clipLeft -= (width > height ? steppingA : steppingB);
        } else {
            clipLeft = 0;
        }
        element.style.clip = 'rect('+clipTop+'px '+clipRight+'px '+clipBottom+'px '+clipLeft+'px)';
        if (clipLeft === 0) {
            element.unclip();
            window.clearInterval(element.rendererGrowInterval);
            if (typeof element.ongrowready == 'function') {
                element.ongrowready();
            }
            if (typeof element.oneffectready == 'function') {
                element.oneffectready();
            }
        }
    }.bindTo(this), Math.round(1000/fps));
};

Renderer.prototype.pushIn = function (element, fps, steps) {
    var wrapper = this.createElement('div');
    with (wrapper.style) {
        position = 'relative';
        lineHeight = 0;
        height = 0;
        overflow = 'hidden';
    }
    with (element.style) {
        position = 'absolute';
        left = 0;
        bottom = 0;
    }
    element.parentNode.replaceChild(wrapper, element);
    element.renderIn(wrapper);
    stepping = Math.ceil(element.offsetHeight / steps);
    
    var I = window.setInterval(function () {
        var newHeight = wrapper.offsetHeight + stepping;
        if (newHeight < element.offsetHeight) {
            wrapper.style.height =  newHeight + 'px';
        } else {
            wrapper.style.height = element.offsetHeight + 'px';
            element.style.position = 'relative';
            wrapper.parentNode.replaceChild(element, wrapper)
            window.clearInterval(I);
            if (typeof element.oneffectready == 'function') {
                element.oneffectready();
            }
        }
        if (typeof (element.onpushingin == 'function')) {
            element.onpushingin();
        }
    }.bindTo(this), 1000/fps);
}

Renderer.prototype.defaultEffectSettings = {
    fade:{
        startOpacity:{
                'in':0,
                'out':1
            },
        stopOpacity:{
                'in':1,
                'out':0
            },
        fps:25,
        stepping:0.1
    },
    move:{
        fps:25,
        stepping:25,
        easing:false,
        stopPos:{
            'x':0,
            'y':0
        }
    },
    grow:{
        fps:25,
        steps:5
    },
    slideIn:{
        fps:25,
        stepping:25,
        easing:true,
        stopPos:{
            'x':0,
            'y':0
        }
    },
    slideOut:{
        fps:25,
        stepping:25,
        easing:true
    },
    pushIn:{
        fps:25,
        steps:5
    }
};
Renderer.prototype.getEffectSettings = function (effect, effectParams) {
    effect = libObject.isMember(effect, this.defaultEffectSettings) ? effect : null;
    if (effect !== null) {
        effectParams = effectParams || this.defaultEffectSettings[effect];
    }
    for (var i in this.defaultEffectSettings[effect]) {
        if (typeof effectParams[i] == 'undefined') {
            effectParams[i] = this.defaultEffectSettings[effect][i];
        }
    }
    return effectParams;
};

Renderer.prototype.elementMethods = {
    renderIn : function (renderParent, effect, effectParams) {
        if (effect) {
            effectParams = this.renderer.getEffectSettings(effect, effectParams);
        }
        switch (effect) {
            case 'pushIn': {
                renderParent.appendChild(this);
                this.renderer.pushIn(this, effectParams.fps, effectParams.steps);
                break;
            }
            case 'fade':
                cssHandler.setOpacity(this, effectParams.startOpacity['in']);
                renderParent.appendChild(this);
                this.renderer.fade(this, 'in', effectParams.fps, effectParams.stepping, effectParams.stopOpacity['in']);
                break;
            case 'slideIn':
                this.style.position = 'absolute';
                renderParent.appendChild(this);
                var settings = {
                    'style':{
                        'left':-this.offsetWidth + 'px',
                        'top':-this.offsetHeight + 'px'
                    }
                };
                var stopPos = {'x':0,'y':0};
                if (typeof effectParams.startPos != 'undefined') {
                    switch (typeof effectParams.startPos) {
                        case 'string':
                            if (effectParams.startPos == 'rand') {
                                if (typeof this.lastSlideInStartPos == 'undefined') {
                                    this.lastSlideInStartPos = effectParams.startPos;
                                }
                                var r = ['top','topRight','right','bottomRight','bottom','bottomLeft','left','topLeft'];
                                do {
                                    effectParams.startPos = r[Math.round(Math.random()*(r.length-1))];
                                } while (this.lastSlideInStartPos == effectParams.startPos);
                                this.lastSlideInStartPos = effectParams.startPos;
                            }
                            switch (effectParams.startPos) {
                                case 'top':
                                    settings.style.left = Math.floor((renderParent.clientWidth)/2) - Math.floor(this.offsetWidth/2) + 'px';
                                    settings.style.top = -this.offsetHeight + 'px';
                                    stopPos.x = Math.floor((renderParent.clientWidth)/2) - Math.floor(this.offsetWidth/2);
                                    stopPos.y = 0;
                                    break;
                                case 'topRight':
                                    settings.style.left = renderParent.clientWidth + 'px';
                                    settings.style.top = -this.offsetHeight + 'px';
                                    stopPos.x = renderParent.clientWidth - this.offsetWidth;
                                    stopPos.y = '0';
                                    break;
                                case 'right':
                                    settings.style.left = renderParent.clientWidth + 'px';
                                    settings.style.top = Math.floor(renderParent.clientHeight/2 - this.offsetHeight/2) + 'px';
                                    stopPos.x = renderParent.clientWidth - this.offsetWidth;
                                    stopPos.y = Math.floor(renderParent.clientHeight/2 - this.offsetHeight/2);
                                    break;
                                case 'bottomRight':
                                    settings.style.left = renderParent.clientWidth + 'px';
                                    settings.style.top = renderParent.clientHeight + 'px';
                                    stopPos.x = renderParent.clientWidth - this.offsetWidth;
                                    stopPos.y = renderParent.clientHeight - this.offsetHeight;
                                    break;
                                case 'bottom':
                                    settings.style.left = Math.floor(renderParent.clientWidth/2 - this.offsetWidth/2) + 'px';
                                    settings.style.top = renderParent.clientHeight + 'px';
                                    stopPos.x = parseInt(Math.floor(renderParent.clientWidth/2 - this.offsetWidth/2), 10);
                                    stopPos.y = renderParent.clientHeight - this.offsetHeight;
                                    break;
                                case 'bottomLeft':
                                    settings.style.left = -this.offsetWidth + 'px';
                                    settings.style.top = renderParent.clientHeight + 'px';
                                    stopPos.x = '0';
                                    stopPos.y = renderParent.clientHeight - this.offsetHeight;
                                    break;
                                case 'left':
                                    settings.style.left = -this.offsetWidth + 'px';
                                    settings.style.top = Math.floor(renderParent.clientHeight/2 - this.offsetHeight/2) + 'px';
                                    stopPos.x = '0';
                                    stopPos.y = Math.floor(renderParent.clientHeight/2 - this.offsetHeight/2);
                                    break;
                                case 'topLeft':
                                    break;
                                default:
                                break;
                            }
                            break;
                        default:
                        break;
                    }
                }
                this.setProperties(settings);
                this.renderer.move(this, stopPos, effectParams.easing, effectParams.stepping, effectParams.fps);
                break;
            case 'grow':
                renderParent.appendChild(this);
                this.renderer.grow(this, effectParams.steps, effectParams.fps);
                break;
            default:
            renderParent.appendChild(this);
        }
        if (typeof this.onrender == 'function') {
            this.onrender();
        }
    },
    remove : function (effect, effectParams) {
        if (effect) {
            effectParams = this.renderer.getEffectSettings(effect, effectParams);
        }
        this.remove.finalize=function (element) {
        	/*
            console.trace();*/
            //console.log(this, this.parentNode);
            if (element.parentNode) {
                element.parentNode.removeChild(element);
            }
            if (typeof element.onremove == 'function') {
                element.onremove();
            }
        }.bindTo(this);
        switch (effect) {
            case 'fade':/*
                eventHandler.addEvent(this, 'fadeready', this.fadeready = function () {
                    var a = function () {
                        eventHandler.removeEvent(this, 'fadeready', this.fadeready);
                    }.call(this);
                    if(this.parentNode) {
                        this.parentNode.removeChild(this);
                    }
                }.bindAsEventListener(this));*/
                this.renderer.fade(this, 'out', effectParams.fps, effectParams.stepping, effectParams.stopOpacity.out, true);
                break;
            case 'slideOut':
                this.style.position = 'absolute';
                var stopPos = {
                    'x':-this.offsetWidth,
                    'y':-this.offsetHeight
                };
                if (typeof effectParams.stopPos != 'undefined') {
                    switch (typeof effectParams.stopPos) {
                        case 'string':
                            switch (effectParams.stopPos) {
                                case 'top':
                                    //stopPos.x = this.offsetLeft + parseInt(cssHandler.getCSSValue(this.parentNode,'borderLeftWidth'));
                                    stopPos.x = this.offsetLeft;
                                    stopPos.y = -this.offsetHeight;
                                    break;
                                case 'topRight':
                                    stopPos.x = this.parentNode.clientWidth;
                                    stopPos.y = -this.offsetHeight;
                                    break;
                                case 'right':
                                    stopPos.x = this.parentNode.clientWidth;
                                    stopPos.y = Math.floor(this.parentNode.clientHeight/2 - this.offsetHeight/2);
                                    break;
                                case 'bottomRight':
                                    stopPos.x = this.parentNode.clientWidth;
                                    stopPos.y = this.parentNode.clientHeight;
                                    break;
                                case 'bottom':
                                    stopPos.x = parseInt(Math.floor(this.parentNode.clientWidth/2 - this.offsetWidth/2), 10);
                                    stopPos.y = this.parentNode.clientHeight;
                                    break;
                                case 'bottomLeft':
                                    stopPos.x = -this.offsetWidth;
                                    stopPos.y = this.parentNode.clientHeight;
                                    break;
                                case 'left':
                                    stopPos.x = -this.offsetWidth;
                                    stopPos.y = Math.floor(this.parentNode.clientHeight/2 - this.offsetHeight/2);
                                    break;
                                case 'topLeft':
                                    break;
                                default:
                                break;
                            }
                            break;
                        default:
                        break;
                    }
                }/*
                eventHandler.addEvent(this, 'moveready', this.moveready = function () {
                    eventHandler.removeEvent(this, 'moveready', this.moveready);
                    if(this.parentNode) {
                        this.parentNode.removeChild(this);
                    }
                }.bindAsEventListener(this));*/
                this.renderer.move(this, stopPos, effectParams.easing, effectParams.stepping, effectParams.fps, true);
                break;
            default:
            if(this.parentNode) {
                this.remove.finalize(this);
            }
        }
    },
    write : function (string) {
        this.appendChild(document.createTextNode(string));
        return this;
    },
    createChild : function (nodeType, attributes) {
        return this.appendChild(this.renderer.createElement(nodeType, attributes));
    },
    move : function (params) {
        params = this.renderer.getEffectSettings('move', params);
        this.renderer.move(this, params.stopPos, params.easing, params.stepping, params.fps);
    },
    fade : function (params) { //element, dir, fps, stepping, stopOpacity
        params = this.renderer.getEffectSettings('fade', params);
        this.renderer.fade(this, params.dir, params.fps, params.stepping, params.stopOpacity);
    },
    setOpacity : function (opacity) {
        cssHandler.setOpacity(this, opacity);
    },
    getOpacity : function () {
        return cssHandler.getOpacity(this);
    },
    getCSSValue : function (property, type) {
        return cssHandler.getCSSValue(this, property, type);
    },
    clip : function (topToTop, leftToRight, topToBottom, leftToLeft) {
        cssHandler.clip(this, topToTop, leftToRight, topToBottom, leftToLeft);
    },
    isClipped : function () {
        return cssHandler.isClipped(this);
    },
    unclip : function () {
        cssHandler.unclip(this);
    },
    getScreenOffset : function () {
        return this.renderer.getScreenOffset(this);
    },
    getCustomOffset : function (parentElement) {
        return this.renderer.getCustomOffset(this, parentElement);
    },
    getOffsetSize : function () {
        return {Width:this.offsetWidth,Height:this.offsetHeight};
    },
    getClientSize : function () {
        return {Width:this.clientWidth,Height:this.clientHeight};
    },
    setProperties : function (properties,subject) {
        subject=subject||this;
        this.renderer.setProperties(properties,subject);
    },
    empty : function () {
        this.renderer.empty(this);
    },
    appendImage : function (args) {
        this.renderer.appendImage(args, this);
    },
    addClassName : function (string) {
        this.renderer.addClassName(string, this);
    },
    removeClassName : function (string) {
        this.renderer.removeClassName(string, this);
    },
    hasClassName : function (string) {
        return this.renderer.hasClassName(string, this);
    },
    getElement : function (search, callback) {
        var elem = this.renderer.getElement(search, this);
        if (elem && typeof callback == 'function') {
            callback(elem);
        }
        return elem;
    },
    getElements : function (search, callback) {
        var ret = this.renderer.getElements(search, this);
        if (typeof callback == 'function') {
            ret.foreach(function (val, key, array) {
                callback(val, key, array);
            })
        }
        return ret;
    },
    mouseover : function () {
        return this.renderer.mouseover(this);
    },
    getMouseOffset : function () {
        return this.renderer.getMouseOffset(this);
    }
};
Renderer.prototype.addClassName = function (string, element) {
    element.className += element.className != '' ? ' '+string : string;
};
Renderer.prototype.removeClassName = function (string, element) {
    var reg = new RegExp('(^'+string+' ?| '+string+')');
    element.className = element.className.replace(reg, '');
    reg = undefined;
};
Renderer.prototype.hasClassName = function (string, element) {
    var reg = new RegExp('(?:^| )('+string+') ?');
    return element.className.match(reg, '') ? RegExp.$1 : false;
};
Renderer.prototype.getScreenOffset = function (element) {
    var sco = libScreen.getScrollOffset();
    var x = element.offsetLeft;
    var y = element.offsetTop;
    var parent = element.offsetParent;
    while (parent !== null) {
        x += parent.offsetLeft;
        y += parent.offsetTop;
        x += cssHandler.getCSSValue(parent, 'borderLeftWidth', 'int');
        y += cssHandler.getCSSValue(parent, 'borderTopWidth', 'int');
        parent = parent.offsetParent;
    }
    return {x:x-sco.x,y:y-sco.y};
};
Renderer.prototype.getCustomOffset = function (element, parentElement) {
    var x = element.offsetLeft;
    var y = element.offsetTop;
    var parent = element.offsetParent;
    while (parent !== null && parent != parentElement) {
        x += parent.offsetLeft;
        x += cssHandler.getCSSValue(parent, 'borderLeftWidth', 'int');
        y += parent.offsetTop;
        y += cssHandler.getCSSValue(parent, 'borderTopWidth', 'int');
        parent = parent.offsetParent;
    }
    return {x:x,y:y};
};
Renderer.prototype.appendImage = function (args, element) {
    var image = this.createElement('IMG');
    if (typeof args == 'object') {
        this.setProperties(args, image);
    }
    image.renderIn(element);
};
Renderer.prototype.empty = function (element) {
    while(element.hasChildNodes()) {
        element.removeChild(element.firstChild);
    }
};
Renderer.prototype.setProperties = function (properties,subject) {
    for (var n in properties) {
        if (typeof properties[n] == 'object' && typeof subject[n] != 'undefined') {
            this.setProperties(properties[n],subject[n]);
        } else {
            subject[n] = properties[n];
        }
    }
};
Renderer.prototype.createElement = function (elementName, attributes) {
    var element = elementName.toLowerCase() == 'img' ? new Image() : document.createElement(elementName);
    element.renderer = this;

    for (var i in this.elementMethods) {
        element[i] = this.elementMethods[i];
    }
    if (attributes) {
        element.setProperties(attributes);
    }
    if (typeof element.oncreate == 'function') {
        element.oncreate();
    }
    return element;
};
Renderer.prototype.getElement = function (search, parent) {
    parent = parent || document;
    var ret, n, i=0, tmp;
    search.match(/^([^.#]*)?([.#])?(.*)$/); 
    /**
     * Search by class
     */
    if (RegExp.$2 == '.') {
        ret = window.getElementsByClassName(RegExp.$3, RegExp.$1, parent);
    } else if (RegExp.$2 == '#') {
        ret = document.getElementById(RegExp.$3);
    } else if (typeof RegExp.$2 == 'undefined' || RegExp.$2 == '') {
        if (typeof parent.getElementsByTagName != 'undefined') {
            tmp = parent.getElementsByTagName(RegExp.$1);
            n = tmp.length;
            ret = [];
            for (i;i<n;i++) {
                ret.push(tmp[i]);
            }
        } else {
            throw 'parent.getElementsByTagName is not a function, renderer.getElement';
        }
    }
    return ret instanceof Array ? ret.length == 1 ? ret[0] : false : ret;
};
Renderer.prototype.getElements = function (search, parent) {
    parent = parent || document;
    var ret, n, i=0, tmp;
    search.match(/^([^.]*)?([.])?(.*)$/);
    /**
     * Search by class
     */
    if (RegExp.$2 == '.') {
        return new ArrayA(window.getElementsByClassName(RegExp.$3, RegExp.$1, parent));
    } else if (typeof RegExp.$2 == 'undefined' || RegExp.$2 == '') {
        if (typeof parent.getElementsByTagName != 'undefined') {
            tmp = parent.getElementsByTagName(RegExp.$1);
            n = tmp.length;
            ret = [];
            for (i;i<n;i++) {
                ret.push(tmp[i]);
            }
            //return parent.getElementsByTagName(RegExp.$1);
            return new ArrayA(ret);
        } else {
            throw 'parent.getElementsByTagName is not a function, renderer.getElement';
        }
    }
    return false;
};
Renderer.prototype.mouseover = function (element) {
    if (!element.renderer) {
        this.assimilate(element);
    }
    var screenPos = this.getScreenOffset(element);
    var size = element.getOffsetSize();
    
    if (this.currentMousePos.x >= screenPos.x
        && this.currentMousePos.x <= screenPos.x+size.Width
        && this.currentMousePos.y >= screenPos.y
        && this.currentMousePos.y <= screenPos.y+size.Height) {
        return true;
    } else {
        return false;
    }
};
Renderer.prototype.getMouseOffset = function (element) {
    var eOffset = this.getCustomOffset(element), sOffset=libScreen.getScrollOffset();
    return {"x":this.currentMousePos.x+sOffset.x - eOffset.x,"y":this.currentMousePos.y+sOffset.y - eOffset.y}
}
Renderer.prototype.getWindowSize = function () {
    var win = document.getElementsByTagName('HEAD')[0].parentNode;
    return {"width":win.clientWidth,"height":win.clientHeight};
};
Renderer.prototype.assimilate = function (element, attributes) {
    if (element instanceof Array) {
        var l=element.length;
        for (n=0;n<l;n++) {
            element[n].renderer = this;
        
            for (var i in this.elementMethods) {
                element[n][i] = this.elementMethods[i];
            }
            if (attributes) {
                element[n].setProperties(attributes);
            }
        }
    } else {
        element.renderer = this;
    
        for (var i in this.elementMethods) {
            element[i] = this.elementMethods[i];
        }
        if (attributes) {
            element.setProperties(attributes);
        }
    }
    return element;
};
Renderer.prototype.currentMousePos = {
    "x":0,
    "y":0
};
window.renderer = new Renderer();

/*
Renderer.prototype.cursor = document.createElement('div');
with(renderer.cursor.style) {
    position = 'absolute';
    border='1px solid cyan';
    borderStyle='none solid solid none';
    width = 6 +'px';
    height = 6 +'px';
}
eventHandler.addLoadEvent(function () {
    document.body.appendChild(renderer.cursor);
});*/
eventHandler.addEvent(document, 'mousemove', function (e) {
    e=eventHandler.getEvent(e);
    Renderer.prototype.currentMousePos = {
        "x":e.clientX,
        "y":e.clientY
    };/*
    with(renderer.cursor.style) {
        top = e.clientY-7 +'px';
        left = e.clientX-7 +'px';
    }*/
});