Attachment #126507 for bug #28180

View | Details | Raw Unified | Return to bug 28180
Collapse All | Expand All




    width: 75px;
}

.bookcover {
    float: left;
    margin: 0;
    padding: 0;
    text-align: center;

    .no-image {
        margin-bottom: 10px;

    }
}

#biblio-cover-slider {
    border: 1px solid #b9d8d9;
    border-radius: 3px;
    margin: 5px;
    padding: 10px 5px 5px 5px;
    min-height: 175px;
}

.cover-slides {
    background: #FFF url("../img/spinner-small.gif") center center no-repeat;

    .hint {
        font-size: 90%;
        padding: .5em 0;
    }

    a {
        &.nav-active {
            &:link,
            &:visited {
                color: #85ca11;
            }
        }
    }
}

td {
    &.bookcover {
        background: #FFF url("../img/spinner-small.gif") center center no-repeat;
        min-width: 120px;
        text-align: center;
    }

    .cover-slides {
        background: transparent none;
        border: 0;
        margin: 0;
        min-height: unset;
        padding: 0;
    }
}

.cover-image {
    display: none;

    img {
        height: auto;
        max-width: 100%;
    }
}

.cover-nav {
    display: inline-block;
    padding: 3px 4px;
}

div {
    &.required_label {
        display: none;

Lines 262-272 $.widget.bridge('uitooltip', $.ui.tooltip); Link Here

(-)a/koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-bottom.inc (-5 lines)
262		262
263	[% IF OPACLocalCoverImages %]	263	[% IF OPACLocalCoverImages %]
264	[% Asset.js("js/localcovers.js") \| $raw %]	264	[% Asset.js("js/localcovers.js") \| $raw %]
265	<script>
266
267	var NO_LOCAL_JACKET = _("No cover image available");
268
269	</script>
270	[% END %]	265	[% END %]
271		266
272	[% IF ( BakerTaylorEnabled ) %]	267	[% IF ( BakerTaylorEnabled ) %]




    [% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]
        [% Asset.css("lib/verovio/midiplayer.css") | $raw %]
    [% END %]
    [% Asset.css("lib/Chocolat/css/chocolat.css") | $raw %]
</head>
[% BLOCK cssinclude %][% END %]
[% INCLUDE 'bodytag.inc' bodyid='opac-detail' bodyclass='scrollto' %]

            <div class="col-lg-9">
                <div id="catalogue_detail_biblio" class="maincontent" data-biblionumber="[% biblio.biblionumber | html %]">

                    <div class="bookcover">
                        [% IF ( biblio.title ) %]
                            [% img_title = biblio.title %]
                        [% ELSE %]
                            [% img_title = biblio.biblionumber %]
                        [% END %]

                        <div id="biblio-cover-slider" class="cover-slider">
                            [% IF ( OPACLocalCoverImages ) %]
                                [% IF localimages.count %]
                                    [% FOREACH image IN localimages %]
                                        <div class="cover-image local-coverimg">
                                            <a href="/cgi-bin/koha/opac-image.pl?imagenumber=[% image.imagenumber | uri %]" title="Local cover image">
                                                <img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&amp;imagenumber=[% image.imagenumber | uri %]" alt="Local cover image" data-link="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblionumber | uri %]&amp;imagenumber=[% image.imagenumber | uri %]" />
                                            </a>
                                            <div class="hint">Local cover image</div>
                                        </div>
                                    [% END %]
                                [% END %]
                            [% END %]
                            <img src="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn | html %].01.MZZZZZZZ.jpg" alt="Cover image" /></a>
                        [% END %]

                            [% IF ( OPACAmazonCoverImages && normalized_isbn) %]
                                <div class="cover-image" id="amazon-bookcoverimg">
                                    <a href="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn | uri %].01.LZZZZZZZ.jpg" title="Amazon cover image">
                                        <img src="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn | uri %].01.MZZZZZZZ.jpg" alt="Amazon cover image" data-link="http://www.amazon[% AmazonTld | uri %]/gp/reader/[% normalized_isbn | uri %][% AmazonAssocTag | uri %]#reader-link"/>
                                    </a>
                                    <div class="hint">Image from Amazon.com</div>
                                </div>
                            [% END %]
                        [% END %]

                            [% IF ( Koha.Preference('OPACCoce') && Koha.Preference('CoceProviders') && normalized_isbn ) %]
                                [% coce_id = normalized_ean || normalized_isbn %]
                                <div class="cover-image" id="coce-coverimg">
                                    [% IF ( coce_id ) %]
                                        <a title="Image from Coce" class="[% coce_id | html %]" id="coce-thumbnail-preview"></a>
                                    [% END %]
                                    <div class="hint">Image from Coce</div>
                                </div>
                            <div title="[% img_title | html %]" class="[% normalized_isbn | html %]" id="openlibrary-thumbnail-preview"></div>
                        [% END %]
                        [% bt_id = ( normalized_upc || normalized_isbn ) %]
                        [% IF ( BakerTaylorEnabled && bt_id ) %]
                            [% IF BakerTaylorBookstoreURL %]
                                [% IF ( OPACURLOpenInNewWindow ) %]
                                    <a href="https://[% BakerTaylorBookstoreURL | url %][% bt_id | url %]" target="_blank" rel="noreferrer"><img alt="See Baker &amp; Taylor" src="[% BakerTaylorImageURL | html %][% bt_id | html %]" /></a>
                                [% ELSE %]
                                    <a href="https://[% BakerTaylorBookstoreURL | url %][% bt_id | url %]"><img alt="See Baker &amp; Taylor" src="[% BakerTaylorImageURL | html %][% bt_id | html %]" /></a>
                                [% END %]
                            [% ELSE %]
                                <img alt="See Baker &amp; Taylor" src="[% BakerTaylorImageURL | html %][% bt_id | html %]" />
                            [% END %]

                            [% IF Koha.Preference('OPACCustomCoverImages') && Koha.Preference('CustomCoverImagesURL') %]
                                [% SET custom_cover_image_url = biblio.custom_cover_image_url %]
                                [% IF custom_cover_image_url %]
                                    <div class="cover-image" id="custom-coverimg">
                                        <a class="custom_cover_image" href="[% custom_cover_image_url | url %]" title="Custom cover image">
                                            <img id="custom-img" alt="Custom cover image" src="[% custom_cover_image_url | url %]" />
                                        </a>
                                        <div class="hint">Custom cover image</div>
                                    </div>
                                [% END %]
                            [% END %]
                        </div> <!-- /.cover-slider -->

                    </div><!-- / .bookcover -->

                    <abbr class="unapi-id" title="koha:biblionumber:[% biblio.biblionumber | html %]"><!-- unAPI --></abbr>
                    [% IF ( ocoins ) # COinS / Openurl %]

                            <div id="images">
                                <p>Click on an image to view it in the image viewer</p>
                                [% FOREACH image IN localimages %]
                                    <a href="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblio.biblionumber | uri %]&amp;imagenumber=[% image.imagenumber | uri %]" title="Local cover image">
                                        <img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&amp;imagenumber=[% image.imagenumber | uri %]" alt="Local cover image" />
                                    </a>
                                [% END %]
                            </div><!-- / #images -->
                        [% END # / IF OPACLocalCoverImages && localimages.size %]


                [% IF Koha.Preference('OPACLocalCoverImages') && ( tab == 'holdings' && itemloop_has_images || tab == 'otherholdings' && otheritemloop_has_images ) %]
                    <td class="cover">
                        <div class="bookcover">
                            <div class="cover-slider">
                                [% FOR image IN ITEM_RESULT.cover_images %]
                                    <div class="cover-image local-coverimg">
                                        <a href="/cgi-bin/koha/opac-image.pl?itemnumber=[% image.itemnumber | uri %]&amp;imagenumber=[% image.imagenumber | uri %]" title="Local cover image">
                                            <img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&amp;imagenumber=[% image.imagenumber | uri %]" alt="Local cover image" />
                                        </a>
                                    </div>
                                [% END %]
                            </div>
                        </div>
                    </td>
                [% END %]


        [% Asset.js("lib/kjua/kjua.min.js") | $raw %]
    [% END %]

    [% Asset.js("lib/Chocolat/js/chocolat.js") | $raw %]

    [% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]
        <script>
            var interface = "[% interface | html %]";

                    $("#highlight_toggle_off").show().click(function() {highlightOff(); return false;});
                [% END %]
            [% END %]

                KOHA.Google.GetCoverFromIsbn([% covernewwindow | html %]);
            [% END %]
            [% IF ( Koha.Preference('OpacCoce') && Koha.Preference('CoceProviders') ) %]
                KOHA.coce.getURL('[% Koha.Preference('CoceHost') | html %]', '[% Koha.Preference('CoceProviders') | html %]',[% covernewwindow | html %]);
            [% END %]

        function verify_images() {
            // Loop over each container in the template which contains covers
            $(".cover-slider").each(function(){
                var lightbox_descriptions = [];
                $(this).find(".cover-image").each( function( index ){
                    var div = $(this);
                    // Find the image in the container
                    var img = div.find("img")[0];
                    if( $(img).length > 0 ){
                        var description = "";
                        if( (img.complete != null) && (!img.complete) || img.naturalHeight == 0 ){
                            // No image loaded in the container. Remove the slide
                            div.remove();
                        } else {
                            // All slides start hidden. If this is the first one, show it.
                            if( index == 0 ){
                                div.show();
                            }
                            // Check if Amazon image is present
                            if ( div.attr("id") == "amazon-bookcoverimg"  ) {
                                w = img.width;
                                h = img.height;
                                if ((w == 1) || (h == 1)) {
                                    // Amazon returned single-pixel placeholder
                                    // Remove the container
                                    div.remove();
                                } else {
                                    lightbox_descriptions.push(_("Amazon cover image (<a href='%s'>see the original image</a>)").format($(img).data('link')));
                                }
                            } else if( div.attr("id") == "custom-coverimg" ){
                                if ( (img.complete != null) && (!img.complete) || img.naturalHeight == 0 ) {
                                    // No image was loaded via the CustomCoverImages system preference
                                    // Remove the container
                                    div.remove();
                                } else {
                                    lightbox_descriptions.push("Custom cover image");
                                }
                            } else if( div.attr("id") == "coce-coverimg" ){
                                // Identify which service's image is being loaded by Coce
                                var coce_description;
                                if( $(img).attr("src").indexOf('amazon.com') >= 0 ){
                                    coce_description = ("Coce image from Amazon.com");
                                } else if( $(img).attr("src").indexOf('google.com') >= 0 ){
                                    coce_description = _("Coce image from Google Books");
                                } else if( $(img).attr("src").indexOf('openlibrary.org') >= 0 ){
                                    coce_description = _("Coce image from Open Library");
                                }
                                div.find(".hint").html(coce_description);
                                lightbox_descriptions.push(coce_description);
                            } else if ( div.attr("id") == "adlibris-coverimg" ){
                                lightbox_descriptions.push(_("Image from Adlibris (<a href='%s'>see the original image</a>)").format($(img).data('link')));
                            } else if ( div.attr("class") == "cover-image local-coverimg" ) {
                                lightbox_descriptions.push(_("Local cover image"));
                            } else {
                                console.log("Source of the image cannot be guessed.")
                            }
                        }
                    }
                });

                // Lightbox for cover images
                Chocolat(this.querySelectorAll('.cover-image a'), {
                    description: function(){
                        return lightbox_descriptions[this.settings.currentImageIndex];
                    }
                });

            });

            $(".cover-slider").each(function(){
                var coverSlide = this;
                var coverImages = $(this).find(".cover-image");
                if( coverImages.length > 1 ){
                    coverImages.each(function( index ){
                        // If more that one image is present, add a navigation link
                        // for activating the slide
                        var covernav = $("<a href=\"#\" data-num=\"" + index + "\" class=\"cover-nav\"></a>");
                        if( index == 0 ){
                            // Set the first navigation link as active
                            $(covernav).addClass("nav-active");
                        }
                        $(covernav).html("<i class=\"fa fa-circle\"></i>");
                        $(coverSlide).append( covernav );
                    });
                }

                if( $(coverSlide).find(".cover-image:visible").length < 1 ){
                    $(coverSlide).remove();
                } else {
                    $(coverSlide).addClass("cover-slides");
                }
            });

            $(".cover-slider").on("click",".cover-nav", function(e){
                e.preventDefault();
                var cover_slider = $(this).parent();
                // Adding click handler for cover image navigation links
                var num = $(this).data("num");
                $(cover_slider).find(".cover-nav").removeClass("nav-active");
                $(this).addClass("nav-active");
                $(cover_slider).find(".cover-image").hide();
                $(cover_slider).find(".cover-image").eq( num ).show();
            });

            $("#editions img").each(function(i){
                if ( this.src.indexOf('amazon.com') >= 0 ) {
                    w = this.width;
                    h = this.height;
                    if ((w == 1) || (h == 1)) {
                        this.src = 'https://images-na.ssl-images-amazon.com/images/G/01/x-site/icons/no-img-sm.gif';
                    } else if ( (this.complete != null) && (!this.complete) || this.naturalHeight == 0 ) {
                        this.src = 'https://images-na.ssl-images-amazon.com/images/G/01/x-site/icons/no-img-sm.gif';
                    }
                }
            });
        }

        $(window).load(function() {
            verify_images();
        });
            [% IF ( NovelistSelectProfile && ( normalized_isbn || normalized_upc ) ) %]
                novSelect.loadContentForQuery(
                    {




 */
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).attr('href', url);
                        $(this).append(img);
                    });
                }
            },

        });
    }

};




                        catch(err){
                        };
                    } else if (this.width > 1) { // don't show the silly 1px "no image" img
                        $(mydiv).empty().append(img);
                            var a = $("<a />").attr('href', '/cgi-bin/koha/opac-imageviewer.pl?biblionumber=' + $(mydiv).attr("class"));
                            $(a).append(img);
                            $(mydiv).empty().append(a);
                        } else {
                            $(mydiv).empty().append(img);
                        }
                        $(mydiv).children('.no-image').remove();
                    }
                })
