$(document).ready(function(){
	$('body').append('<a href="#city" id="city-menu"><img src="images/interface/weather.png" /></a><div style="display:none;"><div id="city"></div></div>');
	$('#menu-bar').prepend($('#city-menu'));
	$('#city').append('<h3>Quelle ville pour la meteo ?</h3><br/><input type="text" id="cityChoice" name="cityChoice"/><span id="city-submit" class="green-button">Enregistrer</span>');
	$('#city-menu').fancybox({
		'zoomSpeedIn'		: 600,
		'zoomSpeedOut'		: 500,
		'easingIn'			: 'easeOutBack',
		'easingOut'			: 'easeInBack',
		'hideOnContentClick': false,
		'padding'			: 15
	});
	$('#city-submit').live('click', function(){
		var ville = $('#cityChoice').val();
		if(ville != '' || ville != null){
			$.get('ajax/update.php', {id:'weather', city: ville}, function(msg){
					location.reload();
			});
		}else{
			$('#city').append('<span class="error">City can\'t be empty.</span>');
		}
	});
	
	var tmp;

	/* A helper function for converting a set of elements to draggables: */
	make_draggable($('#weather'));


});