@osovitny/anatoly 2.0.23 → 2.0.26

package/fesm2015/osovitny-anatoly.js

@@ -1,15 +1,18 @@
-import Swal from 'sweetalert2';
-import { ɵɵdefineInjectable, ɵɵinject, Injectable, NgModule, Injector, Optional, SkipSelf, Component, Input, Directive, ElementRef } from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
+import { Injectable, ɵɵdefineInjectable, ɵɵinject, Pipe, NgModule, APP_INITIALIZER, Injector, Optional, SkipSelf, Component, Input, ViewEncapsulation, Inject, Directive, ElementRef } from '@angular/core';
+import { ActivatedRoute, Router, NavigationStart, NavigationEnd, NavigationCancel, NavigationError } from '@angular/router';
+import { HttpResponse, HttpClient } from '@angular/common/http';
+import { tap, map } from 'rxjs/operators';
+import { BehaviorSubject, Subject, merge, fromEvent, timer } from 'rxjs';
+import { TranslateService, TranslateModule, TranslateLoader } from '@ngx-translate/core';
 import { isValid, format, formatDistanceToNow, formatDistance } from 'date-fns';
 import enUS from 'date-fns/locale/en-US';
-import { CommonModule } from '@angular/common';
-import { HttpClient, HttpResponse } from '@angular/common/http';
-import { map, tap } from 'rxjs/operators';
-import { BehaviorSubject } from 'rxjs';
+import { LOCATION_INITIALIZED, CommonModule, DOCUMENT } from '@angular/common';
+import { TranslateHttpLoader } from '@ngx-translate/http-loader';
+import Swal from 'sweetalert2';
+import { ToastrService } from 'ngx-toastr';
 import { v4 } from 'uuid';
