/*
 * This module defines the hooks required
 * to initialize a page's JS environment
 * when the document.readystate is changed
 * */
import { Category }  from './index'
import { VideoMeta } from './category'

export function category_ready_handler(e?: Event) : Event {
	/*
	 * On page load:
	 * 	This function takes care of fetching the links/thumbnails for that
	 * 	category
	 */
	if(document.readyState != 'complete') { return e }

	let xml = new XMLHttpRequest()

	xml.onload = function() {
		if(this.getResponseHeader('Content-Type') == 'application/json') {
			let raw = JSON.parse(this.responseText)
			for(const cat_raw of raw) {
				let cat = new VideoMeta(cat_raw)
				cat.as_div()
			}
		}
	}

	const endpoint = window.location.origin + '/api' + window.location.pathname
	xml.open('GET', endpoint, true)
	xml.send()

	return e
}

export function index_ready_handler(e?: Event) : Event {
	// Only let this make a get request once we're ready on the page
	if(document.readyState != 'complete') { return e }

	// All we do here is basically make a get request to /api/categories
	const endpoint = window.location.origin + '/api/categories'
	let xml = new XMLHttpRequest()

	xml.onload = function() {
		if(this.getResponseHeader('Content-Type') == 'application/json') {
			let raw = JSON.parse(this.responseText)
			for(const cat_raw of raw) {
				let cat = new Category(cat_raw)
				cat.as_div()
			}
		}
	}

	// Fire request
	xml.open('GET', endpoint, true) // sync request
	xml.send(null) // nothing required for stuff

	return e
}