var _loadPic,
	_ajaxHolder,
	_body,
	_description,
	_winLocation,
	_winLoc,
	_mainPicHolder,
	_page = false,
	_safari = false,
	_nav,
	_viewContent,
	_activeIndex,
	_navigation,
	_navLock,
	_firstLoad;

var _aboutColors = ['#ff0033','#0099ff','#cc0099','#33cc00','#ff6600','#66cccc','#666666'];
var _mainPicFadeDuration = 1000;
var _picFadeDuration = 800;
var _mainPicSwitchTime = 4000;
var _slideThumbnail = 300;
var _showThumb = 250;
var _difShowThumb = 130;
var _thumbOpacity = 0.3;
var _hoverFadeDuration = 300;

var _browser = navigator.userAgent.toString().toLowerCase();
if (_browser.indexOf('applewebkit') != -1 && _browser.indexOf('chrome') == -1) _safari = true;

$(document).ready(function(){
	_firstLoad = true;
	_loadPic = $('img.load');
	_body = $('body');
	_description = $('div.description');
	_winLocation = window.location.toString();
	_mainPicHolder = $('div.main-block');
	_nav = $('#nav');
	_navigation = $('#nav a.ajax-load');
	_navLock = $('#nav-lock');
	
	_body.append('<div id="ajaxHolder" style="position:absolute;top:0;left:-1px;width:0px;height:0px;visibility:hidden;overflow:hidden;"></div>');
	
	if (_firstLoad) _loadPic.css('left',475);
	
	showContent();
	// load main pictures ******************************************************
	if (!_page) {
		var _pic = $('img', _mainPicHolder);
		var _random = Math.floor(Math.random()*_pic.length);
		var _moreImg = _random+2;
		if (_moreImg > _pic.length) _moreImg = _pic.length;
		var _loadIMG = _pic.slice(_random,_moreImg)
		loadImage(_loadIMG, function(){
			if (typeof $().slideShow == 'function') {
				_pic.eq(_random).fadeIn(1000).addClass('active');
				_mainPicHolder.slideShow({
					slideEl:'img',
					numElementLink: false,
					duration:_mainPicFadeDuration,
					autoSlideShow:true,		
					switchTime:_mainPicSwitchTime
				});
			}
		});
	}
	// ajax functional *********************************************************
	_ajaxHolder = $('#ajaxHolder');
	_navigation.click(function(){
		if (!$(this).parent().is('.active')) {
			window.location = _winLocation+'#'+$(this).attr('id');
		}
		return false;
	});
	// click thumbnail *********************************************************
	var _activeNav = false;
	$('#nav ul a').live('click', function(){
		if (!$(this).is('.active')) {
			_activeNav = $(this);
			_winLoc = window.location.toString();
			if (_safari) _winLoc = _winLoc.replace('%23','#');
			var _loc = _winLoc.split('#');
			if (_loc.length < 3) {
				window.location = window.location.toString()+'#'+$(this).attr('id');
			} else {
				_winLoc = _winLoc.substr(0, _winLoc.indexOf(_loc[2])-1);
				window.location = _winLoc+'#'+$(this).attr('id');
			}
		}
		return false;
	});
	$('#nav ul img').live('mouseover', function(){
			$(this).animate({'opacity':1}, {duration:_hoverFadeDuration, queue: false});
	});
	$('#nav ul img').live('mouseout', function(){
		if (!$(this).parent().is('.active'))
			$(this).animate({'opacity':0.3}, {duration:_hoverFadeDuration, queue: false});
	});
	$('h1 a').click(function(){
		window.location = _winLocation.replace('#','');
		return false;
	});
});
// set about color *************************************************************
var _colorInterval = false;
var _oldColor, _color;
function setAboutColor() {
	if ($('div.about-info').is(':visible')) {
		
		_oldColor = _color;
		do {
			_color = Math.floor(Math.random()*_aboutColors.length);
		} while (_oldColor == _color);
		$('div.about-info').animate({'backgroundColor':_aboutColors[_color]}, _mainPicFadeDuration);
		_colorInterval = setTimeout(function(){setAboutColor()}, 6000);
	}
}