-import { ActivatedRoute, Router } from '@angular/router';
 import { NgControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { DomSanitizer } from '@angular/platform-browser';
 import { FroalaEditorModule, FroalaViewModule } from 'angular-froala-wysiwyg';
 
 /*
@@ -33,6 +36,28 @@ import { FroalaEditorModule, FroalaViewModule } from 'angular-froala-wysiwyg';
 const ContextInitState = JSON.parse((document.getElementById('contextInitState')).getAttribute('data-contextinitstate'));
 const AppCoreSettings = JSON.parse((document.getElementById('appCoreSettings')).getAttribute('data-appcoresettings'));
 
+/*
+<file>
+  Project:
+    MICE
+
+  Authors:
+    Vadim Osovitny vaosovitny@deloitte.com
+
+  Created:
+    5 May 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2020 Deloitte Tax. All rights reserved.
+</file>
+*/
+const Urls = {
+    // SignalR Notifications
+    notificationsSocketUrl: '/hubs/notifications'
+};
+
 /*
 <file>
   Project:
@@ -43,14 +68,31 @@ const AppCoreSettings = JSON.parse((document.getElementById('appCoreSettings')).
     Anatoly Osovitny
 
   Created:
-    26 Jun 2020
+    17 Jun 2018
 
   Version:
     1.0
 
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
-*/
+*/
+class BaseGoService {
+    constructor(route, router) {
+        this.route = route;
+        this.router = router;
+    }
+    locationReload() {
+        // this.router.navigate([this.route.url]);
+        window.location.reload();
+    }
+}
+BaseGoService.decorators = [
+    { type: Injectable }
+];
+BaseGoService.ctorParameters = () => [
+    { type: ActivatedRoute },
+    { type: Router }
+];
 
 /*
 <file>
@@ -86,7 +128,7 @@ function throwIfAlreadyLoaded(parentModule, moduleName) {
     Anatoly Osovitny
 
   Created:
-    4 Mar 2020
+    26 Jun 2020
 
   Version:
     1.0
@@ -94,129 +136,205 @@ function throwIfAlreadyLoaded(parentModule, moduleName) {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class Alerts {
-    static Info(text) {
-        Swal.fire({
-            title: "Information",
-            text: text,
-            icon: "info",
-            confirmButtonText: "OK",
-        });
+class LoadingService extends BehaviorSubject {
+    constructor() {
+        super(false);
+        this.counter = 0;
+        //Public
+        this.isFreezed = false;
     }
-    static Warning(text) {
-        Swal.fire({
-            title: "Warning",
-            text: text,
-            icon: "warning",
-            confirmButtonText: "OK",
-        });
+    show() {
+        this.counter++;
+        let that = this;
+        setTimeout(() => {
+            if (that.counter > 0) {
+                that.next(true);
+            }
+        }, 1000);
     }
-    static Error(text) {
-        Swal.fire({
-            title: "Error",
-            text: text,
-            icon: "error",
-            confirmButtonText: "OK",
-        });
+    hide() {
+        if (this.counter <= 0) {
+            return;
+        }
+        this.counter--;
+        if (this.counter == 0) {
+            this.next(false);
+        }
+    }
+    freeze(timeout = 1000) {
+        this.isFreezed = true;
+        let that = this;
+        setTimeout(() => {
+            this.isFreezed = false;
+        }, timeout);
     }
-    static NotImplemented() {
-        this.Warning("Not Implemented Yet");
+}
+LoadingService.ɵprov = ɵɵdefineInjectable({ factory: function LoadingService_Factory() { return new LoadingService(); }, token: LoadingService, providedIn: "root" });
+LoadingService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: "root",
+            },] }
+];
+LoadingService.ctorParameters = () => [];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    26 Jun 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class LoggingService {
+    constructor() { }
+    logError(error) {
+        console.error(error);
     }
-    static ErrorOccurred() {
-        this.Error("Sorry, an unexpected error occurred");
+    logInformation(info) {
+        console.info(info);
     }
-    static AreYouSure(text, title, confirmButtonText, cancelButtonText, successAction, cancelAction) {
-        if (typeof title == "undefined" || title == null)
-            title = "Are you sure?";
-        Swal.fire({
-            title: title,
-            text: text,
-            icon: "warning",
-            confirmButtonText: confirmButtonText,
-            cancelButtonText: cancelButtonText,
-            showCancelButton: true,
-        }).then((result) => {
-            if (result.value) {
-                if (successAction) {
-                    successAction();
+}
+LoggingService.ɵprov = ɵɵdefineInjectable({ factory: function LoggingService_Factory() { return new LoggingService(); }, token: LoggingService, providedIn: "root" });
+LoggingService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: "root",
+            },] }
+];
+LoggingService.ctorParameters = () => [];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    25 March 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class AnatolyHttpInterceptor {
+    constructor(loadingService, loggingService) {
+        this.loadingService = loadingService;
+        this.loggingService = loggingService;
+        this.longRunningExceptionsList = [];
+        this.autoCDNSASTokenUrls = ['chunks', 'resources'];
+        this.externalSiteUrls = ['azurewebsites.net'];
+    }
+    intercept(req, next) {
+        const isCDNEnabled = AppCoreSettings.IsCDNEnabled;
+        const cdnSasToken = AppCoreSettings.CDNSASToken;
+        const isLoadingFreezed = this.loadingService.isFreezed;
+        let loadingRequired = !isLoadingFreezed;
+        const authorizationTokenRequired = true;
+        const url = req.url.toLowerCase();
+        const originalUrl = req.url;
+        let isExternalSite = false;
+        if (!isLoadingFreezed) {
+            for (const i of this.longRunningExceptionsList) {
+                if (url.indexOf(this.longRunningExceptionsList[i]) >= 0) {
+                    loadingRequired = false;
+                    break;
                 }
             }
-            // result.dismiss can be 'cancel', 'overlay', 'close', and 'timer'
-            else if (result.dismiss == Swal.DismissReason.cancel ||
-                result.dismiss == Swal.DismissReason.close) {
-                if (cancelAction) {
-                    cancelAction();
+        }
+        if (isCDNEnabled) {
+            for (const i of this.autoCDNSASTokenUrls) {
+                if (url.indexOf(this.autoCDNSASTokenUrls[i]) >= 0) {
+                    req = req.clone({ url: originalUrl + cdnSasToken });
+                    break;
                 }
             }
-        });
-    }
-    static Success(text, title, successAction) {
-        if (typeof title == "undefined" || title == null)
-            title = "Success";
-        if (!text) {
-            text = "Operation was successful";
         }
-        Swal.fire({
-            title: title,
-            text: text,
-            icon: "success",
-            confirmButtonText: "OK",
-        }).then(function () {
-            if (successAction) {
-                successAction();
+        for (const i of this.externalSiteUrls) {
+            if (url.indexOf(this.externalSiteUrls[i]) >= 0) {
+                isExternalSite = true;
+                break;
             }
-        });
-    }
-    static Cancel(text) {
-        if (!text) {
-            text = "Operation has been cancled";
         }
-        Swal.fire({
-            title: "Cancelled",
-            text: text,
-            icon: "info",
-        });
-    }
-    //Notifications
-    static NotificationCancel(text, title) {
-        if (typeof title == "undefined" || title == null) {
-            title = "Canceled";
+        // VadimOS: IE11-fix
+        if (url.indexOf('/api/') > -1) {
+            let newUrl = '';
+            const t = new Date().getTime().toString();
+            if (url.indexOf('?') > -1) {
+                newUrl = originalUrl + '&t=' + t;
+            }
+            else {
+                newUrl = originalUrl + '?t=' + t;
+            }
+            req = req.clone({ url: newUrl });
         }
-        if (!text) {
-            text = "Operation has been canceled";
+        req = req.clone({ headers: req.headers.set('Accept', 'application/json') });
+        this.onRequestStart(loadingRequired);
+        return next.handle(req).pipe(tap((event) => {
+            if (event instanceof HttpResponse) {
+                this.onRequestEnd(loadingRequired);
+            }
+        }, (err) => {
+            this.onRequestEnd(loadingRequired);
+            this.loggingService.logError(err);
+        }));
+    }
+    onRequestStart(loadingRequired) {
+        if (loadingRequired) {
+            this.loadingService.show();
         }
-        const toast = Swal.mixin({
-            toast: true,
-            position: "top-end",
-            showConfirmButton: false,
-            timer: 3000,
-            timerProgressBar: true,
-        });
-        toast.fire({
-            title: title,
-            text: text,
-            icon: "info",
-        });
     }
-    static NotificationSuccess(text, title) {
-        if (typeof title == "undefined" || title == null) {
-            title = "Success";
+    onRequestEnd(loadingRequired) {
+        if (loadingRequired) {
+            this.loadingService.hide();
         }
-        if (!text) {
-            text = "Operation was successful";
+    }
+}
+AnatolyHttpInterceptor.decorators = [
+    { type: Injectable }
+];
+AnatolyHttpInterceptor.ctorParameters = () => [
+    { type: LoadingService },
+    { type: LoggingService }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    29 June 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class Convert {
+    static toLocalizedDateTime(value) {
+        if (value) {
+            return new Date(Date.UTC(value.getFullYear(), value.getMonth(), value.getDate(), value.getHours(), value.getMinutes(), value.getSeconds(), value.getMilliseconds()));
         }
-        const toast = Swal.mixin({
-            toast: true,
-            position: "top-end",
-            showConfirmButton: false,
-            timer: 3000,
-            timerProgressBar: true,
-        });
-        toast.fire({
-            title: title,
-            text: text,
-            icon: "success",
-        });
+        return null;
     }
 }
 
@@ -293,7 +411,7 @@ class LocalizationService {
         // To Do Manoj: Test in IE and make TimeZone specific changes accordingly
         const dateValue = new Date(key);
         if (isValid(dateValue)) {
-            const localDate = Utils.convertToLocalizedDateTime(dateValue);
+            const localDate = Convert.toLocalizedDateTime(dateValue);
             return format(localDate, AppCoreSettings.DATE_FORMATS.angularWithTime, this.dateFnsLocale);
         }
         return 'Invalid Date';
@@ -332,7 +450,7 @@ LocalizationService.ctorParameters = () => [
     Anatoly Osovitny
 
   Created:
-    26 Jun 2020
+     10 May 2020
 
   Version:
     1.0
@@ -340,22 +458,181 @@ LocalizationService.ctorParameters = () => [
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class LoggingService {
-    constructor() { }
-    logError(error) {
-        console.error(error);
-    }
-    logInformation(info) {
-        console.info(info);
+class LocalizePipe {
+    constructor(localizeService) {
+        this.localizeService = localizeService;
     }
-}
-LoggingService.ɵprov = ɵɵdefineInjectable({ factory: function LoggingService_Factory() { return new LoggingService(); }, token: LoggingService, providedIn: "root" });
-LoggingService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: "root",
+    transform(inputData, type, param2) {
+        if (!inputData) {
+            return;
+        }
+        if (!type) {
+            type = 't';
+        }
+        // Translate
+        if (type === 't') {
+            return this.localizeService.getLocalizedValue(inputData);
+        }
+        // Date
+        if (type === 'd') {
+            return this.localizeService.getLocalizedDate(inputData);
+        }
+        // DateTime
+        if (type === 'dt') {
+            return this.localizeService.getLocalizedDateTime(inputData);
+        }
+        // DistanceToNowInWords
+        if (type === 'dis2now') {
+            return this.localizeService.getLocalizedDistanceToNowInWords(inputData);
+        }
+        // DistanceInWords
+        if (type === 'dis') {
+            return this.localizeService.getLocalizedDistanceInWords(inputData, param2);
+        }
+        return inputData;
+    }
+}
+LocalizePipe.decorators = [
+    { type: Pipe, args: [{
+                name: 'localize'
             },] }
 ];
-LoggingService.ctorParameters = () => [];
+LocalizePipe.ctorParameters = () => [
+    { type: LocalizationService }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+     05 May 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+function customTranslateLoaderFactory(http) {
+    return new TranslateHttpLoader(http, AppCoreSettings.resourcesUrl + "/", '.json');
+}
+function localizationInitializerFactory(translate, localizationService, injector) {
+    return () => new Promise((resolve) => {
+        let locationInitialized = injector.get(LOCATION_INITIALIZED, Promise.resolve(null));
+        locationInitialized.then(() => {
+            let languageToSet = localizationService.configureTranslationSettings(translate);
+            translate.use(languageToSet).subscribe(() => {
+            }, () => {
+                resolve(null);
+            }, () => {
+                resolve(null);
+            });
+        });
+    });
+}
+const TranslateModuleAtRoot = TranslateModule.forRoot({
+    loader: {
+        provide: TranslateLoader,
+        useFactory: customTranslateLoaderFactory,
+        deps: [HttpClient]
+    }
+});
+class LocalizationSettingsModule {
+}
+LocalizationSettingsModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    TranslateModuleAtRoot
+                ],
+                providers: [
+                    {
+                        provide: APP_INITIALIZER,
+                        useFactory: localizationInitializerFactory,
+                        deps: [TranslateService, LocalizationService, Injector],
+                        multi: true
+                    }
+                ],
+                exports: []
+            },] }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+     12 May 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class LocalizationModule {
+}
+LocalizationModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    TranslateModule
+                ],
+                exports: [
+                    TranslateModule,
+                    LocalizePipe
+                ],
+                declarations: [
+                    LocalizePipe
+                ],
+                providers: []
+            },] }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    26 Jun 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class GlobalErrorHandler {
+    constructor(injector) {
+        this.injector = injector;
+    }
+    handleError(error) {
+        const loggingService = this.injector.get(LoggingService);
+        loggingService.logError(error);
+        // IMPORTANT: Rethrow the error otherwise it gets swallowed
+        throw error;
+    }
+}
+GlobalErrorHandler.decorators = [
+    { type: Injectable }
+];
+GlobalErrorHandler.ctorParameters = () => [
+    { type: Injector }
+];
 
 /*
 <file>
@@ -378,63 +655,59 @@ LoggingService.ctorParameters = () => [];
 class BaseApiService {
     constructor(http) {
         this.http = http;
-        this.baseUrl = "";
+        this.baseUrl = '';
     }
     serializeParams(data) {
-        return data ? "?" + $.param(data) : "";
+        return data ? '?' + $.param(data) : '';
     }
-    //api
+    // api
     get(action, data, responseType) {
         if (!responseType) {
-            responseType = "json";
+            responseType = 'json';
         }
-        var url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
+        const url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
         return this.http
-            .get(url, { responseType: responseType })
+            .get(url, { responseType })
             .pipe(map((res) => res));
     }
     post(action, data, responseType) {
         if (!responseType) {
-            responseType = "text";
+            responseType = 'text';
         }
-        var url = `${this.baseUrl}/${action}`;
-        return this.http.post(url, data, { responseType: responseType });
+        const url = `${this.baseUrl}/${action}`;
+        return this.http.post(url, data, { responseType });
     }
     postQS(action, data, responseType) {
         if (!responseType) {
-            responseType = "text";
+            responseType = 'text';
         }
-        var url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
-        return this.http.post(url, null, { responseType: responseType });
+        const url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
+        return this.http.post(url, null, { responseType });
     }
     delete(action, data, responseType) {
         if (!responseType) {
-            responseType = "text";
+            responseType = 'text';
         }
-        var url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
-        return this.http.delete(url, { responseType: responseType });
+        const url = `${this.baseUrl}/${action}${this.serializeParams(data)}`;
+        return this.http.delete(url, { responseType });
     }
-    //gets
+    // gets
     getById(id) {
-        return this.get("getById", { id: id });
+        return this.get('getById', { id });
     }
     getAll(data) {
-        return this.get("getall", data).pipe(map((res) => res));
+        return this.get('getall', data).pipe(map((res) => res));
     }
     getJsonFile(fileName, jsonUrl, jsonVersion) {
         if (!jsonUrl) {
-            jsonUrl = "/dist/jsons";
+            jsonUrl = '/dist/jsons';
         }
         if (!jsonVersion) {
-            jsonVersion = "1.0";
+            jsonVersion = '1.0';
         }
-        var url = jsonUrl + "/" + fileName + "?" + jsonVersion;
+        const url = jsonUrl + '/' + fileName + '?' + jsonVersion;
         return this.http.get(url).pipe(map((res) => res));
     }
-    getNewGuid() {
-        var url = `${this.baseUrl}/getNewGuid`;
-        return this.http.get(url, { responseType: "text" });
-    }
 }
 BaseApiService.decorators = [
     { type: Injectable }
@@ -468,10 +741,10 @@ class AppContextService extends BaseApiService {
         this.current = null;
         this.successes = [];
         this.subscription = null;
-        this.baseUrl = "/api/appContext";
+        this.baseUrl = '/api/appContext';
     }
     getCurrent(success) {
-        if (typeof success == "undefined") {
+        if (typeof success == 'undefined') {
             return;
         }
         if (this.current != null) {
@@ -482,14 +755,14 @@ class AppContextService extends BaseApiService {
         if (this.subscription != null) {
             return;
         }
-        this.subscription = this.get("GetCurrentContext", null).subscribe((data) => {
+        this.subscription = this.get('GetCurrentContext', null).subscribe((data) => {
             this.dataReceived(data);
         }, (e) => { });
     }
     dataReceived(data) {
         this.current = data;
-        for (var i = 0; i < this.successes.length; i++) {
-            var success = this.successes[i];
+        for (let i = 0; i < this.successes.length; i++) {
+            let success = this.successes[i];
             success(data);
         }
         this.successes = [];
@@ -529,52 +802,232 @@ AppContextService.ctorParameters = () => [
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class LoadingService extends BehaviorSubject {
-    constructor() {
-        super(false);
-        this.counter = 0;
-        //Public
-        this.isFreezed = false;
+class Guid {
+    static newGuid() {
+        return v4();
     }
-    show() {
-        this.counter++;
-        let that = this;
-        setTimeout(() => {
-            if (that.counter > 0) {
-                that.next(true);
-            }
-        }, 1000);
+}
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    2 Jun 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+// SignalR
+// import * as signalR from '@microsoft/signalr';
+// import { NotificationsApiService } from '../../../data/services/notifications/notifications-api-service';
+class NotificationService {
+    constructor(toastrService) {
+        this.toastrService = toastrService;
+        // SignalR
+        // private hubConnection: signalR.HubConnection;
+        // private socketUrl: string;
+        // Notifications
+        this._sessionNotifications = new BehaviorSubject([]);
+        this._serverNotifications = new BehaviorSubject([]);
+        // Public
+        this.sessionNotifications$ = this._sessionNotifications.asObservable();
+        this.serverNotifications$ = this._serverNotifications.asObservable();
+        // this.onInit();
     }
-    hide() {
-        if (this.counter <= 0) {
-            return;
+    /*
+    onInit() {
+      if (AppCoreSettings.AzureAD) {
+        this.authService.getAuthToken().subscribe((token: string) => {
+          this.startSignalRConnection(token);
+        });
+  
+        return;
+      }
+  
+      this.startSignalRConnection();
+    }
+  
+    ngOnDestroy() {
+      this.stopSignalRConnection();
+    }
+  
+    // SignalR
+    private startSignalRConnection(accessToken?) {
+      const cskii = AppCoreSettings.selectedClientID;
+      // tslint:disable-next-line:variable-name
+      const cskii_upn = AppCoreSettings.CSKII_UPN;
+      // tslint:disable-next-line:variable-name
+      const cli_sessionguid = AppCoreSettings.CLI_SessionGUID;
+  
+      const url = this.socketUrl + '?cskii=' + cskii + '&cskii_upn=' + cskii_upn + '&cli_sessionguid=' + cli_sessionguid;
+  
+      if (accessToken) {
+        this.hubConnection = new signalR.HubConnectionBuilder()
+          .withUrl(url, {
+            skipNegotiation: false,
+            transport: signalR.HttpTransportType.WebSockets,
+            accessTokenFactory: () => accessToken
+          })
+          .withAutomaticReconnect()
+          .configureLogging(signalR.LogLevel.Debug)
+          .build();
+      }
+      else {
+        this.hubConnection = new signalR.HubConnectionBuilder()
+          .withUrl(this.socketUrl, {
+            skipNegotiation: true,
+            transport: signalR.HttpTransportType.WebSockets
+          })
+          .withAutomaticReconnect()
+          .configureLogging(signalR.LogLevel.Debug)
+          .build();
+      }
+  
+      this.hubConnection
+        .start()
+        .then(() => this.signalRConnection_onSuccess())
+        .catch(err => {
+          console.error('Connection failed to SignalR Notification Hub')
+        })
+    }
+  
+    private signalRConnection_onSuccess() {
+      this.addReceiveMessageDataListener();
+  
+      this.notificationsApiService.retrieveNotifications().subscribe(data => {
+        this.serverNotifications = data;
+      });
+    }
+  
+    stopSignalRConnection() {
+      if (this.hubConnection) {
+        this.hubConnection.stop();
+        this.hubConnection = null;
+      }
+    }
+  
+    private addReceiveMessageDataListener = () => {
+      this.hubConnection.on('ReceiveMessage', (message) => {
+        if (message) {
+          if (message.type === 'error') {
+            this.error(message.text, null, null, false);
+          }
+          else {
+            this.success(message.text, null, null, false);
+          }
+  
+          const notification = {
+            id: message.id,
+            isNew: message.isNew,
+            isSession: true,
+            text: message.text,
+            type: message.type,
+            createdDate: message.createdDate
+          };
+  
+          this.addSessionNotificationToList(notification);
         }
-        this.counter--;
-        if (this.counter == 0) {
-            this.next(false);
+      });
+    }
+    */
+    addSessionNotification(text, type) {
+        const id = Guid.newGuid();
+        const notification = { id, isNew: true, isSession: true, text, type, createdDate: new Date(Date.now()).toISOString() };
+        this.addSessionNotificationToList(notification);
+    }
+    addSessionNotificationToList(notification) {
+        this.sessionNotifications = [
+            notification,
+            ...this.sessionNotifications,
+        ];
+    }
+    // Public API
+    removeNotification(id, isSession) {
+        if (isSession) {
+            this.sessionNotifications = this.sessionNotifications.filter(notifications => notifications.id !== id);
+        }
+        else {
+            this.serverNotifications = this.serverNotifications.filter(notifications => notifications.id !== id);
         }
     }
-    freeze(timeout = 1000) {
-        this.isFreezed = true;
-        let that = this;
-        setTimeout(() => {
-            this.isFreezed = false;
-        }, timeout);
+    success(text, params, title, createSessionNotification = true) {
+        text = Utils.getLocalizedValue(text, params, 'OperationSuccessFull');
+        title = Utils.getLocalizedValue(title);
+        this.toastrService.success(text, title, {
+            timeOut: 3000,
+            progressBar: true
+        });
+        if (createSessionNotification) {
+            this.addSessionNotification(text, 'success');
+        }
+    }
+    info(text, params, title) {
+        text = Utils.getLocalizedValue(text, params);
+        title = Utils.getLocalizedValue(title);
+        this.toastrService.info(text, title, {
+            timeOut: 3000,
+            progressBar: true
+        });
+    }
+    warning(text, params, title) {
+        text = Utils.getLocalizedValue(text, params);
+        title = Utils.getLocalizedValue(title);
+        this.toastrService.warning(text, title, {
+            timeOut: 3000,
+            progressBar: true
+        });
+    }
+    error(text, params, title, createSessionNotification = true) {
+        text = Utils.getLocalizedValue(text, params, 'ErrorOccured');
+        title = Utils.getLocalizedValue(title);
+        this.toastrService.error(text, title, {
+            timeOut: 3000,
+            progressBar: true
+        });
+        if (createSessionNotification) {
+            this.addSessionNotification(text, 'error');
+        }
+    }
+    cancel(text, params, title) {
+        text = Utils.getLocalizedValue(text, params, 'OperationCancelled');
+        title = Utils.getLocalizedValue(title);
+        this.toastrService.info(text, title, {
+            timeOut: 3000,
+            progressBar: true
+        });
+    }
+    // SessionNotifications
+    get sessionNotifications() {
+        return this._sessionNotifications.getValue();
+    }
+    set sessionNotifications(val) {
+        this._sessionNotifications.next(val);
+    }
+    // ServerNotifications
+    get serverNotifications() {
+        return this._serverNotifications.getValue();
+    }
+    set serverNotifications(val) {
+        this._serverNotifications.next(val);
     }
 }
-LoadingService.ɵprov = ɵɵdefineInjectable({ factory: function LoadingService_Factory() { return new LoadingService(); }, token: LoadingService, providedIn: "root" });
-LoadingService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: "root",
-            },] }
+NotificationService.ɵprov = ɵɵdefineInjectable({ factory: function NotificationService_Factory() { return new NotificationService(ɵɵinject(ToastrService)); }, token: NotificationService, providedIn: "root" });
+NotificationService.decorators = [
+    { type: Injectable, args: [{ providedIn: 'root' },] }
 ];
