intervaq
TypeScript icon, indicating that this package has built-in type declarations

2.1.2 • Public • Published

Intervaq

License NPM version Code Style: Google Downloads

Just another one solution for intervals \ timeouts via requestAnimationFrame.

Working well in a project that based on three.js library.

Test coverage:

Coverage lines Coverage functions Coverage branches Coverage statements

Why:

  • to use intervals \ timeouts via requestAnimationFrame;
  • to avoid some time based glitches, violations;
  • to control some time based actions.

Some info to use:

  • intervaq:
    • .checkToExecute(timestamp) in requestAnimationFrame callback body;
    • .setInterval(callback, timeMs) / .clearInterval(interval) as usual;
    • .setTimeout(callback, timeMs) / .clearTimeout(timeout) as usual;
    • .pauseProcessing() / .continueProcessing() when its necessary;
  • intervaq . intervals / timeouts:
    • .pauseExecuting(currentTimeInt) and .continueExecuting(currentTimeInt) manually;
    • .disable() / .enable() / .restart() manually.

Usage:

some sample (TypeScript):

import {Intervaq, Timestamp} from 'intervaq';

// init intervaq object
const intervaq = new Intervaq();

// using intervaq via requestAnimationFrame
function animate(timestamp?: Timestamp) {
  // process intervaq
  if (timestamp && intervaq !== undefined) {
    intervaq.checkToExecute(timestamp);
  }

  requestAnimationFrame(animate);
}

// to control visibility state
document.addEventListener('visibilitychange', onVisibilityChange);

function onVisibilityChange(event: Event) {
  const target = event.target as Document;
  if (target.visibilityState === 'visible') {
    console.log(`tab is active at ${new Date().getTime()} `);
    // continue processing
    intervaq.continueProcessing();
  } else {
    console.log(`tab is inactive at ${new Date().getTime()} `);
    // pause processing
    intervaq.pauseProcessing();
  }
}

// intervaq.setInterval case:
let testIntervalValue = 0;
const testInterval = intervaq.setInterval(() => {
  console.log(
    `testInterval every 1000ms #${testIntervalValue} at ${new Date().getTime()} `
  );
  testIntervalValue++;
}, 1000);

// intervaq.setTimeout case:
const testTimeoutValue = 0;
const testTimeout = intervaq.setTimeout(() => {
  // disable its testInterval
  intervaq.clearInterval(testInterval);
  console.log(
    `testTimeout in 5500ms #${testTimeoutValue} at ${new Date().getTime()} `
  );
  // !not important
  intervaq.clearTimeout(testTimeout);
}, 5500);

// action
animate();

output sample 0:

testInterval every 1000ms #0 at 1689861750168 
testInterval every 1000ms #1 at 1689861751169 
testInterval every 1000ms #2 at 1689861752184 
testInterval every 1000ms #3 at 1689861753184 
testInterval every 1000ms #4 at 1689861754201 
testTimeout in 5500ms #0 at 1689861754667

output sample 1 (on tabs switching):

testInterval every 1000ms #0 at 1689877224270 
testInterval every 1000ms #1 at 1689877225287 
tab is inactive at 1689877226100 
tab is active at 1689877230127 
testInterval every 1000ms #2 at 1689877230319 
tab is inactive at 1689877231240 
tab is active at 1689877234740 
testInterval every 1000ms #3 at 1689877234820 
testInterval every 1000ms #4 at 1689877235821 
testTimeout in 5500ms #0 at 1689877236288

Dev:

  • npm install
  • configure your gitflow workspace like it is here
  • npm run prepare (check husky documentation)

Documentation:

Enumerations

Classes

Type Aliases

Functions

Enumerations

StatusInterval

Status of Interval

Enumeration Members

Member Value Description
DISABLED 2 disabled for execution
DONE 4 execution done
EXECUTING 3 execution is processing
IN_PROCESS 1 in process
PAUSED 0 paused

StatusIntervaq

Status of Intervaq

Enumeration Members

Member Value Description
IN_PROCESS 1 in process
PAUSED 0 paused

StatusTimeout

Status of Timeout

Enumeration Members

Member Value Description
DISABLED 3 disabled for execution
DONE 2 execution done
EXECUTING 4 execution is processing
IN_PROCESS 1 in process
PAUSED 0 paused

Classes

Interval

Interval item class

Constructors

new Interval

new Interval( callback, timeInterval, isPaused): Interval

Constructor.

Parameters
Parameter Type Description
callback Function function to execute
timeInterval number time of execution in Ms
isPaused boolean is intervaq paused on setInterval call
Returns

Interval

Defined In

index.ts:249

Properties

Property Type Description
_callback Function callback function to execute.
executeAtTime null | number timestamp of next execution iteration.
pausedAtTime null | number null or timestamp when current interval is paused.
prevTime null | number timestamp of its prev execution iteration.
status StatusInterval Status value.
timeInterval null | number Int time in Ms of its interval execution.

Methods

checkTimeToExecute

checkTimeToExecute(timeToCheck): void

Check its Interval for execution.

Parameters
Parameter Type Description
timeToCheck number timestamp to check for execution
Returns

void

void

Defined In

index.ts:272


continueExecuting

continueExecuting(continueAtTime): void

Continue to execute after pause.

Parameters
Parameter Type Description
continueAtTime number timestamp to calculate its downtime
Returns

void

void

Defined In

index.ts:312


destroy

destroy(): void

Desctuctor functionality.

Returns

void

void

Defined In

index.ts:354


disable

disable(): Interval

Disable execution.

