import { Component , EventEmitter , OnInit , Output } from '@angular/core' ; import { Router } from '@angular/router' ; import { ToolbarService } from '../../providers/toolbar.service' ; import { Login , TwitchAuthService } from '../../providers/twitch-auth-graphql.service' ; export interface SubheaderValue { playerUsername : string ; playerGame : string ; playerLogo : string ; } @ Component ( { templateUrl : './toolbar.component.html' , selector : 'tw-toolbar' , styleUrls : [ './toolbar.component.scss' ] } ) export class ToolbarComponent implements OnInit , SubheaderValue { @ Output ( ) closed = new EventEmitter ( ) ; @ Output ( ) maximize = new EventEmitter ( ) ; @ Output ( ) minimize = new EventEmitter ( ) ; @ Output ( ) collapse = new EventEmitter ( ) ; @ Output ( ) fullscreen = new EventEmitter ( ) ; title : string = null ; logo : string = null ; login : Login ; isFullscreen = false ; playerUsername : string = null ; playerGame : string = null ; playerLogo : string = null ; sidebarCollapsed = false ; constructor ( public router , private toolbarService , private twitchAuthService ) { this . login = this . twitchAuthService . getLogin ( ) ; if ( this . login . username === '' ) { this . login . username = 'Guest' ; } } ngOnInit ( ) { this . twitchAuthService . loginChange$ . subscribe ( ( login ) => { this . login = login ; } ) ; this . toolbarService . titleChange$ . subscribe ( ( title ) => { this . title = title ; } ) ; this . toolbarService . logoChange$ . subscribe ( ( logo ) => { this . logo = logo ; } ) ; this . toolbarService . subheaderChange$ . subscribe ( ( subHeader ) => { if ( ! subHeader ) { this . playerUsername = null ; this . playerGame = null ; this . playerLogo = null ; } else { this . playerUsername = subHeader . playerUsername ; this . playerGame = subHeader . playerGame ; this . playerLogo = subHeader . playerLogo ; } } ) ; } closeWindow ( ) { this . closed . emit ( 'event' ) ; } maximizeWindow ( ) { this . maximize . emit ( 'event' ) ; } minimizeWindow ( ) { this . minimize . emit ( 'event' ) ; } enterFullscreen ( ) { this . fullscreen . emit ( 'event' ) ; this . isFullscreen = ! this . isFullscreen ; } collapseSidebar ( ) { this . sidebarCollapsed = ! this . sidebarCollapsed ; this . collapse . emit ( 'event' ) ; } }