From: Galen Charlton Date: Fri, 15 Jun 2018 16:16:31 +0000 (-0400) Subject: better syncing of cart state X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=6f2b13d546bf326607bd5e4e009a7b4ea7994ff5;p=working%2FEvergreen.git better syncing of cart state This patch improves how the display of the cart size and selected records are handled when the back (and forward) buttons are used, and embeds record_selectors.js on all pages. It also: * adds more bullet-proofing of element existance in record_selectors.js * adds an /eg/opac/api/mylist/retrieve API --- diff --git a/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader.pm b/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader.pm index df320a63ee..09afe3c0b6 100644 --- a/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader.pm +++ b/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader.pm @@ -133,6 +133,7 @@ sub load { $path =~ /opac\/my(opac\/lists|list)/ || $path =~ m!opac/api/mylist!; + return $self->load_api_mylist_retrieve if $path =~ m|opac/api/mylist/retrieve|; return $self->load_api_mylist_add if $path =~ m|opac/api/mylist/add|; return $self->load_api_mylist_delete if $path =~ m|opac/api/mylist/delete|; diff --git a/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader/Container.pm b/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader/Container.pm index 07f1aabe73..d17c0e2ad1 100644 --- a/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader/Container.pm +++ b/Open-ILS/src/perlmods/lib/OpenILS/WWW/EGCatLoader/Container.pm @@ -73,6 +73,26 @@ sub fetch_mylist { return ($cache_key, $list, $marc_xml); } +sub load_api_mylist_retrieve { + my $self = shift; + + # this has the effect of instantiating an empty one if need be + my ($cache_key, $list) = $self->fetch_mylist(0, 1); + + $self->ctx->{json_response} = { + mylist => [ map { 0 + $_ } @$list ], # force integers + }; + $self->ctx->{json_reponse_cookie} = + $self->cgi->cookie( + -name => (ref $self)->COOKIE_CART_CACHE, + -path => '/', + -value => ($cache_key) ? $cache_key : '', + -expires => ($cache_key) ? undef : '-1h' + ); + + return Apache2::Const::OK; +} + # Adds a record (by id) to My List, creating a new anon cache + list if necessary. sub load_mylist_add { diff --git a/Open-ILS/src/templates/opac/parts/js.tt2 b/Open-ILS/src/templates/opac/parts/js.tt2 index a1dae3da4f..2fdf7ba380 100644 --- a/Open-ILS/src/templates/opac/parts/js.tt2 +++ b/Open-ILS/src/templates/opac/parts/js.tt2 @@ -68,9 +68,7 @@ [%- END %] -[%- IF ctx.page == 'rresult' %] -[%-END %] [% IF ctx.page == 'place_hold' %] diff --git a/Open-ILS/web/js/ui/default/opac/record_selectors.js b/Open-ILS/web/js/ui/default/opac/record_selectors.js index 0a6439eedb..327b7a0232 100644 --- a/Open-ILS/web/js/ui/default/opac/record_selectors.js +++ b/Open-ILS/web/js/ui/default/opac/record_selectors.js @@ -2,13 +2,54 @@ var rec_selector_block = document.getElementById("record_selector_block"); var rec_selectors = document.getElementsByClassName("result_record_selector"); + var record_cart_count_el = document.getElementById('record_cart_count'); + var selected_records_count_el = document.getElementById('selected_records_count'); + var select_all_records_el = document.getElementById('select_all_records'); + var clear_selected_records_el = document.getElementById('clear_selected_records'); var mylist = []; + function initialize() { + var req = new window.XMLHttpRequest(); + req.open('GET', '/eg/opac/api/mylist/retrieve'); + if (('responseType' in req) && (req.responseType = 'json')) { + req.onload = function (evt) { + var result = req.response; + handleUpdate(result); + syncPageState(); + } + } else { + // IE 10/11 + req.onload = function (evt) { + var result = JSON.parse(req.responseText); + handleUpdate(result); + syncPageState(); + } + } + req.send(); + } + initialize(); + + function syncPageState() { + [].forEach.call(rec_selectors, function(el) { + el.checked = mylist.includes(parseInt(el.value)); + if (el.checked) { + adjustLegacyControlsVis('checked', el.value); + } else { + adjustLegacyControlsVis('unchecked', el.value); + } + toggleRowHighlighting(el); + }); + } + function handleUpdate(result) { if (result) { mylist = result.mylist; - document.getElementById('selected_records_count').innerHTML = mylist.length; - document.getElementById('record_cart_count').innerHTML = mylist.length; + if (selected_records_count_el) { + selected_records_count_el.innerHTML = mylist.length; + } + if (record_cart_count_el) { + record_cart_count_el.innerHTML = mylist.length; + } checkMaxCartSize(); } } @@ -40,11 +81,11 @@ } function adjustLegacyControlsVis(op, rec) { - if (op == 'add') { + if (op == 'add' || op == 'checked') { var t; if (t = document.getElementById('mylist_add_' + rec)) t.classList.add('hidden'); if (t = document.getElementById('mylist_delete_' + rec)) t.classList.remove('hidden'); - } else { + } else if (op == 'delete' || op == 'unchecked') { if (t = document.getElementById('mylist_add_' + rec)) t.classList.remove('hidden'); if (t = document.getElementById('mylist_delete_' + rec)) t.classList.add('hidden'); } @@ -65,20 +106,19 @@ } function checkMaxCartSize() { - if ((typeof max_cart_size === 'undefined') || !max_cart_size) return; - var current_size = parseInt(document.getElementById('selected_records_count').innerHTML); + if ((typeof max_cart_size === 'undefined') || !max_cart_size || !mylist.length) return; + var alertel = document.getElementById('hit_selected_record_limit'); [].forEach.call(rec_selectors, function(el) { - if (!el.checked) el.disabled = (current_size >= max_cart_size); + if (!el.checked) el.disabled = (mylist.length >= max_cart_size); }); - var alertel = document.getElementById('hit_selected_record_limit'); - if (current_size >= max_cart_size) { - alertel.classList.remove('hidden'); - if (!document.getElementById('select_all_records').checked) { - document.getElementById('select_all_records').disabled = true; + if (mylist.length >= max_cart_size) { + if (alertel) alertel.classList.remove('hidden'); + if (select_all_records_el && !select_all_records_el.checked) { + select_all_records_el.disabled = true; } } else { - alertel.classList.add('hidden'); - document.getElementById('select_all_records').disabled = false; + if (alertel) alertel.classList.add('hidden'); + if (select_all_records_el) select_all_records_el.disabled = false; } } @@ -93,15 +133,14 @@ mungeList('delete', this.value); adjustLegacyControlsVis('delete', this.value); } - toggleRowHighlighting(this); + toggleRowHighlighting(el); }, false); el.classList.remove("hidden"); if (!el.checked) all_checked = false; }); - if (all_checked) { - document.getElementById('select_all_records').checked = true; + if (rec_selectors.length && all_checked && select_all_records_el) { + select_all_records_el.checked = true; } - checkMaxCartSize(); function deselectSelectedOnPage() { var to_del = []; @@ -118,31 +157,35 @@ } } - document.getElementById('select_all_records').addEventListener('click', function() { - if (this.checked) { - // adding - var to_add = []; - [].forEach.call(rec_selectors, function(el) { - if (!el.checked) { - el.checked = true; - adjustLegacyControlsVis('add', el.value); - toggleRowHighlighting(el); - to_add.push(el.value); + if (select_all_records_el) { + select_all_records_el.addEventListener('click', function() { + if (this.checked) { + // adding + var to_add = []; + [].forEach.call(rec_selectors, function(el) { + if (!el.checked) { + el.checked = true; + adjustLegacyControlsVis('add', el.value); + toggleRowHighlighting(el); + to_add.push(el.value); + } + }); + if (to_add.length > 0) { + mungeList('add', to_add); } - }); - if (to_add.length > 0) { - mungeList('add', to_add); + } else { + // deleting + deselectSelectedOnPage(); } - } else { - // deleting - deselectSelectedOnPage(); - } - }); + }); + } - document.getElementById('clear_selected_records').addEventListener('click', function() { - deselectSelectedOnPage(); - document.getElementById('select_all_records').checked = false; - }); + if (clear_selected_records_el) { + clear_selected_records_el.addEventListener('click', function() { + deselectSelectedOnPage(); + if (select_all_records_el) select_all_records_el.checked = false; + }); + } })();