Warning on time out script

With this JS code on inactivity, how would you add an alert that pop-ups with 1 minute remaining as a warning?

        <script type="text/javascript">
            (function () {
                var idleDurationSecs = 5;
                var redirectUrl = 'timeranout.htm';  // Redirect idle users to this URL
                var idleTimeout;

                var resetIdleTimeout = function () {
                    if (idleTimeout) clearTimeout(idleTimeout);

                    idleTimeout = setTimeout(function () {
                        location.href = redirectUrl
                    }, idleDurationSecs * 1000);
                };

                resetIdleTimeout();

                ['click', 'touchstart', 'mousemove'].forEach(function (evt) {
                    document.addEventListener(evt, resetIdleTimeout, false)
                });
            })();


</script>

I appreciate any help with this…thank you.

I would trigger a warning function instead, and have that warning function then trigger a 1 minute timeout for the reset.

1 Like

Better said that I did - that’s exactly what I was looking for!
I am just not sure how to do that.

You’ve already done it in the code above for the resetIdleTimeout function. You just need to do it for a showWarning function, and then in there do it again for the resetIdleTimeout function.

I am somewhat lost. Are you looking for something like this:

var resetIdleTimeout = function () { 
if (idleTimeout) clearTimeout(idleTimeout); 
var idleDurationSecs = 4; 
alert("Time expired!");

No not really. Having two timers going at the same time introduces more problems.

It is harder to break the simpler situation, where only one timer is used at a time.
First one timer for the warning message. And then, when the warning is shown, to start another timer for 1 minute to redirect.

you can use below change it according your need

<script type="text/javascript">
              var IDLE_TIMEOUT = 1800; //1800=30min//seconds
              var _idleSecondsCounter = 0;
              document.onclick = function () {
                  _idleSecondsCounter = 0;
              };
              document.onmousemove = function () {
                  _idleSecondsCounter = 0;
              };
              document.onkeypress = function () {
                  _idleSecondsCounter = 0;
              };
              window.setInterval(CheckIdleTime, 1000);
              function CheckIdleTime() {
                  _idleSecondsCounter++;
                  if (_idleSecondsCounter >= IDLE_TIMEOUT) {
                      alert("your session has expired!");
                  }
              }
              </script>

Thank you for your input. Is your code a stand alone code or an addition to my existing first posted code? I can’t seem to get it to work either way.

So are you looking for something like this to just show the alert?

setTimeout(function(){ alert("Hello"); }, 60000);

And in the function with the alert, trigger another timeout for 1 minute that does your redirect.

But with my original code the time would start over with mouse click or even moving the mouse. How does that get incorporated with a 1 minute alert?

It would work in the same way, for you just assign the setTimeout to the same timer variable, which gets cleared when mouse movement takes place.

So here is the code so far. Have the times short for easier testing. The alert comes up but the rest fails. I assume that if you click ok on the alert, the time should start over and if not it should redirect? Thank you for your help.

       <script type="text/javascript">
            (function () {
                var idleDurationSecs = 7000;
                var redirectUrl = 'timeranout.htm';  // Redirect idle users to this URL
                var idleTimeout;
                setTimeout(function () { alert("Hello"); }, 5000);

                var resetIdleTimeout = function () {
                    if (idleTimeout) clearTimeout(idleTimeout);

                    idleTimeout = setTimeout(function () {
                        location.href = redirectUrl
                    }, idleDurationSecs * 1000);
                };

                resetIdleTimeout();

                ['click', 'touchstart', 'mousemove'].forEach(function (evt) {
                    document.addEventListener(evt, resetIdleTimeout, false)
                });
            })();


</script>

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.