$(document).ready(function() {          



	/**
	 * Menu Accordion
	 */
	$('#work').accordion({ 
	    active: false, 
	    header: '.head', 
	    navigation: true, 
	    event: 'click',  
	    animated: 'easeslide',
	    clearStyle: true,
		autoHeight: false
	});



    /**
	 * Preview preloader
	 * 
	 * loading preview thumbnails
	 */
	$('ul#work li ul li a').bind('loadstart', function() {
		$('#preview').html('<p class="status">Loading thumbs</p>');
	});             

	$('ul#work li ul li a').bind('loadcomplete', function(event, data) {
		var list = '<ul class="thumbs">';
		for (var i=0; i < data.images.length; i++) {
			list += '<li><img src="'+ data.images[i] +'" alt="preview" /><p class="caption">'+ $($('ul#work li ul li a')[i]).html() +'</p></li>';
		};
		list += '</ul>';
		$('#preview').html(list);
		$('ul.thumbs').cycle({
			fx: 'scrollHorz',
			timeout:  0,
			speed:    500,
			before: function() {
				$('ul.thumbs p').hide();
			},
			after: function() {
				$('ul.thumbs p').fadeIn();
			}
		}); 
	});

	$('ul#work li ul li a').imageQueue({attribute:'rel'}).load(0);

	$('#work li ul li a').hover(function(event) {
		$('ul.thumbs').clearQueue().cycle( $('#work li ul li a').index(this) );
	}, function(event) {
		$('ul.thumbs').delay(2500).queue(function() {
			$(this).cycle( $('#slideshow').data('index') );
			$(this).dequeue();
		});
	});



    /**
	 * Work loading and slideshow
	 */                             
	$('#slideshow').data('index', 0);
	$('#work li ul li a').click(function(event) {
		event.preventDefault();
		$(this).parent().parent().parent().parent().find('li').removeClass('active');
		//console.log( $(this).parent().parent().parent().parent().find('a') );
		$(this).parent().addClass('active');
		$('ul.images').cycle('destroy');
		$('#slideshow').data('index', $('#work li ul li a').index(this) );
		var slug = $(this).attr('href').substr(5);
		//$('ul.images').hide();
		$('ul.images').html('');
		$('p.status').html('0/0');
		var loadingClass = 'loading_'+Math.floor(Math.random()*2);
		if($('#slideshow p.status').length === 0 ) {
			$('ul.images').after('<p class="status"></p>');
		}else {
			$('#slideshow p.status').show();
		}
		$('ul.images').after('<div class="loading '+ loadingClass +'"></div>');

		$.ajax({
			url: 'work/' + slug, // +'.json',
			//dataType: 'json',
			error: function(error, string) {
				// console.log(string);
			},
			success:  function(html) {
				// change asual address
				$.address.value('work/' + slug);
				
				var images = $(html).find('img');
				var listArray = $(html).toArray();
				var count = listArray.length;
				$('div#slideshow p.status').html('0/'+ images.length);
				images.bind('loadprogress', function(event, data) {
					$('div#slideshow p.status').html(data.index +'/'+ data.max);
				});
				images.bind('loadcomplete', function() {

					// remove loading             
					images.unbind('loadprogress');
					images.unbind('loading');

					$('div#slideshow div.loading').remove();
					$('div#slideshow p.status').hide();
					$('div#slideshow #next,div#slideshow #previous').remove();

					// add nex / previous button                               
					$('div #slideshow').prepend('<a href="#" id="previous">Previous</a>').parent().find('#previous').hover(function() {
						$(this).removeClass('hidden').addClass('visible');
					}, function() {
						$(this).removeClass('visible').addClass('hidden');
					}); 

					$('div #slideshow').prepend('<a href="#" id="next">Next</a>').parent().find('#next').hover(function() {
						$(this).removeClass('hidden').addClass('visible');
					}, function() {
						$(this).removeClass('visible').addClass('hidden');
					});

					$('ul.images').html('');

					var slide = $(listArray.pop());
					$('ul.images').prepend('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					slide = $(listArray.shift());;
					$('ul.images').append('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					slide = $(listArray.shift());
					$('ul.images').append('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					//$('ul.images').show('slow');

					function onBefore(curr, next, opts, fwd) {

						$('ul.images p.caption').hide();

						// on Before arguments: 
						//  curr == DOM element for the slide that is currently being displayed 
						//  next == DOM element for the slide that is about to be displayed 
						//  opts == slideshow options 
						//  fwd  == true if cycling forward, false if cycling backward 

						// on the first pass, addSlide is undefined (plugin hasn't yet created the fn yet) 
						if (!opts.addSlide) {
							return;
						}

						// have we added all our slides?
						if (opts.slideCount == count) {
							return;
						}

						// shift or pop from our slide array  
						var nextSlide = fwd ? $(listArray.shift()) : $(listArray.pop()); 

						// add our next slide 
						opts.addSlide('<li><img src="'+ nextSlide.find('img').attr('src') +'" /><p class="caption">'+ nextSlide.find('p').html() +'</p></li>', fwd == false);
					};






					$('ul.images').cycle({
						fx: 'scrollHorz',
						startingSlide: 1,
						timeout:  0,
						speed:    1200,
						prev:    '#previous',
						next:    '#next',
						before:   onBefore,
						easeOut: 'easeOutCirc',
						easeIn: 'easeOutCirc',
						after: function() {
							$('ul.images p.caption').fadeIn();
						}
					});

					$(document.documentElement).keyup(function (event) {
						// keypress right
						if (event.keyCode == 37) {
							$('#previous').click();
						// keypress right
						} else if (event.keyCode == 39) {
							$('#next').click();
						}
					});



				});
				images.imageQueue().load(0);
			}
		}); 

		return false;
	});



    /**
	 * slideshow home
	 */ 
	$('ul.images').cycle({
		fx: 'scrollLeft',
		startingSlide: 1,
		timeout: 8000,
		speed: 1200,
		easeOut: 'easeOutCirc',
		easeIn: 'easeOutCirc',
		after: function() {
			$('ul.images p.caption').fadeIn();
		}
	});


	/**
	 * Address
	 */
	/*
	if ($.address.value() == '') {
		$.address.value(overview);
	}
	*/
	
	// Address handler
	$.address.init(function(event) {
	}).change(function(event) {
		if(event.value == '' || event.value == '/') {
			return;
		}
		event.preventDefault();

		var href = event.value.substr(1); 
		$.address.title( $('ul#work li ul a[href="'+ href +'"]').text() );
    }).externalChange(function(event) {

		if(event.value == '' || event.value == '/') {
			return;
		}
		event.preventDefault();
		$('ul.images').cycle('destroy');
		$('#slideshow').data('index', $('#work li ul li a').index(this) );
		$('ul.images').html('');
		$('p.status').html('0/0');
		var loadingClass = 'loading_'+Math.floor(Math.random()*2);
		if($('#slideshow p.status').length === 0 ) {
			$('ul.images').after('<p class="status"></p>');
		}else {
			$('#slideshow p.status').show();
		}
		$('ul.images').after('<div class="loading '+ loadingClass +'"></div>');

		$.ajax({
			url: event.value, // +'.json',
			//dataType: 'json',
			error: function(error, string) {
				// console.log(string);
			},
			success:  function(html) {
				// change asual address
				//$.address.value('work/detail/' + slug);
				
				var images = $(html).find('img');
				var listArray = $(html).toArray();
				var count = listArray.length;
				$('div#slideshow p.status').html('0/'+ images.length);
				images.bind('loadprogress', function(event, data) {
					$('div#slideshow p.status').html(data.index +'/'+ data.max);
				});
				images.bind('loadcomplete', function() {

					// remove loading             
					images.unbind('loadprogress');
					images.unbind('loading');

					$('div#slideshow div.loading').remove();
					$('div#slideshow p.status').hide();
					$('div#slideshow #next,div#slideshow #previous').remove();

					// add nex / previous button                               
					$('div #slideshow').prepend('<a href="#" id="previous">Previous</a>').parent().find('#previous').hover(function() {
						$(this).removeClass('hidden').addClass('visible');
					}, function() {
						$(this).removeClass('visible').addClass('hidden');
					}); 

					$('div #slideshow').prepend('<a href="#" id="next">Next</a>').parent().find('#next').hover(function() {
						$(this).removeClass('hidden').addClass('visible');
					}, function() {
						$(this).removeClass('visible').addClass('hidden');
					});

					$('ul.images').html('');

					var slide = $(listArray.pop());
					$('ul.images').prepend('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					slide = $(listArray.shift());;
					$('ul.images').append('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					slide = $(listArray.shift());
					$('ul.images').append('<li><img src="'+ slide.find('img').attr('src') +'" /><p class="caption">'+ slide.find('p').html() +'</p></li>');
					//$('ul.images').show('slow');

					function onBefore(curr, next, opts, fwd) {

						$('ul.images p.caption').hide();

						// on Before arguments: 
						//  curr == DOM element for the slide that is currently being displayed 
						//  next == DOM element for the slide that is about to be displayed 
						//  opts == slideshow options 
						//  fwd  == true if cycling forward, false if cycling backward 

						// on the first pass, addSlide is undefined (plugin hasn't yet created the fn yet) 
						if (!opts.addSlide) {
							return;
						}

						// have we added all our slides?
						if (opts.slideCount == count) {
							return;
						}

						// shift or pop from our slide array  
						var nextSlide = fwd ? $(listArray.shift()) : $(listArray.pop()); 

						// add our next slide 
						opts.addSlide('<li><img src="'+ nextSlide.find('img').attr('src') +'" /><p class="caption">'+ nextSlide.find('p').html() +'</p></li>', fwd == false);
					};






					$('ul.images').cycle({
						fx: 'scrollHorz',
						startingSlide: 1,
						timeout:  0,
						speed:    1200,
						prev:    '#previous',
						next:    '#next',
						before:   onBefore,
						easeOut: 'easeOutCirc',
						easeIn: 'easeOutCirc',
						after: function() {
							$('ul.images p.caption').fadeIn();
						}
					});

					/*
					$(document.documentElement).keyup(function (event) {
						// keypress right
						if (event.keyCode == 37) {
							$('#previous').click();
						// keypress right
						} else if (event.keyCode == 39) {
							$('#next').click();
						}
					});
					*/


				});
				images.imageQueue().load(0);
			}
		});
        
    }).history(true);


});


/**
 * Google Analytics
 */
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-4509416-16']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();