Sss-timer NPM | npm.io

About

Timer is a library for creating and updating content based on time.

Like watch, counters, ads e.t.c.

Installation

1) Download Timer

2) Connect Timer before your scripts.

<script src="/assets/js/lib/Timer.js"></script>

3) See how to use the Timer.

Package managers 😎

If you are using package managers such as npm or yarn, import this lib as usual.

# Yarn
yarn add sss-timer

# NPM
npm i sss-timer --save

Do import Timer from 'sss-timer';

Usage

Create callback

    // Timer will call your function with the following params
    // date - time object
    // timer - timer instance
    
    function callback (date, timer) {
      console.dir(date);
      console.dir(timer);
    }

Init your timer

    const timer = new Timer(callback);

    // start your timer 
    timer.start();

Or init and pass params

    const timer = new Timer(callback, {
        time: 5000
    });
    
    // start your timer 
    timer.start();

Options

Option	Type	Description
time	number	Initial Timer time state
tick	number	How much Timer should increment in each tick and call callback
onStop	function	Calls after timer stops
breakOn	OneOf: {Timer.duration.DAY / Timer.duration.HOUR ...}	Prevents the transition to the next time division. 1hour 10min -> 70min

Methods

Timer.convert

Converts milliseconds in the object

Note: This is STATIC method.

const timer = Timer.convert(2000500000, Timer.duration.MIN);
// timer -> DAY: 0, HOUR: 0, MIN: 33341, SEC: 40, MS: 0,

Timer.stringify

Method will convert numbers to string, and will add zero, if the number less than 10.

Useful for making clocks-like counters e.t.c

Note: This is STATIC method.

const timer = Timer.convert(2000500000);
const date = Timer.stringify(timer);
// timer -> {DAY: "23", HOUR: "03", MIN: "41", SEC: "40", MS: "00" }

Timer.format

Format template-string with passed data object

Note: KEY in Object should be the same as {{KEY}} in string. You can use any data with this function.

Note: This is STATIC method.

    const string = '{{DAY}}:{{HOUR}}:{{MIN}}:{{SEC}}:{{MS}}';
    const data = { DAY: '01', HOUR: '01', MIN: '07', SEC: '54', MS: '00'};
    Timer.format(string, data);
    // 01:01:07:54:00

timer.start()

Starts the timer

    const timer = new Timer(callback);
    timer.start()

timer.stop()

Stops the timer

    const timer = new Timer(callback);
    timer.stop()

timer.reset()

Stops the timer

    const timer = new Timer(callback);
    timer.reset()

Example

    const callback = function (date, timer) {
            console.dir(date);
            console.dir(timer);
            const stringifyDate = Timer.stringify(date);
            document.body.innerHTML = 'Time is: '
                + stringifyDate.DAY
                + ' : '
                + stringifyDate.HOUR
                + ' : '
                + stringifyDate.MIN
                + ' : '
                + stringifyDate.SEC;
    
            // timer.time is a working timer variable
            // consider it as read-only
            if(timer.time < 10000) {
                timer.reset();
            }
    
            setTimeout(() => {
                // to stop timer
                timer.stop();
    
                // to reset timer
                timer.reset();
            }, 20000)
        };
    
        const timer = new Timer(callback, {
            // initial time value
            time: 90485000,
            // to count down just pass negative tick int
            tick: -1000,
        });
    
        // to start timer
        timer.start();