Décrémenter un champ de type time

Résolu
chabinot Messages postés 391 Statut Membre -  
 chabinot -
Bonjour,
J'ai un champ de type hh:mm:ss (ex: 00:04:08).
J'aimerais le décrémenter en javascript jusqu'à 00:00:00 et dans le même temps
incrémenter un compteur pour arriver à 00:04:08.
J'arrive à peu près à le faire, mais j'ai un décalage de 1s.
Je vous mets le code javascript :
const audio = document.getElementById('audio');
const duration = document.getElementById('duration');
audio.addEventListener('loadeddata', function() {
    duree = audio.duration;
    savDur = Math.round(duree);
    dur = savDur;
    count = 0;
    durs = 0;

    compteur();
})


function compteur() {
    setTimeout(compteur, 1000);

    // count
    if (count > savDur) {
        count = savDur;
    }

    // Récupérer l'heure en clair hh:mm:ss
    j = 60 * 60 * 24;
    h = 60 * 60;
    m = 60;
    s = 1;
    // Début
    nj = Math.floor(durs / j);
    nj != 0 ? durs = durs - (nj * j) : nj = 0;

    nh = Math.floor(durs / h);
    nh != 0 ? durs = durs - (nh * h) : nh = 0;

    nm = Math.floor(durs / m);
    nm != 0 ? durs = durs - (nm * m) : nm = 0;

    ns = Math.floor(durs / s);
    ns != 0 ? durs = durs - (ns * s) : ns = 0;

    nj = Math.round(nj);
    nh = Math.round(nh);
    nm = Math.round(nm);
    ns = Math.round(ns);
    nh = nh = 0 ? '00' : (nh < 10 ? '0' + nh : nh);
    nm = nm = 0 ? '00' : (nm < 10 ? '0' + nm : nm);
    ns = ns = 0 ? '00' : (ns < 10 ? '0' + ns : ns);
    durs = nh + ':' + nm + ':' + ns;
    // Fin durs

    // Récupérer l'heure en clair hh:mm:ss
    jour = 60 * 60 * 24;
    heure = 60 * 60;
    minutes = 60;
    secondes = 1;
    // Début
    nbj = Math.floor(duree / jour);
    nbj != 0 ? duree = duree - (nbj * jour) : nbj = 0;

    nbh = Math.floor(duree / heure);
    nbh != 0 ? duree = duree - (nbh * heure) : nbh = 0;

    nbm = Math.floor(duree / minutes);
    nbm != 0 ? duree = duree - (nbm * minutes) : nbm = 0;

    nbs = Math.floor(duree / secondes);
    nbs != 0 ? duree = duree - (nbs * secondes) : nbs = 0;

    nbj = Math.round(nbj);
    nbh = Math.round(nbh);
    nbm = Math.round(nbm);
    nbs = Math.round(nbs);
    nbh = nbh = 0 ? '00' : (nbh < 10 ? '0' + nbh : nbh);
    nbm = nbm = 0 ? '00' : (nbm < 10 ? '0' + nbm : nbm);
    nbs = nbs = 0 ? '00' : (nbs < 10 ? '0' + nbs : nbs);
    duree = nbh + ':' + nbm + ':' + nbs;
    // Fin duree

    // Affichage de la durée
    duration.innerHTML = duree + ' | ' + durs;
    // Incrémentation des compteurs
    durs = count++;
    duree = dur--;

    // Dur
    if (dur < 0) {
        dur = 0;
        exit();
    }
}


Merci de votre aide

