ngx-timer-tmp
TypeScript icon, indicating that this package has built-in type declarations

0.0.2 • Public • Published

NgxTimer

Count up timer for angular 5+

WARNING!!!

This package is forked from https://github.com/Y4SHVINE/ngx-timer-lib

The original repo was forked because of this fix https://github.com/Y4SHVINE/ngx-timer-lib/pull/20

So please do not use it if you dont need that fix

Installation

npm i ngx-timer --save

Usage

import { NgxTimerModule } from 'ngx-timer';

@NgModule({
  imports: [
    ...
    NgxTimerModule
  ],
})

1.Count Up Timer

In html

<countup-timer [countUpTimerConfig]="testConfig"></countup-timer>

You can import CountupTimerService from ngx-timer to do the following functionalities.

  1. To start the timer
this.countupTimerService.startTimer();

By passing a start time to above function timer will start from that. eg :-

let cdate = new Date();
cdate.setHours(cdate.getHours()-2);
this.countupTimerService.startTimer(cdate);
  1. To pause the timer
this.countupTimerService.pauseTimer();
  1. To stop the timer
this.countupTimerService.stopTimer();

Configurations

Import countUpTimerConfigModel model from ngx-timer you will be able use following configurations.

import { countUpTimerConfigModel, timerTexts } from 'ngx-timer';    

ngOnInit(): void {
    //countUpTimerConfigModel
    this.testConfig = new countUpTimerConfigModel();
    
    //custom class
    this.testConfig.timerClass  = 'test_Timer_class';

    //timer text values  
    this.testConfig.timerTexts = new timerTexts();
    this.testConfig.timerTexts.hourText = "Hours"; //default - hh
    this.testConfig.timerTexts.minuteText = "Minutes"; //default - mm
    this.testConfig.timerTexts.secondsText = "Seconds"; //default - ss
}

2.Count Down Timer

In html

<countdown-timer [countDownTimerConfig]="testConfig"></countdown-timer>

You can import CountdownTimerService from ngx-timer to do the following functionalities.

1.To start the timer

let cdate = new Date();
cdate.setHours(cdate.getHours() + 2);
this.CountdownTimerService.startTimer(cdate);

2.To pause the timer

this.CountdownTimerService.pauseTimer();

3.To stop the timer

this.CountdownTimerService.stopTimer();

3.To resume the timer

this.CountdownTimerService.resumeTimer();

Configurations

Import countUpTimerConfigModel model from ngx-timer you will be able use following configurations.

import { countDownTimerConfigModel, countDownTimerTexts } from 'ngx-timer';    

ngOnInit(): void {
    //countUpTimerConfigModel
    this.testConfig = new countDownTimerConfigModel();
    
    //custom class
    this.testConfig.timerClass  = 'test_Timer_class';

    //timer text values  
    this.testConfig.timerTexts = new countDownTimerTexts();
    this.testConfig.timerTexts.hourText = "Hours"; //default - hh
    this.testConfig.timerTexts.minuteText = "Minutes"; //default - mm
    this.testConfig.timerTexts.secondsText = "Seconds"; //default - ss
}

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change. 😊

Impending

  1. Day,Month and Year Configuration for both timers.
  2. Stopwatch implementation.

Demo

Demo url

Package Sidebar

Install

npm i ngx-timer-tmp

Weekly Downloads

5

Version

0.0.2

License

MIT

Unpacked Size

274 kB

Total Files

38

Last publish

Collaborators

  • anton_barada