Skip to content

Commit cf26e8b

Browse files
committed
Add README.md
1 parent 5746a28 commit cf26e8b

File tree

1 file changed

+83
-0
lines changed

1 file changed

+83
-0
lines changed

README.md

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
# Angular-Cd-Timer
2+
3+
This is a simple, re-usable and inter-operable timer component for [Angular CLI](https://github.com/angular/angular-cli) with multiple options.
4+
5+
`cd-timer` is able to:
6+
- count up / count down.
7+
- manage start time and end time.
8+
- manage several displaying format.
9+
10+
## Demo
11+
12+
Demo is available on this site: [http://angular-cd-timer.clemdesign.fr/](http://angular-cd-timer.clemdesign.fr/)
13+
14+
## Installation
15+
16+
Execute `npm install angular-cd-timer`
17+
18+
## Usage
19+
20+
`cd-timer` count every seconds.
21+
22+
### Basic usage
23+
24+
This simple integration `<cd-timer></cd-timer>` will start the timer with the default options of ticking every 1 second.
25+
26+
### Attributes
27+
28+
`cd-timer` has the following attributes:
29+
- `[startTime]`: Define the start time (tick count) in second. Default: 0.
30+
- `[endTime]`: Define the end time (tick count) in second. Default: 0 (Not enabled).
31+
- `[countdown]`: Countdown if set to true. Default: false.
32+
- `[autoStart]`: Autostart timer if set to true. Default: true.
33+
- `maxTimeUnit`: Define the maximum unit allowed. Default: 'day'.
34+
- `day`: Timer count up to day. Ex: 2d 12h 04m 12s.
35+
- `hour`: Timer count up to hour. EX: 00d 60h 04m 12s.
36+
- `minute`: Timer count up to minute. EX: 00d 00h 3604m 12s.
37+
- `second`: Timer count up to minute. EX: 00d 00h 00m 216252s.
38+
- `format`: Display timer count in predefined format. Default: 'user' or 'default'.
39+
- `default`: Display like `0d 0h 0m 0s`.
40+
- `hms`: Display like `HH:MM:SS`.
41+
- `intelli`: Display in condensed format:
42+
- only seconds: 25s
43+
- minutes and seconds: 02min 12s
44+
- hours and minutes: 10h 21min
45+
- days and hours: 2days 12min
46+
- `user`: Display according user markup in `<cd-timer></cd-timer>`:
47+
- `[seconds]`: display seconds
48+
- `[minutes]`: display minutes
49+
- `[hours]`: display hours
50+
- `[days]`: display days
51+
52+
### Callbacks
53+
54+
`cd-timer` has the following callbacks (event emitter):
55+
- `(onComplete)`: Called when tick count reach endTime or 0. Argument is `CdTimerComponent`.
56+
- `(onTick)`: Called each tick count. Argument is `TimeInterface`.
57+
- `(onStart)`: Called when timer starts. Argument is `CdTimerComponent`.
58+
- `(onStop)`: Called when timer stop. Argument is `CdTimerComponent`.
59+
60+
### Public methods
61+
62+
`cd-timer` is controlable by the following public methods:
63+
64+
| Method name | Description |
65+
|:----------- |:----------------------------------------------- |
66+
| `start()` | Start timer from 0. |
67+
| `stop()` | Stop timer. |
68+
| `resume()` | Resume timer from the last tick count. |
69+
| `reset()` | Stop and reset timer. |
70+
| `get()` | Get time information by `TimeInterface` object. |
71+
72+
Timer shall be bind with `@ViewChild()` in Angular App.
73+
74+
## Contribution
75+
76+
We welcome any or all kinds of contributions!
77+
Please submit [pull requests](https://github.com/clemdesign/angular-cd-timer/pulls or
78+
[create issues](https://github.com/clemdesign/angular-cd-timer/issues) to contribute to this project :)
79+
80+
## License
81+
82+
Under MIT
83+
Copyright (c) 2018 clemdesign

0 commit comments

Comments
 (0)