const URL = "https://ada.uprrp.edu/~diego.estrada1/CCOM/4027/db";

var last = 'buttons';
const show = i => document.getElementById(i).hidden = false;
const hide = i => document.getElementById(i).hidden = true;

function next(i) {
	hide(last);
	last = i;
	show(i);
}

function restart() {
	show('buttons');
	if (last != 'buttons')
		hide(last);
	last = 'buttons';
}

function tableFilter(event, table) {
	var filter = event.target.value.toUpperCase();

	var trs = table.getElementsByTagName("tr");

	for (var i = 1; i < trs.length; i++) {
		trs[i].style.display = "none";
		tds = trs[i].getElementsByTagName("td");
		for (var j = 0; j < tds.length; j++) {
			td = tds[j];
			if (td) {
				td_text = td.textContent || td.innerText;
				if (td_text.toUpperCase().indexOf(filter) > -1) {
					trs[i].style.display = "";
				}
			}
		}
	}
}

function initTable(HTMLTable, SQLTable, editHandler, deleteHandler) {
	const body = HTMLTable.tBodies[0];
	body.innerHTML = "";
	fetch (`${URL}/api/v1/read/?t=${SQLTable}`).then(resp => resp.json()).then(json => {
		for (var i = 0; i < json.length; ++i) {
			const obj = json[i];
			let HTML = "<tr>";
			for (var j = 0; j < obj.length; ++j) {
				HTML += `<td>${obj[j]}</td>`;
			}
			HTML += `
				<td style="border:0px;">
					<button onclick='${editHandler}(${JSON.stringify(obj)})'>Edit</button>
				</td>
			`;
			HTML += `
				<td style="border:0px;">
					<button style="color:#ff5454;" onclick='${deleteHandler}(${JSON.stringify(obj)})'>Delete</button>
				</td>
			`;
			HTML += "</tr>";
			body.innerHTML += HTML;
		}
	});
}

function fillSelect(select, SQLTable) {
	const body = select;
	console.log(select);
}

function fillTable(HTMLTable, SQLTable) {
	const body = HTMLTable.tBodies[0];
	body.innerHTML = "";
	fetch(`${URL}/api/v1/read/?t=${SQLTable}`).then(resp => resp.json()).then(json => {
		for (var i = 0; i < json.length; ++i) {
			const obj = json[i];
			let HTML = "<tr>";
			for (var j = 0; j < obj.length; ++j) {
				HTML += `<td>${obj[j]}</td>`;
			}
			HTML += "</tr>";
			body.innerHTML += HTML;
		}
	});
}

async function get(endpoint, params) {
	try {
		return await fetch(`${URL}/api/v1/${endpoint}/?${params}`).then(resp => resp.json());
	} catch (error) {
		console.error(error.message);
		return "";
	}
}

async function post(endpoint, payload) {
	try {
		return await fetch(`${URL}/api/v1/${endpoint}/`, {
			method: "POST",
			headers: {
				"Content-Type": "application/json"
			},
			body: JSON.stringify(payload)
		}).then(resp => resp.json());
	} catch (error) {
		console.error(error.message);
		return "";
	}
}