jQuery(document).ready(function() {
	$("#remote #next").click( function() {
		current = Number($("#screen #wrapper").attr("title"));

		$("#screen #wrapper").attr("title", current + 1);
		next = $("#screen #wrapper").attr("title");
		newHTML = $("#canvas"+next).html();

		$(this).attr('href','javascript:;');

		if(newHTML == null) {
			newHTML = $("#canvas1").html();
			$("#screen #wrapper").attr("title", 1);
		}

		changeScreen(newHTML);
	});


	$("#remote #previous").click( function() {
		current = Number($("#screen #wrapper").attr("title"));
		
		$("#screen #wrapper").attr("title", current - 1); 
		previous = $("#screen #wrapper").attr("title");

		newHTML = $("#canvas"+previous).html();

		$(this).attr('href','javascript:;');

		if(newHTML == null) {
			newHTML = $("#canvas"+last).html();
			$("#screen #wrapper").attr("title", last);
		}

		changeScreen(newHTML);
	});
});

function changeScreen(newHTML) {
	$("#screen #wrapper")
		.fadeOut(500, function() {
			$(this).html(newHTML);
		})
		.fadeIn(750);
}