Owen Leonard
6b6cea9d64
This patch modifies the template, JS, and CSS for the bibliographic detail page 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 View a variety of titles and confirm that the cover images are displaying correctly, whether there be 0, 1, 2, or more covers available. Signed-off-by: Lucas Gass <lucas@bywatersolutions.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, newWindow) {
|
|
var ids = [];
|
|
$("[id^=coce-thumbnail]").each(function(i) {
|
|
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).remove();
|
|
}
|
|
};
|
|
$(this).html(img);
|
|
});
|
|
}
|
|
},
|
|
|
|
});
|
|
}
|
|
|
|
};
|