Photogallery = {
    activePhotoId: 1,
    init: function() {
        if ($('.photogallery').length > 0) {
            this.photoGallery();
        }
    },
    
    // Setting the menu events
    photoGallery : function() {
                
        $('.thumbs .img-wrapper').click(function (){
			$('.thumbs .img-wrapper').removeClass('active-img');

            // get the id of the photo clicked
            getId = $(this).attr('id');

            Photogallery.activePhotoId = getId.replace('image-', '');
			$(this).addClass('active-img');
			
			// get the alt text
			var alt = $(this).find('img').attr('alt');
            // get the large image src
            var image = $(this).find('input[name=large_image]').val();
			
            $('.img-large img').attr('src', image);
			$('.img-large img').attr('alt', alt);
            
        });
        
        /*$('.img-wrapper-large').click(function (){
            var image = $('#image-'+Global.activePhotoId).find('input[name=xlarge_image]').val();

            var elmImage = $('<img id="xl-image" />');
            var elmOverlay = $('<span class="img-overlay">&nbsp;</span>');
            $('#picture').html('').append(elmOverlay);
            $('#picture').append(elmImage);
            $(elmImage)
                .attr('src', image)
                .attr('alt', '')
            ;
            $('#picture').addClass('img-wrapper img-wrapper-xlarge');
            
            $('#picture').modal({
                closeHTML: '<div class="modal-close">Sluiten</div>',
                opacity: 0,
                onClose: function (dialog) {
                    $.modal.close();

                    $('#picture').html('');
                }
            });
                        

        });*/
        

    }
}

// Run any/all init functions.
$(document).ready(function() {
    Photogallery.init();
});

$(window).load(function() { 
});
