2 [% INCLUDE 'doc-head-open.inc' %]
3 <title>[% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog › Images for: [% INCLUDE 'biblio-title-head.inc' %]</title>
4 [% INCLUDE 'doc-head-close.inc' %]
8 border : 1px solid #CCCCCC;
17 border : 2px solid #8EB3E7;
26 #thumbnails a img.selected {
30 filter:alpha(opacity=40); /* For IE8 and earlier */
35 [% INCLUDE 'bodytag.inc' bodyid='opac-imageviewer' %]
36 [% INCLUDE 'masthead.inc' %]
39 <nav aria-label="breadcrumb">
40 <ul class="breadcrumb">
41 <li class="breadcrumb-item">
42 <a href="/cgi-bin/koha/opac-main.pl">Home</a>
44 <li class="breadcrumb-item">
45 [% IF ( BiblioDefaultViewmarc ) %]
46 <a href="/cgi-bin/koha/opac-MARCdetail.pl?biblionumber=[% biblionumber |url %]">
48 [% IF ( BiblioDefaultViewisbd ) %]
49 <a href="/cgi-bin/koha/opac-ISBDdetail.pl?biblionumber=[% biblionumber |url %]">
51 <a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% biblionumber |url %]">
53 [% END %][% INCLUDE 'biblio-title.inc' %]</a>
55 <li class="breadcrumb-item active" aria-current="page">
56 <a href="#">Images</a>
61 <div class="container-fluid">
63 [% IF ( OpacNav || OpacNavBottom ) %]
64 <div class="col-lg-2">
66 [% INCLUDE 'navigation.inc' %]
69 <div class="col-10 order-first order-md-first order-lg-2">
71 <div class="col order-first order-md-first order-lg-2">
75 <div class="col-lg-9 maincontent">
76 <h1 class="title">Images for
77 [% IF ( BiblioDefaultViewmarc ) %]
78 <a class="title" href="/cgi-bin/koha/opac-MARCdetail.pl?biblionumber=[% biblionumber |url %]" title="View details for this title">
80 [% IF ( BiblioDefaultViewisbd ) %]
81 <a class="title" href="/cgi-bin/koha/opac-ISBDdetail.pl?biblionumber=[% biblionumber |url %]" title="View details for this title">
83 <a class="title" href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% biblionumber |url %]" title="View details for this title">
85 [% END %][% INCLUDE 'biblio-title.inc' %]</a> [% biblio.author | html %]
87 </div> <!-- / col-lg-9 -->
88 </div> <!-- / .row -->
91 <div class="col-lg-9">
92 <div id="imageviewer">
94 <img id="largeCoverImg" alt="" src="/cgi-bin/koha/opac-image.pl?imagenumber=[% imagenumber | url %]" />
96 </div> <!-- / #imageviewer -->
97 </div> <!-- / .span12 -->
99 [% IF OPACLocalCoverImages == 1 %]
100 <div class="col-lg-3">
101 <div id="thumbnails">
102 [% FOREACH img IN images %]
104 <a href="/cgi-bin/koha/opac-imageviewer.pl?biblionumber=[% biblionumber | url %]&imagenumber=[% img | uri %]" onclick="showCover([% img | html %]); return false;">
105 [% IF ( imagenumber == img ) %]
106 <img class="thumbnail selected" id="[% img | html %]" src="/cgi-bin/koha/opac-image.pl?imagenumber=[% img | html %]&thumbnail=1" alt="Thumbnail"/>
108 <img class="thumbnail" id="[% img | html %]" src="/cgi-bin/koha/opac-image.pl?imagenumber=[% img | html %]&thumbnail=1" alt="Thumbnail"/>
113 </div> <!-- /#thumbnails -->
114 </div> <!-- /.col-lg-3 -->
116 Unfortunately, images are not enabled for this catalog at this time.
118 </div> <!-- / .row -->
119 </div> <!-- / .col-lg-10/12 -->
120 </div> <!-- / .row -->
121 </div> <!-- / .container-fluid -->
122 </div> <!-- / .main -->
124 [% INCLUDE 'opac-bottom.inc' %]
125 [% BLOCK jsinclude %]
127 $(document).ready(function(){
128 $("#largeCoverImg").attr("src","[% interface | html %]/[% theme | html %]/images/loading.gif");
129 showCover([% imagenumber | html %]);
132 function showCover(img) {
133 $('.thumbnail').attr('class', 'thumbnail');
134 $('#largeCoverImg').attr('src', '/cgi-bin/koha/opac-image.pl?imagenumber=' + img);
135 $('#' + img + '.thumbnail').attr('class', 'thumbnail selected');