- 

Return to bug 28180

Lines 617-626 th { Link Here

(-)a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss (-1 / +58 lines)
617	width: 75px;	617	width: 75px;
618	}	618	}
619		619
620	#bookcover {	620	.bookcover {
621	float: left;	621	float: left;
622	margin: 0;	622	margin: 0;
623	padding: 0;	623	padding: 0;
		624	text-align: center;
624		625
625	.no-image {	626	.no-image {
626	margin-bottom: 10px;	627	margin-bottom: 10px;
Lines 638-643 th { Link Here
638	}	639	}
639	}	640	}
640		641
		642	#biblio-cover-slider {
		643	border: 1px solid #b9d8d9;
		644	border-radius: 3px;
		645	margin: 5px;
		646	padding: 10px 5px 5px 5px;
		647	min-height: 175px;
		648	}
		649
		650	.cover-slides {
		651	background: #FFF url("../img/spinner-small.gif") center center no-repeat;
		652
		653	.hint {
		654	font-size: 90%;
		655	padding: .5em 0;
		656	}
		657
		658	a {
		659	&.nav-active {
		660	&:link,
		661	&:visited {
		662	color: #85ca11;
		663	}
		664	}
		665	}
		666	}
		667
		668	td {
		669	&.bookcover {
		670	background: #FFF url("../img/spinner-small.gif") center center no-repeat;
		671	min-width: 120px;
		672	text-align: center;
		673	}
		674
		675	.cover-slides {
		676	background: transparent none;
		677	border: 0;
		678	margin: 0;
		679	min-height: unset;
		680	padding: 0;
		681	}
		682	}
		683
		684	.cover-image {
		685	display: none;
		686
		687	img {
		688	height: auto;
		689	max-width: 100%;
		690	}
		691	}
		692
		693	.cover-nav {
		694	display: inline-block;
		695	padding: 3px 4px;
		696	}
		697
