$.extend({
	_enc_div: null,
	htmlenc: function(val) {
		if (this._enc_div == null) this._enc_div = $('<div />');
		this._enc_div.text(val);
		return this._enc_div.html().replace("\n", "<br />");
	},
	htmldec: function(val) {
		if (this._enc_div == null) this._enc_div = $('<div />');
		this._enc_div.html(val);
		return this._enc_div.text();
	},
	preload_images: function(images, pointer, callback) {
		if (images.length > pointer) {
			$('<img />').load(function() {
				$.preload_images(images, pointer + 1, callback);
			}).attr('src', images[pointer]);
		} else {
			callback();
		}
	}
});

var lock = false;

$(function() {
	if (lock) return;
	lock = true;

	// menu events
	var $menu_about_obj			= $( '#menu_about' ); 
	var $menu_work_obj			= $( '#menu_work' ); 
	var $navigation_prev_obj	= $( '#navigation_prev' ); 
	var $navigation_next_obj	= $( '#navigation_next' );
	var $navigation_paging_objs	= $( '#navigation_paging li' );
	var $media_container_obj	= $( '#media_container' );
	var $media_view_obj			= $( '#media_view' );
	
	function on_resize() {
		var $media_view_obj			= $( '#media_view' );
		var $container_obj			= $( '.container' );

		var viewport_width 			= $(window).width();
		var container_width			= $container_obj.width();
		var mediaview_width			= null;
		
		if ( viewport_width < container_width ) {
			mediaview_width			= container_width - 35;
		}
		else {
			mediaview_width			= viewport_width - 70;
		}
			
		$media_view_obj.width( mediaview_width );
	}

	on_resize();
	$(window).resize( on_resize );
	
	var current_work_id			= null;
	
	var works					= data.works;
	
	var media_path				= data.settings.media_root + 'images/';
	
	for ( i in works ) {
		var work				= works[i];
		
		var work_id				= work.id;
		var work_uid			= work.img_uid;
		var work_ext			= work.img_ext;
		var work_text			= work.body;
		
		var work_path			= media_path + work_id + '/' + work_uid + '/normal.' + work_ext;
		
		var $work_entry_obj		= $( '<td/>' ).attr( 'id', 'work_entry_' + i ).css( 'opacity', 0.1 );
		
		var $work_picture_obj	= $( '<img/>' ).attr( 'id', 'work_picture_' + i ).attr( 'src', work_path ).css( 'padding-bottom', '10px' );
		$work_picture_obj.click(
			function ( event ) {
				var work_id		= get_obj_id( this, 'work_picture' );

				if ( work_id == current_work_id ) {
					// clicked on current work, calculate at which side (right or left) and show prev/next according to that
					var this_width			= $(this).width();
					var this_offset_x		= $(this).offset().left;
					var event_x				= event.layerX;
					
					if ( event_x === undefined ) {
						// Opera, IE
						event_x				= event.offsetX;
					}
					
					var prev_work_id		= work_id - 1;
					var next_work_id		= work_id + 1;
					
					if ( event_x * 2 < this_width ) {
						if ( prev_work_id >= 0 ) {
							show_work( prev_work_id );
						}
					}
					else if ( next_work_id < works_total ) {
						show_work( next_work_id );
					}
				}
				else {
					// clicked on some of next works, show it
					show_work( work_id );
				}
			}
		);
		var $work_text_obj		= $( '<div/>' ).html( work_text );
		
		$work_entry_obj.append( $work_picture_obj );
		$work_entry_obj.append( $work_text_obj );
		
		$media_container_obj.append( $work_entry_obj );
	}

	var works_total				= data.works_total;
	var works_per_page			= data.works_per_page;
	
	show_work( 0 );
	
	function get_obj_id( obj, prefix ) {
		var id;
		
		if ( obj && prefix ) {
			var pattern			= new RegExp( prefix + '_(\\d+)' );
			id					= parseInt( pattern.exec( obj.id )[1] );
		}
		
		return id;
	}
	
	$navigation_prev_obj.click(
		function () {
			var prev_work_id	= current_work_id - 1;
			
			if ( prev_work_id >= 0 ) {
				show_work( prev_work_id );
			}
			
			return false;
		}
	);
	
	$navigation_next_obj.click(
		function () {
			var next_work_id	= current_work_id + 1;
			if ( next_work_id < works_total ) {
				show_work( next_work_id );
			}
			
			return false;
		}
	);

	$navigation_paging_objs.click(
		function () {
			var page_id			= get_obj_id( this, 'work_page' );
			
			work_id				= page_id * works_per_page;
			
			show_work( work_id );
			
			return false;
		}
	);
	
	function get_work_page_id( work_id, works_per_page ) {
		if ( works_per_page ) {
			return Math.floor( work_id / works_per_page );
		}
		else {
			return null;
		}
	}
	
	function show_work( work_id ) {
		if ( current_work_id != work_id ) {
			function fade_in_work() {
				$work_obj.animate(
					{
						'opacity':	1
					}
				);
			}

			function move_works() {
				$container_obj.animate(
					{
						'margin-left':	new_work_left + 'px'
					},
					'slow',
					fade_in_work
				);
			}
			
			var page_id				= get_work_page_id( work_id, works_per_page );
		
			var $work_obj			= $( '#work_entry_' + work_id );
			var $old_work_obj		= $( '#work_entry_' + current_work_id );
			var $picture_obj		= $( '#work_entry_' + work_id + ' img' );
			var $old_picture_obj	= $( '#work_entry_' + current_work_id + ' img' );
			var $container_obj		= $( '#media_carousel' );

			var work_left		= $work_obj.offset().left;
			var container_left	= $container_obj.offset().left; 
			
			var new_work_left	= container_left - work_left;
			
			if ( current_work_id !== null ) {
				$old_work_obj.animate(
					{
						'opacity':	0.1
					},
					move_works
				);
			}
			else {
				fade_in_work();
				page_id			= 0;
			}
						
			current_work_id		= work_id;
			
			$( '#navigation_paging li' ).removeClass( 'selected' );
			$( '#work_page_' + page_id ).addClass( 'selected' );
		}
	}
	
	function select_menu_entry() {
		$(this).stop();
		$(this).animate( { 'borderBottomColor': '#000000' }, 'slow' );
	}
	
	function deselect_menu_entry() {
		$(this).stop();
		$(this).css( 'border-bottom-color', '#ffffff' );
	}
	
	$menu_about_obj.hover( select_menu_entry, deselect_menu_entry );
	$menu_work_obj.hover( select_menu_entry, deselect_menu_entry );
	
	$menu_about_obj.click(
		function () {
			$( '#menu_work' ).removeClass( 'selected' ).css( 'border-bottom-color', '#ffffff' );
			$(this).addClass( 'selected' );
			$(this).unbind('mouseenter mouseleave');
			$( '#menu_work' ).hover( select_menu_entry, deselect_menu_entry );

			$( '#work_page').hide();
			$( '#about_page').show();
			
			return false;
		}
	);
	
	$menu_work_obj.click(
		function () {
			$( '#menu_about' ).removeClass( 'selected' ).css( 'border-bottom-color', '#ffffff' );
			$(this).addClass( 'selected' );
			$(this).unbind('mouseenter mouseleave');
			$( '#menu_about' ).hover( select_menu_entry, deselect_menu_entry );

			$( '#about_page').hide();
			$( '#work_page').show();
			
			return false;
		}
	);
		
	// setup the ajax event handler for processing indicator
/*	$('#ajax_communication_indicator').ajaxStart(function() {
		  $(this).show();
	}).ajaxStop(function() {
		  $(this).hide();
	});*/
});