Frage zur Stoppuhr mit Javascript

  • Moin zusammen,


    ich habe mich mal extra für die Frage bei euch im Forum angemeldet, da ich leider nicht mehr weiter weiß.

    Wir sollen von der Schule auf der Webseite Code.org unser eigene App zusammenbasteln und verwendet wird dafür Javascript. Ich habe mir ein Fitness-App aufgebaut, in der man zwischen Cardio und Kraftsport auswählen kann und man seine Ergebnisse speichern kann. Beim Cardio-Bereich wollte ich zusätzlich noch eine Stoppuhr einfügen. Die funktioniert auch soweit, aber das Problem ist, das bei mir der Text zwar bei Stop pausiert und beim Reset auch resettet wird, die Zeit läuft im Hintergrund allerdings immer weiter. D.h. wenn ich den Start Button anschließend wieder klicke, dann läuft die Zeit einfach immer weiter.


    Ich sitze seit dem Wochenende dran das Problem zu lösen und habe mir auch diverse Tutorials dazu durchgelesen, habe bisher aber keine Lösung gefunden und weiß auch nicht mehr was ich sonst machen soll. Deshalb hoffe ich das mir hier jemand dabei weiterhelfen kann.

    Unten ist einmal der Code für die Stoppuhr, die hatte ich mir nämlich in einem eigenen Projekt nochmal aufgebaut und versucht zu lösen ohne irgendetwas im Hauptprogramm kaputt zu machen. Sorry auch für die Unordnung, ich hab das Step by Step aufgebaut und auch eigentlich gar keine Ahnung von sowas.


    Also hoffentlich kann mir wer weiterhelfen. Vielen Dank schon einmal für eure Vorschläge. :)

    _________________________________________

    //Stoppuhr anzeigen

    var elapsedTime, aktuelleZeit, milliseconds = 0, seconds = 0, minutes = 0, hours = 0, time;

    var zeit = new Date();


    time = hours+":"+minutes+":"+seconds+":"+milliseconds;

    setText("label_timer", time);


    //Stoppuhr Funktionen

    var i = 0;

    var statusTimer = false;


    function calculateTimer() {

    aktuelleZeit = new Date();

    elapsedTime = new Date (aktuelleZeit - zeit);


    milliseconds = elapsedTime.getMilliseconds();

    seconds = elapsedTime.getSeconds();

    minutes = elapsedTime.getMinutes();

    hours = elapsedTime.getHours() -1;


    time = hours+":"+minutes+":"+seconds+":"+milliseconds;

    setText("label_timer", time);

    }

    function startTimer() {

    setProperty("button_work", "text", "Timer stoppen");

    statusTimer = true;

    }

    function updateTimer() {

    i = setInterval(calculateTimer, 1);

    }

    function stopTimer() {

    clearInterval(i);

    statusTimer = false;

    //Timer Zeit bei Stop speichern

    setProperty("button_work", "text", "Timer starten");

    }

    function resetTimer() {

    milliseconds = 0, seconds = 0, minutes = 0, hours = 0;

    time = hours+":"+minutes+":"+seconds+":"+milliseconds;

    setText("label_timer", time);

    }

    //Stoppuhr starten und stoppen

    onEvent("button_work", "click", function() {

    if (statusTimer === false) {

    updateTimer();

    startTimer();

    } else {

    stopTimer();

    }

    });


    //Stoppuhr resetten

    onEvent("button_reset", "click", function() {

    resetTimer();

    });

  • Vielen dank erstmal für deine Lösung. Das löst schon einmal das Problem mit dem Reset. Wie müsste man das mit dem Stop machen? Also wenn man nach dem anhalten wieder auf starten klickt, das die gestoppte zeit genommen wird?

  • Vielen dank erstmal für deine Lösung. Das löst schon einmal das Problem mit dem Reset. Wie müsste man das mit dem Stop machen? Also wenn man nach dem anhalten wieder auf starten klickt, das die gestoppte zeit genommen wird?

    Was meinst du genau ?.

    Die Uhr Zeigt zb 10 Sekunden an . Du Drückst dann auf Stopp und die Zeit soll dann irgedwo stehen .Dann drückst du wieder start und die Uhr läuft wieder .

    Also soll nach jeden stopp die Zeit irgendwo stehen und nicht immer wieder überschrieben werden ?

  • Sorry das ich jetzt erst antworte ...


    Was ich meine ist, wenn ich z.B. bei Sekunde 9 auf Stop klicke, dann soll, wenn ich wieder auf Timer starten klicke, dass der Timer bei Sekunde 9 weiter zählt. Momentan ist das so, dass dann auf einmal 22 sekunden oder je nach dem wie lange man pausiert hat weitergezählt wird.


    Ich hoffe man versteht was ich meine ^^

  • Wow vielen dank. Und dann auch noch die Rundenzeiten. Ich hatte auch schon drüber nachgedacht, aber erstmal weggelassen, da erstmal grundsätzlich die Stoppuhr funktionieren sollte.

    Ist auf jeden Fall jetzt perfekt, vielen dank! :D

  • aloha,


    sehr gute Lösung, wollte ich gleich ausprobieren...


    aber was mir aufgefallen ist:

    die zeit wird nur gezählt wenn das fenster aktiv ist.

    und pro minute mit einer echten uhr läuft das script pro minute ca. 6 sek langsamer.


    kann das sein?


    viele grüße

    frogx

  • Mit den 6 Sekunden liegt wohl am setinterval. Da müßte 1000 stehen um einer echten Uhr Nahe zu sein.


    Wenn ich in anderen Browserfenster rum surfe zählt die Uhr trotzdem weiter. Ich glaube mal gelesen zu haben das bei einigen Browser bei nicht aktiven Fenster die performance irgendwie gedrosselt wird durch ( zb Scripte anhalten und co ). Aber um das genau zu sagen müste ich auch erst Goggeln ,kann mich da auch irren

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!