import { Component, OnInit } from '@angular/core';
import { Title } from '@angular/platform-browser';
import { SiteConfigService } from './services/config.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  constructor(
    private titleService: Title,
    private configService: SiteConfigService
  ) {}

  ngOnInit() {
    this.configService.init();
    this.configService.documentTitle.subscribe(title => this.titleService.setTitle(title));

    this.configService.askReloadSite.subscribe(askReloadSite => {
      if (askReloadSite) {
        window.addEventListener('beforeunload', this.beforeUnloadHandler);
      } else {
        window.removeEventListener('beforeunload', this.beforeUnloadHandler);
      }
    });
  }

  beforeUnloadHandler(event) {
    const confirmationMessage = 'Refreshing this page may mess up your challenge/tutorial state. Are you sure?';
    event.returnValue = confirmationMessage;
    return confirmationMessage;
  }
}