@angular/cdk/layout#BreakpointObserver TypeScript Examples

constructor(
    public i18n: I18nService,
    private logger: LoggerService,
    private dialog: MatDialog,
    private http: HttpClient,
    private snackbar: MatSnackBar,
    private eventbus: EventbusService,
    private breakpointObserver: BreakpointObserver,
  ) {
    this.eventbus.room$.subscribe((event: IEventType) => {
      if ( event.type === EventType.room_created ) {
        this.roomList();
      }
    });
    this.dataSource = new MatTableDataSource<RoomElement>(this.rooms);
    this.isSmallScreen = breakpointObserver.isMatched('(max-width: 599px)');
    if (this.isSmallScreen) {
      this.displayedColumns = ['select', 'name', 'id', 'operation'];
    }
  }

constructor(
    public i18n: I18nService,
    private breakpointObserver: BreakpointObserver,
    private router: Router,
    private logger: LoggerService,
    ) {
      this.router.events.subscribe(value => {
        if ( value instanceof NavigationEnd) {
          this.redirectedUrl = value.urlAfterRedirects;
        }
      });
    }

constructor(
    private readonly statsApiService: StatsApiService,
    private readonly resolverApiService: ResolverApiService,
    private readonly userStorageApiService: UserStorageApiService,
    private readonly searchApiService: SearchApiService,
    private readonly milestoneApiService: MilestoneApiService,
    private readonly epicStatusesApiService: EpicStatusesApiService,
    private readonly userstoryStatusesApiService: UserstoryStatusesApiService,
    private readonly pointsApiService: PointsApiService,
    private readonly taskStatusesApiService: TaskStatusesApiService,
    private readonly issueStatusesApiService: IssueStatusesApiService,
    private readonly issueTypesApiService: IssueTypesApiService,
    private readonly prioritiesApiService: PrioritiesApiService,
    private readonly severitiesApiService: SeveritiesApiService,
    private readonly projectsApiService: ProjectsApiService,
    private readonly membershipsInvitationsApiService: MembershipsInvitationsApiService,
    private readonly epicApiService: EpicsApiService,
    private readonly userstoriesApiService: UserstoriesApiService,
    private breakpointObserver: BreakpointObserver,
    private fb: FormBuilder
  ) {
    this.stats$ = this.statsApiService.getDiscover();
    this.projectId$ = this.resolverApiService.project('taiganext');
  }

constructor(private fb: FormBuilder, private breakpointObserver: BreakpointObserver, private cdr: ChangeDetectorRef) {
  }

constructor(private observer: BreakpointObserver) {}

constructor(breakpointObserver: BreakpointObserver) {
    // Breakpoint observable to switch the view to small handset view
    this.$breakpoint = breakpointObserver.observe(
      [Breakpoints.Small, Breakpoints.HandsetPortrait]
    ).pipe(
      map(state => state.matches)
    );
  }

constructor(private breakpointObserver: BreakpointObserver,
              private templateRef: TemplateRef<NzSafeAny>, private viewContainerRef: ViewContainerRef) {
  }

constructor(private breakpointObserver: BreakpointObserver,
              private cdr: ChangeDetectorRef) {
  }

constructor(private breakpointObserver: BreakpointObserver, private cdr: ChangeDetectorRef) {}

constructor(private fb: FormBuilder, private msg: NzMessageService,
              private validatorsService: ValidatorsService,
              private breakpointObserver: BreakpointObserver,
              private cdr: ChangeDetectorRef) {
  }

constructor(
    public navService: NavService,
    private breakpointObserver: BreakpointObserver,
    private router: Router,
    private activatedRoute: ActivatedRoute,
    private authService: AuthService,
  ) {}

constructor(private cdr: ChangeDetectorRef, private breakpointObserver: BreakpointObserver) {
  }

constructor(private destroy$: DestroyService,private themeSkinService: ThemeSkinService, private windowServe: WindowService, private cdr: ChangeDetectorRef, private login1StoreService: Login1StoreService, private breakpointObserver: BreakpointObserver, private themesService: ThemeService) {
  }

constructor(private cdr: ChangeDetectorRef, private breakpointObserver: BreakpointObserver,) {
  }

