Auto-update variable value in JS

Hi all,

I'm a beginner at JS and PHP, so please forgive my ignorance and bear with me :)

I'm trying to implement a live counter on my website. This counter should display the number of translated words up to now, and I'd like this number to update "live" to reflect the number of translated words (based on my yearly average).

To simplify, I set a variable

$wordsPerYear

with an average of words translated per year, say 1,000. I also set the start date to 10 years ago (2004), so that it returns roughly 10,000.

So here's my code so far:

<!DOCTYPE html>
<html lang="en">
<head>
 <title>Live Word Count</title>
 <style type="text/css">
 .count {
 width: 100%;
 margin: 0 auto;
 padding-top: 10%;
 text-align: center;
 }
 </style>
 <?php
 $now = time();
 $start = mktime(0, 0, 0, 3, 07, 2004);
 $wordsPerYear = 1000;
 $totalDays = (($now - $start) / 86400); // number of a seconds in a day
 $count = $totalDays / 365 * $wordsPerYear;
 $count = round($count);
 ?>

 <script type="text/javascript">
 var totalWords = <?php print($count); ?>;
 function updateCounter() {
 totalWords = totalWords + 1; // need to do something here to update to the real word count instead of incrementing by 1 each second
 document.getElementById("carb").innerHTML=totalWords; }
 </script>
</head>

<body onload="setInterval('updateCounter()', 1000);">
 <div class="count">
 <span id="carb">
 Loading Word Count...
 </span>
 </div>
</body>
</html>

I just need to be able to make this figure update "live" with the real value of words translated instead of a "fake" live incrementation using

setInterval('updateCounter()', 1000)

.

Could anyone help me achieve this?
Let me know if clarifications are needed, it's quite complicated to explain clearly what I want to do!

Thanks in advance

Auto-update variable value in JS

bs0d

daveVk

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week