641	div {	698	div {
642	&.required_label {	699	&.required_label {
643	display: none;	700	display: none;

Lines 38-50 KOHA.LocalCover = { Link Here

(-)a/koha-tmpl/opac-tmpl/bootstrap/js/localcovers.js (-8 / +1 lines)
38	catch(err){	38	catch(err){
39	};	39	};
40	} else if (this.width > 1) { // don't show the silly 1px "no image" img	40	} else if (this.width > 1) { // don't show the silly 1px "no image" img
41	if (uselink) {	41	$(mydiv).empty().append(img);
42	var a = $("<a />").attr('href', '/cgi-bin/koha/opac-imageviewer.pl?biblionumber=' + $(mydiv).attr("class"));
43	$(a).append(img);
44	$(mydiv).empty().append(a);
45	} else {
46	$(mydiv).empty().append(img);
47	}
48	$(mydiv).children('.no-image').remove();	42	$(mydiv).children('.no-image').remove();
49	}	43	}
50	})	44	})
51	-

Lines 34-39 Link Here

(-)a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt (-69 / +179 lines)
34	[% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]	34	[% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]
35	[% Asset.css("lib/verovio/midiplayer.css") \| $raw %]	35	[% Asset.css("lib/verovio/midiplayer.css") \| $raw %]
36	[% END %]	36	[% END %]
		37	[% Asset.css("lib/Chocolat/css/chocolat.css") \| $raw %]
