Click here to Skip to main content
15,893,668 members
Please Sign up or sign in to vote.
4.50/5 (2 votes)
See more:
Hello experts, i am building an online exam application. It has a Jquery timer...everything works fine...but i recently noticed that when the examinee minimizes, opens other tabs...or basically the browser is out of focus...the jquery timer pauses...after a certain while, if i again open the browser, the timer starts again from the value it had when the browser was minimized. I don't know what the issue here is. I've used both older and newer version of the jquery library...and tried all sorts of things, but nothing seems to work. This problem persists in mozilla and chrome...but suprizingly IE does not show this problem...How can i resolve this issue...as most people do not use IE these days...even if they did, we can't be sure that, they'll always use IE.
Here is a snipped of the jQUery code:
JavaScript
var countdownTimer, countdownCurrent;
        $(document).ready(function () {
            countdownCurrent = $('#ctl00_MainContent_example2submit').val() * 100;
            countdownTimer = $.timer(function () {
                var min = parseInt(countdownCurrent / 6000);
                var sec = parseInt(countdownCurrent / 100) - (min * 60);
                var micro = pad(countdownCurrent - (sec * 100) - (min * 6000), 2);
                var output = "00"; if (min > 0) { output = pad(min, 2); }
                $('.countdowntime').html(output + ":" + pad(sec, 2) + ":" + micro);
                if (countdownCurrent == 0) {
                    $('#ctl00_MainContent_btnNext').click();
                    
                } else {
                    countdownCurrent -= 7;
                    if (countdownCurrent < 0) { countdownCurrent = 0; }
                }
            }, 70, true);
            $('#example2submit').bind('keyup', function (e) { if (e.keyCode == 13) { countdownReset(); } });

        });
function CheckIfOptionSelected() {

            var vFlag = true;
            var radioButton1 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_0'];
            var radioButton2 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_1'];
            var radioButton3 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_2'];
            var radioButton4 = document.forms[0].elements['ctl00_MainContent_rdBtnListOptions_3'];

            if (radioButton1.checked == false && radioButton2.checked == false && radioButton3.checked == false && radioButton4.checked == false && countdownCurrent > 0) {
                vFlag = false;
            }

            else {
                countdownReset();
                vFlag = true;
            }
            return vFlag;
        }

        function countdownReset() {
            var newCount = parseInt($('#ctl00_MainContent_example2submit').val()) * 100;
                        if (newCount > 0) { countdownCurrent = newCount; }
                    }

        // Padding function
        function pad(number, length) {
            var str = '' + number;
            while (str.length < length) { str = '0' + str; }
            return str;
        }


EDIT

Here is the fiddle...and it is showing the exact problem i mentioned above...just minimize or open another tab and work there for a while...then again focus the browser where the timer is running...you'll see that the timer has not elpsed much...http://jsfiddle.net/mlimbu/wLk5b/3/
Posted
Updated 7-Apr-13 4:33am
v4
Comments
Prasad Khandekar 31-Mar-13 11:38am    
I have tested the code, ofcourese I had to download the timer plugin from (http://code.google.com/p/jquery-timer/), and had to remove pad call. It's working fine no matter if I minimize the browser or open another tab.
Minghang 31-Mar-13 12:32pm    
thankyou prasad for taking the time to do all that...so, does it work in all the browsers??..chrome,mozilla??...i don't know what i am doing wrong then...i'll post all the client side scirpts here so that someone can figure out the problem...i've tried everything but in mozilla and chrome the timer just pauses when the browser is out of focus. Moreover, the timer also freezes in the server i deployed my web app to. Plz, let me know if i have missed out anything in the code. Thanks again
Zoltán Zörgő 31-Mar-13 12:43pm    
Just a note: since jquery runs on client side, it has little or nothing to do with the server - with the exception when the client side logic does ajax calls, and in case of some server dependent initializations.
Prasad Khandekar 31-Mar-13 13:41pm    
I have checked in IE10, FireFox 19.0.2 & Chrome 25.0.1364.172. Did not find any problem.
Minghang 3-Apr-13 3:39am    
Prasad i looked at the main site of the author who wrote the plugin...i think the plugin itself is bugged...have a look at his site...http://jchavannes.com/jquery-timer/demo...and minimize the browser like i said and wait a while and see the time difference....i swear....the timer just starts from the time when the browser was minimized.

1 solution

So don't do it that way.
Instead of setting a count value, store the start Date and Time. When you need to test it, work out the actual time between the current time and the start time. This is your value, and short of resetting the system clock there isn't a lot they can do about it. If clock mods are a problem, then get the time from the server, which they do not have access to!
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900