import { Component , OnDestroy , OnInit } from '@angular/core' ; import { ActivatedRoute } from '@angular/router' ; import { Subscription } from 'rxjs' ; import { Breakpoints , BreakpointObserver , BreakpointState } from '@angular/cdk/layout' ; import { ProjectService , UserService } from '@core/services/index.service' ; import { IProject , ProjectModel , UserStatsModel } from '@shared/models/index.model' ; /**
 * Homepage component
 */ @ Component ( { selector : 'dashboard-homepage' , templateUrl : './homepage.component.html' , styleUrls : [ './homepage.component.scss' ] , } ) export class HomepageComponent implements OnInit , OnDestroy { private userSubscription : Subscription ; private projectSubscription : Subscription ; public projects : IProject [ ] = [ ] ; public popularProjects : IProject [ ] = [ ] ; public users : UserStatsModel [ ] = [ ] ; public title : string = 'Public Projects' ; public isSmallScreen : boolean ; public activeuserTable : string [ ] = [ 'avatar' , 'title' , 'description' ] ; public projectTable : string [ ] = [ 'icon' , 'title' , 'description' ] ; param projectService param userService param breakpointObserver constructor ( private route , private projectService , private userService , private breakpointObserver ) { } /**
     * Life cycle init method. Initialization of all parameteres
     */ ngOnInit ( ) { this . projects = this . route . snapshot . data . projects ; this . userSubscription = this . userService . findAllUserStats ( ) . subscribe ( ( users ) => this . users = users ) ; this . projectSubscription = this . projectService . getPopularProjects ( ) . subscribe ( ( popularProjects ) => this . popularProjects = popularProjects ) ; this . projectService . findPublicProjects ( ) . subscribe ( ( projects ) => this . projects = projects ) ; this . breakpointObserver . observe ( [ Breakpoints . XSmall ] ) . subscribe ( ( state ) => { if ( state . matches ) { this . activeuserTable = [ 'avatar' , 'title' ] ; this . projectTable = [ 'icon' , 'title' , 'shortDescription' ] ; this . isSmallScreen = true ; } else { this . activeuserTable = [ 'avatar' , 'title' , 'description' ] ; this . projectTable = [ 'icon' , 'title' , 'description' ] ; this . isSmallScreen = false ; } } ) ; } /**
     * Life cycle destroy method
     */ ngOnDestroy ( ) { this . userSubscription . unsubscribe ( ) ; this . projectSubscription . unsubscribe ( ) ; } param project public checkTypeOfProject ( project ) { return project . isPrivate ( ) ? 'lock' : 'lock_open' ; } }