import 'babel-polyfill';
import * as search from './lib/search';
import * as dom from './lib/dom';
import * as ajax from './lib/ajax';

async function resultClicked(grilId) {
	if (document.getElementById(grilId) !== null) {
		return;
	}
	let response = null;
	try {
		response = await ajax.post(
			window.location,
			'id=' + grilId, {
				headers: {
					'Content-type': 'application/x-www-form-urlencoded'
				}
			});
	} catch (e) {
		alert(e.message);
		return;
	}
	document.getElementById('gril-list').innerHTML += response;
}

async function updateGrilOrder(gril, pos) {
	return await ajax.post(
		`${window.location}/order`,
		`gril=${gril}&pos=${pos}`, {
			headers: {
				'Content-Type': 'application/x-www-form-urlencoded',
			}
		});
}

function getCurrentOrder(gril) {
	const els = document.querySelectorAll('#gril-list > li')

	for (let i = 0; i < els.length; i++) {
		if (els[i].id === gril) {
			console.log(i);
			return i;
		}
	}
	return -1;
}

async function listButtonHandler(e) {
	let liFilter = x => x.tagName && x.tagName.toLowerCase() === 'li';
	let cItem = dom.closest(e.target, liFilter);
	let pItem = dom.previous(cItem, liFilter),
	    nItem = dom.next(dom.next(cItem, liFilter), liFilter);
	switch (e.target.classList[0]) {
	case 'gril-sort-up':
		try {
			await updateGrilOrder(cItem.id, getCurrentOrder(cItem.id) - 1);
		} catch(e) {
		 	alert(e.message);
		}
		cItem.parentNode.insertBefore(cItem, pItem);
		break;
	case 'gril-sort-down':
		try {
			await updateGrilOrder(cItem.id, getCurrentOrder(cItem.id) + 1);
		} catch(e) {
			alert(e.message);
		}

		if (nItem) {
			cItem.parentNode.insertBefore(cItem, nItem);
		} else {
			cItem.parentNode.appendChild(cItem);
		}
		break;
	case 'gril-delete':
		try {
			await ajax.del(
				`${window.location}/order`,
				`gril=${cItem.id}`, {
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded',
					}
				});
			cItem.parentNode.removeChild(cItem);
		} catch(e) {
			alert(e.message);
		}
		break;
	}
}

function buildMergeModal(grils, merge) {
	document.getElementById('gril-merge-modal-name').textContent = merge.name;
	document.getElementById('gril-merge-modal-image').setAttribute('src', merge.image_url);
	var targetDiv = document.getElementById('gril-merge-modal-targets');
	targetDiv.innerHTML = '';
	for (var i = 0; i < merge.targets.length; i++) { ((target) => {
		var template = document.createElement('div');
		template.innerHTML = document.getElementById('gril-merge-modal-template').innerHTML;
		template.getElementsByClassName('card-image')[0].setAttribute('src', target.image_url);
		template.getElementsByClassName('card-title')[0].textContent = target.name;
		var links = template.querySelectorAll('.card-action > a');
		links[0].setAttribute('href', '/gril/' + target.id);
		links[1].setAttribute('href', '');
		links[1].addEventListener('click', (e) => {
			e.preventDefault();
			ajax.get(`/api/import/anilist/assign?id=${merge.id}&target=${target.id}`)
				.then(() => {
					$('#gril-merge-modal').modal('close');
					resultClicked(target.id);
					processFirstGril(grils);
				})
				.catch((e) => {
					alert(e);
				});
		}, false);
		while (template.firstChild) {
			targetDiv.appendChild(template.firstChild);
		}
	})(merge.targets[i]); }
	$('#gril-merge-modal').modal('open');
}

async function processFirstGril(grils) {
	if (grils.length === 0) {
		Materialize.toast('Anilist Favoriten wurden erfolgreich importiert!', 5000);
		return;
	}
	var gril = grils[0]
	grils = grils.slice(1);
	if (gril.mapped > 0) {
		resultClicked(gril.mapped);
		processFirstGril(grils);
		return;
	}
	var merge;
	try {
		merge = JSON.parse(await ajax.get('/api/import/anilist/translate?id=' + gril.id))
	} catch (e) {
		alert(e);
		return;
	}
	switch (merge.targets.length) {
	case 0:
		alert('Gril existiert nicht! Das sollte nicht passieren...');
		break;
	case 1:
		resultClicked(merge.targets[0].id);
		processFirstGril(grils);
		break;
	default:
		buildMergeModal(grils, merge);
		break;
	}
}

async function startAnilistImport() {
	var favs = [];
	try {
		favs = JSON.parse(await ajax.get('/api/import/anilist/favourites'));
	} catch (e) {
		alert(e);
		return;
	}
	processFirstGril(favs);
}

function main() {
	$('#gril-merge-modal').modal();
	let is = new search.InstantSearch(
		document.getElementById('gril-add-search'),
		document.getElementById('search-results'));
	is.resultClicked = resultClicked;
	document.getElementById('gril-list').addEventListener(
		'click',
		listButtonHandler,
		true);
	document.getElementById('import-from-anilist').addEventListener(
		'click',
		startAnilistImport,
		false);
}

dom.ready(main);