setTimeout unpredictable behavior in IE9 - javascript

I am looking at a third-party javascript that has a global timer. The timer is used to warn the user with a modal alert box when the session is within 5 minutes of expiration, and any mouse-clicks or keystrokes will reset the timer.
The timer is set up during OnLoad. I wanted to add a second timer, but I have noticed that if the second timer expires while the modal alert box is displayed, the behavior is unpredictable. For sake of simplicity:
var myFunkyTimer1;
var myFunkyTimer2;
function myOnLoadFunction() {
// alert in 10 seconds
myFunkyTimer1 = setTimeout(function(){alert("Get Funky!")}, 10000);
// alert immediately after user clicks ok
myFunkyTimer2 = setTimeout(function(){alert("GET RANDOM!")}, 11000);
}
This works fine in IE8. However, in IE9 the first alert box displays 10 seconds after page load, but if I wait over one second to click OK, the second alert box will not display until sometime between 2-11 seconds afterward.
I can work around this issue, but I was curious if anyone had seen similar issues with setTimeout on IE9 and if Microsoft knows they are randomizing any timers that are queued up behind modal popup windows.

Related

Clicking a button with a chrome extension (ERROR/Not working)

Hello I want to click a button multiple times when on a specific website. I have no idea whats wrong but maybe someone can help me out
function pay(){
document.getElementsByClassName("btn btn--lg btn--full u-margin-b--xl js-place-order2 js-place-order-btn")[0].click();
}
if(window.location.href.includes("https://www.revolveclothing.fr/r/ReviewConfirm.jsp?enteraccount")){
var sleep = setTimeout(pay, 50)
}
The element I am Clicking is the correct one since it works in the chrome console
I hope someone can help me
Since you're using setTimeout, the button will only be pressed once after 50ms is elapsed.
Assuming you want it to be pressed consistently every 50ms, you should change the setTimeout to setInterval like so:
var sleep = setInterval(pay, 50);

clickNextButton not executing properly when previously clicking on the next button

I am building a survey in Qualtrics and use the method clickNextButton to automatically direct the participant to the next page with questions. I implemented the method in several following pages. Furthermore, participants are also able to click the next button themselves. The problem arises when they do so: if they click on the next button before the time limit, in the next page the method directs the participant earlier than given to the page after that one.
this.hideNextButton();
var that = this;
(function(){that.clickNextButton();}).delay(40);
For example, I set the time limit on 40 seconds on every page. On page 1, the participant manually clicks on the 'next button' after 10 seconds. What happens then is that on page 2, the participant is forwarded to page 3 after 28 seconds instead of 40. If he would have clicked on the 'next button' on page 1 after 5 seconds, he would have been forwarded on page 2 to page 3 after around 33 seconds. So it apparently depends on his click speed on page 1 when he will be directed on page 2. How can I prevent this?
Rather than using the timer for automatic redirection. call respective on click method when the question is answered so it will redirect to the respective page. and also reset the timer on every page redirection.
You need to clear the timeout if the respondent clicks the Next button themselves (delay is just a prototypejs implementation of setTimeout). Do it something like this:
Qualtrics.SurveyEngine.addOnReady(function() {
this.hideNextButton();
var that = this;
var timer = setTimeout(function() { that.clickNextButton(); },4000);
Qualtrics.SurveyEngine.addOnPageSubmit(function() { clearTimeout(timer); });
});

JavaScript: Redirecting after closing an alert that came from a popup of another window

The situation is that the site I am working on will display a popup after 10 minutes of inactivity, then 5 minutes (which is counted down in the popup window) an alert message appears informing the user has been logged out.
I am trying to redirect the original page to the page that will done an abandon and redirect to the logon page, but I am struggling to succeed at this;
window.opener.opener.replace("relevantPage.aspx");
window.close;
All in the relevant tags by the way. Any help would be much appreciated
Javascript code for execution after 10 minutes of inactivity will look like this:
showPopup(.....);
// on ready popup action
function onReadyPopup(){
//redirect to "/your page" after 5 minutes
window.setTimeout(function(){ window.location="/your page"; },5*60*1000);
//every second update counter in popup
window.setInterval(updateCounter, 1000);
}

How do I make a pop-up that only appears after the visitor has been on the page for a certain amount of time?

