Как помешать моим миллисекундам рассчитывать? - PullRequest
Новая
       23

Как помешать моим миллисекундам рассчитывать?

0 голосов
/ 26 февраля 2020

Как помешать моим миллисекундам рассчитывать? Я сделал обратный отсчет 5 секунд. Но я не могу остановить свои миллисекунды на 0. Мои секунды останавливаются на 0, а мои миллисекунды - нет. Если я достигну 0, то увижу обратный отсчет, но рассчитываю на миллисекунды, на стороне обратного отсчета. Можете ли вы, ребята, помочь мне? 

(() => {
  let countdownEnded = false;
  start(5); // seconds
})();

function start(inputTime) {
  let startTime = Date.now();
  intervalSeconds = setInterval(() => {
    let currentTime = Date.now() - startTime;

    if (inputTime < 1) {
      stop();
    } else {
      updateDisplay(inputTime, currentTime);
      updateMillis();
    }
  });
}


function stop() {
  let countDivElement = document.getElementById("timer");
  countDivElement.innerHTML = 'countdown done';
}

function updateDisplay(seconds, currentTime) {
  let timeIncrement = Math.floor(currentTime / 1000);
  updateTime(seconds - timeIncrement);
}

/**
 * @method - updatesecondsond
 * @summary - This updates the timer every secondsond 
 */
function updateTime(seconds) {
  let countDivElement = document.getElementById("timer");

  let minutes = Math.floor(seconds / 60);
  let remainingSeconds = seconds % 60;

  if (remainingSeconds < 10) {
    remainingSeconds = '0' + remainingSeconds;
  }

  if (minutes < 10) {
    minutes = '0' + minutes;
  }

  if (seconds > 0) {
    seconds = seconds - 1;
  } else {
    clearInterval(intervalSeconds);
    countdownEnded = true;
    countDivElement.innerHTML = 'countdown done';
    return null;
  }

  countDivElement.innerHTML = minutes + ":" + remainingSeconds + ":";
};

function updateMillis() {
  let countMillsElement = document.getElementById('millis');
  let counterMillis = 99;
  let millis;

  let intervalMillis = setInterval(() => {

    if (counterMillis === 1) {
      counterMillis = 99;
    } else {
      millis = counterMillis < 10 ? '0' + counterMillis : counterMillis;
    };

    countMillsElement.innerHTML = millis;
    counterMillis--;

  }, 10);

  if (countdownEnded) {
    return clearInterval(intervalMillis);

  }
};
<span id="timer"></span><span id="millis"></span>

1 Ответ

0 голосов
/ 26 февраля 2020

Вот ваш рабочий код - 

(() => {
    let countdownEnded = false;
    start(5); // seconds
})();

function start(inputTime) {
    let startTime = Date.now();
    intervalSeconds = setInterval(() => {
        let currentTime = Date.now() - startTime;

        if (inputTime < 1) {
            stop();
        } else {
            updateDisplay(inputTime, currentTime);
            updateMillis();
        }
    });
}


function stop() {
    let countDivElement = document.getElementById("countdown");    // updated
    countDivElement.innerHTML = 'countdown done';
    countdownEnded = true;                                         // updated
}

function updateDisplay(seconds, currentTime) {
    let timeIncrement = Math.floor(currentTime / 1000);
    updateTime(seconds - timeIncrement);
}

/**
 * @method - updatesecondsond
 * @summary - This updates the timer every secondsond 
 */
function updateTime(seconds) {
    let countDivElement = document.getElementById("timer");

    let minutes = Math.floor(seconds / 60);
    let remainingSeconds = seconds % 60;

    if (remainingSeconds < 10) {
        remainingSeconds = '0' + remainingSeconds;
    }

    if (minutes < 10) {
        minutes = '0' + minutes;
    }

    if (seconds > 0) {
        seconds = seconds - 1;
    } else {
        clearInterval(intervalSeconds);
        countdownEnded = true;
        countDivElement.innerHTML = 'countdown done';
        return null;
    }

    countDivElement.innerHTML = minutes + ":" + remainingSeconds + ":";
};

function updateMillis() {
    let countMillsElement = document.getElementById('millis');
    let counterMillis = 99;
    let millis;

    let intervalMillis = setInterval(() => {

        if (counterMillis === 1) {
            counterMillis = 99;
        } else {
            millis = counterMillis < 10 ? '0' + counterMillis : counterMillis;
        };

        countMillsElement.innerHTML = millis;
        counterMillis--;

    }, 10);

    if (countdownEnded) {
        stop();    // updated
        return clearInterval(intervalMillis);

    }
};
<div id="countdown">    <!-- Updated -->
  <span id="timer"></span><span id="millis"></span>
</div>

Примечание: это не оптимизированный код, его можно оптимизировать далее

...