Browse Source

HUE-212. Add ability to load a link without scrolling to the top after it loads.

Re-organizing code per code review.
Aaron Newton 15 years ago
parent
commit
268c1017a4
1 changed files with 56 additions and 65 deletions
  1. 56 65
      desktop/core/static/js/Source/JFrameLinkers/CCS.JFrame.AjaxLoad.js

+ 56 - 65
desktop/core/static/js/Source/JFrameLinkers/CCS.JFrame.AjaxLoad.js

@@ -23,32 +23,14 @@ script: CCS.JFrame.AjaxLoad.js
 */
 */
 
 
 (function(){
 (function(){
-	//if we are loading a link via ajax, we either replace, append, or inject.
-
-	var linkers = {};
-
-	['append', 'replace', 'target'].each(function(action){
-		linkers['data-ajax-' + action] = function(event, link){
-			var target = $(this).getElement(link.get('data', 'ajax-' + action));
-			if (!target) {
-				link.erase('data-ajax-' + action);
-				dbug.log('could not ' + action + ' the target element with response; element matching selector %s was not found', link.get('data', 'ajax-' + action));
-				this.callClick(event, link, true);
-			}
-			ajaxLoad.call(this, event, link, target, action);
-		};
-	});
-
-	CCS.JFrame.addGlobalLinkers(linkers);
 
 
 	/*
 	/*
 		loads the contents of a link into a specific target
 		loads the contents of a link into a specific target
 		* event - the event object from the link click
 		* event - the event object from the link click
 		* link - the link clicked
 		* link - the link clicked
-		* target - where to put the response
-		* action - (string; optional) either 'append', 'replace', or 'update' (defaults to 'update')
 		
 		
 		notes:
 		notes:
+		* links have properties for one of data-ajax-append, data-ajax-replace, and data-ajax-target
 		* replace means destroy the target and replace it entirely with the response.
 		* replace means destroy the target and replace it entirely with the response.
 		* append means leave everything in place and inject the response after the target.
 		* append means leave everything in place and inject the response after the target.
 		* update means empty the target and fill it with the response
 		* update means empty the target and fill it with the response
@@ -58,56 +40,65 @@ script: CCS.JFrame.AjaxLoad.js
 		  the body in the response.
 		  the body in the response.
 	*/
 	*/
 
 
-	var ajaxLoad = function(event, link, target, action){
+	var linkers = {};
 
 
-		action = action || 'update';
-		var requestTarget = target;
-		if (action != 'update') requestTarget = new Element('div');
+	['append', 'replace', 'target'].each(function(action){
 
 
+		linkers['data-ajax-' + action] = function(event, link){
+			var target = $(this).getElement(link.get('data', 'ajax-' + action));
+			if (!target) {
+				link.erase('data-ajax-' + action);
+				dbug.log('could not ' + action + ' the target element with response; element matching selector %s was not found', link.get('data', 'ajax-' + action));
+				this.callClick(event, link, true);
+				return;
+			}
 
 
-		var options = {
-			filter: link.get('data', 'ajax-filter'),
-			requestPath: link.get('href'),
-			spinnerTarget: requestTarget,
-			target: requestTarget,
-			ignorePartialRefresh: true,
-			ignoreAutoRefresh: true,
-			suppressLoadComplete: true,
-			retainPath: true,
-			callback: function(data){
-				switch(action){
-					case 'replace':
-						//reverse the elements and inject them
-						//reversal is required since it injects each after the target
-						//pushing down the previously added element
-						data.elements.reverse().injectAfter(target);
-						target.destroy();
-						break;
-					case 'append':
-						//see note above in 'replace' case as to why we use reverse here
-						data.elements.reverse().injectAfter(target);
-						break;
-					//do nothing for update, as Request.HTML already does it for you
-				}
-				var state = {
-					event: event,
-					link: link,
-					target: target,
-					action: action
-				};
-				//pass along the data that came back from JFrame's response handler as well as the state of this ajax load.
-				this.fireEvent('ajaxLoad', [data, state]);
-				this.behavior.fireEvent('update', [data, state]);
-			}.bind(this)
-		};
-		var spinnerTarget = link.get('data', 'spinner-target');
-		if (spinnerTarget) {
-			spinnerTarget = $(this).getElement(spinnerTarget);
-			options.spinnerTarget = spinnerTarget;
-		}
+			var requestTarget = target;
+			if (action != 'update') requestTarget = new Element('div');
 
 
-		this.load(options);
+			var options = {
+				filter: link.get('data', 'ajax-filter'),
+				requestPath: link.get('href'),
+				spinnerTarget: requestTarget,
+				target: requestTarget,
+				ignorePartialRefresh: true,
+				ignoreAutoRefresh: true,
+				suppressLoadComplete: true,
+				retainPath: true,
+				callback: function(data){
+					switch(action){
+						case 'replace':
+							//reverse the elements and inject them
+							//reversal is required since it injects each after the target
+							//pushing down the previously added element
+							data.elements.reverse().injectAfter(target);
+							target.destroy();
+							break;
+						case 'append':
+							//see note above in 'replace' case as to why we use reverse here
+							data.elements.reverse().injectAfter(target);
+							break;
+						//do nothing for update, as Request.HTML already does it for you
+					}
+					var state = {
+						event: event,
+						link: link,
+						target: target,
+						action: action
+					};
+					//pass along the data that came back from JFrame's response handler as well as the state of this ajax load.
+					this.fireEvent('ajaxLoad', [data, state]);
+					this.behavior.fireEvent('update', [data, state]);
+				}.bind(this)
+			};
+			var spinnerTarget = link.get('data', 'spinner-target');
+			if (spinnerTarget) {
+				spinnerTarget = $(this).getElement(spinnerTarget);
+				options.spinnerTarget = spinnerTarget;
+			}
 
 
-	};
+			this.load(options);
+		};
+	});
 
 
 })();
 })();