var sliderImages=new Array();

sliderImages.push({src:'001.jpg', alt:''});
sliderImages.push({src:'002.jpg', alt:''});
sliderImages.push({src:'003.jpg', alt:''});
sliderImages.push({src:'004.jpg', alt:''});
sliderImages.push({src:'005.jpg', alt:''});
sliderImages.push({src:'006.jpg', alt:''});
sliderImages.push({src:'007.jpg', alt:''});
sliderImages.push({src:'008.jpg', alt:''});
sliderImages.push({src:'009.jpg', alt:''});



imagePath='images/artists/';

$(document).ready(function(){
    var startStep = 40;
    var step = startStep;
    var leftDirection=true;
    var discret = 700;
    var tmpImage;
    var width=0;
    var imagesList;
    var firstList;
    
    $('#header').append($('<ul></ul>'));
    listImages = $('#header ul');
    loadImages();
    function loadImages() {
        if (image = sliderImages.shift()) {
            tmpImage = new Image();
            $(tmpImage).load(function(){
                $('<li></li>').append(tmpImage).appendTo(listImages);
                width += parseInt($(tmpImage).attr('width'))+4;
                $('#header ul').css('width',width);
                loadImages();
            }).attr({
                src: imagePath+image.src
            });
        }
       else {
            imagesList = $('#header ul').clone();
            firstList = $('#header ul');
            moveStep();
            $('#header').mousemove(chengeSpeed);

            $('#header').hover(function () {
            }, function () {
               step = startStep;
            });
            
        }
    }

    function chengeSpeed(e) {
        var headWidth = parseInt($("#header").css('width'));
        var section = parseInt(parseInt(e.clientX)/parseInt(headWidth)*9);
        switch (section) {
            case 0: {
                    leftDirection = true;
                    step=45;
                    break;
            }
            case 1: {
                    leftDirection = true;
                    step=35;
                    break;
            }
            case 2: {
                    leftDirection = true;
                    step=25;
                    break;
            }
            case 3: {
                    leftDirection = true;
                    step=15;
                    break;
            }
            case 4: {
                    step=0;
                    break;
            }
            case 5: {
                    leftDirection = false;
                    step=15;
                    break;
            }
            case 6: {
                    leftDirection = false;
                    step=25;
                    break;
            }
            case 7: {
                    leftDirection = false;
                    step=35;
                    break;
            }
            case 8: {
                    leftDirection = false;
                    step=45;
                    break;
            }
            case 9: {
                    leftDirection = false;
                    step=45;
                    break;
            }
        }
        
    }

    function moveStep(){
        var leftPosFirst = parseInt(firstList.css('left'));
        if (leftDirection) {
            if ((step>0)&&(-leftPosFirst > width/2)) {
                firstel = $('#header ul li:first');
                firstImg = $('#header ul li img:first');
                firstImg = firstImg[0];
                var imageWidth = parseInt($(firstImg).attr('width'))+4;
                firstel.remove().appendTo("#header ul");
                $('#header ul').css('left',leftPosFirst+imageWidth);
                leftPosFirst = parseInt(firstList.css('left'));
                if( -leftPosFirst > width/2) {
                    moveStep();
                    return;
                }
            }
            //alert(leftPosFirst);
            firstList.animate({
                left: leftPosFirst - step
                }, discret,'linear',moveStep);
        }
        else {
            if ((step>0)&&(-leftPosFirst < step*2)) {
                firstel = $('#header ul li:last');
                firstImg = $('#header ul li img:last');
                firstImg = firstImg[0];
                imageWidth = parseInt($(firstImg).attr('width'))+4;
                firstel.remove().prependTo("#header ul");
                $('#header ul').css('left',leftPosFirst-imageWidth);
                leftPosFirst = parseInt(firstList.css('left'));
                if( -leftPosFirst < step*2) {
                    moveStep();
                    return;
                }
            }

            firstList.animate({
                left: leftPosFirst + step
                }, discret,'linear',moveStep);
        }

    }

});