CF>JS inside setTimeout() method
I'm trying to implement a javascript function that compares the session start time with the current time and notifies the user when their session has timed out. My Application.cfc is:
<cfcomponent output="no">
<cfset this.name="MyApp">
<cfset this.sessionManagement="yes">
<cfset this.sessionTimeout=CreateTimeSpan(0,0,0,5)>
<cffunction name="onApplicationStart" returntype="boolean" output="no">
<cfset Application.appStarted=Now()>
<cfreturn true>
</cffunction>
<cffunction name="onSessionStart" output="yes">
<cfset Session.sessionStarted=Now()>
</cffunction>
</cfcomponent>
and my index.cfm page is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CF to JS</title>
</head>
<body onload="calltimeout();">
<h2> Testing CF to JS</h2>
<div>
<p>Application started: <span id="test"></span></p>
<p>Session started: <span id="test2"></span></p>
<p>Difference between session start and now: <span id="test3"></span> seconds</p>
<p id="test4"></p>
</div>
<script language="javascript" type="text/javascript">
<cfoutput>
var #toScript(Application.appStarted, "jsvar")#;
var #toScript(Session.sessionStarted, "jsvar2")#;
</cfoutput>
document.getElementById("test").innerHTML = jsvar;
document.getElementById("test2").innerHTML = jsvar2;
var timer= null;
function calltimeout(){
<cfoutput>
var #toScript(datediff("s", Session.sessionStarted, Now()), "jsvar3")#;
</cfoutput>
document.getElementById("test3").innerHTML = jsvar3;
if (jsvar3 > 5) {
document.getElementById("test4").innerHTML = "You have timed out.";
}
timer = setTimeout("calltimeout()", 1000);
}
</script>
</body>
</html>
Here's my problem: the "jsvar3" variable doesn't get updated unless the page is refreshed manually. I know the JS calltimeout() function is working, because I can implement a counter that increments each time, and which displays the updated value correctly each time the function is called. If I refresh the page manually, the jsvar3 variable shows that it's updated and eventually the conditional block runs and outputs "You have timed out".
Is there a different way I should be refreshing the "jsvar3" variable?
