$(function() {
   // $("html, body, #site").height($(document).height() + ($.browser.mozilla ? 0 : 200));


    var isMobile = navigator.userAgent.toLowerCase().match(/(iphone os)/);
    
    /******* Gallery ******/
    $('div.gallery ul.thumbs li').click(function() {
       var id = $(this).attr('id').split("_")[2];
       
       // Großes Bild einblenden
       $('#gallery_big_'+id).fadeIn(200);
       $('div.gallery .big img:not(#gallery_big_'+id+')').fadeOut(200);
       
       // Thumbnail hervorheben
       $('div.gallery ul.thumbs li#gallery_thumb_'+id).animate({'opacity': 1}, 200);
       $('div.gallery ul.thumbs li:not(#gallery_thumb_'+id+')').animate({'opacity': 0.5}, 200);                    
    });
    
    
    
    
    /**** Scroll Footer ****/
    
    var mouseX = mouseY = entryMouseX = oldMouseX = deltaMouseX = 0;
    var mouseInFooter = false;
    
    var availableBoxes = $('#footer li');
    availableBoxes.remove();
    
    // Footer Boxes mit den availableBoxes rotierend befüllen, bis die Breite des Browserfensters erreicht ist
    for (var i = 0; i < availableBoxes.length; i++) {
        $(availableBoxes[i]).data('availableBoxesIndex', i);
    }
    
    var footerBoxes = [];                
    var footerUl = $('#footer ul');
    var footerWidth = $('#footer').width();

    
    var availableBoxesIndex = posX = 0;                

    while (posX <= footerWidth + 400) {
        

        var box = $(availableBoxes[availableBoxesIndex]).clone();
        
        box.css('left', posX );
        
        box.data('availableBoxesIndex', $(availableBoxes[availableBoxesIndex]).data('availableBoxesIndex'));
        posX += box.outerWidth(true) + 40;
        
        
        footerUl.append(box);
    
        footerBoxes.push(box);
        
        box.css('position', 'absolute');

        availableBoxesIndex = (availableBoxesIndex + 1) % availableBoxes.length;

    }


    // Boxen scrollen

        var posXDelta = oldPosXDelta = -1;
        
        
        
        var touchStartPos = 0;

        if (isMobile) {
            document.getElementById('footer').addEventListener('touchstart', function(e) {
                e.preventDefault();
                var touch = e.touches[0];
                touchStartPos = touch.pageX;
            }, false);

            document.getElementById('footer').addEventListener('touchmove', function(e) {
                e.preventDefault();
                var touch = e.touches[0];
                posXDelta = touch.pageX - touchStartPos;
                touchStartPos = touch.pageX;
                scroll();
            }, false);
            
            /*
            document.getElementById('footer').addEventListener('touchend', function(e) {
                e.preventDefault();
                
                // posXDelta langsam auf 0 zurückführen -> Scrolen mit Schwung
                (function() {
                    if (posXDelta < 0) {
                        posXDelta += 1;
                    } else if (posXDelta > 0){
                        posXDelta -= 1;
                    }
                    scroll();
                    
                    setTimeout(arguments.callee, 30);
                })();
                
            }, false);*/

        }

        
        
        
           
        var scroll = function() {

               // Scrollgeschwindigkeit und -Position anpassen, wenn die Maus im Footer ist
               if (mouseInFooter && !isMobile) {
                   deltaMouseX = oldMouseX - mouseX;
                   oldMouseX = mouseX;

                   if ((Math.abs(mouseX - entryMouseX) > 100 && checkMouseInEnterRegion) || !checkMouseInEnterRegion) {
                       posXDelta = deltaMouseX;
                       checkMouseInEnterRegion = false;
                   } else {
                       posXDelta = 0;
                   }
               }


               var i = 0;
               for (i in footerBoxes) {
                   var newPosX = $(footerBoxes[i]).position().left + posXDelta;                        
                   $(footerBoxes[i]).css('left', newPosX);
               }

               if (posXDelta < 0) {
                   // Zuweit links? raus damit
                   var leftBox = $(footerBoxes[0]);
                   if (leftBox.position().left + leftBox.outerWidth(true) < 0) {
                       leftBox.remove();

                       var footerBoxesLength = footerBoxes.length;

                       // Alle nach links shiften
                       for (var i = 0; i < footerBoxesLength-1; i++) {
                           footerBoxes[i] = footerBoxes[i+1];
                       }

                       var newIndex = ($(footerBoxes[footerBoxesLength-2]).data('availableBoxesIndex') + 1) % availableBoxes.length;
                       footerBoxes[footerBoxesLength-1] = $(availableBoxes[newIndex]).clone();
                       footerBoxes[footerBoxesLength-1].css('left', footerBoxes[footerBoxesLength-2].position().left + footerBoxes[footerBoxesLength-2].outerWidth(true));
                       $('#footer ul').append(footerBoxes[footerBoxesLength-1]);

                   }

               // Genau andersrum wenns nach rechts scrolled    
               } else if (posXDelta > 0) {
                   // Zuweit rects? raus damit
                   var rightBox = $(footerBoxes[footerBoxes.length-1]);
                   if (rightBox.position().left > footerWidth + 200) {
                       rightBox.remove();

                       var footerBoxesLength = footerBoxes.length;

                       // Alle nach rechts shiften
                       for (var i = footerBoxesLength-1; i > 0; i--) {
                           footerBoxes[i] = footerBoxes[i-1];
                       }

                       var newIndex = ($(footerBoxes[0]).data('availableBoxesIndex') - 1) % availableBoxes.length;
                       if (newIndex == -1) {
                           newIndex = availableBoxes.length-1;
                       }

                       footerBoxes[0] = $(availableBoxes[newIndex]).clone();



                       footerBoxes[0].css('left', footerBoxes[1].position().left - footerBoxes[0].outerWidth(true)-40);
                       $('#footer ul').append(footerBoxes[0]);

                   }
               }
               
               
              // Desktop-Browser: automatisch scrollen 
              if (!isMobile) {
                  setTimeout(scroll, 33);       
              }
                          

           }
           scroll();


        
        
    
    
    
    
    // Maus drüber: Bewegung stoppen
    $('#footer').hover(function(e) {
        posXDelta = 0;
        entryMouseX = oldMouseX = mouseX;
        mouseInFooter = checkMouseInEnterRegion = true;                        

    // Maus raus, weiterscrollern
    }, function(e) {
        posXDelta = oldPosXDelta;
        mouseInFooter = checkMouseInEnterRegion = false;
    });
    

    
    
    // Aktuele Mausposition:
    $(document).mousemove(function(e){
        mouseX = e.pageX;
        mouseY = e.pageY;
    });
    
    $(window).resize(function() {

        oldFooterWidth = footerWidth;
        footerWidth = $('#footer').width();

        
        // Fenster breiter geworden? Mehr Boxen reinpacken
        var rightXPos = footerBoxes[footerBoxes.length-1].position().left + footerBoxes[footerBoxes.length-1].outerWidth();
        
        if (footerWidth > rightXPos) {
            var footerBoxesLength = footerBoxes.length;

            var boxesToAdd = Math.floor((footerWidth - rightXPos) / 60);
            for (var i = 0; i < boxesToAdd; i++) {
                var newIndex = ($(footerBoxes[footerBoxesLength-1]).data('availableBoxesIndex') + 1) % availableBoxes.length;
                
                footerBoxes[footerBoxesLength] = $(availableBoxes[newIndex]).clone();
                footerBoxes[footerBoxesLength].css('left', footerBoxes[footerBoxesLength-1].position().left + footerBoxes[footerBoxesLength-1].outerWidth(true));
                
                $('#footer ul').append(footerBoxes[footerBoxesLength]);
                
                footerBoxesLength++;
                
            }
        }
        
    })
    
});