Skip to content

Instantly share code, notes, and snippets.

@ayoisaiah

ayoisaiah/main.js

Last active Aug 3, 2020
Embed
What would you like to do?
Pomodoro Tutorial — Checkpoint 1
const timer = {
pomodoro: 25,
shortBreak: 5,
longBreak: 15,
longBreakInterval: 4,
};
const modeButtons = document.querySelector('#js-mode-buttons');
modeButtons.addEventListener('click', handleMode);
function updateClock() {
const { remainingTime } = timer;
const minutes = `${remainingTime.minutes}`.padStart(2, '0');
const seconds = `${remainingTime.seconds}`.padStart(2, '0');
const min = document.getElementById('js-minutes');
const sec = document.getElementById('js-seconds');
min.textContent = minutes;
sec.textContent = seconds;
}
function switchMode(mode) {
timer.mode = mode;
timer.remainingTime = {
total: timer[mode] * 60,
minutes: timer[mode],
seconds: 0,
};
document
.querySelectorAll('button[data-mode]')
.forEach(e => e.classList.remove('active'));
document.querySelector(`[data-mode="${mode}"]`).classList.add('active');
document.body.style.backgroundColor = `var(--${mode})`;
updateClock();
}
function handleMode(event) {
const { mode } = event.target.dataset;
if (!mode) return;
switchMode(mode);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.