
(function($) {
	$.fn.geoSelect = function(url, destination, params) {

		var params = $.extend({
			loadingText : 'Loading...',
			loadingImgUrl: '/templates/_default/images/ajax-loading.gif'
		}, params);

		var $dest = $(destination);

		function doLoad() {
			var val;
		    
		    $("#loading").remove();
			$dest.after('<span id="loading"><img src="' + params.loadingImgUrl + '" class="load_indicator" /></span>');
			//$("#loading").html(params.loadingImgUrl);

			$dest.attr('disabled','true')
				 .html('<option value="">' + params.loadingText + '</option>')
				 .ajaxStart(function() { $(this).show(); });

			$.getJSON (url, {id: $(this).val()},
				function(j) {
			        var options = '<option value="-1">' +params.firstOption+ '</option>';

			        for (var i = 0; i < j.length; i++) {
			            options += '<option value="' + j[i].id + '">' + j[i].name + '</option>';
			        }

					$dest.removeAttr('disabled').html(options);
					$("#loading").remove();
				}
			); // end load
		}

		return this.each(
    		function() {
    			$(this).bind('change', doLoad);
    		}
		); // end return each
	};  // end function
})(jQuery);
