(function($) {
    $.fn.hoverfade = function(options) {
        return this.each(function() {   
            $.hoverfade(options);
        });
    };

    var Timer;
    var current;
    var currentHover;
//    var old;
    
    $.hoverfade = function(options) {
        var settings = {
            'photoElmID':       '#photoList',
            'hoverElmID':       '#hoverList',
            'hoverTargetElmID':       '#hoverTargetList',
            'start':            0,
            'speed':            'normal',
            'timeout':          5000,
            'timeoutHover':          10000,
            'containerheight':  'auto',
            'runningclass':     'hoverfade',
            'zBase':            10,
            'zBase2':            200
        };
        
//        if (options && options.photoElmID && options.hoverElmID) {
        if (options && options.photoElmID) {
            $.extend(settings, options);
        }
        
        $photoElm = $(settings.photoElmID);
        var photos = $photoElm.children();
        
        
        $hoverElm = $(settings.hoverElmID);
        $hoverTargetElm = $(settings.hoverTargetElmID);
        var hovers = $hoverElm.children();
        var hoverTargets = $hoverTargetElm.children();
        
        $photoElm.css('zIndex', settings.zBase)
        $hoverTargetElm.css('zIndex', settings.zBase2)
        if (photos.length > 1) {
            
            current = settings.start;
            var old = settings.start - 1;
            
            $photoElm.css('position', 'absolute')
                     .css('height', settings.containerheight)
                     .addClass(settings.runningclass);
            
            for (var i = 0; i < photos.length; i++) {
                $(photos[i]).css({'position': 'absolute', 'top': 0, 'left': 0});
                if (i != current) {
                    $(photos[i]).hide();
                }
            }
            
            Timer = setTimeout(function() {
                $.hoverfade.next(photos, settings, current+1, current);
            }, settings.timeout);
        }
        
        
        if (hoverTargets.length) {
            
            $hoverTargetElm.css('position', 'absolute')
                           .css('top', '0').css('left', '0')
                           .css('height', settings.containerheight);
            for (var j = 0; j < hoverTargets.length; j++) {
                $(hoverTargets[j]).css({'position': 'absolute', 'top': 0, 'left': 0});
                if (j != currentHover) {
                    $(hoverTargets[j]).hide();
                }
            }
            
        }
        if (hovers.length) {
            currentHover = -1;
            var oldHover = -1;
            hovers.each(function () {
                var elm = this;
                
                $.hoverfade.setDefaultHoverElm(elm, settings);
                
                var imageHeight = $('img', elm).height();
                var imageWidth = $('img', elm).width();
                
                $(elm).css({'display': 'block'})
                            .height(imageHeight)
                            .width(imageWidth);
                
                $('a', elm).css({'display': 'block', 'position':'relative'})
                            .height(imageHeight)
                            .width(imageWidth);
                
                $('img', elm).css({
                    'display': 'block',
                    'position': 'relative',
                    'vertical-align': 'bottom'
                });
                
                $lay = $('<p class="hovLay"></p>');
                $('a', elm).append($lay);
                
                $('.hovLay', elm)
                    .css({
                        'width': imageWidth - 5,
                        'height': imageHeight,
                        'display': 'block',
                        'position': 'absolute',
                        'top': '0',
                        'left': '0',
                        'vertical-align': 'bottom'
                    })
                    .css('border-right', '5px solid #a69b85');
                $('.hovLay', elm).hide();
                
                $(elm).mouseover(function () {
                    
                    $.hoverfade.setCurrentHoverElm(this, settings);
                    
                    $num = hovers.index(this);
                    oldHover = currentHover;
                    currentHover = $num;
                    
                    if (oldHover != currentHover) {
                        $(hoverTargets[oldHover]).css({'zIndex': settings.zBase2});
                        $(hoverTargets[currentHover]).css({'zIndex': settings.zBase2+1});
//                        $(hoverTargets[oldHover]).fadeOut(settings.speed);
//                        $(hoverTargets[current]).fadeIn(settings.speed);
                        if (hoverTargets[oldHover]) {
                            $(hoverTargets[oldHover]).fadeOut(0);
                        }
                        $(hoverTargets[currentHover]).fadeIn(0);
/*
                        
//                        clearTimeout(Timer);
//                        Timer = setTimeout(function() {
//                            $.hoverfade.next(photos, hovers, settings, current+1, current);
//                        }, settings.timeoutHover);
                        
                        $.hoverfade.setDefaultHoverElm($(hovers[oldHover]), settings);
*/
                    }
                    $hoverTargetElm.show();
                });
                $(elm).mouseout(function () {
                    $hoverTargetElm.hide();
                    $.hoverfade.setDefaultHoverElm(this, settings);
                });
                
            });
            
//            $.hoverfade.setCurrentHoverElm($(hovers[currentHover]), settings);
        }
    };
    
    
    
    $.hoverfade.next = function(photos, settings, next, last) {
        
        if (next >= photos.length) {
            next = 0;
        }
        
        current = next;
        
//        $.hoverfade.setDefaultHoverElm($(hovers[last]), settings);
//        $.hoverfade.setCurrentHoverElm($(hovers[next]), settings);
        
        
//        $(photos[next]).width(0).css('zIndex', photos.length);
//        $(photos[last]).css('zIndex', 1);
        
        $(photos[last]).fadeOut(settings.speed);
        $(photos[next]).fadeIn(settings.speed);
//        $(photos[next]).animate({
//            width: '100%'
//        }, 
//        settings.speed,
//        function () {$(photos[last]).hide();}
//        );
        
        
        
        
//        if (onhover == 1) {
//            $(photos[last]).fadeOut(0);
//            $(photos[next]).fadeIn(0);
//        } else{
//            $(photos[last]).fadeOut(settings.speed);
//            $(photos[next]).fadeIn(settings.speed);
//        }
        
//        $(photos[next]).fadeIn(settings.speed, function() {
//            removeFilter($(this)[0]);
//        });

        if ((current + 1) < photos.length) {
            nextNum = current + 1;
        } else {
            nextNum = 0;
        }
        
        clearTimeout(Timer);
        Timer = setTimeout((function() {
            $.hoverfade.next(photos, settings, nextNum, current);
        }), settings.timeout);
    };
    
    
    
    
    $.hoverfade.setDefaultHoverElm = function(elm, settings) {
        $('img', elm).css({'opacity': 1.0});
        $('.hovLay', elm).hide();
    };
    
    $.hoverfade.setCurrentHoverElm = function(elm, settings) {
        $('img', elm).css({'opacity': 0.4});
        $('.hovLay', elm).show();
    };
    
    
})(jQuery);

// **** remove Opacity-Filter in ie ****
function removeFilter(element) {
	if(element.style.removeAttribute){
		element.style.removeAttribute('filter');
	}
}