/* component Profile Album js-handler */

var componentProfileAlbum = function(items, img_screen_size) {
	this.items = {};

	this.items_number = 0;

	this.image_screen = $("profile_album_image_screen");

	$jq(this.image_screen).dblclick(function(event) {
		$jq("#profile_album_fullsize_btn").trigger('click', event);
	});

	var _self = this;

	this.fullsize_mode = false;

	this.key_listener_handler = function(event) {
		if (event.keyCode == 37 || event.keyCode == 38) { // switch previous
			var new_img_jq_list = $jq(_self.active_item.node).prev('img');
		} else if (event.keyCode == 39 || event.keyCode == 40) { // switch
																	// next
			var new_img_jq_list = $jq(_self.active_item.node).next('img');
		}

		if (new_img_jq_list && new_img_jq_list.length) {
			var new_img_num = new_img_jq_list.get(0).image_number;
		}

		if (new_img_num && _self.items[new_img_num]) {
			_self.selectItem(new_img_num);
		}
	};

	TB_onshow(function() {
		_self.fullsize_mode = true;

		$jq('img', _self.image_screen).remove();

		if ($("profile_album_image_rate_info") && $("profile_album_image_rate_block")) {
			$jq("#profile_album_image_rate_info ~ br:first").hide();
			$jq("#rate_block_div").css("display","none");
		}

		_self.image_screen._default_heigth = _self.image_screen.style.height;

		$jq(_self.image_screen).css( {
			width  : img_screen_size[0],
			height : (img_screen_size[1] - 350),
			backgroundImage : ''
		});

		$jq(document).keyup(_self.key_listener_handler);

		$jq(_self.image_screen).unbind('dblclick');

		var active_num = _self.active_item.number;
		// breaking the active item reference to successfully reload in-screen photo
		_self.active_item = null;
		_self.selectItem(active_num);
	});

	TB_onremove(function() {
		_self.fullsize_mode = false;

		$jq('img', _self.image_screen).remove();

		if ($("profile_album_image_rate_info") && $("profile_album_image_rate_block")) {
			$jq("#profile_album_image_rate_info ~ br:first").show();
			$jq("#rate_block_div").css("display","");
		}

		$jq(_self.image_screen).css( {
			width : 'auto',
			height : _self.image_screen._default_heigth
		});

		$jq(document).unbind('keyup', _self.key_listener_handler);

		$jq(_self.image_screen).dblclick(function(event) {
			$jq("#profile_album_fullsize_btn").trigger('click', event);
		});

		var active_num = _self.active_item.number;
		// breaking the active item reference to successfully reload in-screen photo
		_self.active_item = null;
		_self.selectItem(active_num);
	});

	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;

		$jq(this.items[number].node).mousedown(function() {
			_self.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) {
		var item = this.items[number], node = item.node;

		if (this.active_item && this.active_item.number != number) {
			$jq(this.active_item.node).removeClass('thumb_active');
		}

		if (!this.active_item || this.active_item.number != number) {
			$jq(node).addClass('thumb_active');

			$jq('img', this.image_screen).remove();

			var img = new Image;
			$jq(img).fadeOut(0).css( {
				position : 'absolute',
				left : '-3000px',
				display : 'none',
				width: '357px',
                                height: 'auto',
                             
				opacity : 1
			});
			
			$jq(img).load(function(event) {
					var img_height = this.height;
					var img_width  = this.width;
					
					var screen_height = _self.image_screen.style.height.substr( 0 , _self.image_screen.style.height.length - 2);
					var screen_width  = _self.image_screen.style.width.substr( 0 , _self.image_screen.style.width.length - 2);
										
					screen_height -=350; 
					if(img_height>=screen_height){
						img_height -=200;
					}
					
					if (img_height < screen_height) {
						if(navigator.appName=='Microsoft Internet Explorer') {
						    $jq(this).css('margin-top',	( ( (screen_height - img_height) / 2) ) + 'px');
						}else{
							$jq(this).css('margin-top',	( ( (screen_height - img_height) / 2) + 150 ) + 'px');
						}
					}

					$jq('#TB_load').remove(); // remove loader

					$jq(this).fadeIn(300).css( {
						position : '',
						left : ''
					});
					
			});

			if (this.fullsize_mode) {
				$jq('#TB_load').remove(); // remove existing loader
				$jq("body").append(	"<div id='TB_load'><img src='" + imgLoader.src + "' /></div>");// add loader to the page
				$jq('#TB_load').show();// show loader

				img.src = node.src.replace(/\/pr_photo_/, '/pr_photo_fullsize_');
			} else {
				img.src = node.src;
			}

			$jq(this.image_screen).append(img);

			img = null;

			if ($jq.browser.mozilla && this.fullsize_mode) {
				node.scrollIntoView();
			}
		}

		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);

		// breaking the active item reference to successfully reload in-screen photo
		_self.active_item = null;

		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;

		node.point_amount = i;

		$jq(node).hover(function() {
			_self.highlightRatePoint(this.point_amount);
		}, function() {
			_self.highlightRatePoint(0);
		}).click(function() {
			_self.submitRatePhoto(this.point_amount);
			return false;
		});

		this.rate_points[i] = node;
		this.rate_points.length++;

		node = null;
	}

	// initialing photo items
	for ( var i in items)
		this.registerItem(i, items[i]);

	// selecting active 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 = '';
};