(function($){
    $(document).ready(function(){

        var winwidth = $(document).width();
        $('#slideshow ul').animate({
            'padding-left': winwidth/2 -475
        })
        $('#slideshow li:last').css({
               marginRight:  winwidth/2 -475
             })
        $(window).resize(function() {
            var winwidth = $(document).width();
            $('#slideshow ul').animate({
                'padding-left': winwidth/2 -475
            })

        });

        $('#slideshow li:first-child').addClass('selected');
        var total_width = 0
        $('#slideshow li').each(function () {
            var item_width = $(this).outerWidth(true);
            total_width = total_width + item_width;
        })
      

        function calc_width(nr){
            var width = 0;
            for (i=0; i < nr-1; i++){
                var item_width = $('#slideshow li:eq('+i+')').outerWidth(true);
                width = width + item_width;
            }
            return width;
        }


        function scrollImage(e) {
			var curr_th = $(this).index();
            var curr = $(this).index()+1;
            var scroller = calc_width(curr);
            $('#slideshow li').attr('class','');
            $('#thumbs li').attr('class','').animate({
                marginTop:'10px'
            });

            $('#thumbs li:eq('+curr_th+')').addClass('selected').animate({
                marginTop:'6px'
            });
          var curr_width = calc_width(curr);

            $('#slideshow li:eq('+curr+')').addClass('selected');
            var winwidth = $(document).width();

            $('#slideshow').scrollTo( { top:200, left:curr_width}, 500, {offset:-(winwidth/2)} );
            var leftsel = $('#thumbs li.selected').position().left;

            if (leftsel > 405) {
                $('#thumbs').animate({
                    left: -leftsel+405
                });
            }
            if (leftsel < 405 ) {
                $('#thumbs').animate({
                    left: 0
                });
            }

            e.preventDefault();
        }

        $('#slideshow li').bind('click',scrollImage);
        $('#thumbs li').bind('click',scrollImage);

        function nextImage(){
            var selected = $('#thumbs li.selected');

            if (selected.next('li').length > 0 ) {
                selected.next('li').trigger('click');
            } else {
                $('#thumbs li:first').trigger('click');
            }

        }
        function prevImage(){
            var selected = $('#thumbs li.selected');
            if (selected.prev('li').length > 0 ) {
                selected.prev('li').trigger('click');
            } else {
                $('#thumbs li:last').trigger('click');
            }
        }

        $('#single-slider-wrap .previous').bind('click',prevImage)
        $('#single-slider-wrap .next').bind('click',nextImage)


        //         $('#slideshow').bind('mousewheel', function(event, delta) {
        //                if (delta > 0){
        //                    nextImage();
        //                } else {
        //                    prevImage();
        //                }
        //                return false;
        //            });

        //keyboard navigation - arrows
        $(document.documentElement).keyup(function (event) {
            if (event.keyCode == 37) {
                prevImage();

                return false;
            }
            else if (event.keyCode == 39) {
                nextImage();
                return false;
            }
        });


        function thumbsScroller() {
            var thumbs = $('#thumbs'),
            thumbsCont = $('#thumbs-scroller'),
            // divWidth = thumbsCont.width(),
            thumb = thumbs.find('li'),
            thumbslength = thumb.length;
            //  var extra           = 800;
            var singleHeight = thumb.outerHeight(true);
            var singleWidth = thumb.outerWidth(true);
            thumbsCont.height(singleHeight+10);

            thumbs.width(singleWidth*thumbslength);
        }
        thumbsScroller();
    //        $('#slideshow li').hover(function(){
    //            $(this).stop().animate({
    //                opacity: 0.8
    //            })
    //        }, function(){
    //            $(this).stop().animate({
    //                opacity: 1
    //            })
    //        })


    });


})(this.jQuery);