var pageshift = 0;

$(document).ready(function () {
	$('#title').css('top', '100px');
	relocate();
	$('#hidden').html($('#textdivcontents').html());
	$('#buttonframe').css({'opacity': '1', 'overflow': 'visible'});
	$('#textdivcontents').empty();
	attachMouseovers();
	attachClicks();
	$('#textdiv').css({'position': 'absolute', 'top': '150px'}).fadeOut(0);
});

function relocate() {
	$('#btn_gov').parent().css({'top' : '0', 'left' : '0'});
	$('#btn_nov').parent().css({'top' : '0', 'left' : '380px'});
	$('#btn_och').parent().css({'top' : '130px', 'left' : '0'});
	$('#btn_ala').parent().css({'top' : '130px', 'left' : '380px'});
	$('#btn_lng').parent().css({'top' : '260px', 'left' : '0'});
	$('#btn_pro').parent().css({'top' : '260px', 'left' : '380px'});
	$('#btn_q').parent().css({'top' : '390px', 'left' : '190px'});
}

function attachMouseovers() {
	$('div.col1')
		.bind('mouseover', function() {
			if (!pageshift) {
				$(this).stop().animate({width: '350px'}, 500);
			} else {
				$(this).not('.current').stop().animate({left: '0'}, 500);
			}
		})
		.bind('mouseout', function() {
			if (!pageshift) {
				$(this).stop().animate({width: '300px'}, 500);
			} else {
				$(this).not('.current').stop().animate({left: '-300px'}, 500);
			}
		});
	$('div.col2')
		.bind('mouseover', function() {
			if (!pageshift) {
				$(this).stop().animate({width: '350px'}, 500);
			} else {
				$(this).not('.current').stop().animate({left: '0'}, 500);
			}
		})
		.bind('mouseout', function() {
			if (!pageshift) {
				$(this).stop().animate({width: '300px'}, 500);
			} else {
				$(this).not('.current').stop().animate({left: '-300px'}, 500);
			}
		});
}

function attachClicks() {
	$('div.button img')
		.bind('click', function() {
			if (pageshift == 0) {
				pageshift = 1;
				$('#title').animate({top: '20px'}, 750);
				var thisid = $(this).attr('id');
				$('div.button img').each(function(i) {
					if (thisid != this.id) {
						$(this).parent().animate({left: '-3000px'}, 750);
					} else {
						$(this).parent().css({'width': '300px', 'z-index': '0'}).animate({top: '-100px', left: '0', opacity: '.5'}, 750).addClass('current');
					}
				});
				var newcontents = $('#hidden div[title="' + $(this).attr('title') + '"]').html();
				$('#textdivcontents').html(newcontents);
				$('#textdiv').css('height', $('#hidden div[title="' + $(this).attr('title') + '"]').height() + 30 + "px");
				$('#textdiv').fadeIn(750);
				window.setTimeout(function() {
					$('div.button').not('.current').each(function(i) {
						$(this).fadeOut(0).css({position: 'fixed', left: '-300px', width: '350px', top: i * 110 + 50 + 'px', 'z-index': '11'}).fadeIn(400 * (i+1));
					});
				}, 1000);
			} else {
				$('div.button').animate({left: '-3000px'}, 750);
				$('div.current').removeClass('current').css({opacity: '1', 'z-index': '11'});
				var carryover = $(this);
				window.setTimeout(function() {
					carryover.parent().addClass('current').css({position: 'absolute', left: '-3000px', top: '50px', 'z-index': '0', width: '300px'}).animate({top: '-100px', left: '0', opacity: '.5'}, 750);
					var current = $(this).parent();
					$('div.button').not('div.current').each(function(i) {
						$(this).fadeOut(0).css({position: 'fixed', left: '-300px', width: '350px', top: i * 110 + 50 + 'px'}).fadeIn(400 * (i+1));
					});
				}, 1000);
				$('#textdiv').animate({height: $('#hidden div[title="' + $(this).attr('title') + '"]').height() + 30 + "px"}, 1000);
				var newcontents = $('#hidden div[title="' + $(this).attr('title') + '"]').html();
				$('#textdivcontents').fadeOut(500, function() {$(this).html(newcontents).fadeIn(500)});
			}
			window.setTimeout(function() {
				$('div.button').not('.current').each(function() {
					//alert($(this).css('opacity'));
					if($(this).css('opacity') != 1) {
						$(this).css('opacity', '1');
					}
				});
			}, 3000);
		});


	$('#title img')
		.bind('click', function() {
			pageshift = 0;
			$('#title').animate({top: '100px'}, 750);
			$('div.row1').css({position: 'absolute', width: '300px', left: '-3000px'}).each(function(i) {
				$(this).animate({left: $(this).hasClass('col1') ? '0' : '380px', top: '0', opacity: '1'}, 1000);
				var carryover = $(this);
				window.setTimeout(function() {
					carryover.css({left: carryover.hasClass('col1') ? '0' : '380px', top: '0', opacity: '1'});					   
				}, 1200);
			});
			$('div.row2').css({position: 'absolute', width: '300px', left: '-3000px'}).each(function(i) {
				$(this).animate({left: $(this).hasClass('col1') ? '0' : '380px', top: '130px', opacity: '1'}, 1000);
				var carryover = $(this);
				window.setTimeout(function() {
					carryover.css({left: carryover.hasClass('col1') ? '0' : '380px', top: '130px', opacity: '1'});					   
				}, 1200);
			});
			$('div.row3').css({position: 'absolute', width: '300px', left: '-3000px'}).each(function(i) {
				$(this).animate({left: $(this).hasClass('col1') ? '0' : '380px', top: '260px', opacity: '1'}, 1000);
				var carryover = $(this);
				window.setTimeout(function() {
					carryover.css({left: carryover.hasClass('col1') ? '0' : '380px', top: '260px', opacity: '1'});					   
				}, 1200);
			});
			$('div.row4').css({position: 'absolute', width: '300px', left: '-3000px'}).each(function(i) {
				$(this).animate({left: '190px', top: '390px', opacity: '1'}, 1000);
				var carryover = $(this);
				window.setTimeout(function() {
					carryover.css({left: '190px', top: '390px', opacity: '1'});					   
				}, 1200);
			});
			$('div.current').removeClass('current');

			$('#textdiv').fadeOut(750);
		});
}