[ How to: ] Set up page specific Javascript files - Glidias/Kilogaiajax GitHub Wiki

You can refer to the page template here for developing page-specific code.

gaiaReady = function() { 
	
	// Set up (optional) custom page-specific transition methods if you so wish
	Gaiajax.api.setGaiaTransitionIn(function(callback, content){
		Gaiajax.api.getDefaultTransitionIn()(callback,content);  // comment away if you're not  falling back to  default transition
	});
	
	
	Gaiajax.api.setGaiaTransitionOut(function(callback, content){
		Gaiajax.api.getDefaultTransitionOut()(callback,content); // comment away if you're not falling back to default transition
	});

	// Set up (optional) custom page-specifc transition method callback methods
	Gaiajax.api.setGaiaTransitionInComplete(function(content){ });
	Gaiajax.api.setGaiaTransitionOutComplete(function(content){ });
	
	
	// Page initialization code goes here
	// ......
}

Have your page file .js be preloaded in the Site XML as well. Basically, what you're doing is declaring a temporary global variable gaiaReady to act as an initialization method (in order to defer initialization process till all other assets are preloaded). Whenever a JS file finishes loading in Kilogaiajax, the JS code runs immediately. Thus, preloading a JS file is akin to simply executing the code.

When your page exits (ie. removed from the DOM right after transitioning contents out has completed), gaiaReady is deleted.

There are other ways (example link to be provided soon) to actually initialize page code functionality through the use of Kilogaiajax event hooks. Currently, this system works mainly for seperate page javascript files that are always preloaded together with the rest of the assets.

Your page javascript could also potentially run standalone with/without the Kilogaiajax framework using the following format:

gaiaReady = function() { 
	
	var Gaiajax = window["Gaiajax"];
	
	if (Gaiajax) {
		Gaiajax.api.setGaiaTransitionIn(function(callback, content){
			Gaiajax.api.getDefaultTransitionIn()(callback,content); 
		});
			
		Gaiajax.api.setGaiaTransitionOut(function(callback, content){
			Gaiajax.api.getDefaultTransitionOut()(callback,content);
		});
	
		Gaiajax.api.setGaiaTransitionInComplete(function(content){});	
		Gaiajax.api.setGaiaTransitionOutComplete(function(content){});
	}

}

if (!window["Gaiajax"]) $(document).ready(gaiaReady); 

Sometimes, i use the above format if there are certain browers or environments in which I want to keep the same page Javascript functionality, but keep Gaiajax optional. For such environments, I omit loading the site.js framework file itself.