/*

Simple Image Trail script - By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact

This javascript modified by Dotser from the original at http://www.javascriptkit.com/script/script2/simpleimagetrail.shtml.
Copyright Dotser 2010.

*/

var hover = {
    mouseoffset: [10, 10], // Image x,y offsets from cursor position in pixels.
    setup: function() {
        document.write('<div id="trailimageid"></div>');
        var container = app.get('gallery_table');
        var imgs = container.getElementsByTagName('img');
        for (var i = 0; i < imgs.length; i++) {
                var img = imgs[i];
                // Add attributes here instead of in HTML. Separating content and behaviour.
                img.setAttribute('onmouseover', 'hover.add(this.src, this.alt)');
                img.setAttribute('onmouseout',  'hover.hide()');
            }
    },
    get: function() {
        return app.get('trailimageid');
    },
    truebody: function() {
        return (!window.opera && document.compatMode && document.compatMode != 'BackCompat') ? document.documentElement : document.body;
    },
    hide: function() {
        hover.get().style.display = 'none';
        document.onmousemove = '';
    },
    follow: function(e) {
        var xcoord = hover.mouseoffset[0];
        var ycoord = hover.mouseoffset[1];
        if (typeof e != 'undefined') {
            xcoord += e.pageX;
            ycoord += e.pageY;
        } else if (typeof window.event != 'undefined') {
            xcoord += hover.truebody().scrollLeft + event.clientX;
            ycoord += hover.truebody().scrollTop + event.clientY;
        }
        hover.get().style.display = '';
        hover.get().style.left    = xcoord + 'px';
        hover.get().style.top     = ycoord + 'px';
    },
    add: function(img, text) {
        img                           = img.replace('.front.', '.large.');
        var trail                     = hover.get();
        trail.innerHTML               = '<img src="' + img + '" alt="' + text + '" /><div id="hovertext">' + text + '</div>';
        trail.style.position          = 'absolute';
        trail.style.visibility        = 'visible';
        trail.style.left              = '0';
        trail.style.top               = '0';
        trail.style.backgroundColor   = '#fff';
        trail.style.border            = '3px solid #ccc';
        var description               = app.get('hovertext')
        description.style.clear       = 'both';
        description.style.textAlign   = 'center';
        description.style.fontWeight  = 'bold';
        document.onmousemove          = hover.follow;
    }
}