37	</head>	38	</head>
38	[% BLOCK cssinclude %][% END %]	39	[% BLOCK cssinclude %][% END %]
39	[% INCLUDE 'bodytag.inc' bodyid='opac-detail' bodyclass='scrollto' %]	40	[% INCLUDE 'bodytag.inc' bodyid='opac-detail' bodyclass='scrollto' %]
Lines 56-122 Link Here
56	<div class="col-lg-9">	57	<div class="col-lg-9">
57	<div id="catalogue_detail_biblio" class="maincontent" data-biblionumber="[% biblio.biblionumber \| html %]">	58	<div id="catalogue_detail_biblio" class="maincontent" data-biblionumber="[% biblio.biblionumber \| html %]">
58		59
59	<div id="bookcover">	60	<div class="bookcover">
60	[% IF ( biblio.title ) %]
61	[% img_title = biblio.title %]
62	[% ELSE %]
63	[% img_title = biblio.biblionumber %]
64	[% END %]
65		61
66	[% IF ( OPACLocalCoverImages ) %]	62	<div id="biblio-cover-slider" class="cover-slider">
67	<div title="[% img_title \| html %]" class="[% biblio.biblionumber \| html %]" id="local-thumbnail-preview"></div>	63	[% IF ( OPACLocalCoverImages ) %]
68	[% END %]	64	[% IF localimages.count %]
69		65	[% FOREACH image IN localimages %]
70	[% IF ( OPACAmazonCoverImages ) %]	66	<div class="cover-image local-coverimg">
71	[% IF ( OPACURLOpenInNewWindow ) %]	67	<a href="/cgi-bin/koha/opac-image.pl?imagenumber=[% image.imagenumber \| uri %]" title="Local cover image">
72	<a href="http://www.amazon[% AmazonTld \| uri %]/gp/reader/[% normalized_isbn \| uri %][% AmazonAssocTag \| uri %]#reader-link" target="_blank" rel="noreferrer">	68	<img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&imagenumber=[% image.imagenumber \| uri %]" alt="Local cover image" data-link="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblionumber \| uri %]&imagenumber=[% image.imagenumber \| uri %]" />
73	[% ELSE %]	69	</a>
74	<a href="http://www.amazon[% AmazonTld \| uri %]/dp/[% normalized_isbn \| uri %][% AmazonAssocTag \| uri %]">	70	<div class="hint">Local cover image</div>
		71	</div>
		72	[% END %]
		73	[% END %]
