$(function(){
	
	var $menu = $('#menu-main,#menu-lower'),
		$menu_li = $menu.find('> li'),
		$menu_follow = $('#menu-follow'),
		menu_follow_offset = ($menu_li.height() / 2) - ($menu_follow.height() / 2),
		menu_selected_offset_top = $menu.find('> .current-menu-item, > .current-menu-ancestor'),
		
		$two = $('#two'),
		$three = $('#three'),
		$four = $('#four'),
		$viewer = $('#viewer'),
		
		$lang = $('#lang'),
		
		viewer = false,
		viewer_img_width,
		viewer_img_height,
		viewer_img_margin_right,
		viewer_img_margin_top,
		
		$body = $('body'),
		
		$viewerClose = $('#viewerClose').text('Close photo gallery').click(function(){
						
			if (viewer === false) {
				return;	
			}
						
			$viewerClose.fadeOut(250,function(){
				
				$two.animate({
					width : 290
				},500);
		
				$three.animate({
					width : 220,
					left : 560
				},500);
				
				if ($four.hasClass('three') === true) {
					$four.animate({
						left : 800
					},500);
				} else {
					$four.animate({
						left : 580
					},500);
				}

			});
			
			viewer = false;
			
			change_hash();
	
		}),
		
		$viewerLoader = $('<img />').attr({
			id : 'viewerLoader',
			src : _template_url + '/img/viewer-loader.gif',
			atr : 'Loading...'
		}).hide(),
		
		_window = window,
		$window = $(_window),
		
		content_visible = true,

		hash = get_hash();

	//////////////////////////////////////////////////////////////////////////////////////

	setInterval(function(){
		var tmp_cache = get_hash();
		if (tmp_cache !== hash) {
			hash = tmp_cache;
			init();	
		}
	},500);

	//////////////////////////////////////////////////////////////////////////////////////

	if (menu_selected_offset_top.length > 0) {
		menu_selected_offset_top = menu_selected_offset_top.offset().top;
	} else {
		menu_selected_offset_top = false;
	}

	//////////////////////////////////////////////////////////////////////////////////////
	
	$four.find('a').click(function(){

		var $this = $(this),
			$viewerLoader;
	
		if (viewer === false) {

			$two.animate({
				width : 10
			},800,function(){
				show_image($this.attr('href'),$this.parent());
			});
			$three.animate({
				width : 10,
				left : 280
			},800);
			$four.animate({
				left : 310
			},800);
			viewer = true;
			
		} else {
			show_image($this.attr('href'),$this.parent());
		}
	
		change_hash('viewer='+($(this).parent().index() + 1));
		
		return false;
	});

	//////////////////////////////////////////////////////////////////////////////////////

	function init() {
		
		if (hash.match(/^viewer=\d+$/)) {
			
			var number = hash.split('=')[1] - 1;
			
			$four.find('li:eq('+number+') a').trigger('click');

		} else if (_home === true) {
			console.log('i am on home');
			if (hash === 'reveal') {
				
				hide_content();
				console.log('hide_content()');
				
				setTimeout(show_content,500);
				console.log('show_content()');
				
			} else if (hash === 'show') {
				
				change_lang_hash('show');
				
			} else {
				
				hide_content();
				
				$lang.find('li:not(:has(a))').click(show_content);
			}
		} else if (hash === '') {
			$viewerClose.trigger('click');
		}
	}
	
	init();

	//////////////////////////////////////////////////////////////////////////////////////
	
	if (content_visible === false) {
		change_lang_hash('reveal');
	}
	
	//////////////////////////////////////////////////////////////////////////////////////

	$window.resize(resize);
	resize();
	
	function resize() {
		
		//alert($window.width()+'x'+$window.height());

		var window_height = $window.height();

		if (navigator.userAgent.match(/iPad/)) {
			//var window_height = window_height + 74;
			//var window_height = window_height + 105;
		}
		
		var img_ratio = 1024 / 768,
			viewer_width = $window.width() - 270,
			viewer_height = window_height,
			viewer_ratio = viewer_width / viewer_height;
			
		if (navigator.userAgent.match(/iPad/)) {
			var img_ratio = 1024 / 768,
			viewer_width = $window.width() - 100,
			viewer_height = window_height,
			viewer_ratio = viewer_width / viewer_height;
		}	
			
		if (img_ratio > viewer_ratio) {
		
			viewer_img_width = 'auto';
			viewer_img_height = viewer_height;

			
			viewer_img_margin_right =  - (((viewer_height * img_ratio) - viewer_width) / 2);
			viewer_img_margin_top = 'auto';
			
		} else {
		
			viewer_img_width = viewer_width;
			viewer_img_height = 'auto';

			viewer_img_margin_right =  'auto';
			viewer_img_margin_top = 'auto';

			viewer_img_margin_top = -(((viewer_width / img_ratio) - viewer_height) / 2);

		}
		
		$viewer.find('img').css({
			width : viewer_img_width,
			height : viewer_img_height,
			marginRight : viewer_img_margin_right,
			marginTop : viewer_img_margin_top
		});
		
		if (content_visible === false) {
			$lang.css('bottom',$window.height()-253);
		}
	
	}

	//////////////////////////////////////////////////////////////////////////////////////
	
	if (menu_selected_offset_top) {
		$menu_follow.css({
			top : menu_selected_offset_top + menu_follow_offset,
			left : 0
		});
	} else {
		$menu_follow.css({
			top : 220,
			left : 0
		});
	}
	
	$menu_li.hover(function(){
		var offsetTop = $(this).offset().top;
		$menu_follow.stop(true).animate({
			top : offsetTop + menu_follow_offset,
			left : 0
		},600);
	},function(){
		if (menu_selected_offset_top) {
			$menu_follow.stop(true).animate({
				top : menu_selected_offset_top + menu_follow_offset,
				left : 0
			},1000);	
		} else {
			$menu_follow.stop(true).animate({
				top : 220,
				left : 0
			},1000);	
		}
	});
	
	
	//////////////////////////////////////////////////////////////////////////////////////
	
	function show_image(img,loaderContainer) {
		
		$four.find('li').removeClass('s');
		
		$viewerLoader.appendTo(loaderContainer.addClass('s')).show();
		
		$('<img />').attr({
			src : img
		}).css({
			width : viewer_img_width,
			height : viewer_img_height,
			marginRight : viewer_img_margin_right,
			marginTop : viewer_img_margin_top
		}).hide().appendTo($viewer).load(function(){
			$viewer.find('img:last').fadeIn(1000,function(){
				$viewer.find('img:first').remove();
				$viewerClose.fadeIn(400);
				$viewerLoader.hide();
			});
			
		});

	}
	
	//////////////////////////////////////////////////////////////////////////////////////

	function show_content(){

		if (hash === 'show') {
			return;	
		}

		$lang.animate({bottom:0},1000);
		
		$menu.slideDown(1000,function(){
			
			$menu_follow.css('left',-50).show().animate({
				left : 0
			});
			$two.width(0).show().animate({
				width : 290
			},1000);
			if ($three.length > 0) {
				console.log('three --> four');
				$three.css({
					width : 0,
					left : 270
				}).show().animate({
					width : 220,
					left : 560
				},1000,function(){
					$four.find('ul').fadeIn();
				});
			} else {
				window.setTimeout(function(){
					$four.find('ul').fadeIn();	
				},1000);
				
			}
		});

		content_visible = true;
	
		change_hash('show');
	
		change_lang_hash('show');
	}
	
	function hide_content() {
		$two.add($three).add($menu).add($menu_follow).add($four.find('ul')).hide();
		content_visible = false;
	}
	
	function change_hash(str) {
		if (!str) {
			str = '';	
		}
		_window.location.hash = str;
		hash = str;
	}
	
	function get_hash() {
		return _window.location.hash.substr(1);
	}
	
	function change_lang_hash(str) {
		$lang.find('a').each(function(){
			var $this = $(this);
			$this.attr('href',$this.attr('href').split('#')[0]+'#'+str);
		});
	}

});
