import { Component , NgZone , OnInit } from '@angular/core' ; import { Router } from '@angular/router' ; import { concat as _concat } from 'lodash' ; import { ErrorService } from '../../providers/errorhandler.service' ; import { GameService , Game } from '../../providers/games.service' ; import { SpinnerService } from '../../providers/spinner.service' ; import { ToolbarService } from '../../providers/toolbar.service' ; @ Component ( { templateUrl : './games.component.html' , styleUrls : [ './games.component.scss' ] } ) export class GamesComponent implements OnInit { games : Game [ ] = [ ] ; fetchingMore = false ; constructor ( private router , private toolbarService , private spinnerService , private errorService , private gameService , private zone ) { } ngOnInit ( ) { this . spinnerService . show ( ) ; this . toolbarService . setTitle ( 'Top Games' ) ; this . toolbarService . setLogo ( 'games' ) ; this . gameService . getTopGames ( ) . then ( ( games ) => { this . games = _concat ( this . games , games ) ; this . spinnerService . hide ( ) ; } ) . catch ( ( reason ) => { this . spinnerService . hide ( ) ; this . errorService . showError ( 'Failed fetching games' , reason ) ; console . log ( reason ) ; } ) ; } onScrolled ( ) { if ( ! this . fetchingMore ) { this . fetchingMore = true ; this . zone . run ( ( ) => { } ) ; this . gameService . fetchMoreTopGames ( ) . then ( ( games ) => { this . games = games ; this . fetchingMore = false ; this . zone . run ( ( ) => { } ) ; } ) . catch ( ( reason ) => { console . log ( reason ) ; this . fetchingMore = false ; this . zone . run ( ( ) => { } ) ; } ) ; } } }