consumerportal/js/src/controllers/generic/modal/routeChangeInterrupt.ts

mydna Custimised for you

/// <reference path="../../../includes.ts" />

module app {

    class DetectChange {
        private active: boolean;
        private showing: boolean;
        public static $inject = [
            '$scope',
            '$location',
            'userService',
            'modalService'
        ];
        constructor(
            private $scope: angular.IScope,
            private $location: angular.ILocationService,
            private userService: services.IUserService,
            private modalService: IModalService
        ) {
            $scope.$on('$locationChangeStart', (ev: any, next: any) => {
                if (this.userService.isLoggedIn() && this.active && !this.showing) {
                    this.showing = true;
                    ev.preventDefault();
                    modalService.add('modal-notification.warning', {
                        title: 'Unsaved Changes',
                        content: 'If you navigate away, all changes will be lost. Are you sure?',
                        buttons: [`Yes, I'm sure`, {label: 'No, stay here', className: 'secondary'}]
                    }).then((index: number) => {
                        if (index === 0) {
                            $location.path(next.substring(next.indexOf("#") + 1));
                        } else {
                            this.showing = false;
                        }
                    })
                }
            });
        }
    }

    class Component {
        bindings: any = {
            active: '<'
        };
        public controller: any = DetectChange;
        public controllerAs: string = 'vm';
    }

    angular
        .module('app')
        .component('routeChangeInterrupt', new Component())
}