feat(router): Be able to exclude specific paths from NgxUiLoaderRouter

Author: t-ho

projects/ngx-ui-loader/src/lib/router/ngx-ui-loader-router-config.ts

@@ -2,6 +2,8 @@
  * The interface of ngx-ui-loader configuration
  */
 export interface NgxUiLoaderRouterConfig {
+  exclude?: string[]; // not show loader for the urls that start with these strings
+  excludeRegexp?: string[]; // not show loader for the urls matching these regexps
   loaderId?: string;
   showForeground?: boolean;
 }

projects/ngx-ui-loader/src/lib/router/ngx-ui-loader-router.module.ts

@@ -1,5 +1,5 @@
 import { NgModule, ModuleWithProviders, Inject, Optional, SkipSelf } from '@angular/core';
-import { NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router } from '@angular/router';
+import { NavigationCancel, NavigationEnd, NavigationError, NavigationStart, Router, RouterEvent } from '@angular/router';
 
 import { NgxUiLoaderService } from '../core/ngx-ui-loader.service';
 import { NgxUiLoaderRouterConfig } from './ngx-ui-loader-router-config';
@@ -9,6 +9,9 @@ import { ROUTER_LOADER_ID } from './ngx-ui-loader-router.constants';
 @NgModule({})
 export class NgxUiLoaderRouterModule {
 
+  private exclude: string[];
+  private excludeRegexp: RegExp[];
+
   /**
    * forRoot
    * @param routerConfig Configuration
@@ -50,26 +53,54 @@ export class NgxUiLoaderRouterModule {
     };
 
     if (config) {
+      if (config.exclude) {
+        this.exclude = config.exclude.map(url => url.toLowerCase());
+      }
+      if (config.excludeRegexp) {
+        this.excludeRegexp = config.excludeRegexp.map(regexp => new RegExp(regexp, 'i'));
+      }
       defaultConfig = { ...defaultConfig, ...config };
     }
 
     router.events
-      .subscribe(event => {
+      .subscribe((event: RouterEvent) => {
         if (event instanceof NavigationStart) {
-          if (defaultConfig.showForeground) {
-            ngxUiLoaderService.startLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
-          } else {
-            ngxUiLoaderService.startBackgroundLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+          if (!this.isIgnored(event.url)) {
+            if (defaultConfig.showForeground) {
+              ngxUiLoaderService.startLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+            } else {
+              ngxUiLoaderService.startBackgroundLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+            }
           }
         }
 
         if (event instanceof NavigationEnd || event instanceof NavigationCancel || event instanceof NavigationError) {
-          if (defaultConfig.showForeground) {
-            ngxUiLoaderService.stopLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
-          } else {
-            ngxUiLoaderService.stopBackgroundLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+          if (!this.isIgnored(event.url)) {
+            if (defaultConfig.showForeground) {
+              ngxUiLoaderService.stopLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+            } else {
+              ngxUiLoaderService.stopBackgroundLoader(defaultConfig.loaderId, ROUTER_LOADER_ID);
+            }
           }
         }
       });
   }
+
+  private isIgnored(url: string): boolean {
+    if (this.exclude) {
+      // do not show the loader for urls in the `exclude` list
+      if (this.exclude.findIndex(str => url.toLowerCase().startsWith(str)) !== -1) {
+        return true;
+      }
+    }
+
+    if (this.excludeRegexp) {
+      // do not show the loader for urls which matches regexps in the `excludeRegexp` list
+      if (this.excludeRegexp.findIndex(regexp => regexp.test(url)) !== -1) {
+        return true;
+      }
+    }
+
+    return false;
+  }
 }