aodb/app/flight-detail/detail/flight-detail.ts

import {controller, directive} from '../../infrastructure/Dectorators/Components';
import {FlightListParams} from '../../flight-list/list/flight-list';
import {IFlightDetail} from '../../core/service/flightService';
import {IChromaStateService} from '../../core/service/chromaStateService';
import {IFlightInformationService, IFlightInformationModel, IFlightInformationGroup, IUserAccessModel} from
    '../services/flightInformationService';
import Mod from '../flight-detail.mod';


export interface FlightDetailParams extends FlightListParams {
    flight: IFlightDetail;
    requestId: string;
}

@controller(Mod, 'flightDetailController', ['$stateParams', '$state', '$rootScope', '$window', 'chromaState', 'flightInformationService'])
export class Controller {

    public flight: IFlightDetail;
    public model: IFlightInformationModel;
    public loading: boolean = true;
    public viewTitle: string;

    constructor(private $stateParams: FlightDetailParams,
        private $state: ng.ui.IStateService,
        private $rootScope: ng.IRootScopeService,
        private $window: ng.IWindowService,
        private chromaState: IChromaStateService,
        private flightInformationService: IFlightInformationService) {

        this.getFlight(true);

        this.$rootScope.$on('flightGroupChanged', (event: ng.IAngularEvent, group: IFlightInformationGroup) => {
            this.viewTitle = group.Display;
        });

        this.$rootScope.$on('chroma:flight-updated', () => {
            this.getFlight(false);
        });
    }

    private getFlight(buildGroups: Boolean): void {
        this.flightInformationService.getFlight(this.$stateParams.flight, this.$stateParams.requestId)
            .then((m: IFlightInformationModel) => {
            this.flight = m.Flight;
            this.buildView(m, buildGroups);
            this.flightInformationService.getTransactionAccess()
                .then((tranAccess: IUserAccessModel) => {
                    if (tranAccess.Enabled && tranAccess.View) {
                        this.addTransactionState(tranAccess);
                    }
                });
            this.addPRMState();
        });
    }

    private addTransactionState(tranAccess: IUserAccessModel) {
        this.chromaState.addState('chroma.flight-detail.transaction-list', {
            url: '/transaction-list',
            display: 'Transactions',
            icon: 'ion-social-usd',
            subView: false,
            params: {
                tranAccessModel: tranAccess
            },
            views: {
                'flight-detail': {
                    template: `<chroma:Transaction-List model='vm.model.Flight'></chroma:Transaction-List>`
                }
            }
        });
        this.chromaState.addState('chroma.flight-detail.transaction-detail', {
            url: '/transaction-detail',
            display: 'Transaction Detail',
            icon: '',
            subView: true,
            params: {
                transaction: null,
                tranAccess: undefined,
                columnConfig: undefined
            },
            views: {
                'flight-detail': {
                    template: `<chroma:Transaction-Detail model='vm.model.Flight'></chroma:Transaction-Detail>`
                }
            }
        });
    }

    private addPRMState() {
        this.chromaState.addState('chroma.flight-detail.prm-list', {
            url: '/prm-list',
            display: 'Prms',
            icon: 'ion-social-tux',
            subView: false,
            views: {
                'flight-detail': {
                    template: `<chroma:Prm-List model='vm.model.Flight'></chroma:Prm-List>`
                }
            }
        });
        this.chromaState.addState('chroma.flight-detail.prm-detail', {
            url: '/prm-detail',
            display: 'PRM Detail',
            icon: '',
            subView: true,
            params: {
                prmList: null
            },
            views: {
                'flight-detail': {
                    template: `<chroma:Prm-Detail></chroma:Prm-Detail>`
                }
            }
        });
    }

    private goBack(): void {
        let previousWindow: string =
            this.$window.sessionStorage.getItem('chroma:current-filter');
        this.$state.go('chroma.flight-list', { filter: previousWindow });
    }

    private buildView(model: IFlightInformationModel, buildGroups: Boolean): void {
        if (model.IsOutsideOfWindow) {
            this.loading = false;
            this.model = model;
            return;
        }

        if (buildGroups && model.Groups && model.Groups.length > 0 && !model.IsOutsideOfWindow) {
            model.Groups.forEach((grp: IFlightInformationGroup) => {
                this.chromaState.addState('chroma.flight-detail.' + grp.Name, {
                    url: '/' + grp.Name,
                    display: grp.Display,
                    icon: grp.Icon,
                    subView: false,
                    params: {
                        group: grp
                    },
                    views: {
                        'flight-detail': {
                            template: `<chroma:Flight-Detail-Group model='vm.model'></chroma:Flight-Detail-Group>`
                        }
                    }
                });
            });
        }

        this.model = model;

        if (buildGroups) {
            this.$state.go(this.chromaState.states[0].name);
        }

        this.loading = false;

        this.$rootScope.$broadcast('scroll.refreshComplete');
    }
}

@directive(Mod, 'chromaFlightDetail')
export class Directive implements ng.IDirective {
    controller: string = Controller.$componentName;
    controllerAs: string = 'vm';
    templateUrl: string = 'app/flight-detail/detail/flight-detail.tpl.html';
    restrict: string = 'E';
    replace: boolean = false;
    scope: any = true;
}