(function($) {
    $.fn.MediaWandover = function(options,callback) {  
        var settings = {
            type: "video",
            url: null,
            modalElement: null,
            contentElement: null,
            timeout: 500,
            position: "right",
            clickEvent: function(args){}
        };
        //Merge default settings with params
        if ( options && typeof(options) != 'string' )
            $.extend(settings, options);   
        //updates position to place modal
        updateOffsets = function(ele){
            return $(ele).offset();
        }   
        //shows modal     
        show = function(wandEl, modalEl){            
            offset = updateOffsets(wandEl);            
            $("." + modalEl.attr("class")).hide();                                
            switch(settings.position){
                case "left":
                    modalEl.css({top: offset.top - 10, left: offset.left - modalEl.width()}).fadeIn("fast")
                    break;
                case "right":
                    modalEl.css({top: offset.top - 10, left: offset.left + wandEl.width()}).fadeIn("fast");
                    break;
                default:                     
                    modalEl.css({top: offset.top - 10, left: offset.left + wandEl.width()}).fadeIn("fast")
                    break;
            }            
            
        }  
        //hides modal      
        hide = function(modalEl){
            $(modalEl).unbind("hover").fadeOut("fast");
        } 
        
        return this.each(function() {           
            //contentElement.appendTo(wandover_content); 
            //used in case of multiple wandovers with different content
            var me = this; 
            me.settings = settings;          
            switch(me.settings.type){
                case "video": 
                   html = "<div class='label'>Play Video</div>";
                   break;
                case "image" :
                    html = "<div class='label'>View Photos</div>";
                    break;
                default: 
                   html = "<div class='label'>Play Video</div>";
            }
            me.contentElement = (me.settings.contentElement ? $(me.settings.contentElement.clone(true)) :  $(html)); 
            me.contentElement.show();                      
            if(!settings.modalElement){
                 //Create wandover modal if not specified in settings
                me.wandover = $("<div class='wandover'></div>");
                me.wandover_top = $("<div class='wandover_top'><div class='tl'><div class='tr'><div class='tc'></div></div></div></div>")
                me.wandover_content = $("<div class='wandover_content'><div class='inner'></div></div>")
                me.wandover_bottom = $("<div class='wandover_bottom'><div class='bl'><div class='br'><div class='bc'></div></div></div></div>")
                me.wandover_top.appendTo(me.wandover);
                me.wandover_content.appendTo(me.wandover);
                me.wandover_bottom.appendTo(me.wandover);
                me.contentElement.appendTo(me.wandover_content.find(".inner"));
                me.contentElement.show();
                me.wandover.appendTo(document.body);
            }
            me.modalElement = me.settings.modalElement || me.wandover;            
            me.mouseOver = false;
            me.modalMouseOver = false;
            offset = $(this).offset();                                      
            $(this).hover(function(){                                                                                 
                    me.mouseOver = true; 
                    local = $(this); 
                    url = me.settings.url || $(this).attr("href");
                    show($(this), me.modalElement); 
                    me.contentElement.show();                 
                    $(me.modalElement).hover(function(){                        
                        me.modalMouseOver = true;                        
                        $(me.modalElement).bind("click",function(){
                            $(this).unbind("click");
                            hide(me.modalElement);
                            me.settings.clickEvent.call(null,url);
                        })
                    }, function(){
                        me.modalMouseOver = false;
                        $(me.modalElement).unbind("click");
                        setTimeout(function(){
                            if(!me.modalMouseOver && !me.mouseOver){hide(me.modalElement);}                            
                        }, me.settings.timeout)
                    })
                                  
                }, function(){                    
                    me.mouseOver = false;                
                    setTimeout(function(){
                        if(!me.modalMouseOver && !me.mouseOver){hide(me.modalElement);}                        
                    }, me.settings.timeout)
            });
             
        });  
    }  
})(jQuery);