Jquery stopwatch script not restarting with restored database time

57 views Asked by At

So here's the deal. I've used a jquery script written for a stopwatch. I dont remember who's script and its not relevant. It works great for timing my projects and submitting to a database. What I'm having trouble with is figuring out where to modify the script to start calculating from the time stored in the database when editing is necessary ( like saving the information before it is complete ). I can add the time to the form input field fully formatted but as soon as I start the timer again it starts from 00:00:000. Keeping in mind that starting and stopping the timer before storing it works just fine. Grr. The script is a mess. Which I feel is the majority of my problem since I am a beginner javascript/jquery user.

// 0/1 = start/end
// 2 = state
// 3 = length, ms
// 4 = timer
// 5 = epoch
// 6 = disp el
// 7 = lap count

var t=[0, 0, 0, 0, 0, 0, 0, 1];

function ss() {
    t[t[2]]=(new Date()).valueOf();
    t[2]=1-t[2];

    if (0==t[2]) {
        clearInterval(t[4]);
        t[3]+=t[1]-t[0];
        var row=document.createElement('tr');
        var td=document.createElement('td');
        td.innerHTML=(t[7]++);
        row.appendChild(td);
        td=document.createElement('td');
        td.innerHTML=format(t[1]-t[0]);
        row.appendChild(td);
        td=document.createElement('td');
        td.innerHTML=format(t[3]);
        row.appendChild(td);
        //document.getElementById('lap').appendChild(row);
        t[4]=t[1]=t[0]=0;
        disp();
    } else {
        t[4]=setInterval(disp, 43);
    }
}
function r() {
    if (t[2]) ss();
    t[4]=t[3]=t[2]=t[1]=t[0]=0;
    disp();
    //document.getElementById('lap').innerHTML='';
    t[7]=1;
}

function disp() {
    if (t[2]) t[1]=(new Date()).valueOf();
    t[6].value=format(t[3]+t[1]-t[0]);

    //alert(format(t[3]+t[1]-t[0]));
}
function format(ms) {
    // used to do a substr, but whoops, different browsers, different formats
    // so now, this ugly regex finds the time-of-day bit alone
    var d=new Date(ms+t[5]).toString()
        .replace(/.*([0-9][0-9]:[0-9][0-9]:[0-9][0-9]).*/, '$1');
    var x=String(ms%1000);
    while (x.length<3) x='0'+x;
    d+='.'+x;
    return d;
}

function load() {

    t[5]=new Date(1970, 1, 1, 0, 0, 0, 0).valueOf();
    t[6]=document.getElementById('disp');

    disp();
}

This script attaches to the following html input

<input type='text' class="form-control" id='disp' name="assy" value="" />
<div class="input-group-btn">
    <!-- Buttons -->
    <button type='button' class="btn btn-primary-outline" onclick='ss()' onfocus='this.blur()'><span class="icon icon-controller-play"></span></button>
    <button type='button' class="btn btn-warning-outline" onclick='r()' onfocus='this.blur()'><span class="icon icon-cycle"></span></button>

I think my attempts to try and modify the date in the various functions doesn't work because I can't seem to figure out which t[] and/or function needs to read from the input value that I've added with php. I've tried to use something like this to fetch the new input value and add this to the various "new Date()" parts of the functions to see if that would trial and error the problem.

var x = document.getElementById("disp").value;

Can you find the issue? ... besides finding a new script!

1

There are 1 answers

0
CLHardman On

To conclude this issue... I'm simply not able to locate the dots that belong to the i's. What I did end up discovering was that I could make some headway working with the new Date() functions in the script. I could get the script to recognize the time it needed to start from but then simply wouldn't run at all anymore. I've since moved on to use the Jquery Runner Plugin which took care of my needs.