Owen Leonard
927a62ba6f
This patch modifies the template, JS, and CSS for the staff interface catalog search results in order to gracefully handle multiple cover images. The changed version loops through any cover images which might be embedded and checks that they are successfully loaded. Only successfully-loaded images are shown. Only the first image is shown, and the others can be "paged through" using generated navigation controls. To test, apply the page and rebuild the staff client CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). Enable multiple cover image services. The patch was developed with these services available: - Amazon - Local cover images (including multiple local cover images) - Coce (serving up Amazon, Google, and OpenLibrary images) - Images from the CustomCoverImages preference Perform a variet of searches and confirm that cover images are displaying correctly, whether there be 0, 1, 2, or more covers available for each. Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
50 lines
1.7 KiB
JavaScript
50 lines
1.7 KiB
JavaScript
if (KOHA === undefined || !KOHA) { var KOHA = {}; }
|
|
|
|
|
|
/**
|
|
* A namespace for Coce cover images cache
|
|
*/
|
|
KOHA.coce = {
|
|
|
|
/**
|
|
* Search all:
|
|
* <div title="biblionumber" id="isbn" class="coce-thumbnail"></div>
|
|
* or
|
|
* <div title="biblionumber" id="isbn" class="coce-thumbnail-preview"></div>
|
|
* and run a search with all collected isbns to coce cover service.
|
|
* The result is asynchronously returned, and used to append <img>.
|
|
*/
|
|
getURL: function(host, provider) {
|
|
var ids = [];
|
|
$("[id^=coce-thumbnail]").each(function() {
|
|
var id = $(this).attr("class"); // id=isbn
|
|
if (id !== '') { ids.push(id); }
|
|
});
|
|
if (ids.length == 0) return;
|
|
ids = ids.join(',');
|
|
var coceURL = host + '/cover?id=' + ids + '&provider=' + provider;
|
|
$.ajax({
|
|
url: coceURL,
|
|
dataType: 'jsonp',
|
|
success: function(urlPerID) {
|
|
for (var id in urlPerID) {
|
|
var url = urlPerID[id];
|
|
$("[id^=coce-thumbnail]." + id).each(function() {
|
|
var img = document.createElement("img");
|
|
img.src = url;
|
|
img.alt = "Cover image";
|
|
img.onload = function() {
|
|
// image dimensions can't be known until image has loaded
|
|
if (img.height == 1 && img.width == 1) {
|
|
$(this).closest(".coce-coverimg").remove();
|
|
}
|
|
};
|
|
$(this).html(img);
|
|
});
|
|
}
|
|
},
|
|
|
|
});
|
|
}
|
|
|
|
};
|