import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";

import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { HomeComponent } from "./pages/home/home.component";
import { NavbarComponent } from "./gui/navbar/navbar.component";
import { FooterComponent } from "./gui/footer/footer.component";
import { ArticleComponent } from "./article/article.component";
import { RouterEmptyComponent } from "./gui/router-empty/router-empty.component";
import {HttpClientModule} from "@angular/common/http";
import { MarkdownModule, MarkedOptions, MarkedRenderer, MarkdownComponent } from "ngx-markdown";
import { BigLogoComponent } from './gui/big-logo/big-logo.component';
import { ServiceWorkerModule } from '@angular/service-worker';
import { environment } from '../environments/environment';

@NgModule({
	declarations: [
		AppComponent,
		HomeComponent,
		NavbarComponent,
		FooterComponent,
		ArticleComponent,
		RouterEmptyComponent,
		BigLogoComponent
	],
	imports: [
		BrowserModule,
		AppRoutingModule,
		HttpClientModule,
		MarkdownModule.forRoot({
			markedOptions: {
				provide: MarkedOptions,
				useFactory: markedOptionsFactory,
			},
		}),
		ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }),
	],
	providers: [],
	bootstrap: [AppComponent]
})
export class AppModule { }

export function markedOptionsFactory(): MarkedOptions {
	const renderer = new MarkedRenderer();

	renderer.blockquote = (text: string) => {
		return "<blockquote class=\"blockquote\"><p>" + text + "</p></blockquote>";
	};
	/*renderer.warning = (text: string) => {
		return "<span style=\"color:red\"" + text + "</span>";
	};*/

	return {
		renderer,
		gfm: true,
		tables: true,
		breaks: true,
		pedantic: false,
		sanitize: false,
		smartLists: true,
		smartypants: false,
	};
}