I am trying to add a non-intrusive 'Sign up to our newsletter' pop-up to a website I have been working on, but would like the pop-up to only appear after the user has been on the website for longer than 3 minutes or so. If anyone can help me achieve this that would be great.
Thanks in advance everybody
Right, so there are a couple things to consider. Your popup display attribute, the function that will show your popup, and the amount of time that needs to pass before your function fires.
<style>
.SignupPopup{display:none}
</style>
<!-- Page HTML -->
<div id="SignupPopup" class="SignupPopup"></div>
<script>
// Function that displays your popup
function popSignupForm(){
document.getElementById('SignupPopup').style.display = 'block';
}
// Using setTimeout to fire the popSignupForm function
// in 3 minutes time (this is done in milliseconds)
setTimeout( function(){
popSignupForm();
}, 180000 );
</script>
That will work so long as the user stays on the same page for 3 minutes. If you want the the popup to appear after 3 minutes on your site, you need to create a cookie and timestamp it when the user first arrives at your site. You can then measure the elapsed seconds (from the timestamp) every x intervals to see if its time to popup your newsletter signup form.
The pseudo will look something like this:
function onPageLoad(){
If Cookie Doesn't exist for your site
Create Cookie
Record Timestamp
//Start Checking the cookie to see if
//it's time to show the popup
checkCookieTime()
}
function checkCookieTime(){
// Check to see if at least 3 minutes
// Have elapsed from the time of the cookie's
// cookie's creation
If Now is >= (Cookie.TimeStamp + 3 minutes )
popSignupForm()
Else
// Check again in 10 Seconds
setTimeout( function(){
checkCookieTime()
}, 10000 );
}
Here's a good article from quirksmode on reading/writing cookies.
You can use settimeoutfunction in javascript
setTimeout(function(){},time);

How to save an option for background.html in popup?

I have a problem, what i cant solve yet. I have a popup page with a menu, and tabs, and there is a settings tab. On settings tab, i save some item to localstorage, one of them is notification_time for a desktop notification.
Note: i have no options page!
My extension has this popup window and a background page, its function is to alert user with a desktop notification. I show notification in every 5,10,30 minutes, 1,2 hours etc. And this time should be chooseable on popup pages's options menu. The problem is, if 5 minutes is saved, and when i update to 10 minutes for example, than background.html is not updating himself! I rewrited code almost 20 times, but couldnt find solution. Heres a code sample,and a printscreen to get clear about my problem.
popup:
$("#save_settings").click(function(){
var bgp = chrome.extension.getBackgroundPage();
localStorage.setItem("notifynumber",$("#notifynumber").val());
if($("#notify").attr('checked')){
localStorage.setItem('chbox','true');
} else {
localStorage.setItem('chbox','false');
}
if($("#notif_time_select :selected").val()!="default"){
bgp.setTime(parseInt($("#notif_time_select :selected").val()));
}
if($("#org_select :selected").val()!="default"){
localStorage.setItem('org',$("#org_select :selected").val().replace(/%20/g," "));
}
});
Note: save_settings is a button, on the tab there is a checkbox (if checked then notifications are allowed, else diabled). There are two html select tags, one for choosing some data (org = organisation), and one, for selecting time. "#notif_time_select" is the html select tag, where i choose 5,10,30 minutes etc...
So, whenever i click save button, i save checkbox state to localstorage,and i call one function from background page, to save time.
:bgp.setTime(parseInt($("#notif_time_select :selected").val()));
background page:
for saving time i use function setTime:
var time = 300000; // default
function setTime(time){
this.time=time;
console.log("time set to: "+this.time);
}
after, i use setInterval to show notification periodically
setInterval(function(){
howmanyOnline("notify",function(data){
if(data>localStorage.getItem("notifynumber")){
if (!window.webkitNotifications) { // check browser support
alert('Sorry , your browser does not support desktop notifications.');
}
notifyUser(data); // create the notification
}
if(localStorage.getItem('tweet')=='true'){
if(data>localStorage.getItem("notifynumber")){
sendTweet(data,localStorage.getItem('org'),localStorage.getItem('ck'),localStorage.getItem('cs'),localStorage.getItem('at'),localStorage.getItem('ats'));
}
}
});
},time);
The code inside setInterval works fine, the only problem is,that
},time);
is not updating well. If i change settings to show notifications in every 10 minutes, it stays on 5 minute. The only way is to restart the whole extension. How could i update setInterval's frequency without restarting the whole extension? Thanks Jim
What if i save notif_time to localStorage too, and in background, i set up a listener, to listen for localStorage changes. Is there a way to listen for a particular localStorage item changes?!
Right now, setInterval only runs once, when your application loads. If you want intervals to fire at a new time interval, you should use clearInterval and then make a new call to setInterval.
// set a new time, wipe out the old interval, and set a new interval
function setTime(t) {
window.time = t;
clearInterval(notifInterval);
notifInterval = setInterval(makeNotification, time);
}
// set first interval
notifInterval = setInterval(makeNotification, time);
function makeNotification() {
// do what you need to make a notification
}
Here, notifInterval is a reference to the interval, returned by setInterval, that is used to clear it.
The source code in your question is not completed, but I guess you called setInterval() and then modified window.time in the background page.
Your window.time is not an object but a number value, and setInterval() can't "see" changes of window.time after invocation.
Try this:
function onTimeout() {
// do your notification.
setTimeout(onTimeout, time);
}
setTimeout(onTimeout, time);

Categories

Resources