

(function ($) {
    var opts = new Array;
    var level = new Array;
    var img = new Array;
    var links = new Array;
    var titles = new Array;
    var order = new Array;
    var imgInc = new Array;
    var inc = new Array;
    var stripInt = new Array;
    var imgInt = new Array; 
    $.fn.jqimageslider = $.fn.jqimageslider = function (options) {
        init = function (el) {
            opts[el.id] = $.extend({}, $.fn.jqimageslider.defaults, options);
            img[el.id] = new Array();
            links[el.id] = new Array();
            titles[el.id] = new Array();
            order[el.id] = new Array();
            imgInc[el.id] = 0;
            inc[el.id] = 0;
            params = opts[el.id]; 
           
            stripLeft = 0; 
            $.each($('#' + el.id + ' img'),
            function (i, item) {
                img[el.id][i] = $(item).attr('src');
                links[el.id][i] = $(item).next().attr('href');
                titles[el.id][i] = $(item).attr('alt') ? $(item).attr('alt') : '';
                $(item).hide();
            });
             $('#' + el.id).css({ 'background-image': 'url(' + img[el.id][0] + ')', 'width': params.width, 'height': params.height, 'position': 'relative', 'background-position': 'top left' });
             $('#' + el.id).append("<div class='PicSlider-title' id='PicSlider-title-" + el.id + "' style='position: absolute; bottom:0; left: 0; z-index: 1000; color: #fff; background-color: #000; '>" + titles[el.id][0] + "</div>"); 
            if (titles[el.id][imgInc[el.id]])
                $('#PicSlider-title-' + el.id).css('opacity', opts[el.id].titleOpacity); 
                else
                    $('#PicSlider-title-' + el.id).css('opacity', 0);
                if (params.navigation) {
                    $.navigation(el);
                    $('#PicSlider-buttons-' + el.id).children().addClass('PicSlider-div-' + el.id + '-notactive');
                  $('#PicSlider-buttons-' + el.id).children().first().addClass('PicSlider-div-' + el.id + '-active'); }
              odd = 1; 
            for (j = 1; j < params.strips + 1; j++) {
    
                
if (params.links)
    $('#' + el.id).append("<a href='" + links[el.id][0] + "' class='PicSlider-" + el.id + "' id='PicSlider-" + el.id + j + "' style='width:" + params.width + "px; height:" + params.height + "px; float: left; position: absolute;outline:none;'></a>"); 
                    else
                        $('#' + el.id).append("<div class='PicSlider-" + el.id + "' id='PicSlider-" + el.id + j + "' style='width:" + params.width + "px; height:" + params.height + "px; float: left; position: relative;'></div>");
           
                   order[el.id][j - 1] = j; 
                                
}
            $('.PicSlider-' + el.id).mouseover(function () { opts[el.id].pause = true; });
            $('.PicSlider-' + el.id).mouseout(function () { opts[el.id].pause = false; });
            $('#PicSlider-title-' + el.id).mouseover(function () { opts[el.id].pause = true; });
            $('#PicSlider-title-' + el.id).mouseout(function () { opts[el.id].pause = false; }); 
             clearInterval(imgInt[el.id]); imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay);
         };
         $.transition = function (el, direction) {
             if (opts[el.id].pause == true) return;
             stripInt[el.id] = setInterval(function ()
             { $.strips(order[el.id][inc[el.id]], el) },
            opts[el.id].stripDelay); 
            $('#' + el.id).css({ 'background-image': 'url(' + img[el.id][imgInc[el.id]] + ')' }); if (typeof (direction) == "undefined")
                imgInc[el.id]++; else
                if (direction == 'prev')
                    imgInc[el.id]--; 
                    else
                    imgInc[el.id] = direction; if (imgInc[el.id] == img[el.id].length) { imgInc[el.id] = 0; }
            if (imgInc[el.id] == -1) { imgInc[el.id] = img[el.id].length - 1; }
            if (titles[el.id][imgInc[el.id]] != '') {
                $('#PicSlider-title-' + el.id).animate({ opacity: 0 }, opts[el.id].titleSpeed, function () {
                    $(this).html(titles[el.id][imgInc[el.id]]).animate({ opacity: opts[el.id].titleOpacity },
              opts[el.id].titleSpeed);
                });
            } else 
              { $('#PicSlider-title-' + el.id).animate({ opacity: 0 }, opts[el.id].titleSpeed); }
            inc[el.id] = 0; buttons = $('#PicSlider-buttons-' + el.id).children(); buttons.each(function (index) {
                if (index == imgInc[el.id]) {
                    $(this).removeClass('PicSlider-div-' + el.id + '-notactive'); $(this).addClass('PicSlider-div-' + el.id + '-active');

             } else { $(this).removeClass('PicSlider-div-' + el.id + '-active'); $(this).addClass('PicSlider-div-' + el.id + '-notactive'); } 
         }); if (opts[el.id].direction == 'random')
                $.fisherYates(order[el.id]); 
       
 }; 
        $.strips = function (itemId, el) {
            temp = opts[el.id].strips; if (inc[el.id] == temp) { clearInterval(stripInt[el.id]); return; }
            $('.PicSlider-' + el.id).attr('href', links[el.id][imgInc[el.id]]);
           

           //***********************************************************************************************************************************

                //Hier steht die Animation
              
                $('#PicSlider-' + el.id + itemId).css({ height: 441, opacity: 0, 'background-image': 'url(' + img[el.id][imgInc[el.id]] + ')' });
                $('#PicSlider-' + el.id + itemId).animate({ opacity: 1 }, 1000);

          //***********************************************************************************************************************************



            inc[el.id]++;
        }; $.navigation = function (el) {
            $('#' + el.id).append("<a href='#' id='PicSlider-prev-" + el.id + "' class='PicSlider-prev'><img src='pics/zurueck.jpg' border='0'></a>");
  
            $('#PicSlider-prev-' + el.id).css({ 'position': 'absolute', 'top': params.height / 2 + 251, 'left': -33, 'z-index': 1001, 'line-height': '30px' }).click(function (e)
             {
                 e.preventDefault(); $.transition(el, 'prev');
                 clearInterval(imgInt[el.id]); imgInt[el.id] = setInterval(function ()
                 { $.transition(el) }, params.delay + params.stripDelay * params.strips);
             });   



             $("<div id='PicSlider-buttons-" + el.id + "' style=''></div>").insertAfter($('#' + el.id));

             $("<a href='#' id='PicSlider-next-" + el.id + "' class='PicSlider-next'><img src='pics/vor.jpg' border='0'></a>").insertAfter($('#PicSlider-buttons-' + el.id));
             $('#PicSlider-next-' + el.id).css({  'float':'left','left':5, 'z-index': 1001, 'padding':0, 'margin':0,'padding-top': 31}).click(function (e) {
                 e.preventDefault();
                 $.transition(el);
                 clearInterval(imgInt[el.id]);
                 imgInt[el.id] = setInterval(function ()
                 { $.transition(el) }, params.delay + params.stripDelay * params.strips);
             });


             $('#PicSlider-buttons-' + el.id).css({ 'float': 'left', 'text-align': 'left', 'padding-top': 5 });

             for (k = 1; k < img[el.id].length + 1; k++) { $('#PicSlider-buttons-' + el.id).append("<div class='PicSlider-div-" + el.id + "' style='width:18px; height:18px; float:left;'><a href='#' style='text-decoration:none;' class='PicSlider-button-" + el.id + "'>" + "<img class='imghover' src='spacer.gif' width='18' height='18' border='0'>" + "</a></div>"); }
         
             $('.PicSlider-div-' + el.id).css({ 'margin-right': 4, 'margin-top': 27 });
                 $.each($('.PicSlider-button-' + el.id), function (i, item) {
                     $(item).click(function (e) {
                         e.preventDefault(); $.transition(el, i); 
              clearInterval(imgInt[el.id]); imgInt[el.id] = setInterval(function () { $.transition(el) }, params.delay + params.stripDelay * params.strips); }) });
        }
  $.fisherYates = function (arr) {
      var i = arr.length;
      if (i == 0) return false; 
        while (--i) { var j = Math.floor(Math.random() * (i + 1)); var tempi = arr[i]; var tempj = arr[j]; arr[i] = tempj; arr[j] = tempi; } }
        this.each(function () { init(this); });
    }; 

  
    $.fn.jqimageslider.defaults = { width: 670, height: 441, strips: 1, delay: 3000, stripDelay: 20, titleOpacity: 0.7, titleSpeed: 1000,  navigation: false, links: false };
})(jQuery);
