diff --git a/css/self-check.css b/css/self-check.css index ba365ce..e206939 100644 --- a/css/self-check.css +++ b/css/self-check.css @@ -1,298 +1,331 @@ /* COMMMON */ * { - font-family: "Ubuntu", sans-serif; + font-family: "Ubuntu", sans-serif; } body { - margin: 0px; - padding: 0px; - line-height: 18px; - - background-color: #F0F5FF; + margin: 0px; + padding: 0px; + line-height: 18px; + + background-color: #f0f5ff; } input { - outline: none; + outline: none; } textarea { - outline: none; + outline: none; } .hide { - display: none; + display: none; } .show { - display: initial; + display: initial; } .aligncenter { - text-align: center; + text-align: center; } /* TOP TOOLBAR */ .toptoolbar { - height: 62px; - width: 100%; - - - background: #ededed; - - background: -webkit-linear-gradient(#ffffff, #ededed); - background: -o-linear-gradient(#ffffff, #ededed); - background: -moz-linear-gradient(#ffffff, #ededed); - background: linear-gradient(#ffffff, #ededed); - - border-bottom: 1px solid #909090; - box-shadow: 0px 3px 5px 0px #acacac; + height: 62px; + width: 100%; + + background: #ededed; + + background: -webkit-linear-gradient(#ffffff, #ededed); + background: -o-linear-gradient(#ffffff, #ededed); + background: -moz-linear-gradient(#ffffff, #ededed); + background: linear-gradient(#ffffff, #ededed); + + border-bottom: 1px solid #909090; + box-shadow: 0px 3px 5px 0px #acacac; } .toptoolbar .logo { - padding-top: 4px; - margin-left: 10px; - text-align: center; + padding-top: 4px; + margin-left: 10px; + text-align: center; } +.toptoolbar.vlerick .logo { + padding-top: 4px; + margin-left: 10px; + text-align: center; +} /* MAIN CONTENT */ .maincontent { - text-align: center; - margin: 40px auto 0px auto; - - background: #fafafa; - - background: -webkit-linear-gradient(#ffffff, #ededed); - background: -o-linear-gradient(#ffffff, #ededed); - background: -moz-linear-gradient(#ffffff, #ededed); - background: linear-gradient(#ffffff, #ededed); - - border: 1px solid #cacaca; - border-radius: 15px; - box-shadow: 0px 3px 5px 0px #acacac; + text-align: center; + margin: 40px auto 0px auto; + + background: #fafafa; + + background: -webkit-linear-gradient(#ffffff, #ededed); + background: -o-linear-gradient(#ffffff, #ededed); + background: -moz-linear-gradient(#ffffff, #ededed); + background: linear-gradient(#ffffff, #ededed); + + border: 1px solid #cacaca; + border-radius: 15px; + box-shadow: 0px 3px 5px 0px #acacac; } .smallbox { - width: 500px; + width: 500px; } .largebox { - width: 900px; + width: 900px; } .maincontent .h1title { - padding: 20px; - background: #14436c; - - background: -webkit-linear-gradient(#14436c, #1c5d97); - background: -o-linear-gradient(#14436c, #1c5d97); - background: -moz-linear-gradient(#14436c, #1c5d97); - background: linear-gradient(#14436c, #1c5d97); - - color: #ffffff; - font-weight: bold; - border-radius: 15px 15px 0px 0px; - font-size: 140%; + padding: 20px; + background: #14436c; + + background: -webkit-linear-gradient(#14436c, #1c5d97); + background: -o-linear-gradient(#14436c, #1c5d97); + background: -moz-linear-gradient(#14436c, #1c5d97); + background: linear-gradient(#14436c, #1c5d97); + /* background: -webkit-linear-gradient(#000000, #000000); + background: -o-linear-gradient(#000000, #000000); + background: -moz-linear-gradient(#000000, #000000); + background: linear-gradient(#000000, #000000); */ + color: #ffffff; + font-weight: bold; + border-radius: 15px 15px 0px 0px; + font-size: 140%; +} +.vlerickclass { + background: #000000; +} +.maincontent .h1title.vlerickclass { + padding: 20px; + background: #000000; + + /* background: -webkit-linear-gradient(#14436c, #1c5d97); + background: -o-linear-gradient(#14436c, #1c5d97); + background: -moz-linear-gradient(#14436c, #1c5d97); + background: linear-gradient(#14436c, #1c5d97); */ + background: -webkit-linear-gradient(#000000, #000000); + background: -o-linear-gradient(#000000, #000000); + background: -moz-linear-gradient(#000000, #000000); + background: linear-gradient(#000000, #000000); + color: #ffffff; + font-weight: bold; + border-radius: 15px 15px 0px 0px; + font-size: 140%; } - .maincontent .h2title { - font-size: 120%; - font-weight: bold; - color: #202020; - padding-bottom: 15px; + font-size: 120%; + font-weight: bold; + color: #202020; + padding-bottom: 15px; } - + .maincontent .databox { } .maincontent .databox input[type="text"] { - margin: 5px 0px 5px 5px; - border: 1px solid #cdcdcd; - border-radius: 2px; - box-sizing: border-box; - -moz-box-sizing: border-box; - height: 32px; - outline: none; - - background-color: #fff; - padding: 0 10px 0 10px; - width: 80%; - font-size: 15px; - font-weight: 300; - text-overflow: ellipsis; - - text-align: center; + margin: 5px 0px 5px 5px; + border: 1px solid #cdcdcd; + border-radius: 2px; + box-sizing: border-box; + -moz-box-sizing: border-box; + height: 32px; + outline: none; + + background-color: #fff; + padding: 0 10px 0 10px; + width: 80%; + font-size: 15px; + font-weight: 300; + text-overflow: ellipsis; + + text-align: center; } .maincontent .databox input[type="button"] { - padding: 10px 40px; + padding: 10px 40px; + + color: #ffffff; + font-weight: bold; - color: #ffffff; - font-weight: bold; + border-radius: 5px; + border: 1px solid #909090; - border-radius: 5px; - border: 1px solid #909090; - - background: #656565; - background: -webkit-linear-gradient(#808080, #505050); - background: -o-linear-gradient(#808080, #505050); - background: -moz-linear-gradient(#808080, #505050); - background: linear-gradient(#808080, #505050); - - cursor: pointer; + background: #656565; + background: -webkit-linear-gradient(#808080, #505050); + background: -o-linear-gradient(#808080, #505050); + background: -moz-linear-gradient(#808080, #505050); + background: linear-gradient(#808080, #505050); + + cursor: pointer; } .maincontent .databox input[type="button"]:hover { - - background: #404040; - background: -webkit-linear-gradient(#505050, #202020); - background: -o-linear-gradient(#505050, #202020); - background: -moz-linear-gradient(#505050, #202020); - background: linear-gradient(#505050, #202020); - + background: #404040; + background: -webkit-linear-gradient(#505050, #202020); + background: -o-linear-gradient(#505050, #202020); + background: -moz-linear-gradient(#505050, #202020); + background: linear-gradient(#505050, #202020); } .maincontent .errormessage { - color: #ff0000; - + color: #ff0000; } .maincontent .headertable { - width: 100%; - background: #dadada; + width: 100%; + background: #dadada; } .maincontent .headertable td { - padding: 15px 0px 15px 0px; + padding: 15px 0px 15px 0px; } .maincontent .headertable td .headertablekey { } .maincontent .headertable td .headertablevalue { - font-weight: bold; + font-weight: bold; } .maincontent .loanstable { - margin: 10px auto 10px auto; - width: 80%; - - border-top: 1px solid #cdcdcd; - border-left: 1px solid #cdcdcd; - border-right: 1px solid #cdcdcd; - border-radius: 2px; - box-sizing: border-box; - -moz-box-sizing: border-box; - line-height: 32px; - outline: none; - - background-color: #fff; - width: 80%; - font-size: 15px; - font-weight: 300; - text-overflow: ellipsis; - - text-align: left; + margin: 10px auto 10px auto; + width: 80%; + + border-top: 1px solid #cdcdcd; + border-left: 1px solid #cdcdcd; + border-right: 1px solid #cdcdcd; + border-radius: 2px; + box-sizing: border-box; + -moz-box-sizing: border-box; + line-height: 32px; + outline: none; + + background-color: #fff; + /* background-color: red; */ + + width: 80%; + font-size: 15px; + font-weight: 300; + text-overflow: ellipsis; + + text-align: left; + + overflow-y: auto; + /* max-height: 400px; + + display: block; */ } +/* #loanstable { */ +/* max-height: 400px; + overflow-y: auto; + display: block; */ +/* background-color: red; */ +/* } */ + .maincontent .loanstable th { - background: #dadada; - padding: 0px 0px 0px 10px; + background: #dadada; + padding: 0px 0px 0px 10px; } .maincontent .loanstable td { - border-bottom: 1px solid #cdcdcd; - padding: 0px 10px 0px 10px; - font-size: 90%; + border-bottom: 1px solid #cdcdcd; + padding: 0px 10px 0px 10px; + font-size: 90%; } .maincontent .loanstable button { - background-color: transparent; - border: none; - color: #0000cc; - font-weight: 700; - cursor: pointer; + background-color: transparent; + border: none; + color: #0000cc; + font-weight: 700; + cursor: pointer; } .renewed { - color: green; - font-weight: bold; + color: green; + font-weight: bold; } .not-renewable { - color: red; - font-weight: bold; + color: red; + font-weight: bold; } /* The Modal (background) */ .modal { - display: none; /* Hidden by default */ - position: fixed; /* Stay in place */ - z-index: 1; /* Sit on top */ - left: 0; - top: 0; - width: 100%; /* Full width */ - height: 100%; /* Full height */ - overflow: auto; /* Enable scroll if needed */ - background-color: #909090; /* Fallback color */ - background-color: rgba(90, 90, 90, 0.9); /* Black w/ opacity */ + display: none; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 1; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: #909090; /* Fallback color */ + background-color: rgba(90, 90, 90, 0.9); /* Black w/ opacity */ } /* Modal Content/Box */ .modal-content { - background-color: #fefefe; - margin: 15% auto; /* 15% from the top and centered */ - padding: 20px; - border: 1px solid #888; - width: 30%; - border-radius: 10px; + background-color: #fefefe; + margin: 15% auto; /* 15% from the top and centered */ + padding: 20px; + border: 1px solid #888; + width: 30%; + border-radius: 10px; } .modalheaderdiv { - text-align: center; - font-weight: bold; - font-size: 120%; + text-align: center; + font-weight: bold; + font-size: 120%; } .modalclose { - padding: 10px 40px; + padding: 10px 40px; + + color: #ffffff; + font-weight: bold; + + border-radius: 5px; + border: 1px solid #909090; - color: #ffffff; - font-weight: bold; + background: #656565; + background: -webkit-linear-gradient(#808080, #505050); + background: -o-linear-gradient(#808080, #505050); + background: -moz-linear-gradient(#808080, #505050); + background: linear-gradient(#808080, #505050); - border-radius: 5px; - border: 1px solid #909090; - - background: #656565; - background: -webkit-linear-gradient(#808080, #505050); - background: -o-linear-gradient(#808080, #505050); - background: -moz-linear-gradient(#808080, #505050); - background: linear-gradient(#808080, #505050); - - cursor: pointer; + cursor: pointer; } .modalclose:hover { - - background: #404040; - background: -webkit-linear-gradient(#505050, #202020); - background: -o-linear-gradient(#505050, #202020); - background: -moz-linear-gradient(#505050, #202020); - background: linear-gradient(#505050, #202020); - + background: #404040; + background: -webkit-linear-gradient(#505050, #202020); + background: -o-linear-gradient(#505050, #202020); + background: -moz-linear-gradient(#505050, #202020); + background: linear-gradient(#505050, #202020); } /* The Close Button */ .close { - color: #aaa; - float: right; - font-size: 16px; - font-weight: bold; + color: #aaa; + float: right; + font-size: 16px; + font-weight: bold; } .close:hover, .close:focus { - color: black; - text-decoration: none; - cursor: pointer; + color: black; + text-decoration: none; + cursor: pointer; } - - diff --git a/images/vlericklogo.png b/images/vlericklogo.png new file mode 100644 index 0000000..079045d Binary files /dev/null and b/images/vlericklogo.png differ diff --git a/js/self-check.js b/js/self-check.js index 855b49b..b69ce5d 100644 --- a/js/self-check.js +++ b/js/self-check.js @@ -1,262 +1,468 @@ +var baseURL = window.location.origin; +console.log("baseURL", baseURL); + +var path = window.location.pathname.toLowerCase(); -var baseURL = "https://services.libis.be"; var libraryName = "RBIB"; +var institution = "kuleuven"; var circDesk = "DEFAULT_CIRC_DESK"; +// match exact pathnames +if (path === "/self-check-vlerick/") { + libraryName = "VBS"; + institution = "vlerick"; + circDesk = "ZU"; +} else if (path === "/self-check-vlerick-br/") { + libraryName = "BRU"; + institution = "vlerick"; + circDesk = "BZU"; +} + +console.log("libraryName", libraryName); +console.log("institution", institution); +console.log("circDesk", circDesk); function initiate() { - getModalBox(); - - $("#barcode").bind("keypress", function(e) { - var code = e.keyCode || e.which; - if(code == 13) { - loan(); - } - }); - - - $("#userid").bind("keypress", function(e) { - var code = e.keyCode || e.which; - if(code == 13) { - login(); - } - }); + getModalBox(); + ///////////////////////////////////////////////////////////////////////////////////////////// + // Add institution as a class to .toptoolbar + var topToolbar = document.querySelector(".toptoolbar"); + if (topToolbar) { + topToolbar.className = "toptoolbar " + institution; + // or topToolbar.classList.add(institution); + } + + // change logo dynamically too + var logoImg = document.querySelector(".logo img"); + if (logoImg && institution === "vlerick") { + logoImg.src = "images/vlericklogo.png"; + } else { + logoImg.src = "images/libisnewkuljr.png"; // default logo + } + + // change from blue to black background color + + var h1Title = document.querySelector(".maincontent .h1title"); + if (h1Title && institution === "vlerick") { + h1Title.classList.add("vlerickclass"); + } + + var h1Title = document.getElementById("scanboxtitle"); + if (h1Title && institution === "vlerick") { + h1Title.classList.add("vlerickclass"); + } + ///////////////////////////////////////////////////////////////////////////////////////////// + + $("#barcode").bind("keypress", function (e) { + var code = e.keyCode || e.which; + if (code == 13) { + loan(); + } + }); + + $("#userid").bind("keypress", function (e) { + var code = e.keyCode || e.which; + if (code == 13) { + login(); + } + }); } var modal; var span; var user = null; // User data to track login state - function getModalBox() { - - // Get the modal - modal = document.getElementById('myModal'); - $("#myModal").hide(); - - // Get the element that closes the modal - span = document.getElementsByClassName("close")[0]; - - // When the user clicks on (x), close the modal - span.onclick = function() { - $("#myModal").hide(); - } - - // When the user clicks anywhere outside of the modal, close it - /* - window.onclick = function(event) { - if (event.target == modal) { - $("#myModal").hide(); - } - } - */ + // Get the modal + modal = document.getElementById("myModal"); + $("#myModal").hide(); + + // Get the element that closes the modal + span = document.getElementsByClassName("close")[0]; + + // When the user clicks on (x), close the modal + span.onclick = function () { + $("#myModal").hide(); + }; } function returnToBarcode() { - $("#barcode").prop("disabled", false); - $("#myModal").hide(); - - $("#barcode").val(""); - $("#barcode").focus(); + $("#barcode").prop("disabled", false); + $("#myModal").hide(); + + $("#barcode").val(""); + $("#barcode").focus(); } var inactivityTime = function () { - var time; - var logoutTime = 30000; // 30 seconds + var time; + var logoutTime = 30000; // 30 seconds - function resetTimer() { - if (user) { // Only reset the timer if the user is logged in - clearTimeout(time); - time = setTimeout(logoutUser, logoutTime); - } + function resetTimer() { + if (user) { + // Only reset the timer if the user is logged in + clearTimeout(time); + time = setTimeout(logoutUser, logoutTime); } + } - // Events to reset the timer - window.onload = resetTimer; - document.onmousemove = resetTimer; - document.onkeypress = resetTimer; - document.ontouchstart = resetTimer; + // Events to reset the timer + window.onload = resetTimer; + document.onmousemove = resetTimer; + document.onkeypress = resetTimer; + document.ontouchstart = resetTimer; - // Logout function - function logoutUser() { - if (user) { // Only log out if the user is logged in - logout(); - returnToBarcode(); - user = null; - } + // Logout function + function logoutUser() { + if (user) { + // Only log out if the user is logged in + logout(); + returnToBarcode(); + user = null; } + } }; // Initialize the inactivity timer inactivityTime(); -var renewButtonText = 'RENEW' +var renewButtonText = "RENEW"; /* LOGIN */ function login() { - var loginid = $("#userid").val(); - if ((loginid != null) && (loginid != "")) { - - $("#userid").prop("disabled", true); - $("#loginerror").addClass("hide"); - - $("#modalheader").text("loading data, please wait..."); - $("#myModal").show(); - $(".close").hide(); - + var loginid = $("#userid").val(); + if (loginid != null && loginid != "") { + $("#userid").prop("disabled", true); + $("#loginerror").addClass("hide"); + + $("#modalheader").text("loading data, please wait..."); + $("#myModal").show(); + $(".close").hide(); + + $.ajax({ + type: "GET", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + $("#userid").val() + + "?expand=loans,requests,fees&format=json&limit=100", // added limit to 100 (default == 10) + contentType: "text/plain", + dataType: "json", + crossDomain: true, + }) + .done(function (data) { + user = data; + // Prepare scan box + $("#scanboxtitle").text( + "Welcome " + data.first_name + " " + data.last_name, + ); + $("#userloans").text(data.loans.value); + $("#userrequests").text(data.requests.value); + $("#userfees").text("€ " + data.fees.value); + + // Add Vlerick styling after loggin + var h1Title = document.querySelector(".maincontent .h1title"); + if (h1Title && institution === "vlerick") { + h1Title.classList.add("vlerickclass"); + } + var h1Title = document.getElementById("scanboxtitle"); + if (h1Title && institution === "vlerick") { + h1Title.classList.add("vlerickclass"); + } + $("#loanstable").find("tr:gt(0)").remove(); + + // Fetch loan details + + // let loanUrl = data.loans.link; + // loanUrl += (loanUrl.includes("?") ? "&" : "?") + "limit=100"; + + let loanUrl = data.loans.link; + if (!loanUrl.includes("/" + institution + "/")) { + loanUrl = loanUrl.replace("/almaws/", "/" + institution + "/almaws/"); + } + loanUrl += (loanUrl.includes("?") ? "&" : "?") + "limit=100"; + $.ajax({ - type: "GET", - url: baseURL + "/almaws/v1/users/" + $("#userid").val() + "?expand=loans,requests,fees&format=json", - contentType: "text/plain", - dataType: "json", - crossDomain: true - - }).done(function(data) { - user = data; - // Prepare scan box - $("#scanboxtitle").text("Welcome " + data.first_name + " " + data.last_name); - $("#userloans").text(data.loans.value); - $("#userrequests").text(data.requests.value); - $("#userfees").text("€ " + data.fees.value); - - $("#loanstable").find("tr:gt(0)").remove(); - - // Fetch loan details - $.ajax({ - type: "GET", - url: data.loans.link , - contentType: "text/plain", - dataType: "json", - crossDomain: true - }).done(function(loanData) { - // Iterate through loans and append to table - loanData.item_loan.forEach(function(loan) { - var dueDate = new Date(loan.due_date); - var dueDateText = (dueDate.getDate() ) + "/" + (dueDate.getMonth() + 1) + "/" + dueDate.getFullYear(); - $("#loanstable").append("" + loan.title + "" + dueDateText + ""); - returnToBarcode(); - }); - }).fail(function(jqxhr, textStatus, error) { - console.log(jqxhr.responseText); + type: "GET", + url: loanUrl, + contentType: "text/plain", + dataType: "json", + crossDomain: true, + }) + .done(function (loanData) { + // Iterate through loans and append to table + loanData.item_loan.forEach(function (loan) { + var dueDate = new Date(loan.due_date); + var dueDateText = + dueDate.getDate() + + "/" + + (dueDate.getMonth() + 1) + + "/" + + dueDate.getFullYear(); + $("#loanstable").append( + "" + + loan.title + + "" + + dueDateText + + "", + ); + returnToBarcode(); }); - - $("#loginbox").addClass("hide"); - $("#scanbox").toggleClass("hide"); - - $("#barcode").focus(); - - }).fail(function(jqxhr, textStatus, error) { - $("#loginerror").toggleClass("hide"); + }) + .fail(function (jqxhr, textStatus, error) { console.log(jqxhr.responseText); - - }).always(function() { - $("#userid").prop("disabled", false); - $("#myModal").hide(); - }); - } + }); + + $("#loginbox").addClass("hide"); + $("#scanbox").toggleClass("hide"); + + $("#barcode").focus(); + }) + .fail(function (jqxhr, textStatus, error) { + $("#loginerror").toggleClass("hide"); + console.log(jqxhr.responseText); + }) + .always(function () { + $("#userid").prop("disabled", false); + $("#myModal").hide(); + }); + } } function loaduser(data) { - alert(data); + alert(data); } function loan() { - - var barcode = $("#barcode").val(); - if ((barcode != null) && (barcode != "")) { - - $("#modalheader").text("processing request, please wait..."); - $("#myModal").show(); - $(".close").hide(); - - $("#barcode").prop("disabled", true); - - $.ajax({ - type: "POST", - url: baseURL + "/almaws/v1/users/" + user.primary_id + "/loans?user_id_type=all_unique&item_barcode=" + $("#barcode").val(), - contentType: "application/xml", - data: "" + circDesk + "" + libraryName + "", - dataType: "xml" - }).done(function(data){ - - var dueDate = new Date($(data).find("due_date").text()); - var dueDateText = (parseInt(dueDate.getDate() + "/" + dueDate.getMonth()) + 1) + "/" + dueDate.getFullYear(); - $("#loanstable").append("" + $(data).find("title").text() + "" + dueDateText + ""); - returnToBarcode(); - }).fail(function(jqxhr, textStatus, error) { - console.log(jqxhr.responseText); - $("#modalheader").text(""); - $("#modalheader").append("item not avaiable for loan.

please see the reference desk for more information

"); - $("#barcodeerrorbutton").focus(); - - $(".close").show(); - - $("#barcode").val(""); - - }).always(function() { - - }); - - } -} -function renewLoan(loanId) { - const userId = user.primary_id; - $("#modalheader").text("processing renewal, please wait..."); + var barcode = $("#barcode").val(); + if (barcode != null && barcode != "") { + $("#modalheader").text("processing request, please wait..."); $("#myModal").show(); $(".close").hide(); + + $("#barcode").prop("disabled", true); + $.ajax({ - type: "POST", - url: baseURL + "/almaws/v1/users/" + userId + "/loans/" + loanId + "?op=renew", - contentType: "application/xml", - data: "" + circDesk + "" + libraryName + "", - dataType: "xml" - }).done(function(data) { - // Make a new GET request to fetch the updated loan data to fix bug of not seeing immediatly - $.ajax({ - type: "GET", - url: baseURL + "/almaws/v1/users/" + userId + "/loans/" + loanId, - contentType: "application/json", - dataType: "json" - }).done(function(updatedLoanData) { - var updatedDueDate = new Date(updatedLoanData.due_date); - var updatedDueDateText = `${updatedDueDate.getDate()}/${updatedDueDate.getMonth() + 1}/${updatedDueDate.getFullYear()}`; - // Update the due date in the table - var dueDateCell = $("#loan-" + loanId + " td:nth-child(2)"); - dueDateCell.text(updatedDueDateText); - - // if 401193 value for last renew status -> means that renewd succes, else not succes renewed for whatever reason - var succesfullyRenewedValueCode = '401193;' - var LastRenewedValueCode = updatedLoanData?.last_renew_status?.value - - var renewCell = $("#loan-" + loanId + " td:nth-child(3)"); - if(LastRenewedValueCode == succesfullyRenewedValueCode){ - renewCell.text('RENEWED'); - renewCell.removeClass('not-renewable').addClass('renewed'); - } else { - renewCell.text('NOT RENEWABLE'); - renewCell.removeClass('renewed').addClass('not-renewable'); - } - $("#myModal").hide(); - }).fail(function(error) { - console.error('Error fetching updated loan data:', error); - alert('Failed to fetch updated loan data'); - $("#myModal").hide(); + type: "POST", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + user.primary_id + + "/loans?user_id_type=all_unique&item_barcode=" + + $("#barcode").val(), + contentType: "application/xml", + data: + "" + + circDesk + + "" + + libraryName + + "", + dataType: "xml", + }) + .done(function (data) { + // Extract loanId from the POST response + var loanId = $(data).find("loan_id").text(); + if (!loanId) { + console.error("Loan ID is undefined"); + alert("Failed to retrieve loan ID"); + $("#myModal").hide(); + returnToBarcode(); + return; + } + // var dueDate = new Date($(data).find("due_date").text()); + // var dueDateText = (parseInt(dueDate.getDate() + "/" + dueDate.getMonth()) + 1) + "/" + dueDate.getFullYear(); + // $("#loanstable").append("" + $(data).find("title").text() + "" + dueDateText + ""); + // returnToBarcode(); + fetchUserDetailsAndLoans(); + }) + .fail(function (jqxhr, textStatus, error) { + console.log(jqxhr.responseText); + $("#modalheader").text(""); + $("#modalheader").append( + `Something went wrong.

${ + libraryName === "VBS" + ? "Contact someone from reception services for help." + : "Please consult the library information desk for more information" + }

`, + ); + $("#barcodeerrorbutton").focus(); + + $(".close").show(); + + $("#barcode").val(""); + }) + .always(function () {}); + } +} + +function fetchUserDetailsAndLoans() { + $.ajax({ + type: "GET", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + $("#userid").val() + + "?expand=loans,requests,fees&format=json&limit=100", + contentType: "text/plain", + dataType: "json", + crossDomain: true, + }) + .done(function (data) { + user = data; + $("#scanboxtitle").text( + "Welcome " + data.first_name + " " + data.last_name, + ); + $("#userloans").text(data.loans.value); + $("#userrequests").text(data.requests.value); + $("#userfees").text("€ " + data.fees.value); + // add Vlerick styling after + var h1Title = document.querySelector(".maincontent .h1title"); + if (h1Title && institution === "vlerick") { + h1Title.classList.add("vlerickclass"); + } + + $("#loanstable").find("tr:gt(0)").remove(); + + $.ajax({ + type: "GET", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + user.primary_id + + "/loans?limit=100", + contentType: "text/plain", + dataType: "json", + crossDomain: true, + }) + .done(function (loanData) { + loanData.item_loan.forEach(function (loan) { + var dueDate = new Date(loan.due_date); + var dueDateText = `${dueDate.getDate()}/${ + dueDate.getMonth() + 1 + }/${dueDate.getFullYear()}`; + $("#loanstable").append( + "" + + loan.title + + "" + + dueDateText + + "", + ); + returnToBarcode(); + }); + }) + .fail(function (jqxhr, textStatus, error) { + console.log(jqxhr.responseText); }); - - }).fail(function(error) { - console.error('Error:', error); - alert('Failed to renew loan'); - $("#myModal").hide(); + + $("#barcode").focus(); + }) + .fail(function (jqxhr, textStatus, error) { + console.log(jqxhr.responseText); + }); +} +function renewLoan(loanId) { + const userId = user.primary_id; + $("#modalheader").text("processing renewal, please wait..."); + $("#myModal").show(); + $(".close").hide(); + $.ajax({ + type: "POST", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + userId + + "/loans/" + + loanId + + "?op=renew", + contentType: "application/xml", + data: + "" + + circDesk + + "" + + libraryName + + "", + dataType: "xml", + }) + .done(function (data) { + // Make a new GET request to fetch the updated loan data to fix bug of not seeing immediatly + $.ajax({ + type: "GET", + url: + baseURL + + "/" + + institution + + "/almaws/v1/users/" + + userId + + "/loans/" + + loanId, + contentType: "application/json", + dataType: "json", + }) + .done(function (updatedLoanData) { + var updatedDueDate = new Date(updatedLoanData.due_date); + var updatedDueDateText = `${updatedDueDate.getDate()}/${ + updatedDueDate.getMonth() + 1 + }/${updatedDueDate.getFullYear()}`; + // Update the due date in the table + var dueDateCell = $("#loan-" + loanId + " td:nth-child(2)"); + dueDateCell.text(updatedDueDateText); + + // if 401193 value for last renew status -> means that renewd succes, else not succes renewed for whatever reason + var succesfullyRenewedValueCode = "401193;"; + var LastRenewedValueCode = updatedLoanData?.last_renew_status?.value; + + var renewCell = $("#loan-" + loanId + " td:nth-child(3)"); + if (LastRenewedValueCode == succesfullyRenewedValueCode) { + renewCell.text("RENEWED"); + renewCell.removeClass("not-renewable").addClass("renewed"); + } else { + renewCell.text("NOT RENEWABLE"); + renewCell.removeClass("renewed").addClass("not-renewable"); + } + $("#myModal").hide(); + }) + .fail(function (error) { + console.error("Error fetching updated loan data:", error); + alert("Failed to fetch updated loan data"); + $("#myModal").hide(); + }); + }) + .fail(function (error) { + console.error("Error:", error); + alert("Failed to renew loan"); + $("#myModal").hide(); }); } function logout() { - user = null; - $("#userid").val(""); - $("#loginbox").toggleClass("hide"); - $("#scanbox").toggleClass("hide"); - $("#userid").focus(); + user = null; + $("#userid").val(""); + $("#loginbox").toggleClass("hide"); + $("#scanbox").toggleClass("hide"); + $("#userid").focus(); } -$( document ).ready(function() { - $( "#userid" ).focus(); - }); \ No newline at end of file +$(document).ready(function () { + $("#userid").focus(); +}); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..3625c5e --- /dev/null +++ b/package-lock.json @@ -0,0 +1,6 @@ +{ + "name": "self-check", + "lockfileVersion": 3, + "requires": true, + "packages": {} +} diff --git a/self-check.html b/self-check.html index 71baeff..cd837e5 100644 --- a/self-check.html +++ b/self-check.html @@ -1,90 +1,118 @@ - - + + - - - - - - - - KU Leuven - Self Check - + + - - - - -
- -
-
- -
-
Self-Check Service
-

-
-
Please scan your user card ID:
-
-
Inccorect ID, please try again
- -

- -
-
-

-
- -
-
-
-
- - - - - - - - -
Loans: Requests: Fines & Fees: 
-
-

-
Please scan the item barcode
-
- -
-
-
- - - - - + + + - -
TitleDue Date
-
-
-

-
-

+ KU Leuven - Check out + - - + +
+ +
+
+
+
Check-out Service
+

+
+
Please scan your user card ID:
+
+
+ Inccorect ID, please try again
+
+ +

+ +
+
+

+
- +
+
+
+
+ + + + + + + + +
+ Loans:  + + Requests:  + + Fines & Fees:  + + +
+
+

+
Please scan the item barcode
+
+ +
+
+
+ + + + + + +
TitleDue Date
+
+
+

+
+

+ + + +