var IE = document.all?true:false;             
if (!IE) document.captureEvents('MOUSEMOVE')
{
    document.onmousemove = getMouseXY;
}       
function getMouseXY(e) 
{
    if (IE) 
    {
        tempX = event.clientX + document.body.scrollLeft;
        tempY =  event.clientY + + document.body.scrollTop + document.documentElement.scrollTop;;
        
    }
    else 
    {
        tempX = e.pageX;
        tempY = e.pageY;
    }  
    if (tempX < 0){tempX = 0;}
    if (tempY < 0){tempY = 0;}       
    return true;
}
var tempX = 0;
var tempY= 0;
    
var previewer = new Class({
    frame: null,
    anchor: null,
    image: null,
    width: null,
    height: null,
    html:null,
    tempY:null,
    browser :navigator.appName ,
 
    initialize: function()
    {
        var oSelf = this;
        this.frame = new Element('div');
        this.frame.set('class','previewerCMS'); 
        this.anchor = new Element('a');
        this.frame.inject(this.anchor, 'top');     

        this.frame.addEvent("mouseout", function(event) {
            if( this.browser =='Microsoft Internet Explorer')
            {
                $$('select').each(function(el){el.setStyle('visibility', 'visible');}); 
            }
            this.dispose();
         });

        this.frame.addEvent("mouseleave", function(event) 
        {
            if( navigator.appName =='Microsoft Internet Explorer' )
            {
                $$('select').each(function(el){el.setStyle('visibility', 'visible');}); 
            }
            this.dispose();
         });   
         this.frame.dispose();
    },
    
    show: function(target, src, link,width, height)
    {
        this.width = width;
        this.height = height;
        if( this.browser =='Microsoft Internet Explorer')
        {
            $$('select').each(function(el){el.setStyle('visibility', 'hidden');}); 
        }
        target = $(target);
        if(!link) link = '#';
        this.anchor.set('href', link);    
        if(this.image != null) this.image.dispose();
        this.image = new Element('img');
        this.image.set('src', src);
        this.image.set('width', this.width); 
        this.image.set('height',  this.height);
        this.anchor.grab(this.image);                
        var position = this.cumulativeOffset(target);
        var left = Math.round(position[0] - (this.width - target.getWidth())/2);
        var top = Math.round(position[1] - (this.height - target.getHeight())/2); 
        
        this.frame.setStyles({
            zIndex: 999, 
            position: 'absolute',
            left: left + 'px',
            top: top + 'px',
            overflow: 'hidden',
            backgroundColor: '#FFF'
            
        });   
        this.html =  '<a href="'+link+'">';
        this.html = this.html + '<img src="'+src+'" width="'+this.width+'" height="'+this.height+'" alt="">';
        this.html = this.html + '</a>';
        this.frame.set('html', this.html);
        $(document.body).grab(this.frame); 
        
    },
    cumulativeOffset: function(element) 
    {
        var valueT = 0, valueL = 0;
        do 
        {
            valueT += element.offsetTop  || 0;
            valueL += element.offsetLeft || 0;
            element = element.offsetParent;
        } 
        while (element);
        return this.returnOffset(valueL, valueT);
    },
    returnOffset :function(l, t) 
    {
        var result = [l, t];
        result.left = l;
        result.top = t;
        return result;
    }
});          
previewerCMS = new previewer();
 window.addEvent('domready', 
        function()
        {
            $(document.body).addEvent('mousemove',
                function(e)
                {
                    var cordinates =  previewerCMS.frame.getCoordinates();
                    var yMin = cordinates['top'];
                    var yMax = cordinates['bottom'];
                    var xMin = cordinates['left'];
                    var xMax = cordinates['right'];
                    xMouse =tempX;
                    yMouse =tempY;
                      //  alert('xMouse='+xMouse+';'+'xMax='+xMax+';'+'xMin='+xMin+';'+'yMouse='+yMouse+';'+'yMax='+yMax+';'+'yMin='+yMin+';');

                    if((xMouse>xMax) || (xMouse<xMin))
                    {
                        if (IE)
                        {
                            $$('select').each(function(el){el.setStyle('visibility', 'visible');}); 
                        }
                        previewerCMS.frame.dispose(); 
                    }             
                });
         }
     );