diff options
Diffstat (limited to 'js/meals.js')
| -rw-r--r-- | js/meals.js | 50 |
1 files changed, 39 insertions, 11 deletions
diff --git a/js/meals.js b/js/meals.js index 1ce08f5..3423292 100644 --- a/js/meals.js +++ b/js/meals.js @@ -1,4 +1,5 @@ const API_ENDPOINT = "https://lopolis-api.gimb.tk/"; + async function checkLogin() { localforage.getItem("logged_in_lopolis").then((value) => { if (value != true) { @@ -13,6 +14,7 @@ async function checkLogin() { console.log(err); }); } + function setLoading(state) { if (state) { $("#loading-bar").removeClass("hidden"); @@ -20,6 +22,7 @@ function setLoading(state) { $("#loading-bar").addClass("hidden"); } } + async function getToken(callback, callbackparams = []) { setLoading(true); let promises_to_run = [ @@ -103,16 +106,21 @@ async function getMenus(dataauth, callback, callbackparams = []) { } }); } + 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); } + passtocallback.data = allmeals; passtocallback.token = dataauth.token; let toBePassed = [passtocallback].concat(callbackparams); callback(...toBePassed); + } async function loadMeals() { @@ -121,29 +129,37 @@ async function loadMeals() { function displayMeals(meals) { // console.log(JSON.stringify(meals)); // debug // dela! + let root_element = document.getElementById("meals-collapsible"); for(const [date, mealzz] of Object.entries(meals.data)) { let unabletochoosequestionmark = ""; let readonly = mealzz.readonly; var datum = new Date(date); + // Create root element for a date entry let subject_entry = document.createElement("li"); + // Create subject collapsible header let subject_header = document.createElement("div"); subject_header.classList.add("collapsible-header"); subject_header.classList.add("collapsible-header-root"); + // Create header text element let subject_header_text = document.createElement("span"); + if(mealzz.readonly) { unabletochoosequestionmark = "*" + S("readOnly") + "*"; } - subject_header_text.innerText = dateString.day(datum.getDay())+", "+datum.getDate()+". "+dateString.month(datum.getMonth())+" "+datum.getFullYear()+" ("+mealzz.meal+"@" - +mealzz.location+") "+unabletochoosequestionmark; + + // Use ES6 templates + subject_header_text = `${dateString.day(datum.getDay())}, ${datum.getDate()}. ${dateString.month(datum.getMonth())} ${datum.getFullYear()} (${mealzz.meal} @ ${mealzz.location}) ${unabletochoosequestionmark}`; + // Create collection for displaying individuals meals let subject_body = document.createElement("div"); subject_body.className = "collapsible-body"; let subject_body_root = document.createElement("ul"); subject_body_root.className = "collection"; + for(const [dindex, dmil] of Object.entries(mealzz.menu_options)) { // Create element for individual meal let meal_node = document.createElement("li"); @@ -151,11 +167,13 @@ function displayMeals(meals) { meal_node.classList.add("collection-item") meal_node.classList.add("meal-node"); meal_node.dataset["index"] = dindex; - if(!readonly) { - meal_node.onclick = function () { + + if (!readonly) { + meal_node.onclick = () => { setMenu(date, dmil.value); } } + let meal_node_div = document.createElement("div"); // Node for left text let meal_lefttext = document.createElement("span"); @@ -165,7 +183,7 @@ function displayMeals(meals) { // Apply different style, if the meal is selected if (dmil.selected) { // Text - meal_lefttext.innerHTML = "<i>"+dmil.text+"</i>"; + meal_lefttext.innerHTML = `<i>${dmil.text}</i>`; // Number meal_righttext.innerText = S("selected"); } else { @@ -179,13 +197,14 @@ function displayMeals(meals) { meal_node.appendChild(meal_node_div); subject_body_root.appendChild(meal_node); } + subject_header.appendChild(subject_header_text); subject_body.append(subject_body_root); subject_entry.append(subject_header); subject_entry.append(subject_body); root_element.append(subject_entry); } - $("#grades-collapsible").append(root_element); + $("#meals-collapsible").append(root_element); // refreshClickHandlers(); } @@ -247,11 +266,13 @@ async function lopolisLogin() { } }); } + async function setMenus(currentmeals = 69, toBeSentChoices) { // currentmeals je getMenus response in vsebuje tudi token. if(currentmeals === 69) { getToken(getMenus, [setMenus, toBeSentChoices]); return; } + for(const [mealzzdate, mealzz] of Object.entries(currentmeals.data)) { if(mealzzdate in toBeSentChoices) {} else { for (const [mealid, mealdata] of Object.entries(mealzz.menu_options)) { @@ -263,30 +284,32 @@ async function setMenus(currentmeals = 69, toBeSentChoices) { // currentmeals je } } } + setLoading(true); + $.ajax({ - url: API_ENDPOINT+"setmenus", + url: API_ENDPOINT + "setmenus", crossDomain: true, contentType: "application/json", data: JSON.stringify( { "choices": toBeSentChoices } ), headers: { - "Authorization": "Bearer "+currentmeals.token + "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"); - setLoading(false); } else if (response.error == false) { - setLoading(false); UIAlert( D("mealSet"), "setMenus(): meni nastavljen"); } else { - setLoading(false); UIAlert( D("errorUnexpectedResponse"), "setMenus(): invalid response, no condition met"); } + setLoading(false); }, + error: () => { setLoading(false); UIAlert( D("lopolisAPIConnectionError"), "setMenus(): AJAX error"); @@ -298,23 +321,28 @@ async function setMenu(date, menu) { choice[date] = menu; getToken(getMenus, [setMenus, choice]); } + // Initialization code document.addEventListener("DOMContentLoaded", async () => { checkLogin(); let coll_elem = document.querySelectorAll('.collapsible'); let coll_instance = M.Collapsible.init(coll_elem, {}); + // Setup refresh handler $("#refresh-icon").click(function () { refreshMeals(true); }); + let elems = document.querySelectorAll('.modal'); let instances = M.Modal.init(elems, {}); // Setup side menu const menus = document.querySelectorAll('.side-menu'); M.Sidenav.init(menus, { edge: 'right', draggable: true }); + // Setup side modal const modals = document.querySelectorAll('.side-modal'); M.Sidenav.init(modals, { edge: 'left', draggable: false }); + var elemsx = document.querySelectorAll('select'); var instancesx = M.FormSelect.init(elemsx); var datepickerelems = document.querySelectorAll('.datepicker'); |