View on GitHub

marymafa.github.io


layout: post title: Pamodoro Clock date: 2018-01-24 —

Pomodoro Clock

On this project i were suppose to build a pomodoro clock that is simmilar to freecodecamp following the users stories, Like the user can start a 25 minute pomodoro, and the timer will go off once 25 minutes has elapsed, can reset the clock for my next pomodoro and can reset the clock for my next pomodoro.

code explanation:

1.I should Use whichever libraries or APIs i need.

  1. Should give it my own personal style.

My Approach

I created buttons for play if it’s stopped, and the second one is the reset button if the user wanna reset the time and the last one is a pause button. Each button has it’s own id and class and div. I also created another div class named jumbotron for message and time. This jumbotron is a container shape.

I used document dot ready function for the page to be manipulated, Inside it, have three variable that will do their own part.

I created a function titled check status, it is used to check the status like it is not working click the start button, then the user can pause it using pause button or can reset it using the reset button. If it’s working, the user can click pause button, or reset button and so on.

I created another function titled show time, When the user clicks start button it will show time and it will count-down. I created two variable, the first variable called min(minutes) and on it, used math dot floor to round a number downwards to the nearest integer.

For today I managed to do those things and I will continue tomorrow for my Pomodoro to work well. It was challenging but in a good way .