var LinkAlert = new Class({

    //implements
    Implements: [Options, Events],
    
    //options
    options: {
        container: document.body,
        extensions: {},
        offsets: {
            x: 6,
            y: -15
        },
        preloadImages: true,
        protocols: {},
        sticky: false,
        onShow: function(el, image){
            this.image.setStyle('display', '');
        },
        onHide: function(el, image){
            this.image.setStyle('display', 'none');
        }
    },
    
    //initialization
    initialize: function(options){
        //set options
        this.setOptions(options);
        this.extensions = new Hash(this.options.extensions);
        this.protocols = new Hash(this.options.protocols);
        this.image = new Element('img', {
            src: '',
            styles: {
                position: 'absolute',
                top: -200,
                left: -200,
                visibility: 'hidden'
            }
        }).inject(document.id(document.body));
        //preload images, if necessary
        if (this.options.preloadImages) {
            this.preloadImages();
        }
        //add the listeners
        this.addListeners(this.extensions, '$=', 'extensions');
        this.addListeners(this.protocols, '^=', 'protocols');
    },
    
    //give direction to links
    addListeners: function(items, sep, type){
        //for every item
        items.each(function(image, extension, type){
            //for every link of that type
            $$('a[href' + sep + '\'' + extension + '\']').each(function(el){
                //if the same protocol, don't bother showing
                if (type == 'protocol' && window.location.protocol == extension + ':') {
                    return;
                }
                //add the show/hide events
                el.addEvents({
                    mouseenter: function(e){
                        //position the image and give it the proper SRC
                        this.reposition(e).set('src', image);
                        //fire the event
                        this.fireEvent('show', [el, image]);
                    }
.bind(this)                    ,
                    mouseleave: function(e){
                        //fire the event
                        this.fireEvent('hide', [el, image]);
                    }
.bind(this)
                });
                //sticky?
                if (this.options.sticky) {
                    el.addEvent('mousemove', function(e){
                        this.reposition(e);
                    }
.bind(this));
                }
            }, this);
        }, this);
    },
    
    //repositions
    reposition: function(e){
        return this.image.setStyles({
            left: e.page.x + this.options.offsets.x,
            top: e.page.y + this.options.offsets.y
        });
    },
    
    //preloads necessary images
    preloadImages: function(){
        var images = [this.protocols.getValues(), this.extensions.getValues()].flatten();
        new Asset.images(images);
    }
});