Stop nagivation of pages

[Mahamed_Qlik]

Dear all,

I am using below html code to navigate between different html pages in my mashup. Basically this code is to navigate between the pages for 30 sec.

Page1.html

<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page2.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

Page2.html

<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page3.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

Page3.html

<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page1.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

So, I need to know if there is anything I can do to stop on clicking any of the pages between.

for example : while navigating is running and I click on page2 then it should stop the navigation timer till the time I am active on page2 once I finished then it should either resume to further navigation of can start the timer from begining.

[ajaykakkar93]

Hi,

what i understand is you are migrating from Page 1 to Page 2 then from Page 2 to Page 3 and so on.
you need to halt the timer if there is some activity going on on the page, if there is no activity then you need to switch the page to another one in 30 sec & the timer can be restarted from 30sec.


A simple solution will be, to add a code that if the mouse is moved or any key is up/down the set timeout should be reset to 30 sec 

[Mahamed_Qlik]

Hi Ajay,

you are correct. But I dont know where I can write the code to set timeout and reset in below code :
<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page2.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

[ajaykakkar93]

Hi,

<script>
$(document).ready(function(){
  var timeout = 3000,lastV=timeout;
  setInterval(function() {
    setTimeout(function() { 
      $(document).mousemove(function(event){
         timeout = 3000;    
      });
       timeout--;
       console.log(timeout); // comment this in prod
       window.location.replace("https://Page2.html");
    },timeout);
  },timeout);   
});
</script>

[Mahamed_Qlik]

Hi Ajay,

May be some changes required in given code. But let me tell you more clear this time.

I have Page.html and page2.html. I am navigating between these two pages using below code in each html page(only URL is changed )

Navigation from page1 to page2 :
<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page2.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

Navigation from page2 to page1 :

<script language="javascript" type="text/javascript">
$(document).ready(function(){
setInterval(function() { //even setTimeout can be used
window.location.replace("https://Page1.html"); // redirect to main.html after 30 seconds
}, 30000);
});
</script>

This is working fine automatically both the pages are navigating on given time interval. Now requirement is whenever I click on any page1 or page2 during its navigation the time should stop till the time I am doing some activity on the page once my activity finished the timer should resume and continue page navigation automatically.

Hopefully this time It is more clear.

Thank you.

[ajaykakkar93 · Accepted solution]

correct me i am wrong, You want to pause the timer & resume both activities to pause & continue is it a manual process??

[Mahamed_Qlik]

Or I can ask if we can have two button on each page to " start" and " stop" with existing auto page navigation.

I mean we already navigating the pages using below code. we will this code as it is. in addition to it can we add two button as mentioned above so if anyone wants to do some activity on page he can simply click on " stop" page which should stop the auto navigation and once finished simply click on start button to continue page navigation.

What do you think about this ?

[ajaykakkar93]

Yes, Start & stop you can do via function to reset the timer.