WeatherMap = {
	data : {},
	size : {width: 626, height: 310},
	floatBox : null,
	
	addCity : function(name, x, y, data)
	{
		this.data[name] = data;
		$('#weatherMap').append(
			$('<div></div>')
			.css('position', 'absolute')
			.css('left', x + 'px')
			.css('top', y + 'px')
			.css('text-align', 'center')
			.css('color', 'white')
			.css('font-size', '12px')
			.css('text-shadow', '1px 1px 2px #000')
			.css('visibility', 'hidden')
			.append(
				$('<img/>')
				.attr('src', '/weathermap/img/' + data.img + '.png')
				.load(function() {
					var p = $(this).parent();
					p.css('left', (x - $(this).width()/2) + 'px');
					p.css('top',  (y - $(this).height()/2) + 'px');
					$('div', p).css('position', 'absolute');
					$('div', p).css('top', $(this).height() - $('div', p).height()/2 + 'px');
					$('div', p).css('width', $(this).width() + 'px');
					
					p.css('display', 'none');
					p.css('visibility', '');
					p.fadeIn();
				})
			)
			.mousemove(function(e) {
				if (!WeatherMap.floatBox)
				{
					WeatherMap.floatBox = 
						$('<div/>')
						.css('border', '1px solid black')
						.css('padding', '5px')
						.css('position', 'absolute')
						.css('background', '#eef')
						.css('font-size', '12px')
						.css('opacity', 0.9)
						.css('z-index', 1000);
					$('body').append(WeatherMap.floatBox);
				}
				
				$(WeatherMap.floatBox).show();
				
				$(WeatherMap.floatBox).html(
					'Mesto: <strong>' + name + '</strong><br />' +
					'Stav počasia: <strong>' + WeatherMap.format(data.name) + '</strong><br />' +
					'Teplota vzduchu: <strong>' + WeatherMap.format(data.temp, ' °C') + '</strong><br />' +
					'Pocitová teplota: <strong>' + WeatherMap.format(data.wind.chill, ' °C') + '</strong><br />' +					
					'Smer vetra: <strong>' + WeatherMap.format(data.wind.direction) + '</strong><br />' +
					'Rýchlosť vetra: <strong>' + WeatherMap.format(data.wind.speed, ' m/s') + '</strong><br />' +
					'Vlhkosť vzduchu: <strong>' + WeatherMap.format(data.atmosphere.humidity, ' %') + '</strong><br />' +
//					'Tlak: <strong>' + WeatherMap.format(data.atmosphere.pressure, ' hPa') + '</strong><br />' +
					'Viditeľnosť: <strong>' + WeatherMap.format(data.atmosphere.visibility, ' km') + '</strong><br />' +
					'Východ a západ slnka: <strong>' + WeatherMap.format(data.astronomy.sunrise) + ' - ' + WeatherMap.format(data.astronomy.sunset) + '</strong><br />' +
					'Čas merania: <strong>' + WeatherMap.format(data.time) + '</strong><br />'
				);
				
				$(WeatherMap.floatBox).css('left', (e.pageX - ($(WeatherMap.floatBox).outerWidth())/2) + 'px');
				$(WeatherMap.floatBox).css('top', (e.pageY + 20) + 'px');
			})
			.mouseout(function() {
				$(WeatherMap.floatBox).hide();
			})	
			.append('<div>' + data.temp + ' °C</div>')
		);
	},
	
	format : function(text, unit)
	{
		if (!text) return 'N/A';
		if (unit) return text + unit;
		return text;
	},
	
	init : function()
	{
		$('#weatherMap').css('position', 'relative');
		$('#weatherMap').css('overflow', 'hidden');
	}
};

WeatherMap.init();