updated page loading to cancel pending request

This required moving away off $.load() to use $.get() and do a bit more of DOM
manipulation by ourselves, but there was no other way to get the xhr object.

panikweb_templates/static/js/specifics.js

@@ -10,11 +10,16 @@ $(function() {
 	String.prototype.decodeHTML = function() {
 		return $("<div>", {html: "" + this}).html();
 	};
+
+	var loadPage_request = null;
 	afterLoad = function(html, textStatus, XMLHttpRequest) {
+		loadPage_request = null;
 		if (textStatus == "error") {
 			doLog('Sorry! And error occur when loading page content','error');
-			$("a, area").removeClass('loading');
+			$("a, area, form").removeClass('loading');
 		}
+		new_content = $($.parseHTML(html)).find('#Changing>*');
+		$main.empty().append(new_content);
 		document.title = html.match(/<title>(.*?)<\/title>/)[1].trim().decodeHTML();
 		/*
 		Quite UGLY but needed for styling the whole body with ID
@@ -31,12 +36,18 @@ $(function() {
 	$(window).on("popstate", function(e) {
 		if (e.originalEvent.state !== null) {loadPage(location.href);}
 	});
+
 	loadPage = function(href) {
 		history.pushState({}, '', href);
-		$main.load(href + " #Changing>*", null, afterLoad);
+		if (loadPage_request !== null) {
+			loadPage_request.abort();
+		}
+		loadPage_request = $.get(href, null, afterLoad);
 	};
 	init = function() {
-		$("a, area").removeClass('loading').unbind('click').on('click',function() {
+		$("a, area, form").removeClass('loading');
+		$("a, area").unbind('click').on('click',function() {
+			$("a, area, form").removeClass('loading');
 			$(this).addClass('loading');
 			var href = $(this).attr("href");
 			/* this checks the link points to a local document, be
@@ -51,7 +62,8 @@ $(function() {
 				return true;
 			}
 		});
-		$("#search-form").on('submit', function(event) {
+		$("#search-form").unbind('submit').on('submit', function(event) {
+			$("a, area, form").removeClass('loading');
 			event.preventDefault();
 			$(this).addClass('loading');
 			loadPage($(this).attr('action') + '/?' + $(this).serialize());