"remind me later" popup won't come back using setTimeout across navigations

Question

Hi, there, here's the requirement:

Upon page loading, if certain condition is true, pop up a window with details, provide a link on the popup window that says "remind me in 5 minutes", when clicking on the link, the popup window should disappear and pop back up in 5 mintues. I am using setTimeout for the delay, however it only works when you stay on the original parent page, if you navigate to aother page, the popup won't come back. The following is the function called when the link is clicked on:

  function popBack(delay, spec) {
        var popupUrl = window.location;
        window.close();
        window.opener.setTimeout("window.open('" + popupUrl + "', 'popWindow', '" + spec + "')", delay);
    }

Any help is truly appreciated. Thanks.

Answer 1

Have you considered using cookies or session or a database to store the reminders? Every time your page loads you could check the time the reminder is supposed to pop up and start a new timeout with the time remaining.

A possible solution:

1. User clicks your "Remind me in 5 minutes" link.
2. You create a cookie with the time the reminder should pop-up.
3. On every new page load, open the cookie and get the time.
4. Set your timeout function to fire in (cookie time - current time) milliseconds.
5. Mark the reminder as fired in case it was supposed to go off but the user was busy navigating between pages.
6. You would also check the fired flag on a new page load for a reminder time that has already passed but wasn't fired and show the reminder pop-up immediately.
7. Expire the cookie after 24 hours or whenever you want.

I think that whatever solution you choose, you need to persist the data somewhere outside of just JavaScript.

Answer 2

window.opener refers to the the "window of the source document". This means that if the document disappears (by navigating to another URL), window.opener is no longer valid