$(window).load(function() {	
	var w_box=960, // box width 
		h_box=607, // box height
		p_box=60, // box paddings
		h_num=3; // number of horizontal
	var i=0;
	var act=[];
	if (location.hash.slice(0,3)=='#!/') {
		page=location.hash.slice(3);	
		open_page('#'+page, true);
	}
	if ((location.hash=='#')||(location.hash=='')) {
		page=$('.main > div').eq(0).attr('id')
		open_page('#'+page, true);
		location.hash='#!/'+page;
	}
	$('a').click(function(){
		if ($(this).attr('href').slice(0,3)=='#!/') {
			page=$(this).attr('href').slice(3);	
			open_page('#'+page, true);
			if ($('#'+page).attr('class')=='pop_up') { return false}
		}
		if ($(this).attr('data-type')=='back') {
			if (i>1) {
				i=i-1;
				open_page(act[i], false);
			}
			return false;
		}
		if ($(this).attr('data-type')=='close') {
			$('.pop_up').stop().animate({top:'-2000'},1000, 'easeInCirc', function(){
				$(this).css({display:'none'})
				$('.block_more').fadeOut(1000);
			})
			if (i>1) {
				i=i-1;
				open_page(act[i], false);
			}
			return false;
		}
	})
	function open_page(page, fl){
		if ($(page).attr('class')=='pop_up') {
			$('.block_more').fadeIn(1000);
			$(page).css({top:'-2000px', display:'block'}).stop().animate({top:'0'},1000, 'easeOutCirc');
			i++
		} else {
			num=$(page).attr('data-type');
			location.hash='#!/'+page.slice(1);
			m_left=-(p_box+((num%h_num)*(p_box*2+w_box)));
			m_top=-(p_box+(~~(num/h_num)*(p_box*2+h_box)));	
			$('.main').stop().animate({marginTop:m_top, left:m_left},1000, 'easeOutCirc', function(){
				if (fl) {
					i++;
					act[i]=page; 
				}
			});
		}
	}
	setWidth();
	setHeight();
	w=new_w;h=new_h;
	center_box();
	function setWidth(){
		new_w=$(window).width();
	}
	function setHeight(){
		new_h=$(window).height();
	}
	setInterval(setNew,60);
	function setNew(){
		setWidth();
		setHeight();
		if ((w!=new_w)|(h!=new_h)) {
			w=new_w;h=new_h;
			center_box();
		}
	}
	function center_box(){
		if (w>w_box) {
			m_left=~~((w-w_box)/2);
		} else m_left=0
		if (h>h_box+63) {
			m_top=~~((h-h_box-63)/2)+10;
		} else m_top=10
		$('.block').stop().animate({marginTop:m_top, marginLeft:m_left},1000, 'easeOutCirc')
		if (h>500) {
			$('.pop_up').stop().animate({marginTop:~~((h-500)/2)},1000, 'easeOutCirc')
		}
	}
})