var portfolio_data_path = '/json/portfolio/';

		$(function() {
			$('#image-info').hide();
			$('.image-info-btn').click(function(e) {
				e.preventDefault();
				$('#image-caption').slideToggle();
			});
			
			var photos = [];
			var current = parseInt($('#image-info').attr('data-id'));
						
			$.getJSON(portfolio_data_path, function(data) {
				photos = data['photos'];
				$('#image-info').show(500);
				$('#image-info').mouseenter(function() {
					$(this).animate({opacity: .9}, 500);
				});

				$('#image-info').mouseleave(function() {
					$(this).animate({opacity: .8}, 500);
				});
			})
			

			
			$('#image-control #next').click(function(e) {
				e.preventDefault();
				if(photos.length > 0) {
					current = ((photos.length-1) > current) ? current+1 : 0;
					jump(current);
				}
			})
			
			$('#image-control #prev').click(function(e) {
				e.preventDefault();
				if(photos.length > 0) {
					current = current-1 >= 0 ? current-1 : photos.length-1;
					jump(current);
				}
			})
			
			$('#image-control #rand').click(function(e) {
				e.preventDefault();
				if(photos.length > 0) {
					current = rand(photos, current);
					jump(current);
				}
			})
			
			// hide content
			$('#hide-show a.hide-button').click(function(e) {
				e.preventDefault();
				$('#main').slideToggle(function() {
					if($('#main').is(':hidden')) {
						
						$('#hide-show a.hide-button').toggle().html('↓ Show').toggle();
					} else {
						$('#hide-show a.hide-button').toggle().html('↑ Hide').toggle();
					}
				});
			});
			
			
			// hotkeys
			
			var scroll_index = -1;
			var scroll_items = $('.website');
			
			$(document).bind('keydown', {combi:'j'}, function(e){
				e.preventDefault();
				if(scroll_index < scroll_items.length-1) {
					scroll_index++;
					$.scrollTo(scroll_items[scroll_index], 500);
				}	
				console.log(scroll_index);
			});
			
			// window binding is ugly workaround for browser bugs
			$(window).bind('keydown', {combi:'k'}, function(e){
				e.preventDefault();
				if(scroll_index == 0) {
					scroll_index = -1;
					$.scrollTo('#container', 500);
				} else {
					scroll_index--;					
					$.scrollTo(scroll_items[scroll_index], 500);
				}
				console.log(scroll_index);
			});
			
			
			function jump(id) {
				$('body').css('background-image', 'url(/images/'+photos[id].img+')');
				$('#image-caption h3').text(photos[id].title);
				var caption = photos[id].caption;
				if(photos[id].photo_credit) {
					caption = caption + ' <cite>(photo: '+photos[id].photo_credit+')</cite>';
				}
				$('#image-caption .caption').html(caption);
				$('#image-caption .flickr-link a').attr("href", photos[id].flickr_url);
			}
			
			function rand(array, id) {
				var new_id = id;
				while(new_id == id) {
					new_id = Math.floor(Math.random()*array.length);
				}
				return new_id;
			}
			
			
		});