/* component Profile Album js-handler */

var componentProfileAlbum = function( items )
{
	this.items = {};
	
	this.items_number = 0;
	
	this.image_screen = $("profile_album_image_screen");
	
	this.image_description = $("profile_album_image_description_container");
	
	this.thumbs_container = $("profile_album_thumbs_container");
	
	
	this.registerItem = function( number, item )
	{
		this.items[number] = {
			id: item.id,
			number: number,
			html_description: item.html_description,
			publishing_status: item.publishing_status,
			user_rate_score: item.user_rate_score,
			rate_score: item.rate_score,
			rates: item.rates,
			node: $('profile_album_item_'+number),
			unlocked: item.unlocked
		};
		
		this.items[number].node.image_number = number;
		
		this.items[number].node.handler_object = this;
		
		
		this.items[number].node.onclick = function()
		{
			this.handler_object.selectItem( this.image_number );
		}
		
		this.items_number++;
	}
	
	
	this.pass_input_container = $("profile_album_pass_input_container");
	this.pass_input = $("profile_album_pass_input");
	
	this.pass_submit_btn = $("profile_album_pass_submit_btn");
	
	this.pass_submit_btn.handler_object = this;
	
	this.pass_submit_btn.onclick = function()
	{
		if ( !this.handler_object.pass_input.value )
		{
			this.handler_object.pass_input.focus();
			return;
		}
		
		xajax_getProfilePasswordProtectedPhoto( this.handler_object.active_item.id, this.handler_object.pass_input.value );
	}
	
	this.active_item = null;
	
	if ( $("profile_album_image_rate_block") )
		this.image_rate_block = $("profile_album_image_rate_block");
	else
	{
		this.image_rate_block = {
			
		};
	}
	
	this.selectItem = function( number )
	{
		if ( this.active_item )
			this.active_item.node.className = 'profile_album_thumb';
		
		
		var item = this.items[number];
		var node = item.node;
		
		node.className = 'profile_album_thumb_active';
		
		this.image_screen.style.backgroundImage = 'url('+node.src+')';
		
		if ( this.image_rate_block )
			this.fixRatePoint(item.user_rate_score);
		
		if ( item.publishing_status == 'password_protected' && !item.unlocked )
		{
			this.pass_input_container.style.display = 'block';
			
			this.image_rate_block.className = 'profile_album_image_rate_block_fixed';
			this.rate_fixed = true;
		}
		else if ( item.publishing_status == 'friends_only' && !item.unlocked )
		{
			this.image_rate_block.className = 'profile_album_image_rate_block_fixed';
			this.rate_fixed = true;
			
			this.pass_input_container.style.display = 'none';
		}
		else
		{
			this.pass_input_container.style.display = 'none';
		}
		
		
		this.image_description.innerHTML = (item.html_description) ? item.html_description : '<br />';
		
		if ( $("profile_album_image_rate_info") )
		{
			$("profile_album_image_average_score").innerHTML = item.rate_score;
			$("profile_album_image_rates").innerHTML = item.rates;
		}
		
		
		this.active_item = item;
		
		return;
	}
	
	
	this.selectFirstItem = function()
	{
		for ( var i in this.items )
			return this.selectItem( this.items[i].number );
		
		if ( $('profile_album_item_0') )
			this.image_screen.style.backgroundImage = 'url('+$("profile_album_item_0").src+')';
	}
	
	
	this.drawItem = function( number, url, item )
	{
		var old_node = this.items[number].node;
		var next_sib = old_node.nextSibling;
		
		old_node = this.thumbs_container.removeChild( old_node );
		
		var new_node = new Image();
		new_node.src = url;
		new_node.id = old_node.id;
		new_node.className = old_node.className;
		new_node.style.width = 'auto';
		
		this.thumbs_container.insertBefore( new_node, next_sib );
		
		this.registerItem( number, item );
		this.selectItem( number );
	}
	
	
	this.submitRatePhoto = function( score )
	{
		if ( this.rate_fixed )
			return;
		
		this.fixRatePoint( score );
		
		this.active_item.user_rate_score = score;
		
		xajax_ratePhoto( this.active_item.id, score, this.active_item.number );
	}
	
	
	this.rate_fixed = true;
	
	this.highlightRatePoint = function( point )
	{
		if ( this.rate_fixed )
			return;
		
		var className = point ? 'rate_point_on' : 'rate_point_off';
		
		for ( var i in this.rate_points )
		{
			if ( i == point )
			{
				this.rate_points[i].className = 'rate_point_active';
				className = 'rate_point_off';
				continue;
			}
			
			this.rate_points[i].className = className;
		}
		
		return;
	}
	
	
	this.fixRatePoint = function( score )
	{
		this.rate_fixed = false;
		this.highlightRatePoint( score );
		
		this.image_rate_block.className = ( score ) ? 'profile_album_image_rate_block_fixed' : 'profile_album_image_rate_block_free';
		
		this.rate_fixed = ( score ) ? true : false;
	}
	
	
	// constructing
	
	// initialing points
	this.rate_points = {};
	this.rate_points.length = 0;
	
	for ( var i = 1; true; i++ )
	{
		var node = $("profile_album_rate_point_"+i);
		
		if ( !node )
			break;
		
		this.rate_points[i] = node;
		this.rate_points[i].handler_object = this;
		this.rate_points[i].point_amount = i;
		
		node.onmouseover = function(){ return this.handler_object.highlightRatePoint(this.point_amount) }
		
		node.onmouseout = function(){ return this.handler_object.highlightRatePoint(0) }
		
		node.onclick = function(){ return this.handler_object.submitRatePhoto(this.point_amount) }
		
		this.rate_points.length++;
	}
	
	// initialing photo items
	for ( var i in items )
		this.registerItem( i, items[i] );
	
	
	// selecting item
	if ( /^\#photo_[\d]+$/.exec( location.hash ) )
	{
		var photo_id = location.hash.replace( /^\#photo_+/, '' );
		
		for ( var _number in this.items )
			if ( this.items[_number].id == photo_id )
				this.selectItem(_number);
		
		if ( !this.active_item )
			xajax_checkProfileAlbumPhoto( photo_id );
	}
	
	if ( this.items_number < 2 )
		this.thumbs_container.style.display = 'none';
	
	if ( !this.active_item )
		this.selectFirstItem();
	
	$("profile_album_container").className = '';
}