/**
 * Preload all mouseover images on the page and define a mouseover and mouseout
 * event for those images. All that is required is that the image has a class
 * name consisting of mouseover_* with the * being the rollover key to
 * apply to the mouseover image.
 *
 * i.e. look at the following examples to see how the class name is parsed
 *      <img class="mouseover_r" src="myimage.gif" alt=""/>
 *      out image = myimage.gif
 *      over image = myimage_r.gif
 *
 * @important! this function must be called by the onload event
 *
 * @param void
 * @return void
 *
 * @author Toby Miller <tmiller@resource.com>
 * @author Josh Zeigler <jzeigler@resource.com>
*/

function mouseoverSetup(image)
{
	// set internal vars
	var extlist = ['gif', 'jpg', 'jpeg', 'png'];
	var ext = null;
	var re = null;
	var klass = null;
	var clickklass = null;
	var key = null;
	var src = null;
	var oversrc = null;

    var init = function(el) {
        // get image source and class name
        src = el.src;
        klass = el.className;

        if (klass.contains('mouseclick_')) {
            // strip out additional classes (if they exist)
            re = new RegExp('.*(mouseclick_[a-zA-Z0-9-]+).*');
            clickklass = klass.replace(re, '$1');

            // find the supported extension
            extlist.each(function(x) {
                re = new RegExp('\\.' + x + '$');
                if (src.match(re)) {
                    ext = x;
                }
            });

            if (ext != null) {
                // get this mouseover key
                re = new RegExp('mouseclick(_[a-zA-Z0-9-]+)');
                key = clickklass.replace(re, '$1');

                re = new RegExp('\\.' + ext + '$');
                el.activesrc = src.replace(re, key + '.' + ext);

                // setup onmouseover event
                el.addEvent('click', function(){
                    this.removeEvents('mouseenter');
                    this.removeEvents('mouseleave');
                    this.setProperty('src', this.activesrc);
                });
            }
        }

        if (klass.contains('mouseover_')) {
            // strip out additional classes (if they exist)
            re = new RegExp('.*(mouseover_[a-zA-Z0-9-]+).*');
            klass = klass.replace(re, '$1');

            // find the supported extension
            extlist.each(function(x) {
                re = new RegExp('\\.' + x + '$');
                if (src.match(re)) {
                    ext = x;
                }
            });

            if (ext != null) {
                // get this mouseover key
                re = new RegExp('mouseover(_[a-zA-Z0-9-]+)');
                key = klass.replace(re, '$1');

                if ((ext == 'png') && (document.all) && (navigator.userAgent.toUpperCase().indexOf('OPERA') < 0) && (navigator.userAgent.indexOf('MSIE 7') < 0)) {
                    // get this mouseovers over src
                    re = new RegExp('\\.' + ext + '$');
                    oversrc = src.replace(re, key + '.' + ext);

                    // get the dimensions
                    width = el.getProperty('width');
                    height = el.getProperty('height');

                    // force the spacer for transparent backgrounds
                    el.setProperty('src', _SPACER_IMAGE);

                    // setup the new properties (replace mouseovers)
                    el.overFilter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + oversrc + '\', sizingMethod=scale)';
                    el.outFilter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' + src + '\', sizingMethod=scale)';

                    // apply the defaults
                    el.style.filter = el.outFilter;
                    el.style.width = width + 'px';
                    el.style.height = height + 'px';

                    // setup onmouseover event
                    el.addEvent('mouseenter', function(){
                        this.setStyle('filter', this.overFilter);
                    });

                    // setup onmouseout event
                    el.addEvent('mouseleave', function(){
                        this.setStyle('filter', this.outFilter);
                    });
                }
                else {
                    // get this mouseovers over src
                    re = new RegExp('\\.' + ext + '$');
                    oversrc = src.replace(re, key + '.' + ext);

                    // preload both over and out images
                    el.overImage = new Image();
                    el.overImage.src = oversrc;
                    el.outImage = new Image();
                    el.outImage.src = src;

                    // setup onmouseover event
                    el.addEvent('mouseenter', function(){
                        this.setProperty('src', this.overImage.src);
                    });

                    // setup onmouseout event
                    el.addEvent('mouseleave', function(){
                        this.setProperty('src', this.outImage.src);
                    });
                }
            }
        }
        else if (klass.contains('fadeover_')) {
            Global.set(new Fx.Style(el, 'opacity', {'duration': 333}), el.id);

            // setup onmouseover event
            el.addEvent('mouseenter', function() {
                Global.get(this.id).stop();
                Global.get(this.id).start(1);
            });

            // setup onmouseout event
            el.addEvent('mouseleave', function() {
                Global.get(this.id).stop();
                Global.get(this.id).start(0.000000000000000000000000000000000000000000000000000000001);
            });
        }

        // reset vars
        ext = null;
        re = null;
        klass = null;
        clickklass = null;
        key = null;
        src = null;
        oversrc = null;
    };

    if(image != undefined) {
        init($(image));
    }
    else {
        $$('img').each(init);
    }
}

//on DOMReady, load up the mouse over events
window.addEvent('domready', mouseoverSetup);