import apiConnector from "./connector.js"

class Album {
	static albums = []
	static albumTemplate = null
	static albumContainer = null

	constructor(data) {
		this.data = data
		// create clone element
		const e = Album.albumTemplate.content.cloneNode(true)
		e.firstElementChild.dataset.key = data.id
		e.querySelector("a").href = apiConnector.albumSrc(data.id)
		e.querySelector("img").src = apiConnector.assetThumbnailSrc(data.albumThumbnailAssetId)
		e.querySelector(".album-name").textContent = data.albumName
		e.querySelector(".album-assets-count").textContent = data.assetCount.toLocaleString()
		if (!data.shared)
			e.querySelector(".album-shared").remove()

		Album.albums.push(this)
		Album.albumsContainer.appendChild(e)
		this.element = Album.albumsContainer.lastElementChild
	}

	toggleVisibility(visible) { this.element.classList.toggle("hidden!", !visible) }

	static albumSelect(e) {
		// find album element
		let album = e.target
		while (album && !album.classList.contains("album"))
			album = album.parentElement

		if (album === null)
			return

		if (album.dataset.selected)
			delete album.dataset.selected
		else
			album.dataset.selected = "1"
	}

	static albumsFilter(e) {
		const q = e.target.value.toLowerCase()
		for (const album of Album.albums) {
			const match = album.data.albumName.toLowerCase().includes(q)
			album.toggleVisibility(match)
		}
	}

	static getSelected() {
		const s = []
		for (const album of Album.albums)
			if (album.element.dataset.selected)
				s.push(album.data.id)
		return s
	}

	static submitSelected() {
		apiConnector.updateAlbums(Album.getSelected())
	}

	static async initAlbums(albumsPageContainer) {
		Album.albumsContainer = albumsPageContainer.querySelector("#albums-container")
		Album.albumTemplate   = albumsPageContainer.querySelector("#album-template")
		const albumSearch     = albumsPageContainer.querySelector("#album-search")
		const albumsSubmit    = albumsPageContainer.querySelector("#albums-submit")

		// create albums
		const albumsResponse = await apiConnector.fetchAlbums()

		for (const res of albumsResponse)
			new Album(res)

		// album selection
		Album.albumsContainer.addEventListener("click", Album.albumSelect)
		albumSearch.addEventListener("input", Album.albumsFilter)
		albumsSubmit.addEventListener("click", Album.submitSelected)

		return true
	}
}

export default Album.initAlbums