import { Component, AfterContentInit } from "@angular/core";

let gettingStarted = require('html-loader!markdown-loader!../getting-started.md');

@Component({
	selector: 'app',
	template: `
	<main class="bd-pageheader">
		<div class="container">
		<h1>@myog-io/ngx-chunk-file-upload</h1>
		<p>The Angular2 File Upload directives</p>
		<a class="btn btn-primary" href="https://github.com/myog-io/ngx-chunk-file-upload">View on GitHub</a>
		<div class="row">
			<div class="col-lg-1">
				<iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=@myog-io/ngx-chunk-file-upload&type=star&count=true"
				 frameborder="0" scrolling="0" width="170px" height="20px"></iframe>
			</div>
			<div class="col-lg-1">
				<iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=@myog-io/ngx-chunk-file-upload&type=fork&count=true"
				 frameborder="0" scrolling="0" width="170px" height="20px"></iframe>
			</div>
		</div>
		</div>
	</main>

	<div class="container">
		<section id="getting-started" [innerHtml]="gettingStarted"></section>

		<file-upload-section class="col-md-12"></file-upload-section>
	</div>

	<footer class="footer">
		<div class="container">
		<p class="text-muted text-center">
			<a href="https://github.com/myog-io/ngx-chunk-file-upload">@myog-io/ngx-chunk-file-upload</a>
			 is maintained by <a href="https://github.com/valor-software">valor-software</a>.</p>
		</div>
	</footer>
	`,
})
export class AppComponent implements AfterContentInit {
	public gettingStarted: string = gettingStarted;
	public ngAfterContentInit(): any {
		setTimeout(() => {
			if (typeof PR !== 'undefined') {
				// google code-prettify
				PR.prettyPrint();
			}
		}, 150);
	}
}