项目作者: Eseath

项目描述 :
Track the user's activity status in Web Browser.
高级语言: JavaScript
项目地址: git://github.com/Eseath/user-idle-observer.git
创建时间: 2021-05-10T05:05:36Z
项目社区:https://github.com/Eseath/user-idle-observer

开源协议:MIT License

下载


User Idle Observer

Tracks the user’s activity status. Calls your listeners when considered the user is idle or wakes up.

Installation

  1. npm i @eseath/user-idle-observer

Usage example

  1. import { UserIdleObserver } from '@eseath/user-idle-observer';
  2. const observer = new UserIdleObserver();
  3. const listener = (isActive, event) => {
  4. if (isActive) {
  5. console.log('You have shown activity through a', event.type);
  6. } else {
  7. console.log('Wake up!');
  8. }
  9. };
  10. observer.addListener(listener).observe();

With custom options:

  1. import { UserIdleObserver, domEvents } from '@eseath/user-idle-observer';
  2. const observer = new UserIdleObserver({
  3. isActive: true,
  4. timeout: 5000,
  5. events: [...domEvents, 'keyup'],
  6. });

In browser:

  1. <script src="./dist/user-idle-observer.umd.js"></script>
  2. <script>
  3. document.addEventListener('DOMContentLoaded', function () {
  4. const observer = new UserIdleObserver({
  5. isActive: true,
  6. timeout: 5000,
  7. events: [...UserIdleObserver.domEvents, 'keyup'],
  8. });
  9. observer.addListener((isActive, event) => {
  10. if (isActive) {
  11. console.log('You have shown activity through a', event.type);
  12. } else {
  13. console.log('Wake up!');
  14. }
  15. });
  16. observer.observe();
  17. });
  18. </script>

Options

Name Type Default Description
isActive boolean false The initial activity status of the user.
timeout number 10000 Time after which the user is considered inactive (in milliseconds).
events string[] Array of DOM events, the occurrence of which indicates user activity.

Methods

See src/observer.d.ts