75	[% END %]	74	[% END %]
76	<img src="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn \| html %].01.MZZZZZZZ.jpg" alt="Cover image" /></a>
77	[% END %]
78		75
79	[% IF ( SyndeticsEnabled && SyndeticsCoverImages ) %]	76	[% IF ( OPACAmazonCoverImages && normalized_isbn) %]
80	[% IF ( content_identifier_exists ) %]	77	<div class="cover-image" id="amazon-bookcoverimg">
81	<img src="https://secure.syndetics.com/index.aspx?isbn=[% normalized_isbn \| html %]/[% SyndeticsCoverImageSize \| html %].GIF&client=[% SyndeticsClientCode \| html %]&type=xw10&upc=[% normalized_upc \| html %]&oclc=[% normalized_oclc \| html %]" alt="" class="thumbnail" />	78	<a href="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn \| uri %].01.LZZZZZZZ.jpg" title="Amazon cover image">
82	[% ELSE %]	79	<img src="https://images-na.ssl-images-amazon.com/images/P/[% normalized_isbn \| uri %].01.MZZZZZZZ.jpg" alt="Amazon cover image" data-link="http://www.amazon[% AmazonTld \| uri %]/gp/reader/[% normalized_isbn \| uri %][% AmazonAssocTag \| uri %]#reader-link"/>
83	<span class="no-image">No cover image available</span>	80	</a>
		81	<div class="hint">Image from Amazon.com</div>
		82	</div>
84	[% END %]	83	[% END %]
85	[% END %]
86		84
87	[% IF ( GoogleJackets ) %]	85	[% IF ( Koha.Preference('OPACCoce') && Koha.Preference('CoceProviders') && normalized_isbn ) %]
88	<div title="[% img_title \| html %]" class="[% normalized_isbn \| html %]" id="gbs-thumbnail-preview"></div>	86	[% coce_id = normalized_ean \|\| normalized_isbn %]
89	[% END %]	87	<div class="cover-image" id="coce-coverimg">
90	[% IF ( Koha.Preference('OpacCoce') && Koha.Preference('CoceProviders') ) %]	88	[% IF ( coce_id ) %]
91	[% coce_id = normalized_ean \|\| normalized_isbn \| html %]	89	<a title="Image from Coce" class="[% coce_id \| html %]" id="coce-thumbnail-preview"></a>
92	<div title="[% img_title \| html %]" class="[% coce_id \| html %]" id="coce-thumbnail-preview"></div>	90	[% END %]
93	[% END %]	91	<div class="hint">Image from Coce</div>
94	[% IF OpenLibraryCovers %]	92	</div>
95	<div title="[% img_title \| html %]" class="[% normalized_isbn \| html %]" id="openlibrary-thumbnail-preview"></div>
96	[% END %]
97	[% bt_id = ( normalized_upc \|\| normalized_isbn ) %]
98	[% IF ( BakerTaylorEnabled && bt_id ) %]
99	[% IF BakerTaylorBookstoreURL %]
100	[% IF ( OPACURLOpenInNewWindow ) %]
101	<a href="https://[% BakerTaylorBookstoreURL \| url %][% bt_id \| url %]" target="_blank" rel="noreferrer"><img alt="See Baker & Taylor" src="[% BakerTaylorImageURL \| html %][% bt_id \| html %]" /></a>
102	[% ELSE %]
103	<a href="https://[% BakerTaylorBookstoreURL \| url %][% bt_id \| url %]"><img alt="See Baker & Taylor" src="[% BakerTaylorImageURL \| html %][% bt_id \| html %]" /></a>
104	[% END %]
105	[% ELSE %]
106	<img alt="See Baker & Taylor" src="[% BakerTaylorImageURL \| html %][% bt_id \| html %]" />
107	[% END %]	93	[% END %]
108	[% END %]	94
109	[% IF Koha.Preference('OPACCustomCoverImages') AND Koha.Preference('CustomCoverImagesURL') %]	95	[% IF Koha.Preference('OPACCustomCoverImages') && Koha.Preference('CustomCoverImagesURL') %]
110	[% SET custom_cover_image_url = biblio.custom_cover_image_url %]	96	[% SET custom_cover_image_url = biblio.custom_cover_image_url %]
111	[% IF custom_cover_image_url %]	97	[% IF custom_cover_image_url %]
112	[% IF ( OPACURLOpenInNewWindow ) %]	98	<div class="cover-image" id="custom-coverimg">
113	<a class="custom_cover_image" href="[% custom_cover_image_url \| url %]" target="_blank" rel="noreferrer"><img alt="Cover image" src="[% custom_cover_image_url \| url %]" /></a>	99	<a class="custom_cover_image" href="[% custom_cover_image_url \| url %]" title="Custom cover image">
114	[% ELSE %]	100	<img id="custom-img" alt="Custom cover image" src="[% custom_cover_image_url \| url %]" />
115	<a class="custom_cover_image" href="[% custom_cover_image_url \| url %]"><img alt="Cover image" src="[% custom_cover_image_url \| url %]" /></a>	101	</a>
		102	<div class="hint">Custom cover image</div>
		103	</div>
