How to redirect the 'interface' to a home page after a downtime?

Asked

Viewed 679 times

2

I’m building an interactive interface for an HTML/CSS3 totem that will work offline, with local files, no localhost, using Chrome in "Kiosk" mode and implemented this script (stitched with the help of the net) so that after a downtime, on mouse/touchscreen the interface goes back to the home page, it turns out that nothing happens, I work with HTML and CSS3, but now I started programming and I’m still beginner, so where I went wrong?

var idleTime = 60000;

$(document).ready(function() {
    //Increment the idle time counter every minute.
    var idleInterval = setInterval(timerIncrement, 60000); // 1 minute

    //Zero the idle timer on mouse movement.
    $(this).mousemove(function(e) {
        idleTime = 0;
    });
    $(this).keypress(function(e) {
        idleTime = 0;
    });
});

function timerIncrement() {
    idleTime = idleTime + 1;
    if (idleTime > 1) { // 20 minutes
        window.location.reload = "initial_page.html";
    }
}

3 answers

1

Instead of:

    window.location.reload = "initial_page.html";

Utilize:

    window.location.replace("initial_page.html");

Or:

    window.location.href = "initial_page.html";
  • 1

    Thanks, this change solved the problem, the code is 100% functional.

1

The problem with your code is in window.location.reload = "initial_page.html", take a look at documentation p/ know better how the method works. The rest is working well, I translated the code and put some log’s just to make it clear what’s going on. As @Derlei replied, use window.location.replace to make the redirect.

var segundos = 0;

$(document).ready(function() {
    //Incrementa o tempo de inatividade
    var inatividade = setInterval(timerIncrement, 1000); 

    //Zera o tempo de inatividade
    $(this).mousemove(function(e) {
        segundos = 0;
        console.log("Mouse movimentado.");
    });

    $(this).keypress(function(e) {
        segundos = 0;
        console.log("Tecla pressionada.");
    });
});

function timerIncrement() {
    segundos++;
    console.log(segundos + " segundo(s) de inatividade.");
    if (segundos > 5) { 
        console.log("Redirecionando...");
        window.location.replace("initial_page.html");
    }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  • I was really suspicious of window.location.Reload(); thanks for the clarification, I will check.

0

Hello, I use this plugin, it treats various conditions, I changed too window.location.reload for window.location.href:

https://www.paulirish.com/2009/jquery-idletimer-plugin/

Code taken from the plugin page:

 $.idleTimer(10000);

    $(document).bind("idle.idleTimer", function(){
     // executado quando o usuário ficar inativo, aqui você pode por o redirecionamento
        window.location.href= "initial_page.html";
    });


    $(document).bind("active.idleTimer", function(){
     // executado quando o usuário voltar a ficar ativo
    });

    // para parar o timer
    $.idleTimer('destroy');

Browser other questions tagged

You are not signed in. Login or sign up in order to post.