var curr = '0';
$(document).ready(function() {
	$('#selectors select#state').change(function(e) {
		var id = $('#selectors select#state option:selected').val();
		$.get('w_job.php', { 'id': id, 'action': 'getJobs' }, function(jobs)
		{
			var html = '<option value="0">Select your city</option>';
			for (var i in jobs) {
				html += '<option value="'+jobs[i].id+'">'+jobs[i].city+', '+jobs[i].state+' - '+jobs[i].title+'</option>';
			}
			$('#selectors select#city').html(html).removeAttr('disabled');
		}, 'json');
	});
	$('#selectors select#city').change(function(e) {
		var id = $('#selectors select#city option:selected').val();
		if (id != '') {
			$('aside').fadeOut('normal', function() {
				$('div#description').removeClass('empty');
				getJob(id);
				curr = id;
			});
		} else {
			$('aside').fadeOut('normal', function() {
				curr = '0';
			});
		}
	});
});

function getJob(id)
{
	$.get('w_job.php', { 'id': id, 'action': 'getDesc' }, function (job)
	{
		// Generate description block
		var html = "<a href=\""+job.url+"\" id=\"apply-button\" class=\"button button-primary button-next button-right\">Apply &rarr;</a>";
		html += '<h3>'+job.title+'</h3>';
		html += '<h4>'+job.city+', '+job.state+' '+job.zip+'</h4>';
		html += '<h4>'+job.status.type+' '+job.status.time+'</h4>';
		html += '<p><strong>Description:</strong> '+job.description+'</p>';
		html += '<p><strong>Requirements:</strong> '+job.skills+'</p>';
		// Apply
		$('aside div#description').html(html);
		$('aside').fadeIn();
	}, 'json');
}