Following countdown timer - javascript

Is there a way to create a countdown timer that continues to countdown where it is left off when the user transferred to another page?
For example,
On page 1 the user clicks on the link which takes them to page 2.
The countdown timer on page 1 is XX:YY
Page two loads and the countdown is XX:YY and continues from there...

Yes, but it depends how are you developing you application.
If you are working on SPA, it'll be easy. Since your JS state won't change while user is navigating on your page, you just need to put the countdown on a global variable/singleton and update on it (remember that it could break if user open a new tab or refresh the page).
You also could keep this state on a SharedWorker and share this information between many tabs, and persist this data using Web Storage API.

Related

Refresh the page one time when a user loads the page?

In my small chat application I need to refresh the page once every time the page is loaded. This stops messages from being sent twice.
I have tried using sessionStorage to store whether the page has been refreshed, but this did not work because it was reset every time the page was loaded.
How can I check if the page has already been refreshed?

Track user inactivity even when page closed

I want my frontend to track user inactivity (no mouse/keyboard input) and call my logout API when a specified time threshold is reached.
It seems straightforward at first (promising libraries like jquery-idletimer), however the inactivity tracking needs to support multiple tabs of the same website and even when the user closes all tabs of the website. The duration they have exited the page should count towards the threshold, and if reached while page is closed, my logout API needs to still be called. If the user reopens the page before the threshold, the timer needs to be reset.
Is this still possible from the frontend?

How to prevent some scripts on page to not refresh with page reload

I have a website in which I've added a code with which it reloads every 1-2 mins.
All I want to do this is, place a timer code there, and put a go-to "X" URL script after that time is completed.
But timer and that script got refresh after page reloads?
How to prevent and at the same time implement timer and go to a URL?.
Any Ideas?
You can't refresh a page and keep it's script not refreshed, but... you can use window.localStorage or document.cookie!
I would check if the cookie exists.
If not: create a cookie, make it's value the current
Date.now().
If there is a cookie, compare it's Date to the current to get
the time passed. Then, you can redirect as wanted and delete the
cookie.

Webpage redirection time

I want to calculate time consumed in redirecting from 1 webpage to another webpage.
For Example:
1) I am using Facebook in Google Chrome browser.
I have shared 1 link on my Facebook profile like below:
http://www.webdeveloper.com/
(It's not only Facebook. It can be any domain having link to another domain).
2) When I click on this link from my Facebook profile, then this website will open in new tab.
3) I want to calculate time difference in miliseconds or microseconds between below two events:
First Event: Time of clicking link "http://www.webdeveloper.com/" from my Facebook profile.
Second Event: Time of completely loading webpage of "http://www.webdeveloper.com/".
Thank you in advance.
Unless you load the linked page yourself into a frame or with xmlhhtp request, your facebook page does not have control of another page. In other words, as soon as the user clicks the link you have no control and it runs separately. If you use a frame or load the page ajax style with javascript into an object, it's not going to give you the same kind of timing. So this is basically a pointless excercise as you can't do it. You could potentially setup your own browser with whatever analyzer so it will give you timings but you can't set up any code that would time it for visitors, for the aforementioned reason. If it was possible to do such things then this code could also manipulate the linked to page and take over it. With such lax security you couldn't trust any link you click.

trigger jQuery code after 10 min on in-activity

What would be the best way to monitor activity of a user on the page? I am developing a CMS system and using this as a security feature, if user is inactive for set amount of minutes then jQuery would trigger a function which would trigger whole page overlay and load in login script having to force the user to re-enter the password in-order to reopen the page or else after so many failed attempts PHP would force the user to logout script and destroy entire session.
So here how it would go
If no activity after 5min
jQuery(checks user activity every 5min) -> loop <- jQuery(if no activity after 5min) -> function(trigger overlay + authorization script via AJAX)
If there is activity
jQuery(checks user activity every 5min) -> loop <- jQuery(if active go back to loop)
So ye this is about it, thanks in advance.
Activity Definition for this script: Movement of mouse or input(keyboard) of text into text fields or clicking elements.
You can use jQuery's Idle Timer plugin.
As Justin says, jQuery does have an idle timer plugin. However, this method is not going to be sufficient alone unless your idle timer also destroys login cookies - your overlay can easily be circumvented by an array of browser plugins, or even (depending on how your application is built) GET parameters.
Reloading the page would even circumvent this "security" unless you log the user out.

Categories

Resources