# ngcli-idle-timeout

> **ngcli-idle-timeout** is a simple library to show a model on idle timeout.

Latest version **1.0.1** (published 2019-01-24) · 0 weekly downloads

## Install

```sh
npm install ngcli-idle-timeout
pnpm add ngcli-idle-timeout
yarn add ngcli-idle-timeout
bun add ngcli-idle-timeout
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2019-01-24 |
| First published | 2018-11-07 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 167.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | ravimsnetdev |

## Links

- npm: https://www.npmjs.com/package/ngcli-idle-timeout
- npm.io page: https://npm.io/package/ngcli-idle-timeout

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^1.9.0

## Recent versions

- 1.0.1 (latest) — 2019-01-24
- 0.0.5 — 2019-01-24
- 1.0.0 — 2019-01-24
- 0.0.2 — 2018-11-09
- 0.0.1 — 2018-11-07

## README

# ngcli-idle-timeout

**ngcli-idle-timeout** is a simple library to show a model on idle timeout.

[![npm](https://img.shields.io/npm/v/ngcli-idle-timeout.svg?maxAge=3600?cache=true)](https://www.npmjs.com/package/ngcli-idle-timeout)
[![npm](https://img.shields.io/npm/dt/ngcli-idle-timeout.svg?cache=true)](https://www.npmjs.com/package/ngcli-idle-timeout)


# Getting Started

## Installation:

```bash
npm install ngcli-idle-timeout
```


## Getting Started With Default Configuration - NgModule

##app.module.ts:

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

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

import { NgcliIdleTimeoutModule, NgcliIdleTimeoutService } from 'ngcli-idle-timeout';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    
    NgcliIdleTimeoutModule
  ],
  providers: [NgcliIdleTimeoutService],
  bootstrap: [AppComponent]
})
export class AppModule { }
```

## Getting Started with Default Configuration - Manual Component Inclusion

##app.component.html:

```html

<ngcli-idle-timeout (OnStayLoggedIn_Click)="OnStayLoggedIn();" (OnTimerCompleted_Event)="OnTimerCompleted();"></ngcli-idle-timeout>

<button class="btn btn-primary" (click)="StartWatching();">Start Watching</button>

<button class="btn btn-success" (click)="RestartTimer();">Restart Timer</button>

```

##app.component.ts:

```typescript
import { Component } from '@angular/core';
import { NgcliIdleTimeoutService } from 'ngcli-idle-timeout';
import { DialogConfig } from 'ngcli-idle-timeout/lib/ngcli-idle-timeout.dialogconfig';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'ClientApp';

  private dialogConfig = <DialogConfig>
  { 
      DialogMessage: "", 
      TimeOutInSecs: 15, 
      DialogHeader: "", 
      ShowDialogInSecs: 10 
  };

  constructor(private ngcliIdleTimeoutService: NgcliIdleTimeoutService) {

  }

  OnStayLoggedIn() {
    alert('app component Hi');
  }

  OnTimerCompleted() {
    alert('timer completed');
  }

  StartWatching() {
    this.ngcliIdleTimeoutService.StartWatching(this.dialogConfig);
  }

  RestartTimer() {
    this.ngcliIdleTimeoutService.RestartTimer(this.dialogConfig);
  }
}

```


## NgcliIdleTimeoutService Service
`NgcliIdleTimeoutService` exposes both `StartWatching(this.dialogConfig)` and `RestartTimer(this.dialogConfig)` methods. Both methods do the same. You can use either one to trigger the timer. On any every API call you can call `RestartTimeer()` to reset the timer.

`NgcliIdleTimeoutService` emits both `OnStayLoggedIn()` and `OnTimerCompleted()` methods.
`

### OnStayLoggedIn()
`the method will be fired on `Stay LoggedIn` click on the timeout modal. You can refresh your session or call the API to keep it active
`

### OnStayLoggedIn()
`the method will be fired on `Timer Completed` event. you can logout the user and redirect to login page again.
`


## Author
[Ravinder Seelam](ravimsnetdev@gmail.com)

## Credits



## Copyright


## Licence

---
_Source: https://npm.io/package/ngcli-idle-timeout · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._