2 réponses

  1. Pitet Messages postés 2845 Statut Membre 530
     
    Salut,

    A la place de setTimeout, utilise setInterval qui semble plus précis.

    Tu peux aussi simplifier ton code en utilisant des objets de type Date :
    <div id="date1"></div>
    <div id="date2"></div>
    


    var date1 = new Date(0, 0, 0, 0, 4, 8, 0);
    var date2 = new Date(0, 0, 0, 0, 0, 0, 0);
    
    var interval = setInterval(compteur, 1000);
    
    function compteur() {
      if (date1.getHours() > 0 || date1.getMinutes() > 0 || date1.getSeconds() > 0) {
        date1.setTime(date1.getTime() - 1000);
        date2.setTime(date2.getTime() + 1000);
      
        document.getElementById('date1').innerHTML = date1.getHours() + ':' + date1.getMinutes() + ':' + date1.getSeconds();
        document.getElementById('date2').innerHTML = date2.getHours() + ':' + date2.getMinutes() + ':' + date2.getSeconds();
      } else {
        clearInterval(interval);
      }
    }
    
    


    Bonne journée,
    0
    1. chabinot
       
      Merci pour ta réponse,
      Je l'ai testée, cela marche, mais le problème à l'affichage, c'est que date1 démarre tout de suite à 0:4:7 alors que je veux qu'il m'affiche 0:4:8 avant que le compteur démarre et que date2 affiche 0:0:0 avant au lieu de 0:0:1.
      Ce que je dois faire est de récupérer la durée d'un fichier mp3 exprimée en secondes et à partir de là, je transforme la durée en hh:mm:ss.
      Donc pour un morceau qui a une durée de 248 secondes, je dois la transformée en 00:04:08 et le compteur d'incrémentation je le transforme en 00:00:00 et je le fais à chaque fois qu'il s'incrémente. Regarde la solution que j'ai faite.
      Bien sûr, si je pouvais simplifier, ce serait plus cool.
      Cordialement
      0
  2. chabinot Messages postés 391 Statut Membre 16
     
    Merci à tous,
    J'ai trouvé la solution et cela marche exactement comme je le voulais.
    Je mets à disposition le script :
    const audio = document.getElementById('audio');
    const duration = document.getElementById('duration');
    audio.addEventListener('loadeddata', function() {
        duree = audio.duration;
        savDur = Math.floor(duree);
        dur = savDur;
        count = 0;
        durs = 0;
    
        compteur();
    })
    
    
    function compteur() {
        setTimeout(compteur, 1000);
    
        // Récupérer l'heure en clair hh:mm:ss
        j = 60 * 60 * 24;
        h = 60 * 60;
        m = 60;
        s = 1;
        // Début
        nj = Math.floor(durs / j);
        nj != 0 ? durs = durs - (nj * j) : nj = 0;
    
        nh = Math.floor(durs / h);
        nh != 0 ? durs = durs - (nh * h) : nh = 0;
    
        nm = Math.floor(durs / m);
        nm != 0 ? durs = durs - (nm * m) : nm = 0;
    
        ns = Math.floor(durs / s);
        ns != 0 ? durs = durs - (ns * s) : ns = 0;
    
        nj = Math.round(nj);
        nh = Math.round(nh);
        nm = Math.round(nm);
        ns = Math.round(ns);
        nh = nh = 0 ? '00' : (nh < 10 ? '0' + nh : nh);
        nm = nm = 0 ? '00' : (nm < 10 ? '0' + nm : nm);
        ns = ns = 0 ? '00' : (ns < 10 ? '0' + ns : ns);
        durs = nh + ':' + nm + ':' + ns;
        // Fin durs
    
        // Récupérer l'heure en clair hh:mm:ss
        jour = 60 * 60 * 24;
        heure = 60 * 60;
        minutes = 60;
        secondes = 1;
        // Début
        nbj = Math.floor(duree / jour);
        nbj != 0 ? duree = duree - (nbj * jour) : nbj = 0;
    
        nbh = Math.floor(duree / heure);
        nbh != 0 ? duree = duree - (nbh * heure) : nbh = 0;
    
        nbm = Math.floor(duree / minutes);
        nbm != 0 ? duree = duree - (nbm * minutes) : nbm = 0;
    
        nbs = Math.floor(duree / secondes);
        nbs != 0 ? duree = duree - (nbs * secondes) : nbs = 0;
    
        nbj = Math.round(nbj);
        nbh = Math.round(nbh);
        nbm = Math.round(nbm);
        nbs = Math.round(nbs);
        nbh = nbh = 0 ? '00' : (nbh < 10 ? '0' + nbh : nbh);
        nbm = nbm = 0 ? '00' : (nbm < 10 ? '0' + nbm : nbm);
        nbs = nbs = 0 ? '00' : (nbs < 10 ? '0' + nbs : nbs);
        duree = nbh + ':' + nbm + ':' + nbs;
        // Fin duree
    
        // Affichage de la durée
        duration.innerHTML = duree + ' | ' + durs;
        // Incrémentation des compteurs
        durs = count++;
        duree = dur--;
    
        // count
        if (count > savDur) {
            count = savDur;
        }
    
        // Dur
        if (dur < 0) {
            dur = 0;
            exit();
        }
    }
    
    0