Returns

Interval

this

Defined In

index.ts:324


enable

enable(): Interval

Enable execution.

Returns

Interval

this

Defined In

index.ts:333


execute

execute(): void

Execute the callback function.

Returns

void

void

Defined In

index.ts:291


pauseExecuting

pauseExecuting(pausedAtTime): void

Set execution on pause.

Parameters
Parameter Type Description
pausedAtTime number timestamp to set its pausedAtTime
Returns

void

void

Defined In

index.ts:302


restart

restart(): Interval

Restart execution.

Returns

Interval

this

Defined In

index.ts:346


Intervaq

Main Intervaq class

Constructors

new Intervaq

new Intervaq(): Intervaq

Constructor

Returns

Intervaq

Defined In

index.ts:69

Properties

Property Type Description
intervals Interval[] Array of Intervals
pausedAt null | number null or timestamp when Intervaq is paused
status StatusIntervaq Status value
timeouts Timeout[] Array of Timeouts

Methods

checkToExecute

checkToExecute(timestamp): void

Checking intervals and timeouts to execute.

Parameters
Parameter Type Description
timestamp number timestamp (from requestAnimationFrame, etc)
Returns

void

Defined In

index.ts:139


clearInterval

clearInterval(interval): boolean

clearInterval functionality.

Parameters
Parameter Type Description
interval Interval object of Interval
Returns

boolean

  • done state
Defined In

index.ts:94


clearTimeout

clearTimeout(timeout): boolean

clearTimeout functionality.

Parameters
Parameter Type Description
timeout Timeout object of Timeout
Returns

boolean

  • done state
Defined In

index.ts:125


continueProcessing

continueProcessing(): void

Continue of intervals/timeouts to execute after paused

Returns

void

void

Defined In

index.ts:177


pauseProcessing

pauseProcessing(): void

Set intervals/timeouts paused to prevent its execution

Returns

void

void

Defined In

index.ts:160


setInterval

setInterval(fnToExecute, timeInterval): Interval

setInterval functionality.

Parameters
Parameter Type Description
fnToExecute Function function to execute
timeInterval number time of execution in Ms
Returns

Interval

  • object of Interval
Defined In

index.ts:79


setTimeout

setTimeout(fnToExecute, timeOut): Timeout

setTimeout functionality.

Parameters
Parameter Type Description
fnToExecute Function function to execute
timeOut number time of execution in Ms
Returns

Timeout

  • object of Timeout
Defined In

index.ts:110


Timeout

Timeout item class

Constructors

new Timeout

new Timeout( callback, timeOut, isPaused): Timeout

Constructor

Parameters
Parameter Type Description
callback Function Function to execute.
timeOut number timestamp to check for execution.
isPaused boolean is intervaq paused on setInterval call.
Returns

Timeout

Defined In

index.ts:423

Properties

Property Type Description
_callback Function callback function to execute.
executeAtTime null | number timestamp of next execution iteration.
pausedAtTime null | number null or timestamp when current interval is paused.
prevTime null | number null (initial) or timestamp of its prev execution iteration.
status StatusTimeout Status value.
timeOut null | number Int time in Ms of its timeout execution.

Methods

checkTimeToExecute

checkTimeToExecute(timeToCheck): boolean

Check its Timeout for execution.

Parameters
Parameter Type Description
timeToCheck number timestamp to check for the execution
Returns

boolean

done state

Defined In

index.ts:446


continueExecuting

continueExecuting(continueAtTime): void

Continue to execute after pause.

Parameters
Parameter Type Description
continueAtTime number timestamp to calculate its downtime
Returns

void

void

Defined In

index.ts:483


destroy

destroy(): void

Desctuctor functionality.

Returns

void

void

Defined In

index.ts:525


disable

disable(): Timeout

Disable execution.

Returns

Timeout

this

Defined In

index.ts:495


enable

enable(): Timeout

Enable execution.

Returns

Timeout

this

Defined In

index.ts:504


execute

execute(): boolean

Execute the callback function.

Returns

boolean

done state

Defined In

index.ts:461


pauseExecuting

pauseExecuting(pausedAtTime): void

Set execution on pause.

Parameters
Parameter Type Description
pausedAtTime number timestamp to set its pausedAtTime
Returns

void

void

Defined In

index.ts:473


restart

restart(): Timeout

Restart execution.

Returns

Timeout

this

Defined In

index.ts:517

Type Aliases

Callback

Callback: Function

callback type of function to execute.

Defined In

index.ts:18


Timestamp

Timestamp: number

Timestamp type of datetime.

Defined In

index.ts:22

Functions

dummyCallback

dummyCallback(): null

Dummy callback to avoid calls on destruct.

Returns

null

  • null

Defined In

index.ts:13


getTimestamp

getTimestamp(): number

Returns timestamp.

Returns

number

  • timestamp

Defined In

index.ts:5

TODO:

  • [ ] apply some pattern... maybe...
  • [ ] modify some checkToExecute functionality
  • [ ] chck clearInterval \ clearTimeout on executionInProcess
  • [ ] try to keep pausing at its Intervaq class only
  • [ ] do smth with destroy method
  • [ ] check some scope executing
  • [ ] do smtn good with docs

© kostix.dev

Dependencies (0)

    Dev Dependencies (23)

    Package Sidebar

    Install

    npm i intervaq

    Weekly Downloads

    0

    Version

    2.1.2

    License

    MIT

    Unpacked Size

    51.1 kB

    Total Files

    6

    Last publish

    Collaborators

    • kostix.dev