$(document).ready(
    function() {
        initGallery();
    });

var nTotThumbImage = 0;
var nCurrentImage = 0;
var nCurrentSelectImage = "";
var bmenu = true;

function initGallery() {
    nTotThumbImage = $('#thumbGalleryScroll > .thumb').length;

    if (nTotThumbImage > 0) {
        var nHeightScoll = nTotThumbImage * 67;
        $('#thumbGalleryScroll').css({ 'heigth': nHeightScoll + 'px' });
    }

    if (nTotThumbImage > 10) {
        $('#arrowLeft').css({ 'display': 'none' });
        $('#arrowRight').css({ 'display': 'block' });

        $('#arrowRight').bind('click', function() {
            if (bmenu) {
                bmenu = false;
                if (nCurrentImage < nTotThumbImage - 10) {
                    nCurrentImage++;
                    var sCurrentLeft = $('#thumbGalleryScroll').css('left');
                    sCurrentLeft = sCurrentLeft.replace('px', '');
                    nCurrentLeft = parseInt(sCurrentLeft);
                    nCurrentLeft = nCurrentLeft - 67;
                    $('#thumbGalleryScroll').animate({ 'left': nCurrentLeft + 'px' }, 300, function() {
                        bmenu = true;
                    });
                }

                CheckPos(nCurrentImage, nTotThumbImage);
            }
        });

        $('#arrowLeft').bind('click', function() {
            if (bmenu) {
                bmenu = false;
                if (nCurrentImage > 0) {
                    nCurrentImage--;
                    var sCurrentLeft = $('#thumbGalleryScroll').css('left');
                    sCurrentLeft = sCurrentLeft.replace('px', '');
                    nCurrentLeft = parseInt(sCurrentLeft);
                    nCurrentLeft = nCurrentLeft + 67;
                    $('#thumbGalleryScroll').animate({ 'left': nCurrentLeft + 'px' }, 300, function() {
                        bmenu = true;
                    });
                }

                CheckPos(nCurrentImage, nTotThumbImage);
            }
        });
        
    } else {
        $('#arrowLeft').css({ 'display': 'none' });
        $('#arrowRight').css({ 'display': 'none' });
    }

}

function CheckPos(nPos, nTot) {
    if (nPos > 0)
        $('#arrowLeft').css({ 'display': 'block' });
    else
        $('#arrowLeft').css({ 'display': 'none' });

    if (nPos < nTot - 10)
        $('#arrowRight').css({ 'display': 'block' });
    else
        $('#arrowRight').css({ 'display': 'none' });
}