Develop Reference

How to run a task after the page being killed in browser?

First of all, it has two pages: example.com/pageA and example.com/pageB, it's not a SPA.
How to run a delay task after the page being killed by history.back?
I tried using setTimeout but failed to execute the task after history.back, because the timer will be clear in stack when page change.
var a = 1
function refresh() {
// <p id="count"></p>
count.innerText = a
}
function foo() {
a += 1
refresh()
}
// called in PageB
function goBackA() {
setTimeout(foo, 1000)
history.back()
}
In PageA the count still be 1 instead of 2.

For security reason, your goal to run some code after page being killed will never be supported by the browser, because it's dangerous when some code can run on a different page.
Once the page being reload/killed, all the unfinished tasks will be clear even if in a SharedWorker.
So, two ways to accomplish your logic:
change to SPA
give another page a hint like query

how to disable a timeout on the page source level?

i am opening a page on the chrome by using F12, and i realize it do have a timer inside the source code, however, the timer started on the page load and it does not store the timer as a variable, what the source code use is
self.setTimeout("OnReload()", 60000);
so if i am intend to using window.clearTimeout(timer);
Since it is not store as a variable, i am not able to using this method to clear the timeout variable, may i ask am i able to clear this timeout???

As you cannot disable the timer, why not just overload the function i.e.
function OnReload() { }
So that it does nowt.

the answer is i key in self.clearTimeOut(0);
and it work

Second clearInterval not working to stop the function from executing

I have 2 js functions - one of them is in global main.js file and another one is local to one of my html pages <script> tags. I have access to main.js in all files simply because they are being loaded in the main.html page via ajax. I am able to stop the main function from clearInterval in my html page but when I am trying to do clearInterval for the local function, somehow its not working.
The clearIntervals get triggered when I click the 'edit' button of the page. But my problem is when I click 'edit' only the global function gets stopped but not the local one. The function is just updating selectmenu options based on values that are being recieved from the server. For textboxes it updates in real time but for selectmenus I had to use this approach to make it work in real time.
Below is the JS code with local function:
var dropdown_update=setInterval(updateDropdownValues, 1200); //calling the local function
function updateDropdownValues(){
//does some work
}
$("#editFields").click(function(){
//some code
clearInterval(ajax_interval); //works..ajax_interval is in main.js not shown here
clearInterval(dropdown_update); //doesnt work..keeps executing the function
});
Following is main.js relevant part (I dont think this is the culprit):
var ajax_interval = setInterval(loadAjaxData2, 1 * 1000);
function loadAjaxData2() {
//some variables
$.ajax({
//an ajax call
});
}
I looked over several stackoverflow posts but none of them had this kind of problem.

Javascript function not fired on video timeupdate

Currently working on a page containing a video that has to be paused at certain points (like chapters). So I made a function that will stop the video when it hits the next "time marker" which looks like this:
function vidPause(nextMarker){
var timeMarker = nextMarker;
if(videoPlayer.currentTime >= timeMarker) {
videoPlayer.pause();
videoPlayer.removeEventListener('timeupdate', vidPause());
}
};
And I'm trying to fire it this way:
videoPlayer.addEventListener('timeupdate', vidPause(nextMarker));
But it only seems to fire when the video is loaded. Nothing happens when the video is playing (tested by using a console.log(videoPlayer.currentTime); inside the vidPause function).
Note: I need the function to be called that way so that I can remove the event listener when it hits the time marker, that way it won't stop when the user wants to play the video from that point on.
Thanks in advance for any suggestions!

The function is being called once in the addEventListener line, but that's not actually passing it as a callback.
Try this:
function videoUpdate(e) {
vidPause(nextMarker, videoPlayer.currentTime;); // Now call your function
}
function vidPause(nextMarker, timeStamp){
var timeMarker = nextMarker;
if (timeStamp >= timeMarker) {
videoPlayer.pause();
videoPlayer.removeEventListener('timeupdate', videoUpdate);
}
};
videoPlayer.addEventListener('timeupdate', videoUpdate); // Note no brackets, as it's passing a ref to the function rather than calling it
I don't know what the scope of nextMarker is, but you should be able to start console logging and find out.

To execute Flex cleanup function when browser is closed by user

I have a Flex client application. I need a clean up function to run in Flex when the user closes the browser. I found the following solution on the net, but it only works half-way for me. How could I fix it? Thanks in advance for any responses!
Symptoms
CustomEvent triggered, but not executed. >> EventHandler for CustomEvent.SEND_EVENTS is defined by a Mate EventMap. All the handler does is to call an HTTPServiceInvoker. In debug console, I'm able to see the handler and HTTPServiceInvoker being triggered, but neither the resultHandlers nor the faultHandlers were called. I know this event handler has no problem because when I dispatch the same CustomEvent.SEND_EVENTS in a button click handler, it behaves exactly as I expected)
Browser seems to wait for cleanUp function to complete before it closes. (all traces were printed before browser closes down)
Code
I added the following into the index.template.html
window.onbeforeunload = clean_up;
function clean_up()
{
var flex = document.${application} || window.${application};
flex.cleanUp();
}
And used the following in the application MXML file
import flash.external.ExternalInterface;
public function init():void {
ExternalInterface.addCallback("cleanUp",cleanUp);
}
public function cleanUp():void {
var newEvent:CustomEvent = new CustomEvent(CustomEvent.SEND_EVENTS);
newEvent.requestObj = myFormModel;
dispatchEvent(newEvent);
// for testing purposes
// to see whether the browser waits for Flex cleanup to finish before closing down
var i:int;
for (i=0; i<10000; i++){
trace(i);
}
}
My Setup
FlexBuilder 3
Mate MVC Framework (Mate_08_9.swc)
FlashPlayer 10

Unfortunately, there is no solid way of doing such clean up functions that execute asynchronously. The result/fault events of the HTTPService occur asynchronously after the cleanUp method is returned. The browser waits only till the onbeforeunload function (the js clean_up function) returns. Unless you call event.preventDefault() from that function, the page will be closed. Note that calling preventDefault() will result in an ok/cancel popup asking:
Are you sure you want to navigate away from this page?
Press OK to continue, or Cancel to stay on the current page.
If the user selects OK, the browser will be closed nevertheless. You can use the event.returnValue property to add a custom message to the popop.
//tested only in Firefox
window.addEventListener("beforeunload", onUnload, false);
function onUnload(e)
{
e.returnValue = "Some text that you want inserted between " +
"'Are you sure' and 'Press OK' lines";
e.preventDefault();
}

You'll never be able to reliably detect the browser code 100% of the time. If you really need to run actions then the safest course of action is to have clients send "i'm still alive" messages to the server. The server needs to track time by client and when a client doesn't send a message within the specified amount of time (with some wiggle room), then run clean-up activities.
The longer you make the time the better, it depends on how time-critical the clean-up is. If you can get away with waiting 5 minutes that's great, otherwise look at 1 minute or 30 seconds or whatever is required for your app.

An alternate way to clean up the session on client side is to use JavaScript and external.interface class in as3. Here is sample code:
JavaScript:
function cleanUp()
{
var process;
var swfID="customRightClick";
if(navigator.appName.indexOf("Microsoft") != -1){
process = window[swfID];
}else
{
process = document[swfID];
}
process.cleanUp();
}
and in the as3 class where the clean up function is defined use this:
import flash.external.ExternalInterface;
if (ExternalInterface.available)
{
ExternalInterface.addCallback("cleanUp", cleanUp);
}
function cleanUp():void {// your code }