var wall = function(){

		var
			nav = false,
			item_width = 525,
			item_height = 325,
			rows = 1,
			columns = 5,
			items_per_page,
			page_width,
			total_page,
			current_page = 0,
			wall_angle = 0,
			wall_direction,
			wall_max_angle = 10,
			wall_interval,
			wall_speed = 0,
			wall_max_speed = 20,
			wall_width;

		function init(){
			// Calculate the columns and widths according to the window width
			columns = Math.floor($(window).width() / item_width);
			items_per_page = rows * columns;
			page_width = columns * item_width;
			total_page = Math.ceil($('li').size() / items_per_page);
			wall_width = page_width * total_page;
			
			// Position the LIs
			$('li').each(function(i){
				var current_page = Math.floor(i/items_per_page);
				$(this).css({
					'position': 'absolute',
					'top': i%rows * item_height,
					'left': ((Math.floor((i/rows)%columns))*item_width) + (current_page * page_width)
				});
			});
			
			// Display the nav
			if(nav){
				to_inject = "";
				for (var i=0; i < total_page; i++) {
					to_inject += '<a href="#">'+i+'</a> ';
				};
			
				$('.paging').html(to_inject);
			
				$('.paging a').each(function(i){
					$(this).click(function(){
						change_page(i)
						return false;
					});
				});
			}
			
			$('ul')
				.width(page_width-23)
				.height(item_height*rows);
			
			cached_value = 0;
			$('#slider').slider({
				slide: function(event,ui){
					wall_direction = (cached_value < ui.value) ? 1 : -1;
					wall_speed = cached_value - ui.value;
					cached_value = ui.value;

					$('li').each(function(i){
						var current_page = Math.floor(i/items_per_page);
						$(this).stop().animate({
							'left': ((Math.floor((i/rows)%columns))*item_width) + (current_page * page_width) - (ui.value*(page_width*(total_page-1))/100)
						});
					});
				},
				start: function(){
					wall_direction = 1;
					perspective();
				},
				stop: function(){
					wall_direction = 0;
				}
			});
		};
		
		function change_page(page){
			direction = (current_page < page) ? 1 : -1;
			page_diff = page - current_page;
			current_page = page;

			$('li').each(function(i){
				$(this).animate({
					'left': parseFloat($(this).css('left')) - (page_diff*page_width)
				});
			});
		};
		
		function perspective(){
			clearInterval(wall_interval);
			
			// Set an interval for the anim.
			wall_interval = setInterval(function(){
				if(wall_direction == 0){
					if(wall_angle > 0 || wall_angle < 0 ){
						wall_angle  = wall_angle/1.1;
						$('ul').css('-webkit-transform','rotateY('+(wall_angle*-1)+'deg)');
					}else{
						clearInterval(wall_interval);
					}
				}else{
					wall_target_angle = wall_speed * wall_max_angle / wall_max_speed;
					if(wall_direction > 0 && wall_angle > wall_target_angle) {
						wall_angle--;
					}else if(wall_direction < 0 && wall_angle < wall_target_angle){
						wall_angle++;
					}
					$('ul').css('-webkit-transform','rotateY('+(wall_angle*-1)+'deg)');
				}
			},20)
		}

		// Expose only the init function
		return {
			init: init
		};
}();
