$(function() {

    //remove js-disabled class
    $("#viewer").removeClass("js-disabled");

    //create new container for images
    $("<div>").attr("id", "container").css({
        position:"relative"
    }).width($(".wrapper").length * 180).height(100).appendTo("div#viewer");

    //add images to container
    $(".wrapper").each(function() {
        $(this).appendTo("div#container");
    });

    //work out duration of anim based on number of images (1 second for each image)
    var duration = $(".wrapper").length * 3500;

    //set initial position and class based on direction
    $("div#container").css("left", $("div#viewer").width()).addClass("rtl");

    //animator function
    var animator = function(el, time) {

        //add direction class
        el.removeClass("ltr").addClass("rtl");

        //animate the el
        el.animate({
            left:"-" + el.width() + "px"
        }, time, "linear", function() {

            //reset container position
            $(this).css({
                left:$("div#imageScroller").width(),
                right:""
            });

          
                    
            //restart animation
            animator($(this), duration);

            //hide controls if visible
            ($("div#controls").length > 0) ? $("div#controls").slideUp("slow").remove() : null ;

        });
    }

    //start anim
    animator($("div#container"), duration);



});