import 'bootstrap/dist/css/bootstrap.css'
import serverRequest from "./serverRequsest.js";

const $forms = document.querySelectorAll("form");

const onSubmit = (e) => {
	e.preventDefault();
	const form = e.target;

	switch (form.id) {
		case "calc" : {
			calc(form)
			break;
		}
		case "toUpperCase" : {
			tuc(form)
			break;
		}
		case "split" : {
			split(form)
			break;
		}
		case "toHex" : {
			nth(form)
			break;
		}
	}
}

const calc = (form) => {
	const v1 = form.v1.value;
	const v2 = form.v2.value;

	serverRequest.calc(v1, v2).then(data => {
		const $res = document.getElementById("calc_result");
		$res.innerHTML = data;
	})
}

const tuc = (form) => {
	const value = form.value.value;

	serverRequest.toUpperCase(value).then(data => {
		const $res = document.getElementById("tuc_result");
		$res.innerHTML = data;
	})
}

const split = (form) => {
	const value = form.value.value;
	const sep = form.sep.value;

	serverRequest.split(value, sep).then(data => {
		const $res = document.getElementById("ss_result");
		$res.innerHTML = data;
	})
}

const nth = (form) => {
	const value = form.value.value;

	serverRequest.toHex(value).then(data => {
		const $res = document.getElementById("nth_result");
		$res.innerHTML = data;
	})
}

$forms.forEach(item => {
	item.onsubmit = onSubmit;
})