constructor(private cdr: ChangeDetectorRef, private breakpointObserver: BreakpointObserver,) {
  }

constructor(private cdr: ChangeDetectorRef, private breakpointObserver: BreakpointObserver,) {
  }

constructor(private winWidthService: WindowsWidthService, private breakpointObserver: BreakpointObserver, private themesService: ThemeService) {
  }

// TODO: Change into Observable.
    // get userActivated(): boolean {
    //   return this.authService.authenticated;
    // }

    constructor(
        private readonly titleService: TitleService,
        private readonly authService: AuthenticationService,
        public appState: ApplicationStateService,
        public appModes: AppModes,
        private electronService: ElectronService,
        private router: Router,
        private log: Logger,
        public updateService: UpdateService,
        public detailsService: DetailsService,
        public identityService: IdentityService,
        public settings: SettingsService,
        public localeService: LocaleService,
        private apiService: ApiService,
        public snackBar: MatSnackBar,
        private walletService: WalletService,
        private readonly cd: ChangeDetectorRef,
        public dialog: MatDialog,
        public notifications: NotificationService,
        private globalService: GlobalService,
        private readonly breakpointObserver: BreakpointObserver,
    ) {
        this.log.info('Expanded:', localStorage.getItem('Menu:Expanded'));

        this.loadFiller();

        this.isAuthenticated = authService.isAuthenticated();

        if (this.electronService.ipcRenderer) {
            if (this.electronService.remote) {
                const applicationVersion = this.electronService.remote.app.getVersion();

                this.appState.setVersion(applicationVersion);
                this.log.info('Version: ' + applicationVersion);
            }

            this.ipc = electronService.ipcRenderer;

            this.ipc.on('daemon-exiting', (event, error) => {
                this.log.info('daemon is currently being stopped... please wait...');
                this.appState.shutdownInProgress = true;
                this.cd.detectChanges();

                // If the exit takes a very long time, we want to allow users to forcefully exit City Hub.
                setTimeout(() => {
                    this.appState.shutdownDelayed = true;
                    this.cd.detectChanges();
                }, 60000);

            });

            this.ipc.on('daemon-exited', (event, error) => {
                this.log.info('daemon is stopped.');
                this.appState.shutdownInProgress = false;
                this.appState.shutdownDelayed = false;

                // Perform a new close event on the window, this time it will close itself.
                window.close();
            });

            this.ipc.on('daemon-error', (event, error) => {

                this.log.error(error);

                const dialogRef = this.dialog.open(ReportComponent, {
                    data: {
                        title: 'Failed to start EXOS Node background daemon',
                        error,
                        lines: this.log.lastEntries(),
                        specific: this.log.catchErrorLogs()
                    }
                });

                dialogRef.afterClosed().subscribe(result => {
                    this.log.info(`Dialog result: ${result}`);
                });
            });

            this.ipc.on('log-debug', (event, msg: any) => {
                this.log.verbose(msg);
            });

            this.ipc.on('log-info', (event, msg: any) => {
                this.log.info(msg);
            });

            this.ipc.on('log-error', (event, msg: any) => {
                this.log.error(msg);
            });
        }

        // Upon initial load, we'll check if we are on mobile or not and show/hide menu.
        const isSmallScreen = breakpointObserver.isMatched(Breakpoints.HandsetPortrait);

        this.menuOpened = !isSmallScreen;

        breakpointObserver.observe([
            Breakpoints.HandsetPortrait
        ]).subscribe(result => {
            if (result.matches) {
                appState.handset = true;
                this.handset = true;
                this.menuMode = 'over';
                this.showFiller = true;
            } else {
                appState.handset = false;
                this.handset = false;
                this.menuOpened = true;
                this.menuMode = 'side';
                this.loadFiller();
            }
        });

        this.authService.isAuthenticated().subscribe(auth => {
            if (auth) {
                this.updateNetworkInfo();
            } else {
            }
        });

        this.router.events.subscribe((evt) => {
            if (!(evt instanceof NavigationEnd)) {
                return;
            }

            const contentContainer = document.querySelector('.app-view-area-main') || window;
            contentContainer.scrollTo(0, 0);
        });
    }

