var MIN;
var MAX;
var curr;
var WIDTH = 4;

function show_thumbnails(x) {
    var c = 0;
    $("div#thumbnails img.thumbnail").each(function() {
            if(c >= x && c <= (x + WIDTH)) {
                $(this).show();
            } else {
                $(this).hide();
            }
            c++;
        });
}

function count_thumbnails() {
    var c = 0;
    $("div#thumbnails img.thumbnail").each(function() {
            if($(this).hasClass("current")) {
                curr = c;
            }
            c++;
        });
    MAX = c - 1;
    if(curr > MAX - WIDTH) {
        curr = MAX - WIDTH;
    }
}

function scroll_left() {
    if(curr > MIN) {
        curr--;
        show_thumbnails(curr);
    }
}

function scroll_right() {
    if(curr + WIDTH < MAX) {
        curr++;
        show_thumbnails(curr);
    }
}

$(document).ready(function() {
        MIN = 0;
        count_thumbnails();
        
        show_thumbnails(curr);
        $("img#thumbnails-left").click(function() {
                scroll_left();                
                return false;
            });

        $("img#thumbnails-right").click(function() {
                scroll_right();
                return false;
            });

    });