function RoomGallery()
{
}

with( RoomGallery )
{
    prototype._setGalleryContainer = function( galleryContainer ) { this.m_galleryContainer = galleryContainer; }
    prototype._getGalleryContainer = function( ) { return this.m_galleryContainer; }
    
    prototype._setMainPhoto = function( mainPhoto ) { this.m_mainPhoto = mainPhoto; }
    prototype._getMainPhoto = function( ) { return this.m_mainPhoto; }
    
    prototype._setLoading = function( loading ) { this.m_loading = loading; }
    prototype._getLoading = function( ) { return this.m_loading; }

	prototype._bindEventHandlers = function()
	{
		var context = this;
		$(".scrollable .items a").click( function( ev ){
			ev.preventDefault();
			context._changeMainImage( $( this ).attr( "id" ) );
		})
	}

	prototype.init = function()
	{
        var context = this;
        
        $("#mainPhoto").wrap('<div id="roomGalleryContainer" class="foto_room" />');
        
        var galleryContainer = $('#roomGalleryContainer');
        var mainPhoto = $("#mainPhoto");        
        var loading = $('<div id="roomGalleryLoading" />');
        
        galleryContainer.css('float', 'left').css('display', 'inline');
        loading.css('position', 'absolute').css('z-index', 5).css('background', 'url(/images/loader-bar.gif) center center no-repeat');
        mainPhoto.removeClass('foto_room').css('z-index', 4).css('display', 'block');

        galleryContainer.prepend(loading);
        
        context._setGalleryContainer(galleryContainer);
        context._setMainPhoto(mainPhoto);
        context._setLoading(loading);
        
        context._bindEventHandlers();
	}
    
    prototype._toggleLoading = function(visible)
	{
        var context = this;
        var loading = context._getLoading();

        if (visible)
        {
            var galleryContainer = context._getGalleryContainer();
            
            loading.width( galleryContainer.width() );
            loading.height( galleryContainer.height() );
        }
        
        if ( visible )
        $(loading).fadeIn( "fast" );
        else
        $(loading).fadeOut( "fast" );
    }
    
    prototype.preloadImage = function( id )
    {    
        if ( $('#n' + (parseInt(id) + 1)).length > 0 )
        {
            var preloadElement = new Image();

            if ( $("#photoSource").length > 0 )
            {
                source = $("#photoSource").attr("value");
                path = source + "/" + (parseInt(id) + 1) + ".jpg";
            }
            else
            {
                path = $('#n' + (parseInt(id) + 1)).attr("rel");
            }          
            
            preloadElement.src = path; 
        }
    }
    
	prototype._changeMainImage = function( id )
	{
        var context = this;
        
        var mainPhoto = context._getMainPhoto();
        var galleryContainer = context._getGalleryContainer();
        
        var isPhotoVisible = ($(mainPhoto).css('opacity') == '1') ? true : false;
        
        id = id.substr( id.indexOf("n") + 1 );
        
        if ( $("#photoSource").length > 0 )
        {
            source = $("#photoSource").attr("value");
            path = source + "/" + id + ".jpg";
        }
        else
        {
            path = $('#n' + id).attr("rel");
        }
        
        loadingElement = new Image();
        
        loadingElement.onload = function() {
            loadingElement.onload = null;
            
            context._toggleLoading(false);
            
            if ( isPhotoVisible )
            $(galleryContainer).css('background', 'url(' + this.src + ') no-repeat');
            else
            mainPhoto.attr("src", this.src);
            
            if ( isPhotoVisible )
            $(mainPhoto).animate( {'opacity':0}, {}, context.preloadImage(id) );
            else
            $(mainPhoto).animate( {'opacity':1}, {}, context.preloadImage(id) );                   
        };
        
        context._toggleLoading(true);
        loadingElement.src = path;
	}
}