-LoadingService.ctorParameters = () => [];
+NotificationService.ctorParameters = () => [
+    { type: ToastrService }
+];
 
-const providers = [
-    LoggingService,
-    AppContextService,
-    LoadingService
-];
 let InjectorInstance;
 class AnatolyCoreModule {
     constructor(injector, parentModule) {
@@ -586,7 +1039,13 @@ class AnatolyCoreModule {
 AnatolyCoreModule.decorators = [
     { type: NgModule, args: [{
                 imports: [CommonModule],
-                providers: [...providers],
+                exports: [],
+                providers: [
+                    LoggingService,
+                    NotificationService,
+                    AppContextService,
+                    LoadingService
+                ],
             },] }
 ];
 AnatolyCoreModule.ctorParameters = () => [
@@ -612,13 +1071,13 @@ AnatolyCoreModule.ctorParameters = () => [
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-// @dynamic
 class Utils {
     static getValueByNameInQS(name) {
         return Utils.getValueByName(location.search, name);
     }
     static getValueByName(url, name) {
         name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
+        // tslint:disable-next-line:one-variable-per-declaration
         const regex = new RegExp('[\\?&]' + name + '=([^&#]*)'), results = regex.exec(url);
         return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
     }
@@ -664,16 +1123,6 @@ class Utils {
         }
         return key;
     }
-    /**
-     * Convert date time lo local time zone value.
-     * @param value
-     */
-    static convertToLocalizedDateTime(value) {
-        if (value) {
-            return new Date(Date.UTC(value.getFullYear(), value.getMonth(), value.getDate(), value.getHours(), value.getMinutes(), value.getSeconds(), value.getMilliseconds()));
-        }
-        return null;
-    }
     static downloadBlobFile(value, fileName) {
         if (window.navigator.msSaveOrOpenBlob) {
             window.navigator.msSaveOrOpenBlob(value, fileName);
@@ -695,7 +1144,7 @@ class Utils {
     Anatoly Osovitny
 
   Created:
-    26 Jun 2020
+    3 March 2020
 
   Version:
     1.0
@@ -703,20 +1152,91 @@ class Utils {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class Subs {
-    constructor() {
-        this.subs = [];
+class Alerts {
+    static success(text, params, title, successAction) {
+        text = Utils.getLocalizedValue(text, params, 'OperationSuccessFull');
+        title = Utils.getLocalizedValue(title, null, 'Success');
+        Swal.fire({
+            text,
+            title,
+            icon: 'success',
+            confirmButtonText: Utils.getLocalizedValue('Ok')
+        })
+            .then(() => {
+            if (successAction) {
+                successAction();
+            }
+        });
     }
-    add(...subscriptions) {
-        this.subs = this.subs.concat(subscriptions);
+    static info(text, params, title) {
+        text = Utils.getLocalizedValue(text, params);
+        title = Utils.getLocalizedValue(title, null, 'Info');
+        Swal.fire({
+            text,
+            title,
+            icon: 'info',
+            confirmButtonText: Utils.getLocalizedValue('Ok')
+        });
     }
-    set sink(subscription) {
-        this.subs.push(subscription);
+    static warning(text, params, title) {
+        text = Utils.getLocalizedValue(text, params);
+        title = Utils.getLocalizedValue(title, null, 'Warning');
+        Swal.fire({
+            text,
+            title,
+            icon: 'warning',
+            confirmButtonText: Utils.getLocalizedValue('Ok')
+        });
     }
-    unsubscribe() {
-        this.subs.forEach((sub) => sub && sub.unsubscribe());
-        this.subs = [];
+    static error(text, params, title) {
+        text = Utils.getLocalizedValue(text, params, 'ErrorOccured');
+        title = Utils.getLocalizedValue(title, null, 'Error');
+        Swal.fire({
+            text,
+            title,
+            icon: 'error',
+            confirmButtonText: Utils.getLocalizedValue('Ok')
+        });
+    }
+    static cancel(text, params, title) {
+        text = Utils.getLocalizedValue(text, params, 'OperationCancelled');
+        title = Utils.getLocalizedValue(title, null, 'Cancelled');
+        Swal.fire({
+            text,
+            title,
+            icon: 'info'
+        });
+    }
+    static notImplemented() {
+        this.warning('Not Implemented Yet');
     }
+    ;
+    static areYouSure(text, title, confirmButtonText, cancelButtonText, successAction, cancelAction) {
+        text = Utils.getLocalizedValue(text);
+        title = Utils.getLocalizedValue(title, null, 'AreYouSure');
+        Swal.fire({
+            text,
+            title,
+            icon: 'warning',
+            confirmButtonText: Utils.getLocalizedValue(confirmButtonText),
+            cancelButtonText: Utils.getLocalizedValue(cancelButtonText),
+            showCancelButton: true
+        })
+            .then((result) => {
+            if (result.value) {
+                if (successAction) {
+                    successAction();
+                }
+            }
+            // result.dismiss can be 'cancel', 'overlay', 'close', and 'timer'
+            else if (result.dismiss == Swal.DismissReason.cancel || result.dismiss == Swal.DismissReason.close) {
+                if (cancelAction) {
+                    cancelAction();
+                }
+            }
+        });
+    }
+    ;
 }
 
 /*
@@ -729,19 +1249,14 @@ class Subs {
     Anatoly Osovitny
 
   Created:
-    26 Jun 2020
+    2 Jun 2020
 
   Version:
     1.0
 
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
-*/
-class Guid {
-    static newGuid() {
-        return v4();
-    }
-}
+*/
 
 /*
 <file>
@@ -753,7 +1268,7 @@ class Guid {
     Anatoly Osovitny
 
   Created:
-    17 Jun 2018
+    26 Jun 2020
 
   Version:
     1.0
@@ -761,22 +1276,46 @@ class Guid {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class BaseGoService {
-    constructor(route, router) {
-        this.route = route;
-        this.router = router;
+class IdleService {
+    constructor() {
+        this.expired$ = new Subject();
     }
-    locationReload() {
-        //this.router.navigate([this.route.url]);
-        window.location.reload();
+    startWatching(timeOutSeconds) {
+        this.idle$ = merge(fromEvent(document, "mousemove"), fromEvent(document, "click"), fromEvent(document, "mousedown"), fromEvent(document, "keypress"), fromEvent(document, "DOMMouseScroll"), fromEvent(document, "mousewheel"), fromEvent(document, "touchmove"), fromEvent(document, "MSPointerMove"), fromEvent(window, "mousemove"), fromEvent(window, "resize"));
+        this.timeOutMilliSeconds = timeOutSeconds * 1000;
+        this.idleSubscription = this.idle$.subscribe((res) => {
+            this.resetTimer();
+        });
+        this.startTimer();
+        return this.expired$;
+    }
+    startTimer() {
+        this.timer$ = timer(this.timeOutMilliSeconds, this.timeOutMilliSeconds).subscribe((res) => {
+            this.expired$.next(true);
+        });
+    }
+    resetTimer() {
+        this.timer$.unsubscribe();
+        this.startTimer();
+    }
+    stopTimer() {
+        this.timer$.unsubscribe();
+        this.idleSubscription.unsubscribe();
+    }
+    restartIdleTimer() {
+        this.timer$.unsubscribe();
+        this.idleSubscription.unsubscribe();
+        this.idleSubscription = this.idle$.subscribe((res) => {
+            this.resetTimer();
+        });
+        this.startTimer();
     }
 }
-BaseGoService.decorators = [
-    { type: Injectable }
-];
-BaseGoService.ctorParameters = () => [
-    { type: ActivatedRoute },
-    { type: Router }
+IdleService.ɵprov = ɵɵdefineInjectable({ factory: function IdleService_Factory() { return new IdleService(); }, token: IdleService, providedIn: "root" });
+IdleService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: "root",
+            },] }
 ];
 
 /*
@@ -797,122 +1336,48 @@ BaseGoService.ctorParameters = () => [
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class GlobalErrorHandler {
-    constructor(injector) {
-        this.injector = injector;
+class WebStorageService {
+    constructor(storage) {
+        this.currentClientKey = AppCoreSettings.SERVICES_CONF.selectedClientID;
+        this.storage =
+            storage === 'local' || storage === 'localStorage'
+                ? localStorage
+                : sessionStorage;
     }
-    handleError(error) {
-        const loggingService = this.injector.get(LoggingService);
-        loggingService.logError(error);
-        // IMPORTANT: Rethrow the error otherwise it gets swallowed
-        throw error;
+    setItem(key, value) {
+        this.storage.setItem(this.currentClientKey + key, value);
     }
-}
-GlobalErrorHandler.decorators = [
-    { type: Injectable }
-];
-GlobalErrorHandler.ctorParameters = () => [
-    { type: Injector }
-];
-
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    25 March 2020
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-class AnatolyHttpInterceptor {
-    constructor(loadingService, loggingService) {
-        this.loadingService = loadingService;
-        this.loggingService = loggingService;
-        this.longRunningExceptionsList = [];
-        this.autoCDNSASTokenUrls = ['chunks', 'resources'];
-        this.externalSiteUrls = ['azurewebsites.net'];
+    setObject(key, value) {
+        this.storage.setItem(this.currentClientKey + key, JSON.stringify(value));
     }
-    intercept(req, next) {
-        const isCDNEnabled = AppCoreSettings.IsCDNEnabled;
-        const cdnSasToken = AppCoreSettings.CDNSASToken;
-        const isLoadingFreezed = this.loadingService.isFreezed;
-        let loadingRequired = !isLoadingFreezed;
-        const authorizationTokenRequired = true;
-        const url = req.url.toLowerCase();
-        const originalUrl = req.url;
-        let isExternalSite = false;
-        if (!isLoadingFreezed) {
-            for (const i of this.longRunningExceptionsList) {
-                if (url.indexOf(this.longRunningExceptionsList[i]) >= 0) {
-                    loadingRequired = false;
-                    break;
-                }
-            }
-        }
-        if (isCDNEnabled) {
-            for (const i of this.autoCDNSASTokenUrls) {
-                if (url.indexOf(this.autoCDNSASTokenUrls[i]) >= 0) {
-                    req = req.clone({ url: originalUrl + cdnSasToken });
-                    break;
-                }
-            }
-        }
-        for (const i of this.externalSiteUrls) {
-            if (url.indexOf(this.externalSiteUrls[i]) >= 0) {
-                isExternalSite = true;
-                break;
-            }
-        }
-        // VadimOS: IE11-fix
-        if (url.indexOf('/api/') > -1) {
-            let newUrl = '';
-            const t = new Date().getTime().toString();
-            if (url.indexOf('?') > -1) {
-                newUrl = originalUrl + '&t=' + t;
-            }
-            else {
-                newUrl = originalUrl + '?t=' + t;
-            }
-            req = req.clone({ url: newUrl });
-        }
-        req = req.clone({ headers: req.headers.set('Accept', 'application/json') });
-        this.onRequestStart(loadingRequired);
-        return next.handle(req).pipe(tap((event) => {
-            if (event instanceof HttpResponse) {
-                this.onRequestEnd(loadingRequired);
-            }
-        }, (err) => {
-            this.onRequestEnd(loadingRequired);
-            this.loggingService.logError(err);
-        }));
+    getItem(key) {
+        return this.storage.getItem(this.currentClientKey + key);
     }
-    onRequestStart(loadingRequired) {
-        if (loadingRequired) {
-            this.loadingService.show();
-        }
+    getObject(key) {
+        return JSON.parse(this.storage.getItem(this.currentClientKey + key) || '{}');
     }
-    onRequestEnd(loadingRequired) {
-        if (loadingRequired) {
-            this.loadingService.hide();
-        }
+    remove(key) {
+        this.storage.removeItem(this.currentClientKey + key);
     }
 }
-AnatolyHttpInterceptor.decorators = [
+class LocalStorageService extends WebStorageService {
+    constructor() {
+        super('localStorage');
+    }
+}
+LocalStorageService.decorators = [
     { type: Injectable }
 ];
-AnatolyHttpInterceptor.ctorParameters = () => [
-    { type: LoadingService },
-    { type: LoggingService }
-];
+LocalStorageService.ctorParameters = () => [];
+class SessionStorageService extends WebStorageService {
+    constructor() {
+        super('sessionStorage');
+    }
+}
+SessionStorageService.decorators = [
+    { type: Injectable }
+];
+SessionStorageService.ctorParameters = () => [];
 
 /*
 <file>
@@ -931,7 +1396,22 @@ AnatolyHttpInterceptor.ctorParameters = () => [
 
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
-*/
+*/
+class Subs {
+    constructor() {
+        this.subs = [];
+    }
+    add(...subscriptions) {
+        this.subs = this.subs.concat(subscriptions);
+    }
+    set sink(subscription) {
+        this.subs.push(subscription);
+    }
+    unsubscribe() {
+        this.subs.forEach((sub) => sub && sub.unsubscribe());
+        this.subs = [];
+    }
+}
 
 /*
 <file>
@@ -1063,6 +1543,68 @@ BaseGridEditService.ctorParameters = () => [
     { type: HttpClient }
 ];
 
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    30 April 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+const consts = {
+    billingApiPath: 'api/billing',
+    // Notifications API
+    notificationsApiPath: 'api/notifications',
+};
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    30 April 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class NotificationsApiService extends BaseApiService {
+    constructor(http) {
+        super(http);
+        this.http = http;
+        this.baseUrl = consts.notificationsApiPath;
+    }
+    retrieveNotifications() {
+        return this.get('retrieveNotifications');
+    }
+}
+NotificationsApiService.ɵprov = ɵɵdefineInjectable({ factory: function NotificationsApiService_Factory() { return new NotificationsApiService(ɵɵinject(HttpClient)); }, token: NotificationsApiService, providedIn: "root" });
+NotificationsApiService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
+];
+NotificationsApiService.ctorParameters = () => [
+    { type: HttpClient }
+];
+
 /*
 <file>
   Project:
@@ -1085,12 +1627,10 @@ class BillingApiService extends BaseApiService {
     constructor(http) {
         super(http);
         this.http = http;
-        this.baseUrl += "billing/";
+        this.baseUrl = consts.billingApiPath;
     }
     requestNewSubscription(requestedPlan, success, error) {
-        this.postQS("requestNewSubscription", {
-            requestedPlan: requestedPlan,
-        }).subscribe((data) => { }, (e) => {
+        this.postQS("requestNewSubscription", { requestedPlan: requestedPlan }).subscribe((data) => { }, (e) => {
             if (error)
                 error();
         }, () => {
@@ -1143,33 +1683,24 @@ BillingApiService.ctorParameters = () => [
 </file>
 */
 class AnatolyDataModule {
+    constructor(parentModule) {
+        throwIfAlreadyLoaded(parentModule, 'AnatolyDataModule');
+    }
 }
 AnatolyDataModule.decorators = [
     { type: NgModule, args: [{
-                imports: [CommonModule],
-                providers: [BillingApiService],
+                imports: [
+                    CommonModule
+                ],
+                providers: [
+                    BillingApiService
+                ],
             },] }
+];
+AnatolyDataModule.ctorParameters = () => [
+    { type: AnatolyDataModule, decorators: [{ type: Optional }, { type: SkipSelf }] }
 ];
 
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    4 Mar 2020
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-
 /*
 <file>
   Project:
@@ -1195,7 +1726,7 @@ class BuyAccessButtonComponent {
         this.contextUpdated = false;
         this.isUserSignedIn = false;
         this.currentPlan = 0;
-        this.currentPlanTitle = "";
+        this.currentPlanTitle = '';
     }
     ngOnInit() {
         if (!this.appcontext.isUserSignedIn()) {
@@ -1214,9 +1745,9 @@ class BuyAccessButtonComponent {
     onBuyPlan() {
         const text = `Requested plan: ${this.plantitle} `;
         const that = this;
-        Alerts.AreYouSure(text, "Buying access", "Confirm change", "Cancel", () => {
+        Alerts.areYouSure(text, 'Buying access', 'Confirm change', 'Cancel', () => {
             that.api.buyAccess(that.plan, () => {
-                Alerts.Success("Access Granted", null, () => {
+                Alerts.success('Access Granted', null, null, () => {
                     window.location.reload();
                 });
             });
@@ -1225,7 +1756,7 @@ class BuyAccessButtonComponent {
 }
 BuyAccessButtonComponent.decorators = [
     { type: Component, args: [{
-                selector: "anatoly-buyaccess-button",
+                selector: 'anatoly-buyaccess-button',
                 template: "<div *ngIf=\"contextUpdated\">\r\n  <div *ngIf=\"!isUserSignedIn\">\r\n    <anatoly-signup-button classbtn=\"btn btn-block btn-primary\"></anatoly-signup-button>\r\n  </div>\r\n\r\n  <div *ngIf=\"isUserSignedIn\">\r\n    <button class=\"btn btn-block btn-success selectPlan\" *ngIf=\"plan == currentPlan\">\r\n      Your Plan\r\n    </button>\r\n\r\n    <button class=\"btn btn-block  btn-warning selectPlan\" *ngIf=\"plan != currentPlan && currentPlan == 1\" (click)=\"onBuyPlan()\">\r\n      Buy Now\r\n    </button>\r\n  </div>\r\n</div>\r\n"
             },] }
 ];
@@ -1323,9 +1854,9 @@ class UpgradePlanButtonComponent {
     onUpgradePlan() {
         const text = `Current plan: ${this.currentplantitle} New plan: ${this.requestedplantitle}`;
         const that = this;
-        Alerts.AreYouSure(text, "Change billing plan", "Confirm change", "Cancel", () => {
+        Alerts.areYouSure(text, 'Change billing plan', 'Confirm change', 'Cancel', () => {
             that.api.requestNewSubscription(that.requestedplan, () => {
-                Alerts.Success("Your request for changing plan has been sent.", null, () => {
+                Alerts.success('Your request for changing plan has been sent.', null, null, () => {
                     window.location.reload();
                 });
             });
@@ -1334,7 +1865,7 @@ class UpgradePlanButtonComponent {
 }
 UpgradePlanButtonComponent.decorators = [
     { type: Component, args: [{
-                selector: "anatoly-upgrade-plan-button",
+                selector: 'anatoly-upgrade-plan-button',
                 template: "<button class=\"btn btn-block btn-primary\" (click)=\"onUpgradePlan()\">\r\n  Upgrade\r\n</button>\r\n"
             },] }
 ];
@@ -1357,7 +1888,7 @@ UpgradePlanButtonComponent.propDecorators = {
     Anatoly Osovitny
 
   Created:
-    4 Jul 2018
+    23 Apr 2018
 
   Version:
     1.0
@@ -1365,18 +1896,21 @@ UpgradePlanButtonComponent.propDecorators = {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class SignInButtonComponent {
-    constructor() { }
+class ContentHeaderComponent {
+    ngOnInit() {
+        if (this.title == null) {
+            this.title = "";
+        }
+    }
 }
-SignInButtonComponent.decorators = [
+ContentHeaderComponent.decorators = [
     { type: Component, args: [{
-                selector: "anatoly-signin-button",
-                template: "<a href=\"identity/signIn\" class=\"{{classbtn}}\">Sign In</a>\r\n"
+                selector: "anatoly-content-header",
+                template: "<h2 class=\"page-header\">\r\n  {{title}}\r\n  <!--<small>Optional {{title}}</small>-->\r\n</h2>\r\n"
             },] }
 ];
-SignInButtonComponent.ctorParameters = () => [];
-SignInButtonComponent.propDecorators = {
-    classbtn: [{ type: Input }]
+ContentHeaderComponent.propDecorators = {
+    title: [{ type: Input }]
 };
 
 /*
@@ -1389,7 +1923,7 @@ SignInButtonComponent.propDecorators = {
     Anatoly Osovitny
 
   Created:
-    4 Jul 2018
+    12 Dec 2017
 
   Version:
     1.0
@@ -1397,83 +1931,75 @@ SignInButtonComponent.propDecorators = {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class SignOutButtonComponent {
-    constructor() { }
-}
-SignOutButtonComponent.decorators = [
-    { type: Component, args: [{
-                selector: "anatoly-signout-button",
-                template: "<a href=\"identity/signOut\" class=\"{{classbtn}}\">Sign Out</a>\r\n"
-            },] }
-];
-SignOutButtonComponent.ctorParameters = () => [];
-SignOutButtonComponent.propDecorators = {
-    classbtn: [{ type: Input }]
-};
-
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    4 Jul 2018
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-class SignUpButtonComponent {
-}
-SignUpButtonComponent.decorators = [
-    { type: Component, args: [{
-                selector: "anatoly-signup-button",
-                template: "<a href=\"identity/signup\" class=\"{{classbtn}}\">Sign Up</a>\r\n"
-            },] }
-];
-SignUpButtonComponent.propDecorators = {
-    classbtn: [{ type: Input }]
-};
-
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    23 Apr 2018
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-class ContentHeaderComponent {
-    ngOnInit() {
-        if (this.title == null) {
-            this.title = "";
-        }
-    }
-}
-ContentHeaderComponent.decorators = [
-    { type: Component, args: [{
-                selector: "anatoly-content-header",
-                template: "<h2 class=\"page-header\">\r\n  {{title}}\r\n  <!--<small>Optional {{title}}</small>-->\r\n</h2>\r\n"
-            },] }
-];
-ContentHeaderComponent.propDecorators = {
-    title: [{ type: Input }]
+const DefaultEditorOptions = {
+    placeholderText: "Edit Your Content Here",
+    charCounterCount: true,
+    heightMin: 100,
+    toolbarInline: false,
+    toolbarButtons: {
+        moreText: {
+            buttons: [
+                "bold",
+                "italic",
+                "underline",
+                "strikeThrough",
+                "subscript",
+                "superscript",
+                "fontFamily",
+                "fontSize",
+                "textColor",
+                "backgroundColor",
+                "inlineClass",
+                "inlineStyle",
+            ],
+        },
+        moreParagraph: {
+            buttons: [
+                "alignLeft",
+                "alignCenter",
+                "formatOLSimple",
+                "alignRight",
+                "alignJustify",
+                "formatOL",
+                "formatUL",
+                "paragraphFormat",
+                "paragraphStyle",
+                "lineHeight",
+                "outdent",
+                "indent",
+                "quote",
+            ],
+        },
+        moreRich: {
+            buttons: [
+                "insertLink",
+                "insertImage",
+                "insertTable",
+                "emoticons",
+                "fontAwesome",
+                "specialCharacters",
+                "embedly",
+            ],
+        },
+        moreMisc: {
+            buttons: [
+                "selectAll",
+                "clearFormatting",
+                "html",
+                "undo",
+                "redo",
+                "fullscreen",
+            ],
+            align: "right",
+        },
+    },
+    /*
+        Upload:
+        https://www.froala.com/wysiwyg-editor/docs/concepts/image/upload
+    */
+    imageUploadURL: "/api/HtmlEditor/UploadImage",
+    imageAllowedTypes: ["jpeg", "jpg", "png"],
+    imageUploadParams: { uploadType: "", uploadParentId: "" },
 };
 
 /*
@@ -1593,75 +2119,263 @@ BaseEditComponent.propDecorators = {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-const DefaultEditorOptions = {
-    placeholderText: "Edit Your Content Here",
-    charCounterCount: true,
-    heightMin: 100,
-    toolbarInline: false,
-    toolbarButtons: {
-        moreText: {
-            buttons: [
-                "bold",
-                "italic",
-                "underline",
-                "strikeThrough",
-                "subscript",
-                "superscript",
-                "fontFamily",
-                "fontSize",
-                "textColor",
-                "backgroundColor",
-                "inlineClass",
-                "inlineStyle",
-            ],
-        },
-        moreParagraph: {
-            buttons: [
-                "alignLeft",
-                "alignCenter",
-                "formatOLSimple",
-                "alignRight",
-                "alignJustify",
-                "formatOL",
-                "formatUL",
-                "paragraphFormat",
-                "paragraphStyle",
-                "lineHeight",
-                "outdent",
-                "indent",
-                "quote",
-            ],
-        },
-        moreRich: {
-            buttons: [
-                "insertLink",
-                "insertImage",
-                "insertTable",
-                "emoticons",
-                "fontAwesome",
-                "specialCharacters",
-                "embedly",
-            ],
-        },
-        moreMisc: {
-            buttons: [
-                "selectAll",
-                "clearFormatting",
-                "html",
-                "undo",
-                "redo",
-                "fullscreen",
-            ],
-            align: "right",
-        },
-    },
-    /*
-        Upload:
-        https://www.froala.com/wysiwyg-editor/docs/concepts/image/upload
-    */
-    imageUploadURL: "/api/HtmlEditor/UploadImage",
-    imageAllowedTypes: ["jpeg", "jpg", "png"],
-    imageUploadParams: { uploadType: "", uploadParentId: "" },
+class BaseHtmlEditorComponent extends BaseEditComponent {
+    constructor() {
+        super();
+        this.froalaEditorInitialized = false;
+        this.afterInitializedActions = [];
+        // Inputs
+        this.editorLabelText = 'Html';
+        this.editorOptions = {};
+    }
+    ngOnInit() {
+        let opt = this.editorOptions;
+        if (typeof this.editorOptions == 'string') {
+            opt = JSON.parse(this.editorOptions);
+        }
+        let newOptions = $.extend({}, DefaultEditorOptions, opt);
+        const key = AppCoreSettings.froalaEditorKey;
+        if (key) {
+            newOptions = $.extend({}, newOptions, JSON.parse('{ "key": "' + key + '" }'));
+        }
+        if (newOptions.events && newOptions.events.initialized) {
+            newOptions.events.initialized.overridden = false;
+        }
+        this.options = newOptions;
+    }
+    ngAfterViewInit() {
+        const that = this;
+        setTimeout(function () {
+            that.froalaEditorInitialized = true;
+            that.onInitialized();
+        }, 300);
+    }
+    onInitialized() {
+        const actions = this.afterInitializedActions;
+        // Clear actions
+        this.afterInitializedActions = [];
+        if (actions) {
+            for (let i = 0; i < actions.length; i++) {
+                actions[i]();
+            }
+        }
+    }
+    getEditor() {
+        if (this.froalaEditor)
+            return this.froalaEditor.getEditor();
+        return null;
+    }
+    // Public Funcs
+    doAfterInitialized(action) {
+        const that = this;
+        if (!this.froalaEditorInitialized) {
+            this.afterInitializedActions.push(() => {
+                action(that);
+            });
+        }
+        else {
+            action(that);
+        }
+    }
+    initializeControl(control) {
+        this.froalaEditor = control;
+        this.froalaEditor.initialize();
+    }
+    setUploadParams(uploadType, uploadParentId) {
+        this.doAfterInitialized(function (that) {
+            const editor = that.getEditor();
+            if (typeof editor == 'undefined' || editor == null) {
+                return;
+            }
+            editor.opts.imageUploadParams.uploadType = uploadType;
+            editor.opts.imageUploadParams.uploadParentId = uploadParentId;
+        });
+    }
+}
+BaseHtmlEditorComponent.propDecorators = {
+    editorLabelText: [{ type: Input }],
+    editorOptions: [{ type: Input }]
+};
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    12 Dec 2017
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class FormsHtmlEditorComponent extends BaseHtmlEditorComponent {
+    constructor() {
+        super();
+        this.editorFormKey = "html";
+    }
+    setFormValueAfterInitialized(name, value) {
+        this.doAfterInitialized(function (that) {
+            that.setFormValue(name, value);
+        });
+    }
+}
+FormsHtmlEditorComponent.decorators = [
+    { type: Component, args: [{
+                selector: "anatoly-forms-html-editor",
+                template: "<div [formGroup]=\"formGroup\">\r\n  <div class=\"form-group\" [ngClass]=\"{'has-error': isControlInvalid(editorFormKey) }\">\r\n    <label class=\"control-label\">{{ editorLabelText }}</label>\r\n    <textarea [formControlName]=\"editorFormKey\"\r\n              [froalaEditor]=\"options\" (froalaInit)=\"initializeControl($event)\">\r\n    </textarea>\r\n    <anatoly-item-validation-summary [formGroup]=\"formGroup\"\r\n                                     [formSubmitted]=\"formSubmitted\"\r\n                                     [controlName]=\"editorFormKey\"\r\n                                     [controlTitle]=\"editorLabelText\">\r\n    </anatoly-item-validation-summary>\r\n  </div>\r\n</div>\r\n"
+            },] }
+];
+FormsHtmlEditorComponent.ctorParameters = () => [];
+FormsHtmlEditorComponent.propDecorators = {
+    editorFormKey: [{ type: Input }]
+};
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    12 Dec 2017
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class HtmlEditorComponent extends BaseHtmlEditorComponent {
+    constructor() {
+        super();
+    }
+    setHtml(content) {
+        this.doAfterInitialized(function (that) {
+            var editor = that.getEditor();
+            if (typeof editor == "undefined" || editor == null) {
+                return;
+            }
+            editor.html.set(content);
+        });
+    }
+    getHtml() {
+        var editor = this.getEditor();
+        if (typeof editor == "undefined" || editor == null) {
+            return;
+        }
+        return editor.html.get(false);
+    }
+}
+HtmlEditorComponent.decorators = [
+    { type: Component, args: [{
+                selector: "anatoly-html-editor",
+                template: "<div>\r\n  <label>{{ editorLabelText }}</label>\r\n  <textarea [froalaEditor]=\"options\" (froalaInit)=\"initializeControl($event)\">\r\n  </textarea>\r\n</div>"
+            },] }
+];
+HtmlEditorComponent.ctorParameters = () => [];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    4 Jul 2018
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class SignInButtonComponent {
+    constructor() { }
+}
+SignInButtonComponent.decorators = [
+    { type: Component, args: [{
+                selector: "anatoly-signin-button",
+                template: "<a href=\"identity/signIn\" class=\"{{classbtn}}\">Sign In</a>\r\n"
+            },] }
+];
+SignInButtonComponent.ctorParameters = () => [];
+SignInButtonComponent.propDecorators = {
+    classbtn: [{ type: Input }]
+};
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    4 Jul 2018
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class SignOutButtonComponent {
+    constructor() { }
+}
+SignOutButtonComponent.decorators = [
+    { type: Component, args: [{
+                selector: "anatoly-signout-button",
+                template: "<a href=\"identity/signOut\" class=\"{{classbtn}}\">Sign Out</a>\r\n"
+            },] }
+];
+SignOutButtonComponent.ctorParameters = () => [];
+SignOutButtonComponent.propDecorators = {
+    classbtn: [{ type: Input }]
+};
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    4 Jul 2018
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class SignUpButtonComponent {
+}
+SignUpButtonComponent.decorators = [
+    { type: Component, args: [{
+                selector: "anatoly-signup-button",
+                template: "<a href=\"identity/signup\" class=\"{{classbtn}}\">Sign Up</a>\r\n"
+            },] }
+];
+SignUpButtonComponent.propDecorators = {
+    classbtn: [{ type: Input }]
 };
 
 /*
@@ -1674,7 +2388,7 @@ const DefaultEditorOptions = {
     Anatoly Osovitny
 
   Created:
-    12 Dec 2017
+    9 May 2020
 
   Version:
     1.0
@@ -1682,82 +2396,100 @@ const DefaultEditorOptions = {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class BaseHtmlEditorComponent extends BaseEditComponent {
-    constructor() {
-        super();
-        this.froalaEditorInitialized = false;
-        this.afterInitializedActions = [];
-        //Inputs
-        this.editorLabelText = "Html";
-        this.editorOptions = {};
+class LoadingComponent {
+    constructor(loadingService) {
+        this.loadingService = loadingService;
+        // Private
+        this.subs = new Subs();
+        // Public
+        this.show = false;
     }
     ngOnInit() {
-        let opt = this.editorOptions;
-        if (typeof this.editorOptions == "string") {
-            opt = JSON.parse(this.editorOptions);
-        }
-        let newOptions = $.extend({}, DefaultEditorOptions, opt);
-        let key = AppCoreSettings.froalaEditorKey;
-        if (key) {
-            newOptions = $.extend({}, newOptions, JSON.parse('{ "key": "' + key + '" }'));
-        }
-        if (newOptions.events && newOptions.events.initialized) {
-            newOptions.events.initialized.overridden = false;
-        }
-        this.options = newOptions;
+        this.subs.sink = this.loadingService.subscribe((state) => {
+            this.show = state;
+        });
     }
-    ngAfterViewInit() {
-        let that = this;
-        setTimeout(function () {
-            that.froalaEditorInitialized = true;
-            that.onInitialized();
-        }, 300);
+    ngOnDestroy() {
+        this.subs.unsubscribe();
     }
-    onInitialized() {
-        let actions = this.afterInitializedActions;
-        //Clear actions
-        this.afterInitializedActions = [];
-        if (actions) {
-            for (var i = 0; i < actions.length; i++) {
-                actions[i]();
+}
+LoadingComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'anatoly-loading',
+                template: "<div *ngIf=\"show\">\r\n  <span id=\"pnlLoading\" class=\"k-icon k-i-loading\"></span>\r\n</div>\r\n"
+            },] }
+];
+LoadingComponent.ctorParameters = () => [
+    { type: LoadingService }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    16 May 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+const SpinnerSpinKit = {
+    spinnerLine: 'spinner-line-material',
+    // ToDo
+    ChasingDots: 'spinner-chasing-dots',
+    CubeGrid: 'spinner-cube-grid',
+    DoubleBounce: 'spinner-double-bounce',
+    RotatingPlane: 'spinner-rotationg-plane',
+    SpinnerPulse: 'spinner-spinner-pulse',
+    ThreeBounce: 'spinner-three-bounce',
+    WanderingCubes: 'spinner-wandering-cubes',
+    Wave: 'spinner-wave'
+};
+class SpinnerComponent {
+    constructor(router, document) {
+        this.router = router;
+        this.document = document;
+        this.isSpinnerVisible = true;
+        this.spinnerSpinKit = SpinnerSpinKit;
+        this.backgroundColor = '#007CB0';
+        this.spinner = SpinnerSpinKit.spinnerLine;
+        this.router.events.subscribe(event => {
+            if (event instanceof NavigationStart) {
+                this.isSpinnerVisible = true;
             }
-        }
-    }
-    getEditor() {
-        if (this.froalaEditor)
-            return this.froalaEditor.getEditor();
-        return null;
-    }
-    //Public Funcs
-    doAfterInitialized(action) {
-        let that = this;
-        if (!this.froalaEditorInitialized) {
-            this.afterInitializedActions.push(() => {
-                action(that);
-            });
-        }
-        else {
-            action(that);
-        }
-    }
-    initializeControl(control) {
-        this.froalaEditor = control;
-        this.froalaEditor.initialize();
-    }
-    setUploadParams(uploadType, uploadParentId) {
-        this.doAfterInitialized(function (that) {
-            var editor = that.getEditor();
-            if (typeof editor == "undefined" || editor == null) {
-                return;
+            else if (event instanceof NavigationEnd || event instanceof NavigationCancel || event instanceof NavigationError) {
+                this.isSpinnerVisible = false;
             }
-            editor.opts.imageUploadParams.uploadType = uploadType;
-            editor.opts.imageUploadParams.uploadParentId = uploadParentId;
+        }, () => {
+            this.isSpinnerVisible = false;
         });
     }
+    ngOnDestroy() {
+        this.isSpinnerVisible = false;
+    }
 }
-BaseHtmlEditorComponent.propDecorators = {
-    editorLabelText: [{ type: Input }],
-    editorOptions: [{ type: Input }]
+SpinnerComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'spinner',
+                template: "<div id=\"spinner-loader\" *ngIf=\"isSpinnerVisible\">\r\n  <div class=\"loader-bg\">\r\n    <div class=\"spinner-line-material\" [class.colored]=\"!backgroundColor\" *ngIf=\"spinner === spinnerSpinKit.spinnerLine\">\r\n      <div class=\"spinner-child spinner-bounce1\" [style.background-color]='backgroundColor'></div>\r\n    </div>\r\n  </div>\r\n</div>\r\n",
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+SpinnerComponent.ctorParameters = () => [
+    { type: Router },
+    { type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
+];
+SpinnerComponent.propDecorators = {
+    backgroundColor: [{ type: Input }],
+    spinner: [{ type: Input }]
 };
 
 /*
@@ -1770,7 +2502,7 @@ BaseHtmlEditorComponent.propDecorators = {
     Anatoly Osovitny
 
   Created:
-    12 Dec 2017
+    28 Jun 2020
 
   Version:
     1.0
@@ -1778,34 +2510,59 @@ BaseHtmlEditorComponent.propDecorators = {
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class HtmlEditorComponent extends BaseHtmlEditorComponent {
-    constructor() {
-        super();
+class NativeElementDirective {
+    constructor(el, control) {
+        this.el = el;
+        this.control = control;
     }
-    setHtml(content) {
-        this.doAfterInitialized(function (that) {
-            var editor = that.getEditor();
-            if (typeof editor == "undefined" || editor == null) {
-                return;
-            }
-            editor.html.set(content);
-        });
+    ngOnInit() {
+        // sets the localization key to the control
+        this.control.control.nativeElement = this.el.nativeElement;
     }
-    getHtml() {
-        var editor = this.getEditor();
-        if (typeof editor == "undefined" || editor == null) {
-            return;
+}
+NativeElementDirective.decorators = [
+    { type: Directive, args: [{
+                selector: '[formControl], [formControlName]'
+            },] }
+];
+NativeElementDirective.ctorParameters = () => [
+    { type: ElementRef },
+    { type: NgControl }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    26 Jun 2020
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class ReplaceTextPipe {
+    transform(inputData, search, replacement) {
+        if (inputData) {
+            return inputData.replace(new RegExp(search, "g"), replacement);
+        }
+        else {
+            return inputData;
         }
-        return editor.html.get(false);
     }
 }
-HtmlEditorComponent.decorators = [
-    { type: Component, args: [{
-                selector: "anatoly-html-editor",
-                template: "<div>\r\n  <label>{{ editorLabelText }}</label>\r\n  <textarea [froalaEditor]=\"options\" (froalaInit)=\"initializeControl($event)\">\r\n  </textarea>\r\n</div>"
+ReplaceTextPipe.decorators = [
+    { type: Pipe, args: [{
+                name: "replaceText",
             },] }
-];
-HtmlEditorComponent.ctorParameters = () => [];
+];
 
 /*
 <file>
@@ -1817,7 +2574,7 @@ HtmlEditorComponent.ctorParameters = () => [];
     Anatoly Osovitny
 
   Created:
-    12 Dec 2017
+    26 Jun 2020
 
   Version:
     1.0
@@ -1825,27 +2582,59 @@ HtmlEditorComponent.ctorParameters = () => [];
   Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
 </file>
 */
-class FormsHtmlEditorComponent extends BaseHtmlEditorComponent {
+class FileSizePipe {
     constructor() {
-        super();
-        this.editorFormKey = "html";
-    }
-    setFormValueAfterInitialized(name, value) {
-        this.doAfterInitialized(function (that) {
-            that.setFormValue(name, value);
-        });
+        this.units = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB'];
+    }
+    transform(bytes = 0, precision = 0) {
+        if (isNaN(parseFloat(String(bytes))) || !isFinite(bytes))
+            return '';
+        let unit = 0;
+        while (bytes >= 1024) {
+            bytes /= 1024;
+            unit++;
+        }
+        return bytes.toFixed(+precision) + ' ' + this.units[unit];
     }
 }
-FormsHtmlEditorComponent.decorators = [
-    { type: Component, args: [{
-                selector: "anatoly-forms-html-editor",
-                template: "<div [formGroup]=\"formGroup\">\r\n  <div class=\"form-group\" [ngClass]=\"{'has-error': isControlInvalid(editorFormKey) }\">\r\n    <label class=\"control-label\">{{ editorLabelText }}</label>\r\n    <textarea [formControlName]=\"editorFormKey\"\r\n              [froalaEditor]=\"options\" (froalaInit)=\"initializeControl($event)\">\r\n    </textarea>\r\n    <anatoly-item-validation-summary [formGroup]=\"formGroup\"\r\n                                     [formSubmitted]=\"formSubmitted\"\r\n                                     [controlName]=\"editorFormKey\"\r\n                                     [controlTitle]=\"editorLabelText\">\r\n    </anatoly-item-validation-summary>\r\n  </div>\r\n</div>\r\n"
+FileSizePipe.decorators = [
+    { type: Pipe, args: [{
+                name: 'filesize',
             },] }
+];
+
+/*
+<file>
+  Project:
+    @osovitny/anatoly
+
+  Authors:
+    Vadim Osovitny
+    Anatoly Osovitny
+
+  Created:
+    27 Oct 2019
+
+  Version:
+    1.0
+
+  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
+</file>
+*/
+class SafeHtmlPipe {
+    constructor(sanitized) {
+        this.sanitized = sanitized;
+    }
+    transform(value) {
+        return this.sanitized.bypassSecurityTrustHtml(value);
+    }
+}
+SafeHtmlPipe.decorators = [
+    { type: Pipe, args: [{ name: 'safeHtml' },] }
 ];
-FormsHtmlEditorComponent.ctorParameters = () => [];
-FormsHtmlEditorComponent.propDecorators = {
-    editorFormKey: [{ type: Input }]
-};
+SafeHtmlPipe.ctorParameters = () => [
+    { type: DomSanitizer }
+];
 
 /*
 <file>
@@ -2058,44 +2847,6 @@ ItemValidationSummaryComponent.propDecorators = {
     controlTitle: [{ type: Input }]
 };
 
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    28 Jun 2020
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-class NativeElementDirective {
-    constructor(el, control) {
-        this.el = el;
-        this.control = control;
-    }
-    ngOnInit() {
-        // sets the localization key to the control
-        this.control.control.nativeElement = this.el.nativeElement;
-    }
-}
-NativeElementDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[formControl], [formControlName]'
-            },] }
-];
-NativeElementDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: NgControl }
-];
-
 /*
 <file>
   Project:
@@ -2139,8 +2890,12 @@ AnatolyUIModule.decorators = [
                     HtmlEditorComponent,
                     FormsHtmlEditorComponent,
                     ContentHeaderComponent,
-                    // Directives
-                    NativeElementDirective
+                    SpinnerComponent,
+                    LoadingComponent,
+                    NativeElementDirective,
+                    SafeHtmlPipe,
+                    ReplaceTextPipe,
+                    FileSizePipe
                 ],
                 declarations: [
                     SubscribePlanButtonComponent,
@@ -2154,31 +2909,16 @@ AnatolyUIModule.decorators = [
                     HtmlEditorComponent,
                     FormsHtmlEditorComponent,
                     ContentHeaderComponent,
-                    // Directives
-                    NativeElementDirective
+                    SpinnerComponent,
+                    LoadingComponent,
+                    NativeElementDirective,
+                    SafeHtmlPipe,
+                    ReplaceTextPipe,
+                    FileSizePipe
                 ]
             },] }
 ];
 
-/*
-<file>
-  Project:
-    @osovitny/anatoly
-
-  Authors:
-    Vadim Osovitny
-    Anatoly Osovitny
-
-  Created:
-    26 Jun 2020
-
-  Version:
-    1.0
-
-  Copyright (c) 2016-2020 Osovitny Inc. All rights reserved.
-</file>
-*/
-
 /*
  * Public API Surface of anatoly
  */
@@ -2187,5 +2927,5 @@ AnatolyUIModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { Alerts, AnatolyCoreModule, AnatolyDataModule, AnatolyHttpInterceptor, AnatolyUIModule, AppContextService, AppCoreSettings, BaseApiService, BaseComponent, BaseEditComponent, BaseGoService, BaseGridEditService, BaseGridReadService, BillingApiService, BuyAccessButtonComponent, ContentHeaderComponent, ContextInitState, FormValidationSummaryComponent, FormsHtmlEditorComponent, GlobalErrorHandler, Guid, HtmlEditorComponent, ItemValidationSummaryComponent, LoadingService, LoggingService, NativeElementDirective, SignInButtonComponent, SignOutButtonComponent, SignUpButtonComponent, Subs, SubscribePlanButtonComponent, UpgradePlanButtonComponent, Utils, ValidationSummaryComponent, throwIfAlreadyLoaded };
+export { Alerts, AnatolyCoreModule, AnatolyDataModule, AnatolyHttpInterceptor, AnatolyUIModule, AppContextService, AppCoreSettings, BaseApiService, BaseComponent, BaseEditComponent, BaseGoService, BaseGridEditService, BaseGridReadService, BaseHtmlEditorComponent, BillingApiService, BuyAccessButtonComponent, ContentHeaderComponent, ContextInitState, Convert, DefaultEditorOptions, FileSizePipe, FormValidationSummaryComponent, FormsHtmlEditorComponent, FroalaEditorModuleWithProviders, FroalaViewModuleWithProviders, GlobalErrorHandler, Guid, HtmlEditorComponent, IdleService, InjectorInstance, ItemValidationSummaryComponent, LoadingComponent, LoadingService, LocalStorageService, LocalizationModule, LocalizationService, LocalizationSettingsModule, LocalizePipe, LoggingService, NativeElementDirective, NotificationService, NotificationsApiService, ReplaceTextPipe, SafeHtmlPipe, SessionStorageService, SignInButtonComponent, SignOutButtonComponent, SignUpButtonComponent, SpinnerComponent, Subs, SubscribePlanButtonComponent, TranslateModuleAtRoot, UpgradePlanButtonComponent, Urls, Utils, ValidationSummaryComponent, consts, customTranslateLoaderFactory, localizationInitializerFactory, throwIfAlreadyLoaded };
 //# sourceMappingURL=osovitny-anatoly.js.map