4 files changed, 285 insertions, 232 deletions

diff --git a/assets/js/lang/bundle.js b/assets/js/lang/bundle.js
index 4e15832..bd0335c 100644
--- a/assets/js/lang/bundle.js
+++ b/assets/js/lang/bundle.js
@@ -18,9 +18,6 @@ async function refreshLangDOM() {
 		localforage.getItem("chosenLang").then( (value) => {
 			chosenLang = value;
 		})
-		// localforage.getItem("chosenCapitalize").then( (value) => { // poor unused code
-		// 	chosenCapitalize = value;
-		// })
 	];
 	await Promise.all(promises_to_runn);
 	// this could be done nicer. p. s.: lahko bi se uporablil x-s in x-S za razločitev med capitalize in !capitalize queryselectorall ni case sensitive za imena elementov
@@ -58,16 +55,18 @@ async function setLangConfigAndReload() {
 	window.location.reload();
 }
 window.addEventListener("DOMContentLoaded", () => {
-	localforage.getItem("chosenLang").then( (value) => {
-			if(value == null) {
-				setLangConfigAndReload();
-			} else {
-				chosenLang = value;
-			}
-	});
-	refreshLangDOM();
+	find_chosen_lang();
 });
 
+async function find_chosen_lang() {
+	let value = await localforage.getItem("chosenLang");
+	if(value == null) {
+		setLangConfigAndReload();
+	} else {
+		chosenLang = value;
+	}
+	refreshLangDOM();
+}
 
 const capitalize = (s) => {
 	if (typeof s !== 'string') return ''
@@ -253,6 +252,10 @@ var langstrings = {
 		mealSet: "meal set! Reload meals to be sure",
 		selected: "selected",
 		meal: "meal",
+		checkedOut: "checked out",
+		checkedIn: "checked in",
+		successfulCheckingInOut: "successfully checked in/out",
+		errorCheckingInOut: "failed to check in/out",
 		// about
 		version: "version",
 		authors: "authors",
@@ -461,6 +464,10 @@ var langstrings = {
 		mealSet: "obrok nastavljen! osvežite obroke in se prepričajte sami",
 		selected: "izbrano",
 		meal: "obrok",
+		checkedOut: "odjavljen",
+		checkedIn: "prijavljen",
+		errorCheckingInOut: "prijava/odjava na obrok NI uspela",
+		successfulCheckingInOut: "prijava/odjava na obrok je uspela",
 		// about
 		version: "različica",
 		authors: "avtorji",
diff --git a/assets/js/lopolisc.js b/assets/js/lopolisc.js
index 6170ede..dfd9ff6 100644
--- a/assets/js/lopolisc.js
+++ b/assets/js/lopolisc.js
@@ -4,12 +4,15 @@ function getStringBetween(string, start, end) {
 
 const LOPOLIS_URL = "https://lopolis.gimb.tk/";
 const LOPOLISC_ERR_NET = "LOPOLSIC NETWORK ERROR (ajax error)";
-const	LOPOLISC_ERR_NET_POSTBACK_GET = "LOPOLISC NETWORK ERROR (ajax error) in postback GET"
-const LOPOLISC_ERR_NET_POSTBACK_POST = "LOPOLISC NETWORK ERROR (ajax error) in postback POST"
+const	LOPOLISC_ERR_NET_POSTBACK_GET = "LOPOLISC NETWORK ERROR (ajax error) "+
+	"in postback GET";
 const LOPOLISC_ERR_LOGIN = "LOPOLISC LOGIN ERROR";
-const LOPOLISC_ERR_NOTAPPLIED = "LOPOLISC DATA NOT APPLIED ERROR"
-const LOPOLISC_SIGNATURE = "lopolisc.js neuradni API - anton<at>sijanec.eu"
-
+const LOPOLISC_ERR_NET_POSTBACK_POST = "LOPOLISC NETWORK ERROR (ajax error) "+
+	"in postback POST";
+const LOPOLISC_ERR_NET_POSTBACK_POST_IN_POSTBACK = "LOPOLISC NETWORK ERROR $$$";
+const LOPOLISC_ERR_NOTAPPLIED = "LOPOLISC DATA NOT APPLIED ERROR";
+const LOPOLISC_SIGNATURE = "lopolisc.js neuradni API - anton<at>sijanec.eu";
+const LOPOLISC_ERR_OUT_OF_RETRIES = "LOPOLISC ERROR NI VEČ POSKUSOV!";
 class lopolisc {
 
 	constructor() {
@@ -58,6 +61,7 @@ class lopolisc {
 				type: "POST",
 				data: params,
 				dataType: "text",
+				maxRetries: 3,
 				success: (postData, textStatus, xhr) => {
 					resolve({data: postData, textStatus: textStatus, code: xhr.status});
 				},
@@ -80,12 +84,15 @@ class lopolisc {
 				type: "GET",
 				dataType: "html",
 				success: (data) => {
-					if (useDiffAction == true) {
+					if (useDiffAction === true) {
 						useDiffAction = getUrl;
 					}
-					this.parseAndPost(data, params, formId, useDiffAction).then((value) => {
-						resolve(value);
-					});
+						this.parseAndPost(data, params, formId, useDiffAction)
+						.then((value) => {
+							resolve(value);
+						}).catch((e)=>{
+							reject(new Error(LOPOLISC_ERR_NET_POSTBACK_POST_IN_POSTBACK));
+						});
 				},
 				error: () => {
 					reject(new Error(LOPOLISC_ERR_NET_POSTBACK_GET));
@@ -94,14 +101,65 @@ class lopolisc {
 		});
 	}
 
+	getUserData() {
+		return new Promise((resolve, reject)=>{
+			$.ajax({
+				xhrFields: {
+					withCredentials: true
+				},
+				crossDomain: true,
+				url: LOPOLIS_URL+"?MeniID=2",
+				cache: false,
+				type: "GET",
+				dataType: "html",
+				success: (data) => {
+					if (data.includes("Dostop ni dovoljen")) {
+						// console.log(data);
+						resolve(false);
+						return;
+					}
+					let parser = new DOMParser();
+					let p = parser.parseFromString(data, "text/html");
+					let uporabnik = {
+						u: p.getElementsByClassName("obrazecPovdarjen")[0].innerText.trim(),
+						n: p.getElementsByClassName("obrazecPovdarjen")[1].innerText.trim(),
+						e: p.getElementById("Email").value
+					}
+					resolve(uporabnik);
+				},
+				error: () => {
+					reject(new Error(LOPOLISC_ERR_NET));
+				}
+			});
+		});
+	}
+
+	logout() { // you can get pretty race conditiony if you use this wrong! // nah
+		return new Promise((resolve, reject)=>{
+			this.postback(LOPOLIS_URL + "Uporab/Prijava", {}, null, false).then((response) => { // če je true, bo URL, če je false, bo action
+				resolve(true); // don't bother checking cookies...
+			});
+		});
+	}
+
 	login(usernameToLogin, passwordToLogin) {
-		return new Promise((resolve, reject) => {
+		return new Promise(async function(resolve, reject) {
+			let l = new lopolisc();
+			var uporabnik = await l.getUserData();
+			if (uporabnik != false) {
+				if (uporabnik.u = usernameToLogin) {
+					resolve(true);
+					return;
+				} else {
+					await this.logout();
+				}
+			}
 			var dataToSend = {
 				"Uporabnik": usernameToLogin,
 				"Geslo": passwordToLogin,
 				"OsveziURL": "https://pornhub.com/\"; lopolis=\"boljsi od easistenta",
 			};
-			this.postback(LOPOLIS_URL + "Uporab/Prijava", dataToSend, null, true).then((response) => { // če je true, bo URL, če je false, bo action
+			l.postback(LOPOLIS_URL + "Uporab/Prijava", dataToSend, null, true).then((response) => { // če je true, bo URL, če je false, bo action
 				let parser = new DOMParser();
 				let parsed = parser.parseFromString(response.data, "text/html");
 				if (parsed.getElementById("divPrijavaOsvezi") != null) {
@@ -130,7 +188,7 @@ class lopolisc {
 															getElementsByTagName("tr")) {
 					let date_idx = element.getElementsByTagName("input")[2].value;
 					checkouts[date_idx] = {
-						checked: element.getElementsByTagName("input")[0].checked,
+						checked/*out*/: element.getElementsByTagName("input")[0].checked,
 						readonly: element.getElementsByTagName("input")[0].disabled,
 						// spodaj spremenljivke, ki so potrebne za submit (ne-API)
 						index: Number(getStringBetween( // string, start, end
@@ -159,7 +217,53 @@ class lopolisc {
 		});
 	}
 
+	fetchAllMeals(koliko = 3) { // "vsi" pomeni nas. n mes. (vklj. s tem me.)
+		return new Promise (async function(resolve, reject) {
+			let date = new Date();
+			let podatki = {};
+			while (koliko-- > 0) {
+				let l = new lopolisc(); // this zajebava, sorry; seja je itak na
+				let resp = await l.fetchMeals(date); // browserju, ne na objectu.
+				podatki = {...podatki, ...resp};
+				date.setMonth(date.getMonth()+1); // ja, popravi se letnica!
+			}
+			resolve(podatki);
+		});
+	}
+
+
+	fetchAllCheckouts(koliko = 3) { // "vsi" pomeni nas. n mes. (vklj. s tem me.)
+		return new Promise (async function(resolve, reject) {
+			let date = new Date();
+			let podatki = {};
+			while (koliko-- > 0) {
+				let l = new lopolisc(); // this zajebava, sorry; seja je itak na
+				let resp = await l.fetchCheckouts(date); // browserju, ne na objectu.
+				podatki = {...podatki, ...resp};
+				date.setMonth(date.getMonth()+1); // ja, popravi se letnica!
+			}
+			resolve(podatki);
+		});
+	}
+
 	setCheckouts(odjava_objects) {
+		let odjava_objects_sorted = {};
+		for (const [odjava_da, odjava_ob] of Object.entries(odjava_objects)) {
+			let yearmonth_combo = odjava_da.substring(0,7);
+			if (odjava_objects_sorted[yearmonth_combo] == undefined) {
+				odjava_objects_sorted[yearmonth_combo] = {};
+			}
+			odjava_objects_sorted[yearmonth_combo][odjava_da] = odjava_ob;
+		}
+		if (Object.entries(odjava_objects_sorted).length < 1) {
+			return false;
+		} else if (Object.entries(odjava_objects_sorted).length > 1) {
+			var response;
+			for (const [ym_combo, odj_ob] of Object.entries(odjava_objects_sorted)) {
+				response = this.setCheckouts(odj_ob);
+			}
+			return response; // napake so itak exceptioni, promisov ne potrebujemo!
+		} // else: samo en mesec podatkov imamo, let's go!
 		return new Promise((resolve, reject) => {
 			var dataToSend = { "Ukaz": "Shrani" };
 			for (const [odjava_da, odjava_object] of Object.entries(odjava_objects)) {
@@ -183,7 +287,7 @@ class lopolisc {
 		});
 	}
 
-	fetchMeals(date_object = null) { // todo: fetchAllMeals(): naslednja 2 meseca
+	fetchMeals(date_object = null, retried = 3) { // retried je interni parameter
 		if (date_object == null) {
 			date_object = new Date();
 		}
@@ -195,7 +299,7 @@ class lopolisc {
 				"API-METODA": "fetchMeals",
 				"MesecModel.Leto": String(date_object.getFullYear())
 			}
-			this.postback(LOPOLIS_URL+"Prehrana/Prednarocanje",dataToSend,null,true).
+			this.postback(LOPOLIS_URL+"?MeniID=78",dataToSend,"form1",false).
 				then((response) => {
 				let parser = new DOMParser();
 				let parsed = parser.parseFromString(response.data, "text/html");
@@ -253,11 +357,35 @@ class lopolisc {
 							String(element.getElementsByTagName("input")[2].value); // readonly
 				}
 				resolve(meals);
+			}).catch((err)=>{
+				if (retried <= 0) {
+					reject(new Error(LOPOLISC_ERR_OUT_OF_RETRIES));
+				} else {
+					resolve(this.fetchMeals(date_object, retried-1)); // retry
+				}
 			});
 		});
 	}
 
 	setMeals(meal_objects) {
+		let meal_objects_sorted = {};
+		for (const [meal_da, meal_ob] of Object.entries(meal_objects)) {
+			let yearmonth_combo = meal_da.substring(0,7);
+			if (meal_objects_sorted[yearmonth_combo] == undefined) {
+				meal_objects_sorted[yearmonth_combo] = {};
+			}
+			meal_objects_sorted[yearmonth_combo][meal_da] = meal_ob;
+		}
+		if (Object.entries(meal_objects_sorted).length < 1) { // ni podatkov sploh
+			return false;
+		} else if (Object.entries(meal_objects_sorted).length > 1) {
+			var response;
+			for (const [ym_combo, meal_ob] of Object.entries(meal_objects_sorted)) {
+				response = this.setMeals(meal_ob);
+			}
+			return response; // itak ne uporabljamo response ampak try{}catch{} except
+		} // else: samo en mesec podatkov imamo, let's go!
+	
 		return new Promise((resolve, reject) => {
 			var dataToSend = { "Ukaz": "Shrani" };
 			for (const [meal_date, meal_object] of Object.entries(meal_objects)) {
@@ -290,6 +418,15 @@ class lopolisc {
 			});
 		});
 	}
+	
+	chooseMenu(meal_object, meal_index) {
+		for (const menu_option of meal_object.menu_options) {
+			menu_option.selected = false;
+		}
+		meal_object.menu_options[meal_index].selected = true;
+		return;
+	}
+
 }
 
 //   Edited with    \  / o  _ _    this script is     I         /\/\        2020
diff --git a/assets/js/meals.js b/assets/js/meals.js
index 15accdb..bb04583 100644
--- a/assets/js/meals.js
+++ b/assets/js/meals.js
@@ -1,8 +1,8 @@
-const API_ENDPOINT = "https://lopolis-api.gimb.tk/";
+const API_ENDPOINT = "https://lopolis-api.gimb.tk/"; // unused!
 
 var meals_calendar_obj = null;
 var meals_data_global = {};
-
+var checkouts_data_global = {};
 function getDateString() { // ne mene gledat, ne vem, kaj je to.
 	let date = new Date();
 
@@ -50,105 +50,49 @@ async function getToken(callback, callbackparams = []) {
 		})
 	];
 	await Promise.all(promises_to_run);
-
-	$.ajax({
-		url: API_ENDPOINT + "gettoken",
-		crossDomain: true,
-		contentType: "application/json",
-		data: JSON.stringify({
-			"username": username,
-			"password": password
-		}),
-
-		dataType: "json",
-		cache: false,
-		type: "POST",
-
-		success: (dataauth) => {
-			if (dataauth == null || dataauth.error == true) {
-				UIAlert(D("authenticationError"), "getToken(): response error or null");
-				localforage.setItem("logged_in_lopolis", false).then(function() {
-					checkLogin();
-				});
-			} else if (dataauth.error == false) {
-				let empty = {};
-				empty.token = dataauth.data;
-				let argumentsToCallback = [empty].concat(callbackparams);
-				callback(...argumentsToCallback); // poslje token v {token: xxx}
-			} else {
-				UIAlert(D("authenticationError"), "getToken(): invalid response, no condition met");
-			}
-			setLoading(false);
-		},
-		error: () => {
-			UIAlert(D("lopolisAPIConnectionError"), "getToken(): AJAX error");
-			setLoading(false);
-		}
-	});
+	try {
+		var lopolisClient = new lopolisc();
+		var response = await lopolisClient.login(username, password);
+		// če response ni true bo itak exception
+	} catch (e) {
+		console.log(e);
+		UIAlert(D("authenticationError"), "getToken(): invalid response, no condition met");
+		await localforage.setItem("logged_in_lopolis", false);
+		return false;
+	}
+	await localforage.setItem("logged_in_lopolis", true);
+	let empty = {};
+	empty.token = {}; // tokenov NI VEČ! old code pa to
+	let argumentsToCallback = [empty].concat(callbackparams);
+	callback(...argumentsToCallback); // poslje token v {token: xxx}
 }
 
 async function getMenus(dataauth, callback, callbackparams = []) {
 	setLoading(true);
-	let current_date = new Date();
-	// naloži za dva meseca vnaprej (če so zadnji dnevi v mesecu)
-	let mealsgathered = {};
-	let promises_to_wait_for = [];
-	for (let iteration = 1; iteration <= 2; iteration++) {
-
-		promises_to_wait_for[iteration] = $.ajax({
-			url: API_ENDPOINT + "getmenus",
-			crossDomain: true,
-			contentType: "application/json",
-			data: JSON.stringify({
-				"month": current_date.getMonth() + iteration,
-				"year": current_date.getFullYear()
-			}),
-
-			headers: {
-				"Authorization": `Bearer ${dataauth.token}`
-			},
-
-			dataType: "json",
-			cache: false,
-			type: "POST",
-
-			success: (meals) => {
-				if (meals == null || meals.error == true) {
-					UIAlert(D("errorGettingMenus"), "getMenus(): response error or null");
-					setLoading(false);
-					localforage.setItem("logged_in_lopolis", false).then(() => {
-						checkLogin();
-					});
-				} else if (meals.error == false) {
-					setLoading(false);
-					mealsgathered[iteration] = meals;
-				} else {
-					setLoading(false);
-					UIAlert(D("errorUnexpectedResponse"), "getMenus(): invalid response, no condition met");
-				}
-			},
-
-			error: () => {
-				setLoading(false);
-				UIAlert(D("lopolisAPIConnectionError"), "getMenus(): AJAX error");
-			}
-		});
-	}
-
-	await Promise.all(promises_to_wait_for); // javascript is ducking amazing
-
-	let allmeals = {};
 	let passtocallback = {};
-
-	for (const [index, monthmeals] of Object.entries(mealsgathered)) { // although this is not very javascripty
-		allmeals = mergeDeep(allmeals, monthmeals.data);
+	let allmeals, allcheckouts;
+	let tries = 3;
+	while (true) {
+		try {
+			let lopolisClient = new lopolisc();
+			allmeals = await lopolisClient.fetchAllMeals();
+			allcheckouts = await lopolisClient.fetchAllCheckouts();
+		} catch (e) {
+			console.log(e);
+			UIAlert(D("lopolisAPIConnectionError"), "getMenus(): AJAX error");
+			if (tries-- < 0) {
+				return false;
+			} else {
+				continue;
+			}
+		}
+		break;
 	}
-
-	passtocallback.data = allmeals;
-	passtocallback.token = dataauth.token;
+	passtocallback.data = allmeals; // kot po starem apiju so meniji še vedno tu!!
+	passtocallback.checkouts = allcheckouts;
+	passtocallback.token = "tokens-not-used-anymore";
 	let toBePassed = [passtocallback].concat(callbackparams);
 	callback(...toBePassed);
-
 }
 
 async function loadMeals() {
@@ -158,6 +102,7 @@ async function loadMeals() {
 function displayMeals(meals) {
 	// console.log(JSON.stringify(meals)); // debug // dela!
 	meals_data_global = meals.data;
+	checkouts_data_global = meals.checkouts;
 	let transformed_meals = [];
 	for (const [date, mealzz] of Object.entries(meals.data)) {
 		let bg_color = "#877F02";	let fg_color = "#FFFFFF";
@@ -165,7 +110,7 @@ function displayMeals(meals) {
 		let meal_date = new Date(date+"+00:00"); // idk u figure it out. timezones
 		let meal_object = {
 			start: meal_date.toISOString().substring(0,10), // zakaj? poglej gradings.js - NUJNO! poglej, če so timezoni v redu! da slučajno ne preskakuje na naslednji dan!
-			title: S("meal"),
+			title: mealzz.meal,
 			id: date,
 			allDay: true,
 			backgroundColor: bg_color,
@@ -175,6 +120,7 @@ function displayMeals(meals) {
 	}
 	meals_calendar_obj.removeAllEvents();
 	meals_calendar_obj.addEventSource(transformed_meals);
+	setLoading(false);
 	return;
 }
 
@@ -188,117 +134,35 @@ function refreshMeals() {
 }
 
 function lopolisLogout() {
-	localforage.setItem("logged_in_lopolis", false);
-	$("#meals-collapsible").html("");
-	checkLogin();
+	localforage.setItem("logged_in_lopolis", false).then(()=>{
+		clearMeals();
+		checkLogin();
+	});
 }
 
 async function lopolisLogin() {
 	setLoading(true);
 	var usernameEl = $("#meals-username");
 	var passwordEl = $("#meals-password");
-	$.ajax({
-		url: API_ENDPOINT + "gettoken",
-		crossDomain: true,
-		contentType: "application/json",
-		data: JSON.stringify({
-			"username": usernameEl.val(),
-			"password": passwordEl.val()
-		}),
-
-		dataType: "json",
-		cache: false,
-		type: "POST",
-
-		success: async function(data) {
-			if (data == null) {
-				UIAlert(S("requestForAuthenticationFailed"), "lopolisLogin(): date is is null");
-				setLoading(false);
-				usernameEl.val("");
-				passwordEl.val("");
-			} else if (data.error == true) {
-				UIAlert(S("loginFailed"), "lopolisLogin(): login failed. data.error is true");
-				usernameEl.val("");
-				passwordEl.val("");
-				setLoading(false);
-			} else {
-				let promises_to_run = [
-					localforage.setItem("logged_in_lopolis", true),
-					localforage.setItem("lopolis_username", usernameEl.val()),
-					localforage.setItem("lopolis_password", passwordEl.val())
-				];
-				await Promise.all(promises_to_run);
-				checkLogin();
-				UIAlert("Credential match!");
-			}
-		},
-
-		error: () => {
-			UIAlert(D("loginError"), "lopolisLogin(): ajax.error");
-			setLoading(false);
-		}
-	});
-}
-
-async function setMenus(currentmeals = 69, toBeSentChoices) { // currentmeals je getMenus response in vsebuje tudi token.
-
-	if (currentmeals === 69) {
-		getToken(getMenus, [setMenus, toBeSentChoices]);
-		return;
+	try {
+		let l = new lopolisc();
+		await l.login(usernameEl.val(), passwordEl.val());
+	} catch (e) {
+		UIAlert(D("loginError"), "lopolisLogin(): ajax.error");
+		setLoading(false);
+		return false;
 	}
-
-	for (const [mealzzdate, mealzz] of Object.entries(currentmeals.data)) {
-		if (mealzzdate in toBeSentChoices === false) {
-			for (const [mealid, mealdata] of Object.entries(mealzz.menu_options)) {
-				// console.log(mealdata);
-				if (mealdata.selected == true || mealzz.readonly == true) {
-					toBeSentChoices[mealzzdate] = mealdata.value;
-					break;
-				}
-			}
-		}
-	}
-
-	setLoading(true);
-
-	$.ajax({
-		url: API_ENDPOINT + "setmenus",
-		crossDomain: true,
-		contentType: "application/json",
-		data: JSON.stringify({
-			"choices": toBeSentChoices
-		}),
-		headers: {
-			"Authorization": "Bearer " + currentmeals.token
-		},
-		dataType: "json",
-		cache: false,
-		type: "POST",
-
-		success: (response) => {
-			if (response === null || response.error == true) {
-				UIAlert(D("errorSettingMeals"), "setMenus(): response error or null");
-			} else if (response.error == false) {
-				UIAlert(D("mealSet"), "setMenus(): meni nastavljen");
-			} else {
-				UIAlert(D("errorUnexpectedResponse"), "setMenus(): invalid response, no condition met");
-			}
-			setLoading(false);
-		},
-
-		error: () => {
-			setLoading(false);
-			UIAlert(D("lopolisAPIConnectionError"), "setMenus(): AJAX error");
-		}
-	});
-}
-async function setMenu(date, menu) {
-	let choice = {};
-	choice[date] = menu;
-	getToken(getMenus, [setMenus, choice]);
+	let promises_to_run = [
+		localforage.setItem("logged_in_lopolis", true),
+		localforage.setItem("lopolis_username", usernameEl.val()),
+		localforage.setItem("lopolis_password", passwordEl.val())
+	];
+	await Promise.all(promises_to_run);
+	checkLogin();
+	UIAlert("Credential match!");
+	return true;
 }
 
-
 function setupEventListeners() {
 	$("#meals-login").click(() => {
 		lopolisLogin();
@@ -310,9 +174,33 @@ function setupEventListeners() {
 }
 
 var mealClickHandler = (eventClickInfo) => {
-	// console.log("meal clicked!"); // debug
 	let meal_date = eventClickInfo.event.id;
 	let meal_object = meals_data_global[meal_date];
+
+	/// ˇˇˇ checkouts
+	$("#checkout_label").show();		let can_do_checkout = true;
+	try {
+		let checkout_object = checkouts_data_global[meal_date];
+	} catch (e) {
+		$("#checkout_label").hide();	let can_do_checkout = false;
+	}
+	if (can_do_checkout) { let cc = $("#checkout_checkbox");
+		cc.off();
+		cc.on("change", ()=>{
+			let l = new lopolisc();
+			checkouts_data_global[meal_date].checked/*out*/ = !(cc[0].checked/*in*/);
+			setLoading(true);
+			l.setCheckouts(checkouts_data_global).then(()=>{ // update server checkots
+				UIAlert(D("successfulCheckingInOut"), "successfulcheckinginout");
+				setLoading(false);
+			}).catch(()=>{
+				UIAlert(D("errorCheckingInOut"), "errorcheckinginout");
+				setLoading(false);
+			});
+		});
+		cc.prop("disabled", checkouts_data_global[meal_date].readonly);
+	}
+	/// ^^^ checkouts
 	$("#meal-type").text(meal_object.meal);
 	let meal_date_obj = new Date(meal_date);
 	$("#meal-date").text(dateString.longFormatted(meal_date_obj));
@@ -326,12 +214,9 @@ var mealClickHandler = (eventClickInfo) => {
 		let menu_option_li_el = document.createElement("li");
 		let menu_option_a_el = document.createElement("button");
 		menu_option_a_el.innerText = option_object.text;
-		// console.log(JSON.stringify(meal_object)); // debug
 		let classlist = "";
 		if (option_object.selected != null) {
 			if(option_object.selected) {
-				// console.log("selected"); // debug
-				//
 				classlist = "color: green; font-weight: bold";
 			}
 		}
@@ -339,13 +224,25 @@ var mealClickHandler = (eventClickInfo) => {
 		menu_option_a_el.style = "color: var(--color-text); background-color: rgba(0,0,0,0); line-height: 1.2; height:auto; "+classlist+" !important";
 		menu_option_a_el.id = "menu_index_"+option_index;
 		if(!(meal_object.readonly)) {
-			menu_option_a_el.onclick = () => { 
-				setMenu(meal_date, option_object.value);
+			menu_option_a_el.disabled = false;
+			menu_option_a_el.onclick = () => {
+				setLoading(true);
+				let l = new lopolisc();
+				l.chooseMenu(meals_data_global[meal_date], option_index);
+				l.setMeals(meals_data_global).then(()=>{
+					UIAlert(D("mealSet"), "meal set!");
+					setLoading(false);
+				}).catch(()=>{
+					UIAlert(D("errorSettingMeals"), "error setting meals");
+					setLoading(false);
+				});
 				menu_option_a_el.className = "to-be-selected-meal";
 				let sidenav_element = document.getElementById("meal-info");
 				let sidenav_instance = M.Sidenav.getInstance(sidenav_element);
 				sidenav_instance.close();
 			};
+		} else {
+			menu_option_a_el.disabled = true;
 		}
 		menu_option_li_el.appendChild(menu_option_a_el);
 		document.getElementById("meal-options").appendChild(menu_option_li_el);
@@ -357,6 +254,7 @@ var mealClickHandler = (eventClickInfo) => {
 
 // Initialization code
 document.addEventListener("DOMContentLoaded", async () => {
+	await find_chosen_lang();
 	checkLogin();
 
 	var calendarEl = document.getElementById("meals-calendar");
@@ -377,6 +275,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 
 	// Setup refresh handler
 	$("#refresh-icon").click(function() {
+		setLoading(true);
 		refreshMeals();
 	});
 
@@ -408,5 +307,5 @@ document.addEventListener("DOMContentLoaded", async () => {
 		format: "dddd, dd. mmmm yyyy"
 	});
 
-	refreshMeals();
+	// refreshMeals(); // checklogin already does this
 });
diff --git a/assets/pages-src/meals.bvr b/assets/pages-src/meals.bvr
index d98ed56..47be6e4 100644
--- a/assets/pages-src/meals.bvr
+++ b/assets/pages-src/meals.bvr
@@ -17,20 +17,18 @@
 		<script src="/js/lib/jquery.min.js"></script>
 		<!-- localForage -->
 		<script type="text/javascript" src="/js/lib/localforage.min.js"></script>
+		<!-- i18n bundle -->
+		<script src="/js/lang/bundle.js"></script>
 		<!-- mergedeep.js -->
 		<script type="text/javascript" src="/js/lib/mergedeep.js"></script>
 		<!-- stylesheet for custom styles -->
 		<link type="text/css" href="/css/styles.css" rel="stylesheet">
-		<!-- page-specific javascript code -->
-		<script type="text/javascript" src="/js/meals.js"></script>
 		<!-- PWA manifest -->
 		<link rel="manifest" href="/manifest.json">
 		<!-- app global code -->
 		<script src="/js/app.js"></script>
 		<!-- code for custom theme switcher -->
 		<script src="/js/lib/themes.js"></script>
-		<!-- i18n bundle -->
-		<script src="/js/lang/bundle.js"></script>
 		<!-- favicon -->
 		<link rel="shortcut icon" type="image/png" href="/favicon.png" />
 		<!-- iOS support -->
@@ -45,6 +43,8 @@
 		<script src="/js/lib/fullcalendar/daygrid/main.min.js"></script>
 		<!-- lopolis client API library - unofficial by sijanec -->
 		<script src="/js/lopolisc.js"></script>
+		<!-- page-specific javascript code -->
+		<script type="text/javascript" src="/js/meals.js"></script>
 	</head>
 
 	<body>
@@ -83,6 +83,16 @@
 					<x-du>readOnly</x-du>
 				</a>
 			</li>
+			<li>
+				<div class=switch>
+					<label id=checkbox_label>
+						<x-su>checkedOut</x-su>
+						<input id=checkout_checkbox type=checkbox>
+						<span class=lever></span>
+						<x-su>checkedIn</x-su>
+					</label>
+				</div>
+			</li>
 			<div class=divider></div>
 			<li id=meal-options>