import { NgModule, Injectable, APP_INITIALIZER } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpClientModule, HttpInterceptor, HttpHandler, HttpRequest, HTTP_INTERCEPTORS } from '@angular/common/http';
import { MaterialModule } from './material/material.module';
import { DatePipe } from '@angular/common';
import { MatPaginatorIntl } from '@angular/material/paginator';
import { MAT_DATE_LOCALE } from '@angular/material/core';
import * as moment from 'moment';

import { AutofocusDirective } from './material/autofocus';

import { I18nPipe } from './utils/i18n.pipe';
import { MomentPipe } from './utils/moment.pipe';
import { AppComponent } from './app.component';
import { PageBookmarks } from './pages/bookmarks/bookmarks.page';
import { PageComment } from './pages/comment/comment.page';
import { PageEntry } from './pages/entry/entry.page';
import { PageLogin } from './pages/login/login.page';
import { PageNew } from './pages/new/new.page';
import { PageNotFound } from './pages/notfound/notfound.page'
import { PageSettings } from './pages/settings/settings.page';
import { PageSubmission } from './pages/submission/submission.page';
import { PageTop } from './pages/top/top.page';
import { PageUnavailable } from './pages/unavailable/unavailable.page'
import { PageUser } from './pages/user/user.page';
import { PageUserComments } from './pages/user/usercomments/usercomments.page';
import { PageUserEntries } from './pages/user/userentries/userentries.page';
import { UiComment } from './ui/comment/comment.ui';
import { UiCommentCount } from './ui/commentcount/commentcount.ui';
import { UiCommentForm } from './ui/commentform/commentform.ui';
import { UiComments } from './ui/comments/comments.ui';
import { UiEntries } from './ui/entries/entries.ui';
import { UiEntry } from './ui/entry/entry.ui';
import { UiMain } from './ui/main/main.ui';
import { UiPoints } from './ui/points/points.ui';
import { ConfirmDialog } from './ui/confirm/confirm.component'

import { I18nService, I18nPaginatorIntl } from './services/i18n.service';
import { ServiceWorkerModule } from '@angular/service-worker';
import { environment } from '../environments/environment';


export function fetchI18n(i18n: I18nService) {
  return () => i18n.fetch().then(response => { }, error => { });
}


export function setMaterialDate(i18n: I18nService) {
  let locale = i18n.getLocale();

  if (locale == 'de-informal') {
    locale = 'de';
  }

  moment.locale(locale);
  return locale;
}

@Injectable()
export class XhrInterceptor implements HttpInterceptor {

  intercept(req: HttpRequest<any>, next: HttpHandler) {
    const xhr = req.clone({
      headers: req.headers.set('X-Requested-With', 'XMLHttpRequest').set('Content-Type', 'application/json;charset=UTF-8'), withCredentials: true
    });
    return next.handle(xhr);
  }
}

@NgModule({
  declarations: [
    AutofocusDirective,
    I18nPipe,
    MomentPipe,
    AppComponent,
    PageBookmarks,
    PageComment,
    PageEntry,
    PageLogin,
    PageNew,
    PageNotFound,
    PageSettings,
    PageSubmission,
    PageTop,
    PageUnavailable,
    PageUser, PageUserComments, PageUserEntries,
    UiComment,
    UiCommentCount,
    UiCommentForm,
    UiComments,
    UiEntries,
    UiEntry,
    UiMain,
    UiPoints,
    ConfirmDialog,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    MaterialModule,
    HttpClientModule,
    FormsModule,
    ReactiveFormsModule,
    ServiceWorkerModule.register('ngsw-worker.js', {
      enabled: environment.production,
      // Register the ServiceWorker as soon as the app is stable
      // or after 30 seconds (whichever comes first).
      registrationStrategy: 'registerWhenStable:30000'
    }),
  ],
  exports: [ MaterialModule ],
  providers: [ { provide: APP_INITIALIZER, useFactory: fetchI18n, deps: [ I18nService ], multi: true }, { provide: MAT_DATE_LOCALE, useFactory: setMaterialDate, deps: [ I18nService ], multi: true }, { provide: HTTP_INTERCEPTORS, useClass: XhrInterceptor, multi: true }, DatePipe,
  {
    provide: MatPaginatorIntl, useFactory: (i18n) => {
      const service = new I18nPaginatorIntl();
      service.injectI18n(i18n)
      return service;
    }, deps: [ I18nService ]
  } ],
  bootstrap: [ AppComponent ],
})
export class AppModule {
}