// show content ****************************************************************
var _allImageLoad = true;
function showContent() {
	var _mainLink = false;
	var _subLink = false;
	var _imgArray = [];
	var _locTmp = window.location.toString();
	if (_safari) _locTmp = _locTmp.replace('%23','#');
	
	var _ids = _locTmp.substr(_locTmp.indexOf('#')+1);
	_winLocation = _locTmp.substr(0, _locTmp.indexOf('#'));
	
	if (_ids.length > 1) {
		var _id = _ids.split('#');
		_mainLink = $('#'+_id[0]);
		_subLink = $('#'+_id[1]);
		_activeNav = _subLink;
	}
	if (_locTmp.indexOf('#') != -1) {
		if (_mainLink.length) {
			_page = true;
			if (!_mainLink.is('.ajax-complete')) {
				// function load content
				var _href = _mainLink.attr('href');
				_mainLink.attr('href','#')
				if (_href != _locTmp) {
					function loadThis(){
						var _openSlide = $('> li div:visible',_nav);
						var _active = $('> li div:visible a.active',_nav);
						_loadPic.show();
						_navLock.show();
						_openSlide.slideUp(_slideThumbnail);
						
						$.ajax({
							url: _href,
							success: function(msg){
								_ajaxHolder.html(msg);
								var _subNav = _ajaxHolder.find('div.nav').clone();
								var _gallery = _ajaxHolder.find('div.img-desript');
								Cufon.refresh();
								
								var _loadImages = _ajaxHolder.find('div.nav img, div.inner:eq(0) img, div.inner:eq(1) img, div.inner:eq(2) img');
								
								_mainLink.addClass('ajax-complete');
								_mainLink.after(_subNav)
								_description.append(_gallery);
								
								_gallery.find('div.inner').slideShow({
									slideEl:'img',
									numElementLink: true,
									duration:_picFadeDuration,
									autoSlideShow:false
								});
								
								_ajaxHolder.empty();
								
								_navigation.parent().removeClass('active');
								
								_active.removeClass('active');
								_active.find('img').css('opacity',0.3);
								
								if (_id[0] == 'about') {
									_color = Math.floor(Math.random()*_aboutColors.length);
									$('div.about-info').css('background',_aboutColors[_color]);
									_colorInterval = setTimeout(function(){setAboutColor()}, 6000);
								}
								
								if (_viewContent) {
									_viewContent.find('.inner').hide();
									_viewContent.hide();
								}
								
								var _n = 0;
								
								var _rImage = _subNav.find('img');
								
								loadImage(_loadImages, function(){
									
									_allImageLoad = false;
									setTimeout(function(){
										_allImage = $('img');
										loadImage(_allImage, function(){
											_allImageLoad = true;
											_loadPic.hide();
											_navLock.hide();
											_activeNav.css('opacity',1);
											var _id = _activeNav.attr('href');
											if (_id != undefined) {
												_id = _id.substr(_id.indexOf('#'));
												$(_id).fadeIn(800);
											}
										});
									}, 1000);
									
									_rImage.css('opacity',0);
									_imgArray = randomImage(_rImage);
									// add active
									_mainLink.parent().addClass('active');
									
									_subNav.slideDown(_slideThumbnail, function(){
										_description.show();
										_subLink = $('#'+_id[1]);
										showThumb();
										function showThumb() {
											if (_subLink.length) {
												if (_subLink.find('img').attr('src') == _imgArray[_n].attr('src')) {
													subST(_n);
												}
											} else if (_rImage.eq(0).attr('src') == _imgArray[_n].attr('src')) {
												subST(_n);
											}
											if (_subLink.length) {
												if (_subLink.find('img').attr('src') != _imgArray[_n].attr('src'))
													_imgArray[_n].fadeTo(_showThumb, _thumbOpacity);
											}
											else if (_rImage.eq(0).attr('src') != _imgArray[_n].attr('src'))
												_imgArray[_n].fadeTo(_showThumb, _thumbOpacity);
												
											if (_n < _imgArray.length-1) setTimeout(function(){showThumb()}, _difShowThumb);
											_n++;
											
											function subST(n){
												_imgArray[n].fadeTo(_showThumb, 1);
												_imgArray[n].parent().addClass('active');
												_viewContent = $('#'+_mainLink.attr('rel'));
												var _subContent = _imgArray[n].parent().attr('href');
												_subContent = _subContent.substr(_subContent.indexOf('#'));
												_subContent = $(_subContent);
												_viewContent.find('.inner').hide();
												_viewContent.show();
												_subContent.fadeIn(_mainPicFadeDuration);
												_activeIndex = _n;									
											}
										}
									});
								});
							}	
						});
					}
					if (_mainPicHolder.is(':visible')) {
						_mainPicHolder.fadeOut(200, function(){
							loadThis();
						});
					} else {
						_description.find('div.img-desript div.inner:visible').fadeOut(200, function(){
							loadThis();
						});
					}
				}
			} else {
				if (!_mainLink.parent().is('.active')) {
					// nav don't open
					_navigation.parent().removeClass('active');
					var _openSlide = $('> li div:visible',_nav);
					var _active = $('> li div:visible a.active',_nav);
					_active.removeClass('active');
					_active.find('img').css('opacity',0.3);
					
					_mainLink.parent().addClass('active');
					
					if (_id[0] == 'about') {
						do {
							_color = Math.floor(Math.random()*_aboutColors.length);
						} while (_oldColor == _color);
						_oldColor = _color;
						$('div.about-info').css('background',_aboutColors[_color]);
						if (_colorInterval) clearTimeout(_colorInterval);
						_colorInterval = setTimeout(function(){setAboutColor()}, 6000);
					}
					
					if (!_allImageLoad) {
						_description.find('div.img-desript div.inner:visible').fadeOut(300, function(){
							_loadPic.show();
							_navLock.show();
						});
					} else {
						_description.find('div.img-desript div.inner:visible').fadeOut(300, function(){
							_description.find('div.img-desript div.inner').hide();
							var _rImage = _mainLink.next().find('img');
							_rImage.css('opacity',0);
							_imgArray = randomImage(_rImage);
							
							_openSlide.slideUp(_slideThumbnail);
							_mainLink.next().slideDown(_slideThumbnail, function(){
								var _n = 0;
								showThumb();
								function showThumb() {
									if (_subLink.length) {
										if (_subLink.find('img').attr('src') == _imgArray[_n].attr('src')) {
											subST(_n);
										}
									} else if (_n == 0) {
										subST(_n);
									}
									if (_subLink.length) {
										if (_subLink.find('img').attr('src') != _imgArray[_n].attr('src'))
											_imgArray[_n].fadeTo(_showThumb, _thumbOpacity);
									}
									else if (_n != 0)
										_imgArray[_n].fadeTo(_showThumb, _thumbOpacity);
									if (_n < _imgArray.length-1) setTimeout(function(){showThumb()}, _difShowThumb);
									_n++;
									
									function subST(n){
										_imgArray[n].fadeTo(_showThumb, 1);
										_imgArray[n].parent().addClass('active');
										_viewContent = $('#'+_mainLink.attr('rel'));
										var _subContent = _imgArray[n].parent().attr('href');
										_subContent = _subContent.substr(_subContent.indexOf('#'));
										_subContent = $(_subContent);
										_viewContent.find('.inner').hide();
										_viewContent.show();
										_subContent.fadeIn(_mainPicFadeDuration);
										_activeIndex = _n;
									}
								}
							});
						});
					}
				} else {
					// nav open
					var _rImage = _mainLink.next().find('img');
					_mainLink.next().find('a').removeClass('active');
					_rImage.css('opacity',0.3);
					_subLink.find('img').css('opacity',1);
					_subLink.addClass('active');
					var _id = _subLink.attr('href');
					if (_id != undefined) {
						_id = _id.substr(_id.indexOf('#'));
						if (!_allImageLoad) {
							_description.find('div.img-desript div.inner:visible').fadeOut(300, function(){
								_loadPic.show();
								_navLock.show();
							});
						} else {
							_description.find('div.inner:visible').fadeOut(_picFadeDuration);
							$(_id).fadeIn(_picFadeDuration);
						}
					}
				}
			}
		}
	} else {
		if (_description.get(0) && _description != null)
			_description.hide();
		_mainPicHolder.fadeIn(_mainPicFadeDuration);
		var _openSlide = $('> li div:visible',_nav);
		if (_openSlide.length) {
			var _active = $('> li div:visible a.active',_nav);
			_active.removeClass('active');
			$('> li.active',_nav).removeClass('active');
			_openSlide.slideUp(200);
		}
	}
}

