import {q, qa, ElemJS} from "/static/js/elemjs/elemjs.js"
import {SubscribeButton} from "/static/js/modules/SubscribeButton.js"

const modulePaths = [ "globals", "cacheInfo", "quality", "player", "controls", "volume", "captions" ]

Promise.all(modulePaths.map(m => import(`/static/js/player/${m}.js`))).then(moduleResults => {
	let modules = {}
	for (let i = 0; i < moduleResults.length; i++)
		modules[modulePaths[i]] = moduleResults[i]
	for (let i = 0; i < moduleResults.length; i++)
		modules[modulePaths[i]] = modules[modulePaths[i]].default(modules, q, qa)

	// Page + all modules loaded

	modules.quality.videoDownloaded(modules.globals.videoPath, modules.globals.startingFormat.qualityLabel)
})

// Hide default controls
document.getElementsByClassName("video")[0].removeAttribute("controls")

// Hide noscript elements
document.getElementById("quality-select-noscript-parent").remove()
document.querySelector("form[action='/redownloadVideo']").remove()

/////

new SubscribeButton(q("#subscribe"))

const timestamps = qa("[data-clickable-timestamp]")

class Timestamp extends ElemJS {
	constructor(element) {
		super(element)
		this.on("click", this.onClick.bind(this))
	}

	onClick(event) {
		event.preventDefault()
		document.getElementsByClassName("video")[0].currentTime = event.target.getAttribute("data-clickable-timestamp")
		window.history.replaceState(null, "", event.target.href)
	}
}

timestamps.forEach(el => {
	new Timestamp(el)
})
