afonsopacifer / react-pomodoro Goto Github PK

View Code? Open in Web Editor NEW

388.0 18.0 97.0 2.25 MB

:alarm_clock: Pomodoro timer built with ReactJS.

Home Page: http://afonsopacifer.github.io/react-pomodoro/

License: MIT License

JavaScript 67.26% CSS 26.04% HTML 6.70%

react-pomodoro's Introduction

React Pomodoro

Pomodoro timer for developers.

Features

Add to homescreen
Offline support
Times available:
- Timer for code - 25min
- Timer for social - 5min
- Timer for Coffee - 15min
Time display:
- Page display
- Title display
Alarms available:
- Web Notifications
- Vibration
- Songs
Basic controls:
- Play button
- Pause button
Keyboard Shortcuts
- Space: Play
- Ctrl/Command + Left: Toggle mode
- Ctrl/Command + Right: Toggle mode

Versioning

To keep better organization of releases we follow the Semantic Versioning 2.0.0 guidelines.

Run the project locally

1 - Prepare the environment:

$ npm install -g webpack

2 - Clone the project and install the dependencies:

$ git clone https://github.com/afonsopacifer/react-pomodoro.git
$ cd react-pomodoro
$ npm install

3 - Run webpack and webpack-dev-server:

$ npm start

Go to: localhost:8080

Tasks available

$ npm start - Run webpack and webpack-dev-server
$ npm run lint - ESlint :D
$ npm run test - Run mocha tests
$ npm run build - Generates the bundle.js
$ npm run deploy - Push for gh-pages

Contributing

Find on our issues the next steps of the project ;)
Want to contribute? Follow these recommendations.

History

See Releases for detailed changelog.

License

MIT License © Afonso Pacifer

react-pomodoro's People

Contributors

Stargazers

Watchers

Forkers

willianjusten joaocarvalhowd mauriciojunior andrevvalle kaseyjcowley mkxml webize giovannefeitosa fhferreira fdaciuk gobrasil luancurti ayrtonricardo lnmunhoz lsgoulart rocknrollmarc rodrigo-oliveira tykoth ruslan-kurkebayev reactive-coding-playground realdubb teaualune kr-fun lothbrek danielpoulson trashsydowdev carbonell rodrigooler abdelhamidhenni aaronago codeangler msandeep96 fidelisclayton khucanhminhluong alanpeters flying7eleven phpsmarter bradpsheehan ravikrranjan aleksey-t manjula-dube larissaabreu willnguyen1312 ribeiroevandro fizzvr tiagocharo spock74 mm2ra francishero jizusun pcg92 showme-gh-pages bartizan naveenkariyappa murrtuck raphael27atm oduolaakeem bogdanbiv paras594 markhalkier wilomgfx vikash-kothary sayyidisal ytbau 040203 pareshmayani ajay-balava theooliveira faozornek diegosampaio mandroso daniel-n-huss daltonjorge nicko-lee araguaci noemk2 mehmetsuci peculiar97 aoaquino dibyadarshidas robsonmobile chingfc fsclaro tchaguitos wakolivotes djholmes97 tesfadan vmenna muathcs akshayark97 manoelscosta awaisabdulsalam codemod-com

react-pomodoro's Issues

Put timer on title's page

We should put the timer on title's page, so we can see the time using another tabs on the browser =)

Launcher Icon Not Displayed on mobile

The launcher icon not displayed on android phone.

Great project btw.

The sound of code time end

The sound when code time end doesn't exist?

Use local storage to save user preferences

The Notification API throw out an error in the mobile web browser.

Have you tested the notification in the mobile browser?

I used new Notification() API, too. It worked normally on the desktop, howerver there was an error on my Android mobile Chrome(Version 60.0.3112.116).

Add Task for code quality and CI

JSHint + TravisCI?

Ask for notification

The notification API require user's permission to show on desktop. We should ask this permission when click to enable notification.

Ctrl + Left and Right doesn't works on Mac OS X

Stack:

Google Chrome 51.0.2704.79 (64-bit)
OS X El Capitan 10.11.5

Use keyboard!

EX: Press space for play ou pause the time :)

Fix bottom bar in mobile devices with more than 500px of height

Automatize deploy for gh-pages

npm run deploy seems not to work

missing script: deploy

Are there high level steps to deploy from /src/ to gh-pages?

how to debug?

excuse me ... i am fresh to webpack, how to debug this program??

By default the pause button should be disabled.

For a better user experience the pause button should be disabled by default, it should only be enabled once the timer has started.

Change position of controls?

Do you think a good idea change the position of controls for below the types of timer?

We can increase the size of icons too, then it can facilitates the pause and play of pomodoros.

Use ES6 classes and stateless functions

Hi.

Great project!

I noticed that the project is using React 15.0.1 and since ES6 is already present in the codebase I figured we might want to switch to an ES6 class in the Pomodoro component and a stateless function in the Footer component.

What do you think?

Those are quick changes and I am happy to send a PR if you agree with them.

Thank you 😎

Change icons to SVG sprites

volume slider for sound

I think a volume slider would be really nice to implement, my ears die a little when the alarm goes off and scares the heck outta me if I have my volume jacked up, e.g. listening to spotify, spotify volume slider is set to 25% so system volume is set to 70%, pomodoro timer goes off at 70% and its quite shocking.