1.0.0 • Published 5 years ago

@j1m/rcc v1.0.0

Weekly downloads
-
License
ISC
Repository
github
Last release
5 years ago

React Countdown Clock

A HTML 5 canvas countdown clock as a React component.

Screenshot

Demo

pughpugh.github.io/react-countdown-clock

Installation

npm install react-countdown-clock

Usage

<ReactCountdownClock seconds={60}
                     color="#000"
                     alpha={0.9}
                     size={300}
                     onComplete={myCallback} />

Props

proptypedefaultdescription
secondsinteger60Seconds to countdown
colorstring#000Colour of counter
alphafloat1.0Alpha transparency of counter
sizeinteger300Width & height of canvas element
weightintegerWeight of circle, in pixels
fontSizeinteger/stringautopx size of font. auto for dynamic sizing.
fontstringArialFont of counter
timeFormatstringsecondsCounter style; seconds or hms
showMillisecondsbooleantrueShow milliseconds for last 10 seconds
onCompletefuncCallback when time completes
pausedbooleanfalsePause countdown of the timer
pausedTextstringText to display when paused, defaults to the current time

Bugs & Contributions

Bugs, features and pull requests always welcome.

github.com/pughpugh/react-countdown-clock/issues

Also, it's always just nice to hear how people are using it. Feel free to get in touch.