/**
 * @since Tue Aug 28 2018
 * @author Charles Gouldmann - Klean
 */


import { Component, Input, OnInit } from '@angular/core'
import { DomSanitizer }   from '@angular/platform-browser'

import { CookieBotService }	from '@k-services/general/svc.cookieBot'
import { PageType } from '../../../../types/page'

@Component({
	selector: 'page-content',
	templateUrl: 'tpl.page-content.pug'
})
export class PageContentComponent implements OnInit {
	
	
	constructor(
		private _sanitizer: DomSanitizer,
		private _cookieBot: CookieBotService,
		) { }
		
		
	// ---- Variables ---- \\
	@Input() pageContent: PageType
	@Input() containerClasses
	content
	hasIframes: boolean = false
	manipulatedContent: any[] = []


	// ---- Lifecycle hooks ---- \\
	ngOnInit() {
		this.initContent()
	}

	ngOnChanges() {
		this.initContent()
	}

	// ---- Functions ---- \\

	/**
	 * Init the content and allow iframes
	 */
	initContent() {
		if(!!this.pageContent) {

			if(!this.pageContent.content) {
				console.warn('no content found in pageContent')
			} else {

				if(this.pageContent.content.includes('iframe')) {
					//console.log('iframes found in content')
					this.hasIframes = true
	

					
					this.locateIframes(this.pageContent.content)
	
					// content needs to exist to generate stuff
					//this.content = "<p>How'a you doin'</p>"
				} 
				else {
					// No iframes found, so display content as is
					//console.log('no iframes, displaying content as is')
					this.hasIframes = false
					this.content = this._sanitizer.bypassSecurityTrustHtml(this.pageContent.content)
				}
			}
		}
	}


	/**
	 * TODO: Describe
	 * 
	 * @param content 
	 */
	locateIframes(content) {
		// Reset
		this.manipulatedContent = []

		let contentList = content.split('<p')

		for(let c of contentList) {
			
			if(c.indexOf('<') != 0) {
				c = '<p' + c
			}

			if(!c.includes('iframe')) {
				if(c.includes('</p>'))
					c = '' + c

				this.manipulatedContent.push(c)

			} else {
				
				let iFrame: any = {}
				iFrame.url = c.match('src="(.*?)"')[1]
				iFrame.width =  c.match('width="(.*?)"')[1]
				iFrame.height =  c.match('height="(.*?)"')[1]

				this.manipulatedContent.push(`<div class="iframe-wrapper"><iframe src="${iFrame.url}" width="${iFrame.width}" height="${iFrame.height}" frameBorder="0"></iframe></div>`)
			}
		}
	}


	/**
	 * return typeof of the given `el`
	 * 
	 * @param el 
	 */
	typeof(el) {
		return typeof el
	}



	/**
	 * Searches for iframes in content and adds a container around them
	 * 
	 * @param content 
	 */
	addContainers(content: any) {
		let wrappedContent = ''

		if(content) {
			let iframeSplit = content.split('iframe')
			for(let split of iframeSplit) {
				if(/\>\<\/$/.test(split)) {
					// The previous string will end with `<`, and the next will begin with `>`
					// So these are not needed on our container `div`
					wrappedContent += 'div class="iframe-wrapper"><iframe' 
					+ split 
					+ 'iframe></div';
				}
				else {
					wrappedContent += split
				}
			}
		}
		else {
			// Return empty string if no content is recieved
			wrappedContent = ''
		}

		return wrappedContent
	}
}