window.addEvent('domready', function() {

	var institutionBox = $('institution_id');

	$('country').addEvent('change', function(e) {
		e.stop();
		var val = this.getSelected().get('value');
		if(val == 0) {
			console.log(val);
			institutionBox.empty();
		} else {
			institutionBox.empty();
			var req = new Request.JSON({
				url: '/directory/json/institutions/country/'+val,
				onComplete: function(jsonObj) {
					fillSelect(jsonObj);
					institutionBox.setStyle('color', '#333');
					//console.log(jsonObj.id);
				}
			}).send();
		}
	});

	var fillSelect = function(opts) {
		opts.each(function(option) {
			var el = new Element('option', {'value': option.id, 'html': option.name });
			el.inject(institutionBox);
		});
	};
});

window.addEvent('load', function() {

	var val = $('country').getSelected().get('value');
	
	if(val != 0) {
		var institutionBox = $('institution_id');
		institutionBox.empty();
		var req = new Request.JSON({
			url: '/directory/json/institutions/country/'+val,
			onComplete: function(jsonObj) {
				fillSelect(jsonObj);
				institutionBox.setStyle('color', '#333');
			}
		}).send();
	}

	var fillSelect = function(opts) {
		opts.each(function(option) {
			var el = new Element('option', {'value': option.id, 'html': option.name });
			el.inject(institutionBox);
		});
	};
});