app.component.ts

import { Component } from '@angular/core';
import { animate, style, state, transition, trigger } from '@angular/animations';
import { Router, NavigationEnd } from '@angular/router';
import { StaticService } from './services/static.service';

@Component({
    selector: 'test-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss'],
    host: {'(window:scroll)': 'fixedMenuToggle($event)'},
    animations: [
        trigger('enterAnimation', [
            state('false', style({ opacity: 1 })),
            state('true', style({ opacity: 1 })),
            transition('0 => 1', [style({opacity: 0}) ,animate('.2s', style({opacity: 1}))] )
        ])
    ]
})

export class AppComponent {

    fixedMenu: boolean;
    menuStatus: boolean;
    menuChange: boolean;
    userLanguage: string;

    constructor(private local: StaticService, private router: Router){

        this.fixedMenu = false;

        router.events.forEach((event) => {
            if(event instanceof NavigationEnd) {

                this.local.mobileMenu = false;

                if(this.router.url.indexOf('/main') < 0){
                    this.local.summonerData = false;
                    this.local.summonerLoading = false;
                    this.menuChange = false;
                } else {
                    this.menuChange = true;
                }

                if(this.router.url == "/" || this.router.url == "/search"){
                    this.menuStatus = false;
                } else {
                    this.menuStatus = true;
                }
            }
        });

        if(navigator.language){
            if(navigator.language.indexOf('-') > 0){
                this.userLanguage = navigator.language.split('-')[0];
            }else{
                this.userLanguage = navigator.language;
            }
        }else{
            this.userLanguage = 'en';
        }

        // First Language Set
        if(!this.local.getLanguage()){
            this.local.setLanguage(this.userLanguage);
        }

        // First Region Set
        if(this.userLanguage){
            var languageToRegion = this.local.languageToRegion();

            for(var lang in languageToRegion){
                if(languageToRegion[lang].lang == this.userLanguage && !this.local.getRegion()){
                    this.local.setRegion(languageToRegion[lang].region);
                }
            }
        }

    }

    fixedMenuToggle(event) {
        this.local.mobileMenu = false;
        if(window.pageYOffset > 110){
            this.fixedMenu = true;
        } else {
            this.fixedMenu = false;
        }
        //console.debug("Scroll Event", window.pageYOffset );
    }

}