Calling Server-side JS/Code during Mobile Page Transitions (Pre 9.0.1)

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.ibm.com/xsp/core xsdxp://localhost/xsp~core.xsd
http://www.ibm.com/xsp/coreex xsdxp://localhost/xsp~coreex.xsd"
	xmlns:xe="http://www.ibm.com/xsp/coreex">
	<xp:this.beforePageLoad>
		<![CDATA[#{javascript:
			viewScope.foo = "hello world";
			viewScope.bar = "hello mars";
		}]]>
	</xp:this.beforePageLoad>
	<xe:singlePageApp id="singlePageApp1"
		selectedPageName="pageOne">
		<xe:appPage id="appPage1" pageName="pageOne">
			<xe:djxmHeading id="djxmHeading1" transition="slide"
				moveTo="pageTwo" label="Page One" back="Page Two">
			</xe:djxmHeading>
		</xe:appPage>
		<xe:appPage id="appPage2" pageName="pageTwo">
			<xe:djxmHeading id="djxmHeading2" transition="slide"
				moveTo="pageOne" label="Page Two" back="Page One">
			</xe:djxmHeading>
		</xe:appPage>
	</xe:singlePageApp>
	<xp:scriptBlock id="scriptBlock1">
		<xp:this.value><![CDATA[
			XSP.addOnLoad(function(){
				var appPage1 = dijit.byId("#{id:appPage1}");
				if(null != appPage1){
					dojo.connect(appPage1, "onBeforeTransitionIn", function(){
						console.log("onBeforeTransitionIn");
						var deferred = scopedVarsService.refresh();
						deferred.addCallback(function(result) {
							console.log(result);
						});
					});
					dojo.connect(appPage1, "onAfterTransitionIn", function(){
						console.log("onAfterTransitionIn");
						var deferred = scopedVarsService.refresh();
						deferred.addCallback(function(result) {
							console.log(result);
						});
					});
					dojo.connect(appPage1, "onBeforeTransitionOut", function(){
						console.log("onBeforeTransitionOut");
						var deferred = scopedVarsService.refresh();
						deferred.addCallback(function(result) {
							console.log(result);
						});
					});
					dojo.connect(appPage1, "onAfterTransitionOut", function(){
						console.log("onAfterTransitionOut");
						var deferred = scopedVarsService.refresh();
						deferred.addCallback(function(result) {
							console.log(result);
						});
					});
				}
			});
		]]></xp:this.value>
	</xp:scriptBlock>
	<xe:jsonRpcService id="jsonRpcService1" serviceName="scopedVarsService">
		<xe:this.methods>
			<xe:remoteMethod name="refresh">
				<xe:this.script>
					<![CDATA[
						if(viewScope.containsKey("foo")){
							viewScope.foo = null;
							print("cleared foo");
						}
						if(viewScope.containsKey("bar")){
							viewScope.bar = null;
							print("cleared bar");
						}
						return "<DONE>";
					]]>
				</xe:this.script>
			</xe:remoteMethod>
		</xe:this.methods>
	</xe:jsonRpcService>
</xp:view>