Changing Seconds to Hours in Timer

JavaScript
1

Hello everyone!

I have the following code that will count the elapsed time and print the value in seconds after the user hits the stop button. However we are trying to get it to post the elapsed time in hours. So lets say the elapsed time is 20 mintues, the output would be .3 hours. I appreciate any help or tips you can give me.

<script type="text/javascript">

// Javascript to compute elapsed time between "Start" and "Finish" button clicks
function timestamp_class(this_current_time, this_start_time, this_end_time, this_time_difference) { 
        this.this_current_time = this_current_time;
        this.this_start_time = this_start_time;
        this.this_end_time = this_end_time;
        this.this_time_difference = this_time_difference;
        this.GetCurrentTime = GetCurrentTime;
        this.StartTiming = StartTiming;
        this.EndTiming = EndTiming;
    }

    //Get current time from date timestamp
    function GetCurrentTime() {
    var my_current_timestamp;
        my_current_timestamp = new Date();              //stamp current date & time
        return my_current_timestamp.getTime();
        }

    //Stamp current time as start time and reset display textbox
    function StartTiming() {
        this.this_start_time = GetCurrentTime();        //stamp current time
        document.TimeDisplayForm.TimeDisplayBox.value = 0;      //init textbox display to zero
        }

    //Stamp current time as stop time, compute elapsed time difference and display in textbox
    function EndTiming() {
        this.this_end_time = GetCurrentTime();          //stamp current time
        this.this_time_difference = (this.this_end_time - this.this_start_time) / 1000; //compute elapsed time
        document.TimeDisplayForm.TimeDisplayBox.value = this.this_time_difference;      //set elapsed time in display box
        }

var time_object = new timestamp_class(0, 0, 0, 0);  //create new time object and initialize it

//-->
</script>

    <form>
        <input type="button" value="Start" onClick="time_object.StartTiming()"; name="StartButton">
    </form>
    <form>
        <input type="button" value="Finish" onClick="time_object.EndTiming()"; name="EndButton">
    </form>
    <form name="TimeDisplayForm">
    Elapsed time:
      <input type="text" name="TimeDisplayBox" size="6">
    seconds
    </form>
2

You can divide seconds by 60 to get the number of minutes.

If you want the resulting number to a certain number of decimal places, you can use toFixed()

3

Thanks for the reply paul!

Then would we divide that again by 60 to get the hours?

4

There are 60 minutes in an hour, so you can divide the seconds by (60 * 60)

5

I was told to divide by 36,00,000 (1 hour = 60 mins * 60 secs * 1000 milliseconds) to get the value in hours.=, would that be correct?

6

That’s only if the value that you start with is in milliseconds.

7

Thanks paul. I was able to get the time in hours working, but when I try toFixed(2) it puts out 2 decimal places but it also puts the elapsed time as 0.00.

document.TimeDisplayForm.TimeDisplayBox.value = this.this_time_difference.toFixed(2);      //set elapsed time in display box
8

That implies that this.this_time_difference is also zero. Trace it back.

9

I took out .toFixed(2) and it outputs the correct answer. As soon as I put it back in, it outputs 0 again. I am not sure where to trace it back to since thats all I am adding to my code.

10

Do you have a test page, or some demo code so that we can also experience the problem and diagnose a solution?

11

Here is the code that I am using without the .toFixed(2).

<script type="text/javascript">

// Javascript to compute elapsed time between "Start" and "Finish" button clicks
function timestamp_class(this_current_time, this_start_time, this_end_time, this_time_difference) { 
        this.this_current_time = this_current_time;
        this.this_start_time = this_start_time;
        this.this_end_time = this_end_time;
        this.this_time_difference = this_time_difference;
        this.GetCurrentTime = GetCurrentTime;
        this.StartTiming = StartTiming;
        this.EndTiming = EndTiming;
    }

    //Get current time from date timestamp
    function GetCurrentTime() {
    var my_current_timestamp;
        my_current_timestamp = new Date();              //stamp current date & time
        return my_current_timestamp.getTime();
        }

    //Stamp current time as start time and reset display textbox
    function StartTiming() {
        this.this_start_time = GetCurrentTime();        //stamp current time
        document.TimeDisplayForm.TimeDisplayBox.value = 0;      //init textbox display to zero
        }

    //Stamp current time as stop time, compute elapsed time difference and display in textbox
    function EndTiming() {
        this.this_end_time = GetCurrentTime();          //stamp current time
        this.this_time_difference = (this.this_end_time - this.this_start_time) / 3600000; //compute elapsed time
        document.TimeDisplayForm.TimeDisplayBox.value = this.this_time_difference;      //set elapsed time in display box
        }
        
      

var time_object = new timestamp_class(0, 0, 0, 0);  //create new time object and initialize it

//-->
</script>

    <form>
        <input type="button" value="Start" onClick="time_object.StartTiming()"; name="StartButton">
    </form>
    <form>
        <input type="button" value="Finish" onClick="time_object.EndTiming()"; name="EndButton">
    </form>
    <form name="TimeDisplayForm">
    Total Time Spent working on the car:
      <input type="text" name="TimeDisplayBox" size="6">
    hours
    </form>
12

Have you tried waiting longer before stopping the timer?

Currently the value is something like:
0.0011266666666666667

When that’s restricted to two decimal places, that is only this green part of the number:

[color="green"]0.00[/color]11266666666666667
13

Ok, I see why it is doing that now. We just decided we are going to go to 4 decimal places. Thanks for your help, its highly appreciated!