// TODO: Change into Observable.
    // get userActivated(): boolean {
    //   return this.authService.authenticated;
    // }

    constructor(
        private readonly titleService: TitleService,
        private readonly authService: AuthenticationService,
        public appState: ApplicationStateService,
        public appModes: AppModes,
        private electronService: ElectronService,
        private router: Router,
        private log: Logger,
        public updateService: UpdateService,
        public detailsService: DetailsService,
        public settings: SettingsService,
        private apiService: ApiService,
        private walletService: WalletService,
        public wallet: WalletService,
        private readonly cd: ChangeDetectorRef,
        public dialog: MatDialog,
        private ngZone: NgZone,
        private storage: StorageService,
        public chains: ChainService,
        public notifications: NotificationService,
        public globalService: GlobalService,
        private zone: NgZone,
        private readonly breakpointObserver: BreakpointObserver,
    ) {
        this.log.info('Expanded:', localStorage.getItem('Menu:Expanded'));

        this.loadFiller();

        this.isAuthenticated = authService.isAuthenticated();

        if (this.electronService.ipcRenderer) {
            this.appState.setVersion(APP_VERSION);
            this.log.info('application version: ', this.appState.version);
            this.ipc = electronService.ipcRenderer;
            this.ipc.on('daemon-exiting', (event, error) => {
                this.log.info('daemon is currently being stopped... please wait...');
                this.appState.shutdownInProgress = true;
                this.cd.detectChanges();

                // If the exit takes a very long time, we want to allow users to forcefully exit Blockcore Hub.
                setTimeout(() => {
                    this.appState.shutdownDelayed = true;
                    this.cd.detectChanges();
                }, 60000);
            });

            this.ipc.on('daemon-exited', (event, error) => {
                this.log.info('daemon is stopped.');
                this.appState.shutdownInProgress = false;
                this.appState.shutdownDelayed = false;

                // Perform a new close event on the window, this time it will close itself.
                window.close();
            });

            this.ipc.on('daemon-changing', (event, error) => {
                this.zone.run(() => {
                    this.log.info('daemon change is requested and shutdown was successful.');
                    this.cd.detectChanges();

                    // Navigate again to hide the loading indicator.
                    // if (!this.appState.isChangingToChain) {
                    this.router.navigate(['/load']);
                    // }

                    this.cd.detectChanges();
                });
            });

            this.ipc.on('daemon-error', (event, error) => {

                this.log.error(error);

                const dialogRef = this.dialog.open(ReportComponent, {
                    data: {
                        title: 'Failed to start node background daemon',
                        error,
                        lines: this.log.lastEntries()
                    }
                });

                dialogRef.afterClosed().subscribe(result => {
                    this.log.info(`Dialog result: ${result}`);
                });
            });

            this.ipc.on('log-debug', (event, msg: any) => {
                this.log.verbose(msg);
            });

            this.ipc.on('log-info', (event, msg: any) => {
                this.log.info(msg);
            });

            this.ipc.on('log-error', (event, msg: any) => {
                this.log.error(msg);
            });
        }

        // Upon initial load, we'll check if we are on mobile or not and show/hide menu.
        const isSmallScreen = breakpointObserver.isMatched(Breakpoints.HandsetPortrait);

        this.menuOpened = !isSmallScreen;

        breakpointObserver.observe([
            Breakpoints.HandsetPortrait
        ]).subscribe(result => {
            if (result.matches) {
                appState.handset = true;
                this.handset = true;
                this.menuMode = 'over';
                this.showFiller = true;
            } else {
                appState.handset = false;
                this.handset = false;
                this.menuOpened = true;
                this.menuMode = 'side';
                this.loadFiller();
            }
        });

        this.authService.isAuthenticated().subscribe(auth => {
            if (auth) {
                this.updateNetworkInfo();
            } else {
            }
        });

        this.router.events.subscribe((evt) => {
            if (!(evt instanceof NavigationEnd)) {
                return;
            }

            const contentContainer = document.querySelector('.app-view-area-main') || window;
            contentContainer.scrollTo(0, 0);
        });
    }