116	[% END %]	104	[% END %]
117	[% END %]	105	[% END %]
118	[% END %]	106	</div> <!-- /.cover-slider -->
119	</div><!-- / #bookcover -->	107
		108	</div><!-- / .bookcover -->
120		109
121	<abbr class="unapi-id" title="koha:biblionumber:[% biblio.biblionumber \| html %]"><!-- unAPI --></abbr>	110	<abbr class="unapi-id" title="koha:biblionumber:[% biblio.biblionumber \| html %]"><!-- unAPI --></abbr>
122	[% IF ( ocoins ) # COinS / Openurl %]	111	[% IF ( ocoins ) # COinS / Openurl %]
Lines 868-874 Link Here
868	<div id="images">	857	<div id="images">
869	<p>Click on an image to view it in the image viewer</p>	858	<p>Click on an image to view it in the image viewer</p>
870	[% FOREACH image IN localimages %]	859	[% FOREACH image IN localimages %]
871	<a class="localimage" href="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblio.biblionumber \| html %]&imagenumber=[% image.imagenumber \| html %]"><img alt="" src="/cgi-bin/koha/opac-image.pl?thumbnail=1&imagenumber=[% image.imagenumber \| html %]" /></a>	860	<a href="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblio.biblionumber \| uri %]&imagenumber=[% image.imagenumber \| uri %]" title="Local cover image">
		861	<img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&imagenumber=[% image.imagenumber \| uri %]" alt="Local cover image" />
		862	</a>
872	[% END %]	863	[% END %]
873	</div><!-- / #images -->	864	</div><!-- / #images -->
874	[% END # / IF OPACLocalCoverImages && localimages.size %]	865	[% END # / IF OPACLocalCoverImages && localimages.size %]
Lines 1116-1124 Link Here
1116		1107
1117	[% IF Koha.Preference('OPACLocalCoverImages') && ( tab == 'holdings' && itemloop_has_images \|\| tab == 'otherholdings' && otheritemloop_has_images ) %]	1108	[% IF Koha.Preference('OPACLocalCoverImages') && ( tab == 'holdings' && itemloop_has_images \|\| tab == 'otherholdings' && otheritemloop_has_images ) %]
1118	<td class="cover">	1109	<td class="cover">
1119	[% FOR image IN ITEM_RESULT.cover_images %]	1110	<div class="bookcover">
1120	<div title="[% ITEM_RESULT.itemnumber \| html %]" data-imagenumber="[% image.imagenumber \| html %]" data-biblionumber="[% ITEM_RESULT.biblionumber \| html %]" class="local-thumbnail-preview"></div>	1111	<div class="cover-slider">
1121	[% END %]	1112	[% FOR image IN ITEM_RESULT.cover_images %]
		1113	<div class="cover-image local-coverimg">
		1114	<a href="/cgi-bin/koha/opac-image.pl?itemnumber=[% image.itemnumber \| uri %]&imagenumber=[% image.imagenumber \| uri %]" title="Local cover image">
		1115	<img src="/cgi-bin/koha/opac-image.pl?thumbnail=1&imagenumber=[% image.imagenumber \| uri %]" alt="Local cover image" />
		1116	</a>
		1117	</div>
		1118	[% END %]
		1119	</div>
		1120	</div>
1122	</td>	1121	</td>
1123	[% END %]	1122	[% END %]
1124		1123
Lines 1300-1305 Link Here
1300	[% Asset.js("lib/kjua/kjua.min.js") \| $raw %]	1299	[% Asset.js("lib/kjua/kjua.min.js") \| $raw %]
1301	[% END %]	1300	[% END %]
1302		1301
		1302	[% Asset.js("lib/Chocolat/js/chocolat.js") \| $raw %]
		1303
1303	[% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]	1304	[% IF ( Koha.Preference('OPACShowMusicalInscripts') ) %]
1304	<script>	1305	<script>
1305	var interface = "[% interface \| html %]";	1306	var interface = "[% interface \| html %]";
Lines 1474-1495 Link Here
1474	$("#highlight_toggle_off").show().click(function() {highlightOff(); return false;});	1475	$("#highlight_toggle_off").show().click(function() {highlightOff(); return false;});
1475	[% END %]	1476	[% END %]
1476	[% END %]	1477	[% END %]
1477	[% IF ( GoogleJackets ) %]	1478
1478	KOHA.Google.GetCoverFromIsbn([% covernewwindow \| html %]);
1479	[% END %]
1480	[% IF ( Koha.Preference('OpacCoce') && Koha.Preference('CoceProviders') ) %]	1479	[% IF ( Koha.Preference('OpacCoce') && Koha.Preference('CoceProviders') ) %]
1481	KOHA.coce.getURL('[% Koha.Preference('CoceHost') \| html %]', '[% Koha.Preference('CoceProviders') \| html %]',[% covernewwindow \| html %]);	1480	KOHA.coce.getURL('[% Koha.Preference('CoceHost') \| html %]', '[% Koha.Preference('CoceProviders') \| html %]',[% covernewwindow \| html %]);
1482	[% END %]	1481	[% END %]
1483		1482
1484	[% IF OpenLibraryCovers %]	1483	function verify_images() {
1485	KOHA.OpenLibrary.GetCoverFromIsbn();	1484	// Loop over each container in the template which contains covers
1486	[% END %]	1485	$(".cover-slider").each(function(){
1487	[% IF OPACLocalCoverImages %]	1486	var lightbox_descriptions = [];
1488	KOHA.LocalCover.GetCoverFromBibnumber(true);	1487	$(this).find(".cover-image").each( function( index ){
1489	[% IF itemloop_has_images OR oheritemloop_has_images %]	1488	var div = $(this);
1490	KOHA.LocalCover.GetCoverFromItemnumber(true);	1489	// Find the image in the container
1491	[% END %]	1490	var img = div.find("img")[0];
1492	[% END %]	1491	if( $(img).length > 0 ){
		1492	var description = "";
		1493	if( (img.complete != null) && (!img.complete) \|\| img.naturalHeight == 0 ){
		1494	// No image loaded in the container. Remove the slide
		1495	div.remove();
		1496	} else {
		1497	// All slides start hidden. If this is the first one, show it.
		1498	if( index == 0 ){
		1499	div.show();
		1500	}
		1501	// Check if Amazon image is present
		1502	if ( div.attr("id") == "amazon-bookcoverimg" ) {
		1503	w = img.width;
		1504	h = img.height;
		1505	if ((w == 1) \|\| (h == 1)) {
		1506	// Amazon returned single-pixel placeholder
		1507	// Remove the container
		1508	div.remove();
		1509	} else {
		1510	lightbox_descriptions.push(_("Amazon cover image (<a href='%s'>see the original image</a>)").format($(img).data('link')));
		1511	}
		1512	} else if( div.attr("id") == "custom-coverimg" ){
		1513	if ( (img.complete != null) && (!img.complete) \|\| img.naturalHeight == 0 ) {
		1514	// No image was loaded via the CustomCoverImages system preference
		1515	// Remove the container
		1516	div.remove();
		1517	} else {
		1518	lightbox_descriptions.push("Custom cover image");
		1519	}
		1520	} else if( div.attr("id") == "coce-coverimg" ){
		1521	// Identify which service's image is being loaded by Coce
		1522	var coce_description;
		1523	if( $(img).attr("src").indexOf('amazon.com') >= 0 ){
		1524	coce_description = ("Coce image from Amazon.com");
		1525	} else if( $(img).attr("src").indexOf('google.com') >= 0 ){
		1526	coce_description = _("Coce image from Google Books");
		1527	} else if( $(img).attr("src").indexOf('openlibrary.org') >= 0 ){
		1528	coce_description = _("Coce image from Open Library");
		1529	}
		1530	div.find(".hint").html(coce_description);
		1531	lightbox_descriptions.push(coce_description);
		1532	} else if ( div.attr("id") == "adlibris-coverimg" ){
		1533	lightbox_descriptions.push(_("Image from Adlibris (<a href='%s'>see the original image</a>)").format($(img).data('link')));
		1534	} else if ( div.attr("class") == "cover-image local-coverimg" ) {
		1535	lightbox_descriptions.push(_("Local cover image"));
		1536	} else {
		1537	console.log("Source of the image cannot be guessed.")
		1538	}
		1539	}
		1540	}
		1541	});
		1542
		1543	// Lightbox for cover images
		1544	Chocolat(this.querySelectorAll('.cover-image a'), {
		1545	description: function(){
		1546	return lightbox_descriptions[this.settings.currentImageIndex];
		1547	}
		1548	});
		1549
		1550	});
		1551
		1552	$(".cover-slider").each(function(){
		1553	var coverSlide = this;
		1554	var coverImages = $(this).find(".cover-image");
		1555	if( coverImages.length > 1 ){
1556	coverImages.each(function( index ){
1557	// If more that one image is present, add a navigation link
1558	// for activating the slide
1559	var covernav = $("<a href=\"#\" data-num=\"" + index + "\" class=\"cover-nav\"></a>");
1560	if( index == 0 ){
1561	// Set the first navigation link as active
1562	$(covernav).addClass("nav-active");
1563	}
1564	$(covernav).html("<i class=\"fa fa-circle\"></i>");
1565	$(coverSlide).append( covernav );
1566	});
1567	}
1568
1569	if( $(coverSlide).find(".cover-image:visible").length < 1 ){
1570	$(coverSlide).remove();
1571	} else {
1572	$(coverSlide).addClass("cover-slides");
1573	}
1574	});
1575
1576	$(".cover-slider").on("click",".cover-nav", function(e){
1577	e.preventDefault();
1578	var cover_slider = $(this).parent();
1579	// Adding click handler for cover image navigation links
1580	var num = $(this).data("num");
1581	$(cover_slider).find(".cover-nav").removeClass("nav-active");
1582	$(this).addClass("nav-active");
1583	$(cover_slider).find(".cover-image").hide();
1584	$(cover_slider).find(".cover-image").eq( num ).show();
1585	});
1586
1587	$("#editions img").each(function(i){
1588	if ( this.src.indexOf('amazon.com') >= 0 ) {
1589	w = this.width;
1590	h = this.height;
1591	if ((w == 1) \|\| (h == 1)) {
1592	this.src = 'https://images-na.ssl-images-amazon.com/images/G/01/x-site/icons/no-img-sm.gif';
1593	} else if ( (this.complete != null) && (!this.complete) \|\| this.naturalHeight == 0 ) {
1594	this.src = 'https://images-na.ssl-images-amazon.com/images/G/01/x-site/icons/no-img-sm.gif';
1595	}
1596	}
1597	});
1598	}
1599
1600	$(window).load(function() {
1601	verify_images();
1602	});
1493	[% IF ( NovelistSelectProfile && ( normalized_isbn \|\| normalized_upc ) ) %]	1603	[% IF ( NovelistSelectProfile && ( normalized_isbn \|\| normalized_upc ) ) %]
1494	novSelect.loadContentForQuery(	1604	novSelect.loadContentForQuery(
1495	{	1605	{

Lines 6-43 if (KOHA === undefined \|\| !KOHA) { var KOHA = {}; } Link Here

(-)a/koha-tmpl/opac-tmpl/bootstrap/js/coce.js (-33 / +41 lines)
6	*/	6	*/
7	KOHA.coce = {	7	KOHA.coce = {
8		8
9	/**	9	/**
10	* Search all:	10	* Search all:
11	* <div title="biblionumber" id="isbn" class="coce-thumbnail"></div>	11	* <div title="biblionumber" id="isbn" class="coce-thumbnail"></div>
12	* or	12	* or
13	* <div title="biblionumber" id="isbn" class="coce-thumbnail-preview"></div>	13	* <div title="biblionumber" id="isbn" class="coce-thumbnail-preview"></div>
14	* and run a search with all collected isbns to coce cover service.	14	* and run a search with all collected isbns to coce cover service.
15	* The result is asynchronously returned, and used to append <img>.	15	* The result is asynchronously returned, and used to append <img>.
16	*/	16	*/
17	getURL: function(host,provider,newWindow) {	17	getURL: function(host, provider) {
18	var ids = [];	18	var ids = [];
19	$("[id^=coce-thumbnail]").each(function(i) {	19	$("[id^=coce-thumbnail]").each(function() {
20	var id = $(this).attr("class"); // id=isbn	20	var id = $(this).attr("class"); // id=isbn
21	if ( id !== '' ) { ids.push(id); }	21	if (id !== '') { ids.push(id); }
22	});	22	});
23	if (ids.length == 0) return;	23	if (ids.length == 0) return;
24	ids = ids.join(',');	24	ids = ids.join(',');
25	var coceURL = host + '/cover?id=' + ids + '&provider=' + provider;	25	var coceURL = host + '/cover?id=' + ids + '&provider=' + provider;
26	$.ajax({	26	$.ajax({
27	url: coceURL,	27	url: coceURL,
28	dataType: 'jsonp',	28	dataType: 'jsonp',
29	success: function(urlPerID){	29	success: function(urlPerID) {
30	for (var id in urlPerID) {	30	for (var id in urlPerID) {
31	var url = urlPerID[id];	31	var url = urlPerID[id];
32	$("[id^=coce-thumbnail]."+id).each(function() {	32	$("[id^=coce-thumbnail]." + id).each(function() {
33	var img = document.createElement("img");	33	var img = document.createElement("img");
34	img.src = url;	34	img.src = url;
35	img.title = url; //FIXME: to delete	35	img.alt = "Cover image";
36	$(this).html(img);	36	img.onload = function() {
37	});	37	// image dimensions can't be known until image has loaded
38	}	38	if (img.height == 1 && img.width == 1) {
39	}	39	$(this).closest(".coce-coverimg").remove();
40	});	40	}
41	}	41	};
		42	$(this).attr('href', url);
		43	$(this).append(img);
		44	});
		45	}
		46	},
		47
		48	});
		49	}
42		50
43	};	51	};