JS: Timer, bin mit meiner Mathematik am Ende

nietaL

NGBler
Registriert
8 Sep. 2013
Beiträge
231
Ort
Exilgullianer
Hey Leute,

ich habe mir mit JS eine Armbanduhr programmiert, die auch hervorragend funktioniert. Neben dem Datum möcht ich auch eine CountDown-Anzeige einbauen.
Meine Idee war die folgende: Ich vergleiche einfach die Milisekunden der Jetztzeit mit der der Zielzeit und rechne es in Tage, Stunden, Minuten und Sekunden um. Wenn es gar nicht funktionieren würde, wäre ich zufriedener als mti diesem Ergebnis, dass nicht falsch aber auch nicht richtig ist. :confused:

[src=javascript]var jetzt = new Date();

var day = jetzt.getDate();

function f_uhr()
{
var endDate = 'Mar 09 2017 23:59:59';

var endMs = Date.parse(endDate);
var currentMs = Date.parse(new Date()) ;

var resttage = (endMs-currentMs) / 86400000;
var reststunden = (endMs-currentMs) / 3600000 - Math.round(resttage) * 24;
var restminuten = (endMs-currentMs) / 60000 - Math.round(resttage)*24*60 - Math.round(reststunden)*60;

var restsekunden = (endMs-currentMs) / 1000 - Math.round(resttage)*24*60*60 - Math.round(reststunden)*60*60 - Math.round(restminuten)*60;

document.getElementById('countdown').innerHTML = Math.round(resttage)+':'+Math.round(reststunden)+':'+Math.round(restminuten)+':'+Math.round(restsekunden);


window.setTimeout("f_uhr()", 1000);
}

f_uhr();
[/src]

Wie man auf dem Bild sieht, kommt es zu folgendem Fehler:
Die letzten 29 (29 bis 0) Sekunden des Sekundencountdowns stimmen. Aber statt anstatt von 59 zu beginnen, fängt er bei -1 an und zählt bis -30, wechselt dann auf (+)29 und zählt wieder richtig weiter.
Außerdem wird die -13 ausgelassen, sodass es bei jeder Minute zu einer Verschiebung um je eine Sekunde kommt. Ich raff das nicht. :eek:

Hat jemand einen Plan?
 

Anhänge

  • uhr.jpg
    uhr.jpg
    92,7 KB · Aufrufe: 62
[src=javascript]
var jetzt = new Date();
var day = jetzt.getDate();

function f_uhr()
{
var endDate = 'Mar 09 2017 23:59:59';

var endMs = Date.parse(endDate);
var currentMs = Date.parse(new Date());
var restMs = endMs-currentMs;

var resttage = Math.floor(restMs/(1000*60*60*24));
var resttageMs = resttage * 1000*60*60*24;

var reststunden = Math.floor((restMs - resttageMs) / (1000*60*60));
var reststundenMs = reststunden * 1000*60*60;
if(reststunden < 10){
reststunden = '0' + reststunden;
}

var restminuten = Math.floor((restMs - (resttageMs + reststundenMs)) / (1000*60));
var restminutenMs = restminuten * 1000*60;
if(restminuten < 10){
restminuten = '0' + restminuten;
}

var restsekunden = Math.floor((restMs - (resttageMs + reststundenMs + restminutenMs)) / 1000);
if(restsekunden < 10){
restsekunden = '0' + restsekunden;
}

document.getElementById('countdown').innerHTML = resttage + ':' + reststunden + ':' + restminuten + ':' + restsekunden;

window.setTimeout("f_uhr()", 1000);
}

f_uhr();[/src]

Well... Math.round() war hier nicht der Burner :)
Außerdem werden Multiplikation und Division vor Addition und Subtraktion ausgeführt.
 
Zuletzt bearbeitet:
Puh... also ohne da jetzt zuviel zu sagen, aber du solltest mehr mit dem Modulo Operator "%" arbeiten, also für Stunden:
"Math.floor((1272200000 / (60 * 60 * 1000)) % 24)".

Funktioniert meiner Meinung nach eigentlich besser. Der Module "% 24" sorgt auch in diesem Beispiel dafür, das bei 25 Stunden wieder mit 1 Stunde angefangen wird. Was einem Countdown wohl viel eher entspricht.
 
Falls Du Dich auf mich bezogen hast - ich habs absichtlich so übersichtlich und nachvollziehbar wie möglich ausgedrückt. Falls nicht, einfach ignorieren :D
 
@Jester, @nietal: Eigentlich meinte ich @nietaL - aber ja, dein Beispiel finde ich auch schrecklich Jester... :D *duck*
 
  • Thread Starter Thread Starter
  • #7
Also erst einmal danke. Es funktioniert perfekt. Das mit dem math.round und math.floor muss ich mir noch einmal zu Gemüte führen. Aber hab ich echt "Puntkrechtung vor Strichrechnung" missachtet/vergessen? Also danke für den Hinweis, aber ich war auch in der 5. Klasse :D Wäre ja peinlich.
 
Auch wenn die Frage ansich beantwortet ist, ein kleiner Tipp. Javascript ist Zeilensensitiv, deshalb kann man optional (nicht empfohlen!) das Semikolon am ende des Befehls weglassen. Aber den von PHP bekannten Stil die geschweiften Klammern in die nächste Zeile zu packen, ist gefährlich.
Bei Funktionen mag das noch gehen, bei einem return crashed es gewaltig, deshalb gar nicht erst angewöhnen!

[src=javascript]
function foo() {
return
{
foo: 'bar',
}
}

foo(); // undefined


function bar() {
return {
bar: 'foo';
}
}


bar(); // {bar: 'foo'}
[/src]
 
Zurück
Oben