$(function(e) {
	var uname = $('#username');
	var note = $('<small></small>').hide();
	uname.after(note);

	var timerID = 0;
	var lastCheck = '';
	var usernameCheck = function() {
		var n = uname.val();
		if((n.length > 3)) {
			if(n != lastCheck) {
				lastCheck = n;
				$.getJSON(baseurl+'/json/username/'+n, updateUsername);
			}
		} else {
			note.text('').hide();
			uname.css('color', '');
		}
	}
	var updateUsername = function(data) {
		note.show();
		if(data[1]) {
			note.text('This username is already taken.').css('color', 'red');
			uname.css('color', 'red');
		} else {
			note.text('This username is available.').css('color', 'green');
			uname.css('color', 'green');
		}
	}
	uname.keydown(function(e) {
		clearTimeout(timerID);
		timerID = setTimeout(usernameCheck, 500);
	});
});
