// All URLs listed here are from a custom NGINX config.

let area = document.querySelector('#area-main');
let entries = [];
let users = {};
let fetchData;
let sum = 0;
let doThings = false;
let i = 0;
let studios = {};

async function genTree(treeId) {
	let entry = treeId;

	while (true) {
		let entryDat = fetchData[entry];

		entries.push(entry);

		if (!entryDat) break;

		let us = users[entryDat.username];

		let s = 1 / ((new Date() - new Date(entryDat.datetime_created.$date)) + 1000 * 60 * 60);
		sum += s;
		users[entryDat.username] = (us ? us : 0) + s;
		entry = entryDat.parent_id;
	}

	return entry;
}

//todo: rewrite
async function main(type) {
	let users = document.querySelector('#users').value.split('\n');

	for (let user of users) {
		let typed = user[0];
		user = user.slice(1);

		if (typed == '#') {
			studios[typed] = await (fetch(`https://hf.zenoverse.net/studio/${user}`)
				.then(x => x.json()));
		}
	}

	let url = new URL(window.location);
	url.search = '?users=' + users.join('&users=');
	history.pushState(null, '', url);

	entries = [];

	for (let user of users) {
		let typed = user[0];
		user = user.slice(1);

		let extraFetch = [];

		if (typed == '#' && type == '#user') {
			extraFetch = await (fetch(`https://hf.zenoverse.net/studio_project/${user}`)
				.then(x => x.json()));
			extraFetch.forEach(x => {
				x.studio = studios[typed].title;
				x.studioID = user;
			});
		} else if (typed == '#' && type == '#comment') {
			extraFetch = await (fetch(`https://hf.zenoverse.net/studio_comment/${user}`)
				.then(x => x.json()));
			extraFetch.forEach(x => x.studio = studios[typed].title);
		} else if (typed == '@' && type == '#user') {
			extraFetch = await (fetch(`https://hf.zenoverse.net/user/${user}`)
				.then(x => x.json()));
			extraFetch.forEach(x => x.username = user);
		}

		entries = [...entries, ...extraFetch];
	}
	entries = entries.sort((a, b) => b.id - a.id);

	let params = new URL(window.location).searchParams;

	let start = params.get('start') * 1;
	let end = params.get('end') * 1;

	end = Math.min(end, entries.length - 2);

	if (start && end) {
		entries = entries.splice(entries.length - end - 2, end - start + 1);
	}

	doThings = true;


	setInterval(function () {
		if (!doThings || (window.innerHeight + window.scrollY) < document.body.scrollHeight - 25) return;
		if (type == '#user') scroller();
		if (type == '#comment') commenter();
	}, 500);
}

function sanitize(content) {
	const decoder = document.createElement('div');
	decoder.textContent = content;
	return decoder.innerHTML;
}

function commenter() {
	let h = '';
	area.className = 'nogrid';
	for (let j = 0; j < 10; j++) {
		let entry = entries[i];
		if (!entry) continue;
		// ugly tbf
		h += `<div class='commenter'>
<img src='https://uploads.scratch.mit.edu/get_image/user/${entry.author.id}_999x999.png' class='user' float='left'>
<div>
<div><b><a href='https://scratch.mit.edu/users/${entry.author.username}'>${entry.author.username}</a></b></div>
<sub>In <a href='https://scratch.mit.edu/studios/${entry.studioID}'>${entry.studio}</a></sub>
<pre>${entry.content}</pre>
<sub>${entry.datetime_created}</sub>
</div>
</div>
`
		i++;
	}
	area.innerHTML += h;
}

function scroller() {
	let h = '';
	for (let j = 0; j < 35; j++) {
		let entry = entries[i];
		if (!entry) continue;
		// ugly tbf
		h += `<div class='proj'>
<a href="https://scratch.mit.edu/projects/${entry.id}">
<img src='https://uploads.scratch.mit.edu/get_image/project/${entry.id}_1920x1080.png'>
${entry.title}
</a>
<sub>
by ${entry.username}
</sub>
<sub>
${entry.studio ? ' in ' + entry.studio : ''}
</sub>
</div>`;
		i++;
	}
	area.innerHTML += h;
}

let sub = document.querySelector('#users');

let srch = new URLSearchParams(window.location.search)

let params = srch.getAll('users');

let val = params.join('\n') || sub.value;

sub.textContent = sub.value = val;

main(window.location.hash || '#user');
document.querySelector('#submit').onclick = () => main(window.location.hash || '#user');

document.querySelectorAll('.buttons button').forEach(x => x.onclick = function() {
	window.setInterval(function() {
		window.location.reload();
	},100);
})