network-notifier v0.1.2

Angular 8 Network Connection Notifier by Feres Henteti

Network Notifier is a simple light-weight library that notifies you whether when the network connection has been lost or re-established.

Installation

Run npm install network-notifier to install this library.

Usage

To use this library, just import its module into your app.module.ts

import { NetworkNotifierModule } from "network-notifier";

and add it to your imports in the @NgModule annotation

@NgModule({
    ...
    imports: [..., NetworkNotifierModule],
    ...
})

and then place

<fh-network-notifier></fh-network-notifier>

wherever you want into your template, preferably in the root template of your project.

Test it!

To test if the library works fine, open the Chrome Debugger Console so you can simulate connection states (on, off, slow 3G, ...). Open Chrome Debugger Console (click on F12, or right click -> inspect element), go to 'Network' section, and you can find a network status switcher on the top.

Customize the notification popup!

For the moment, you can customize the following attributes:

<fh-network-notifier
  [_timeout]="timeout"
  [onlineMessage]="onlineMessage"
  [onlineBgColor]="onlineBgColor"
  [onlineTextColor]="onlineTextColor"
  [offlineMessage]="offlineMessage"
  [offlineBgColor]="offlineBgColor"
  [offlineTextColor]="offlineTextColor"
>
</fh-network-notifier>

Attributes

Note: Further customizations and popup types will be available soon. Your suggestions are welcome :D

Need help?

If you need further help, support, or have any other suggestions, please contact me at fereshenteti@gmail.com.

Enjoy :D