/*
 * Realityweb javascript functions
 * http://www.realityweb.nl
 *
 * Copyright 2010, Realityweb
 * Written by Bob Olde Hampsink
 */
 
// Projectobject
var project = {

	items : function(selector) {
			
		if($('.item').eq(selector).size()) {
			$('.seperator').eq(selector).fadeIn(100);
			$('.item').eq(selector).fadeIn(100, function() {
				project.items(selector + 1);
			});	
		} else {
			project.show(0);
			return false;
		}	
	
	},
	
	show : function(selector) {
				
		if($('.item').eq(selector).size()) {
			$('.item').eq(selector).animate({
				opacity: 0
			}, 100, function() {
				$(this).css('background', 'url(' + $(this).data('image') + ') no-repeat top center');
				$(this).animate({
					opacity: 0.6
				}, 200, function() {
					$(this).animate({
						opacity: 0.1
					}, 600, function() {
						$(this).attr('data-loaded', 'true');
					});
					project.show(selector + 1);
				});
			});	
		} else {
			return false;
		}	
	
	},
}
 
// Scrollobject
var scroll = {

	horizontal : {
	
		active : false,
		
		start : function() {
		
			if(!scroll.horizontal.active) {
		
				$('#projects').mousedown(function(event) {
			    	$(this).data('down', true).data('x', event.clientX).data('scrollLeft', this.scrollLeft);
					return false;
				}).mouseup(function(event) {
					$(this).data('down', false);
				}).mousemove(function(event) {
					if($(this).data('down') == true) {
						this.scrollLeft = $(this).data('scrollLeft') + $(this).data('x') - event.clientX;
					}
				}).mousewheel(function(event, delta) {
					this.scrollLeft -= (delta * 40);
				});
			
				scroll.horizontal.active = true;
				
			}		
		
		},
		
		stop : function() {
		
			$('#projects').unbind();
			
			scroll.horizontal.active = false;
		
		}
	
	}

}

$(function() {

	// Hoveranimaties bij ingeladen items en de klikactie
	$('.item[data-loaded]').live('mouseover', function() {
		if(!$(this).data('init')) {  
			$(this).data('init', true);  
			$(this).hoverIntent(function() {  
				scroll.horizontal.start();
				if($(this).width() == 202) {
					$(this).animate({
						opacity: 0.6
					}, 500);
				}
			}, function() {
				if($(this).width() == 202) {
					$(this).animate({
						opacity: 0.1
					}, 300);
				}
			});
			$(this).trigger('mouseover');
		} 		
	}).live('click', function() {
		$item = $(this);
		if($(this).width() == 202) {
			$(this).find('.open').hide();
			$('.item').not($(this)).animate({
				width: 202,
				opacity: 0.1
			});
			$(this).animate({
				width: 600,
				opacity: 1
			}, 500, function() {
				$(this).find('.open').fadeIn();
			});
			scroll.horizontal.stop();
		} else {
			$(this).find('.open').hide();
			$(this).animate({
				width: 202,
				opacity: 0.1
			}, 300);		
		}
	});
	
	$(window).mouseout(function (event) {
		if($('#projects').data('down')) {
			try {
				if(event.originalTarget.nodeName == 'BODY' || event.originalTarget.nodeName == 'HTML') {
					$('#projects').data('down', false);
				}                
			} catch (e) {}
		}
	});
		
	// Contactgegevens laten zien
	$('#contactgegevens').click(function() {
		if(!$('#contactlarge').is(':visible')) {
			$('#projects').animate({
				left: '810px'
			}, 1000, function() {
				$('#contactlarge').fadeIn(function() {
					$('#map').gMap({
						markers: [{ 
							address : 'Vondelstraat 12 Tubbergen, Nederland',
							icon : {
								image: 'images/maps.png',
								iconsize: [57, 46],
								iconanchor: [12,46],
								infowindowanchor: [12, 0]
							}
						}],
					    address: 'Vondelstraat 12 Tubbergen, Nederland',
					    zoom: 12
					});				
				});
			});
		} else {
			$('#contactlarge').fadeOut(function() {
				$('#projects').animate({
					left: '202px'
				}, 1000);	
			});	
		}
	});
	
	// Oneindig doorscrollen
	$('#projects').scroll(function() {
		if(($('.item:last').offset().left + 204) == $(window).width()) {
			$('#content').width(($('#content').width()*2)).append($('#content').html());
		}
	});
	
	// Scrollgebied aanpassen aan browserschermgrootte
	$('#projects').width(($(window).width() - 202));
	
	// Bij resize moet alles opnieuw ingesteld worden
	$(window).resize(function() {
		$('#projects').unbind('scroll').scroll(function() {
			if(($('.item:last').offset().left + 204) == $(window).width()) {
				$('#content').width(($('#content').width()*2)).append($('#content').html());
			}
		});
		$('#projects').width(($(window).width() - 202));	
	});
	
	$('#thisisreality').click(function() {
		$('body').append('<embed src="audio/thisisreality.mp3" loop="false" hidden="true" autostart="true"></embed>');
		$(this).unbind('click');
	});
	
	// Scrollfunctionaliteit initialiseren
	scroll.horizontal.start();
	
	// Twittergegevens inladen
	$.getJSON('http://api.twitter.com/1/statuses/user_timeline.json?screen_name=realitywebnl&count=1&callback=?', function(data) {
		var date = new Date();
		if(/msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent)) {	
			var created = data[0].created_at.replace(' +0000', ',');
		} else {
			var created = data[0].created_at;	
		}
		var time = Math.round((date.getTime() - Date.parse(created))/3600000);
		if(time < 1) {
			$('#twittertime').html('minder dan 1 uur geleden');
		} else if(time < 24) {
			$('#twittertime').html(time + ' uur geleden');
		} else if(time < 48) {
			$('#twittertime').html('1 dag geleden');
		} else {
			$('#twittertime').html((Math.round(time/24)) + ' dagen geleden');
		} 
		$('#twitterstatus').html(data[0].text);
	});
	
	// Projectinfo inladen
	$.ajax({
		cache: false,
		url: 'projects.xml',
		dataType: 'xml',
		success: function(xml) {
			var load = new Array();
			$(xml).find('item').each(function(index) {
				$('#content').append('<div class="item" style="background: url(images/loading.gif) no-repeat center" data-image="' + $(this).find('image').text() + '"><div class="open"><a href="' + $(this).find('url').text() + '" target="_blank"></a></div></div><div class="seperator"></div>');
				$('#content').width(($('.item').size() * 204));
 				load[index] = new Image(); 
  				load[index].src = $(this).find('image').text();
			});
			setTimeout(function() {
				project.items(0);
			}, 400);
		}
	});
	
});