$(document.body).ready(function() {
	
	$('.project').click(getDetails);
	
	$(".paginator a").click(function() {
		var href = $(this).attr('href');
		
		last = href.substring(href.indexOf('page:'))
		href = href.substring(0, href.indexOf('page:'));
		
		$.getJSON(href + 'json/' + last, function(data) {
			alert(data);
		});
		
		//return false;
	});
	
	$(".menu .checked, .menu .checked").click(function() {
		$(this).toggleClass("checked").toggleClass("item");
				
		if($(this).hasClass('checked')) {
			$('.'+$(this).attr('id')).show();
		} else {
			$('.'+$(this).attr('id')).hide();
		}
		setSlider();
	});
	
	if($.browser.safari) {
		$('#search').replaceWith('<input type="search" autosave="search" results="0" id="search" onSearch="search()"/>');
	}
	$('#search').change(search);
});


$(window).load(function() {
	setSlider();
});
$(window).resize(function() {
	setSlider();
});

function setGroups () {
	
}

function setSlider() {
	
	$('.hidden').hide();
	
	$('#list').each(function () {
		
		var ul = $('.projects', this);
		
		ul.css('position', 'relative');
		
		self = $('.project:visible', this);
		$(self).each(function (i) {
			
			//console.log(i * $(this).outerWidth({ margin: true }));
			
			$(this).css({
				'position' : 'absolute',
				'left'		: (i * $(this).outerWidth({ margin: true }))
			})
		})
		
		var productWidth = self.length * self.outerWidth({ margin: true });
		var scrollWidth = productWidth - $(this).outerWidth() - 10
		scrollWidth = Math.max(scrollWidth, 0);
		
		$('.slider .group').hide();
		groups = $('.projects .group:visible', this);
		$(groups).each(function (i) {
			var x = parseInt($('.'+$(this).attr('id')).css('left'));
		
			$(this).css({
				'position' : 'absolute',
				'left'		: x
			})
						
			$('.slider .'+$(this).attr('id'))
			.show()
			.css({
				'position' : 'absolute',
				'left'		: ( x / productWidth ) * ($('.slider').innerWidth()) 
			});
		})
		
		$('.slider', this).slider("destroy");
		
		var max = $('.slider', this).innerWidth();
		
		$('.slider .handle', this).width( Math.min( ( $(this).outerWidth() / productWidth) * max, max));
		
		var animation;
		
		var slider = $('.slider', this).slider({ 
			handle: '.handle',
			min: 0, 
			max: scrollWidth, 
			slide: function (ev, ui) {
				if(animation) animation.stop();
				ul.css('left', '-' + ui.value + 'px');
			}, 
			stop: function (ev, ui) {
				//ul.animate({ 'left' : '-' + ui.value + 'px' }, 700, 'linear');
			},
			change: function(ev, ui) {
				animation = ul.animate({ 'left' : '-' + ui.value + 'px' }, 700, 'linear');
			}
		});
	});
}

function search() {
	
	$.getJSON(indexPath+$('#search').val(), function(data) {
		$("#list .projects").empty();
		
		createItems($("#list .projects"), data);
	});
	/*$('#list .project').each(function() {
		if($('h2', this).text().toLowerCase().indexOf($('#search').val().toLowerCase()) != -1 ||
			$('.hidden', this).text().toLowerCase().indexOf($('#search').val().toLowerCase()) != -1) {
			//$(this).fadeIn("slow", setSlider);
			$(this).show();
			setSlider();
		} else {
			//$(this).fadeOut("slow", setSlider);
			$(this).hide();
			setSlider();
		}
	});
	
	$('#list .group').each(function() {
		var id = $(this).attr('id');
		var group = $('.'+id);
				
		if(group.length == 0) {
			$('#'+id).hide();
		} else {
			$('#'+id).show();
		}
	})*/
}
function showItem(item) {
	if(item['type'] == "pdf" && !$.browser.safari) {
		item['type'] = 'image';
		item['url'] = item['path'];
		item['path'] = 'pdf.gif';
		$('.popup h3').show();
	} else {
		$('.popup h3').hide();
	}
	
	$('.popup h3').text(item['name']);
	
	$('.popup img').hide();
	$('.popup iframe').hide();
	$('.popup .embed').hide();
	
	if(item['type'] == "image") {
		$('.popup img').show()
		.attr('title', item['name'])
		.attr('alt', item['name'])
		.attr('src', filePath + item['path'])
		.load(function() {
			$('.popup').lightboxPos();
		});
		
		if(item['url'] != '') {
			if(item['url'].indexOf('http://') == -1) {
				url = filePath+item['url'];
			} else {
				url = item['url'];
			}
			$('.popup img').css('cursor', 'pointer').unbind('click').click(function() {
				window.open(url)
			});
		}
	} else if(item['type'] == "swf") {
		$('.popup .embed').show().find('embed').attr('src', filePath+ item['path']);
	} else {
		$('.popup iframe').show().attr('src', filePath+ item['path']);
	}
}

function createItems(root, items) {
	group = 0;
	
	for(i in items) {
		item = items[i];
		
		if(group != item['Group']['id']) { 
			group = item['Group']['id'];
			$('<div class="group client-'+
				item['Group']['client_id']+'" id="group-'+
				item['Group']['id']+'">'+
				item['Group']['name']+'</div>')
			.appendTo(root);
		}
		
		var div = $('<div class="project client-'+
			item['Group']['client_id']+' group-'+
			item['Group']['id']+'" id="'+
			item['Project']['id']+'"></div>')
		.appendTo(root)
		.click(getDetails);
		
		$('<div class="screen"><h2>'+item['Project']['title']+'</h2>'+
			'<img src="'+ imagePath + item['Project']['image'] + '" width="180" height="150" ></div>')
		.appendTo(div);
			
		$('<p><h4>Voor</h4>: '+
			'<span title="'+item['Client']['name']+'">'+
			item['Client']['short_name']+'</span></p><div class="hidden">'+
			item['Project']['text']+'</div>')
		.appendTo(div);
	}
	setSlider();
}

function getDetails() {
		$.getJSON(detailPath + $(this).attr('id'), function(data) {
			
			var current = 0;
			
			$('.popup h1').text(data['Project']['title']);
			if(data['Preview'] != '') {
				$('.popup .preview').show();
				$('.popup .navigator .count').text('1 van ' + data['Preview'].length)
				showItem(data['Preview'][0]);
			} else {
				$('.popup .preview').hide();
			}
			$('.popup p').html(data['Project']['text']);
			
			$('.popup').show().lightbox();
			
			if(data['Preview'].length > 1) {
				$('.popup .navigator').show();
				$('.popup .navigator .next').click(function() {					
					if(typeof(data['Preview'][current+1]) != 'undefined') {
						current++;
						$('.popup .navigator .count').text((current+1) + ' van ' + data['Preview'].length)
						showItem(data['Preview'][current]);
					}
				});
				$('.popup .navigator .back').click(function() {
					if(current != 0) {
						current--;
						$('.popup .navigator .count').text((current+1) + ' van ' + data['Preview'].length)
						showItem(data['Preview'][current]);
					}
				});
			} else {
				$('.popup .navigator').hide();
			}
		});
	}