// loading image callback function *********************************************
function loadImage(_images, callback) {
	var _preloadImage = [];
	var _n = 0;
	var _length = _images.length - 1;
	_images.each(function(i, img){
		if (!img.complete) {
			if (window.opera){
				do {
					_date = new Date();
				} while (img.complete);
				_n++;
				if (_n > _length) {
					_loadPic.hide();
					_navLock.hide();
					if (_firstLoad) {
						_loadPic.css('left',325);
						_firstLoad = false;
						$('#header, #nav').fadeIn(_mainPicFadeDuration);
					}
					callback();
				}
			} else {
				img.onload = function(){
					_n++;
					if (_n > _length) {
						_loadPic.hide();
						_navLock.hide();
						if (_firstLoad) {
							_loadPic.css('left',325);
							_firstLoad = false;
							$('#header, #nav').fadeIn(_mainPicFadeDuration);
						}
						callback();
					} 
					img.onload = null;
				}
			}
		} else {
			_n++
			if (_n > _length) {
				_loadPic.hide();
				_navLock.hide();
				if (_firstLoad) {
					_loadPic.css('left',325);
					_firstLoad = false;
					$('#header, #nav').fadeIn(_mainPicFadeDuration);
				}
				callback();
			}
		}
	});
}

// random show *****************************************************************
function randomImage(_img) {
	var _array = [];
	_img.each(function(){
		_array.push($(this));
	});
	var _resArray = [];
	var _length = _array.length;
	// fill random array
	for (var j = 0; j < _length; j++) {
		var _num = rndNum(_array.length);
		_resArray.push(_array[_num]);
		for(var k=0; k<_array.length; k++ )
			if(k ==_num) _array.splice(k,1);
	}
	function rndNum(c) {
		return Math.floor(Math.random()*c);
	}
	return _resArray;
}

// hash
var lastHash = '', f = 0, l = 0, z = 0;
function pollHash() {
	var _locTmp = window.location.toString();
	var _ids = _locTmp.substr(_locTmp.indexOf('#')+1);
    if(lastHash !== _ids) {
        lastHash = _ids;
		showContent();
    }
}
setInterval(pollHash, 400);