(function($){
		  
	$.fn.clock = function()
	{
		$.fn.clock.prestart($(this));
	}

	$.fn.clock.prestart = function(el)
	{
		$.fn.clock.update(el);
		var sec = 60-new Date().getSeconds();
		setTimeout(function(){$.fn.clock.start(el)}, sec*1000);
	}
	
	$.fn.clock.start = function(el)
	{
		$.fn.clock.update(el);
		setInterval(function(){$.fn.clock.update(el)}, 60*1000);
	}
	
	$.fn.clock.update = function(el)
	{
		var date = new Date();
		var hours = date.getHours();
		var minutes = date.getMinutes();
		
		if(hours < 10) hours = '0'+hours;
		if(minutes < 10) minutes = '0'+minutes;

		el.html(hours+'<span>:</span>'+minutes);
	}
	
})(jQuery)

function mapAnimate()
{
	if($('.map').length)
	{
		var $obj = $('.map');
		var $mapView = $('#map-view');
		var rect = {
			left:$mapView.offset().left,
			right:$mapView.offset().left + $mapView.width(),
			top:$mapView.offset().top,
			bottom:$mapView.offset().top + $mapView.height()
		}
		var ghost = {percent: 0.1};
		ghost.left = rect.left+Math.round((rect.right-rect.left)*ghost.percent);
		ghost.right = rect.right-Math.round((rect.right-rect.left)*ghost.percent);
		ghost.top = rect.top+Math.round((rect.bottom-rect.top)*ghost.percent);
		ghost.bottom = rect.bottom-Math.round((rect.bottom-rect.top)*ghost.percent);
	
		var last = {x:0, y:0};
		
		var percent = {x: 0.4, y: 0.3, gx: 0.5, gy: 0.65};
		var store = {left: 60, top: 30};
		store._top = -2*store.top;
		store._left = -2*store.left;
		
		var mouseon = false;
		var p_x = percent.x; 
		var p_y = percent.y;
		var time = 0;
	
		var $text = $('.map #text');
		var text_left = parseInt($text.css('left'));
		var text_top = parseInt($text.css('top'));
		var $text_clone = $('.map #text').clone(true).attr('id', 'text-clone')
			.css({
				 position:'absolute',
				 left:parseInt($obj.css('left'))+text_left+'px',
				 top:parseInt($obj.css('top'))+text_top+'px',
				 width:$text.width()
			})
			.appendTo($mapView);
		$text.hide();
		
		function mapMove(e)
		{
			var d = new Date();
			if(d.getTime() - time  < 14) return;
			
			if(!(e.pageX > rect.left && e.pageX < rect.right
				&& e.pageY > rect.top && e.pageY < rect.bottom))
			{
				if(mouseon) 
				{
					mouseon = false;
					last.x = e.pageX;
					last.y = e.pageY;
					p_x = percent.x; 
					p_y = percent.y; 
				}
				return;
			}
			else 
			{
				if(!mouseon) 
				{
					last.x = e.pageX;
					last.y = e.pageY;
					mouseon = true;
				}
			}
			
			if(e.pageX > ghost.left && e.pageX < ghost.right
				&& e.pageY > ghost.top && e.pageY < ghost.bottom)
			{
				p_x = percent.gx;
				p_y = percent.gy;
			}
			
			var offset = {x:e.pageX - last.x, y:e.pageY - last.y};
		
			var pos = {x:parseInt($obj.css('left')), y:parseInt($obj.css('top'))}
			
			pos.x += Math.round(-offset.x*p_x);
			pos.y += Math.round(-offset.y*p_y);
			
			if(pos.x > 0)
				pos.x = 0;
			else if(pos.x < -2*store.left)
				pos.x = -2*store.left;
			
			if(pos.y > 0)
				pos.y = 0;
			else if(pos.y < -2*store.top)
				pos.y = -2*store.top;
	
			if($obj.is(':animated')) $obj.add($text_clone).stop();
			$obj.css({left: pos.x, top: pos.y});
			$text_clone.css({
				 left:parseInt($obj.css('left'))+text_left+'px',
				 top:parseInt($obj.css('top'))+text_top+'px'
			});
			last.x = e.pageX;
			last.y = e.pageY;
			
			d = new Date()
			time = d.getTime();
		}
	
		$('#header')
			.hover(function(e){
					//bind mousemove here for IE and Opera
					$(this).bind('mousemove', mapMove);
				},
				function(){ 
					$obj.stop(true);
					$(this).unbind('mousemove');
	
					$text_clone.animate({left:-store.left+text_left, top:-store.top+text_top}, {duration:'slow'});
					$obj.animate({left: -store.left, top: -store.top}, {duration:'slow'});
				}
			);
	}
}

$(function(){


if($.browser.msie)
	DD_belatedPNG.fix('#clock, #speck, #kompas');

$('#clock').clock();
/*** shapko preload ***/
var imagesObj = new Array($('#navigator'), $('#kompas'), $('#speck'), $('#map-img'));
var images = new Array();

$.each(imagesObj, function(i, v){
	if(v.get(0).tagName.toUpperCase() == 'IMG') images.push(v.attr('src'));
	else images.push(v.css('background-image').match(/http:\/\/[\w\d.\/]*/)[0]);
});

$map_loading = $('<div id="map-loader">Загрузка местности...</div>');
var start_time = new Date().getTime();

function imagesComplete()
{
	/*** set minimal time ***/
	var min_time = 500;
	date = new Date();	
	if((date.getTime() - start_time) < min_time) 
	{
		setTimeout(imagesComplete, min_time-(date.getTime() - start_time));
		return;
	}

	$map_loading.remove();
	$('#map-view').addClass('map-view');
	$('#map, #speck').fadeIn('fast');
	$('#map-view A').css('visibility', 'visible');
	$('#clock, #kompas').show().animate({bottom: 0});
	mapAnimate();
}

new preload({
		data: images,
		complete: function(i, v){
			/*if($.browser.msie && v.indexOf('.png') !== -1)
					DD_belatedPNG.fix('#'+imagesObj[i].attr('id'));//fix  png for IE 6*/
			if(imagesObj[i].attr('id') == 'navigator')
			{
				$('#header').css('background-image', 'url('+v+')').prepend($map_loading);
				imagesObj[i].remove();
			}
			else if(imagesObj[i].attr('id') == 'map-img')
			{
				$('#map').css('background-image', 'url('+v+')');
				if(imagesObj[i].is('A'))
				{
					$('#speck').click(function(){
						window.location = imagesObj[i].attr('href');
					})
					.css('cursor', 'pointer');
				}
				imagesObj[i].remove();
			}
		},
		completeAll: imagesComplete,
		queue: true
	});

});