Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

angular-user-idle

Package Overview
Dependencies
Maintainers
1
Versions
19
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angular-user-idle

User's idle service for Angular 6+

  • 2.2.2
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
23K
increased by13%
Maintainers
1
Weekly downloads
 
Created
Source

angular-user-idle

Service for Angular 6+ to detect and control of user's idle.

Important

This library was written for needs of my corporate project and this library compiles and works (Angular 6) very well and as I expected. Unfortunately, I don't have necessary time to maintenance my library as fast as you can expected. I have a plan to review my code to try to fix a bugs that was reported by other users but I don't know when I do it. Thank for your understanding.

To use this library in Angular 5.x use angular-user-idle ver. 1.1.0 (depreacated and don't supported!)

Demo

See Demo app

Installation

npm install angular-user-idle

In app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { UserIdleModule } from 'angular-user-idle';

import { AppComponent } from './app.component';

@NgModule({
  imports: [
    BrowserModule,
    
    // Optionally you can set time for `idle`, `timeout` and `ping` in seconds.
    // Default values: `idle` is 600 (10 minutes), `timeout` is 300 (5 minutes) 
    // and `ping` is 120 (2 minutes).
    UserIdleModule.forRoot({idle: 600, timeout: 300, ping: 120})
  ],
  declarations: [AppComponent],
  bootstrap: [AppComponent]
})
export class AppModule {}

Usage

You should init user idle service in one of core component or service of your app, for example login.component.ts:

import { Component, OnInit } from '@angular/core';
import { UserIdleService } from 'angular-user-idle';

@Component({
  templateUrl: './login.component.jade'
})
export class LoginComponent implements OnInit {

  readonly googlePlayLink: string;
  readonly appStoreLink: string;

  constructor(private userIdle: UserIdleService) {
  }

  ngOnInit() {
    //Start watching for user inactivity.
    this.userIdle.startWatching();
    
    // Start watching when user idle is starting.
    this.userIdle.onTimerStart().subscribe(count => console.log(count));
    
    // Start watch when time is up.
    this.userIdle.onTimeout().subscribe(() => console.log('Time is up!'));
  }

  stop() {
    this.userIdle.stopTimer();
  }

  stopWatching() {
    this.userIdle.stopWatching();
  }

  startWatching() {
    this.userIdle.startWatching();
  }

  restart() {
    this.userIdle.resetTimer();
  }
}
About ping

Please note that ping is used if you want to perform some action periodically every n-minutes in lifecycle of timer (from start timer to timeout).

For example, if you want to make a request to refresh token every 2 minutes you set ping to 120 and subscribe to ping's observable like this:

this.idle.ping$.subscribe(() => console.log("PING"));

The main schema will be as follow:

|–– 2m (ping)––4m (ping) ––6m (ping)...-– 10m (user idle detected, start timer for 5 min) –- 12m (ping) –– 14m (ping) –– 15m (time is out)|

If you don't use a ping just set ping to any value (not null) and just ignore it.

API

startWatching(): void;

Start user idle service and configure it.

onTimerStart(): Observable<number>

Fired when timer is starting and return observable (stream) of timer's count.

onTimeout(): Observable<boolean>;

Fired when time is out and id user did not stop the timer.

stopTimer()

Stop timer.

resetTimer()

Reset timer after onTimeout() has been fired.

stopWatching()

Stop user idle service.

setConfigValues({idle, timeout, ping})

Set config values after module was initialized.

setCustomActivityEvents(customEvents: Observable<any>): void

Set custom activity events after module was initialized.

Service logic:
  • User is inactive for 10 minutes
  • onTimerStart() is fire and return countdown for 5 minutes
  • If user did not stop timer by stopTimer() then time is up and onTimeout() is fire.

FAQs

Package last updated on 30 Mar 2020

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc