Javascript countdown just working on Chrome

Question

Well, I'm making a game, and in my game I have a countdown script in javascript that receives the date when the building upgrade is over, and makes a countdown, and when the countdown ends, executes a script that upgrades the building to the next level.

But just works in google chrome, and in the other browsers appears like that:

---

Firefox:

Google Chrome

---

Just the Javascript:

date_default_timezone_set('europe/lisbon');
$datephp = date('Y-m-d H:i:s');


echo'

<script type="text/javascript">
function cdtd() {
    var xmas = new Date("' . $factory_date . '");
    var now = new Date();
    var timeDiff = xmas.getTime() - now.getTime();
    if (timeDiff <= 0) {
    clearTimeout(timer);
    $("#factory_upgrade").load("/include/factory_upgraded.php");
    $("#quantidade_fabricas").load("/include/factory_stats.php");
    }

    var seconds = Math.floor(timeDiff / 1000);
    var minutes = Math.floor(seconds / 60);
    var hours = Math.floor(minutes / 60);
    var days = Math.floor(hours / 24);
    hours %= 24;
    minutes %= 60;
    seconds %= 60;' .
    "var tempo=('0'  + hours).slice(-2)+':'+('0'  + minutes).slice(-2)+':'+('0' + seconds).slice(-2);"
    .
    '
    document.getElementById("secsBox").innerHTML = tempo;
    var timer = setTimeout("cdtd()",1000);
}
</script>
';

---

Complete function:

function factory_update($get){

$userid = $_SESSION['userid'];

$query00 = "SELECT * FROM factory_upgrading WHERE userid = '$userid'";
$result00 = mysql_query($query00) or die(mysql_error());

while($row00 = mysql_fetch_array($result00)){
$factory_upgrade = $row00['userid'];
}

if(!isset($factory_upgrade)){
echo "Sem melhoramentos.";
return 0;
}

$query01 = "SELECT * FROM factory_upgrading WHERE userid = '$userid'";
$result01 = mysql_query($query01) or die(mysql_error());

while($row01 = mysql_fetch_array($result01)){
$factory_level = $row01['new_level'];
$factory_date = $row01['upgraded'];
}


if ($get == "load")
{
echo '<div class="message_upgrades" ">';
echo '<div class="loading"><img src="/images/loading.gif"></img></div>';
echo '</div>';}

else
{

date_default_timezone_set('europe/lisbon');
$datephp = date('Y-m-d H:i:s');


echo'

<script type="text/javascript">
function cdtd() {
    var xmas = new Date("' . $factory_date . '");
    var now = new Date();
    var timeDiff = xmas.getTime() - now.getTime();
    if (timeDiff <= 0) {
    clearTimeout(timer);
    $("#factory_upgrade").load("/include/factory_upgraded.php");
    $("#quantidade_fabricas").load("/include/factory_stats.php");
    }

    var seconds = Math.floor(timeDiff / 1000);
    var minutes = Math.floor(seconds / 60);
    var hours = Math.floor(minutes / 60);
    var days = Math.floor(hours / 24);
    hours %= 24;
    minutes %= 60;
    seconds %= 60;' .
    "var tempo=('0'  + hours).slice(-2)+':'+('0'  + minutes).slice(-2)+':'+('0' + seconds).slice(-2);"
    .
    '
    document.getElementById("secsBox").innerHTML = tempo;
    var timer = setTimeout("cdtd()",1000);
}
</script>
';

echo '<div class="success_upgrades">';
echo '<div class="upgrade_text"><b>Nivel: </b>' . $factory_level . '</div><div class="div_separator"></div><div class="upgrade_text"><b>Duração:</b>
 <div class="secsBox" id="secsBox"></div>
<script type="text/javascript">cdtd();</script></div><div class="div_separator"></div>
';
echo '<div id="close" class="stop_upgrade" ><a href="#" id="close" ><img src="/icon/x.png"></img></a></div>';
echo '</div>';

echo '<script>


    $(".stop_upgrade").click(function (e) {
    e.preventDefault();
    $(factory_upgrade2).empty();



    setTimeout(function(){
    $("#factory_upgrade2").load("/include/upgrade_cancel.php");
    $("#factory_upgrade").load("/include/factory_update.php");
    $("#load").load("/include/cabecalho_content.php");
    $("#industrial").fadeIn();
                $(loader1).delay(1000).hide(0);
                }, 100);


    });


    </script>
    ';
}
}    

Answer 1

The format of $factory_date is invalid according to standard JavaScript and Chrome happens to be able to parse it.

For better results, stick to these Date constructors:

new Date();
new Date(value);
new Date(dateString);
new Date(year, month [, day, hour, minute, second, millisecond]);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date