koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-browse.tt

   1 [% USE Koha %]
   2 [% USE Asset %]
   3 [% USE raw %]
   4 [% USE AdditionalContents %]
   5 [% SET OpacNav = AdditionalContents.get( location => "OpacNav", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
   6 [% SET OpacNavBottom = AdditionalContents.get( location => "OpacNavBottom", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
   7 [% INCLUDE 'doc-head-open.inc' %]
   8 <title>Browse our catalog &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
   9 [% INCLUDE 'doc-head-close.inc' %]
  10 [% BLOCK cssinclude %][% END %]
  11 [% INCLUDE 'bodytag.inc' bodyid='opac-browser' %]
  12 [% INCLUDE 'masthead.inc' %]
  13
  14 <div class="main">
  15     <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumbs">
  16         <ol class="breadcrumb">
  17             <li class="breadcrumb-item">
  18                 <a href="/cgi-bin/koha/opac-main.pl">Home</a>
  19             </li>
  20             <li class="breadcrumb-item active">
  21                 <a href="#" aria-current="page">Browse search</a>
  22             </li>
  23         </ol>
  24     </nav> <!-- /#breadcrumbs -->
  25
  26     <div class="container-fluid">
  27         <div class="row">
  28             [% IF ( OpacNav || OpacNavBottom ) %]
  29                 <div class="col-lg-2">
  30                     <div id="navigation">
  31                     [% INCLUDE 'navigation.inc' %]
  32                     </div>
  33                 </div>
  34             [% END %]
  35
  36             [% IF ( OpacNav ) %]
  37                 <div class="col-10 order-first order-md-first order-lg-2">
  38             [% ELSE %]
  39                 <div class="col order-first order-md-first order-lg-2">
  40             [% END %]
  41
  42             [% IF Koha.Preference('SearchEngine') == 'Elasticsearch' && Koha.Preference('OpacBrowseSearch') %]
  43                 <div id="browse-search" class="maincontent">
  44                     <h1>Browse search</h1>
  45
  46                     <form>
  47                         <legend class="sr-only">Browse search</legend>
  48                         <div class="form-row">
  49                             <div class="col">
  50                                 <label for="browse-searchterm">Search for:</label>
  51                                 <input type="search" id="browse-searchterm" class="form-control" name="searchterm" value="" />
  52                             </div> <!-- /.col-12.col-sm-9 -->
  53                             <div class="col-auto">
  54                                 <label for="browse-searchfield">Search type:</label>
  55                                 <select id="browse-searchfield" name="searchfield" class="form-control">
  56                                     <option value="author">Author</option>
  57                                     <option value="subject">Subject</option>
  58                                     <option value="title">Title</option>
  59                                 </select>
  60                             </div> <!-- /.col-auto -->
  61                         </div> <!-- /.form-row -->
  62                         <div class="form-row">
  63                             <div class="col">
  64                                 <div id="browse-searchfuzziness">
  65                                     <div class="form-check form-check-inline">
  66                                         <label for="exact" class="form-check-label">
  67                                             <input class="form-check-input" type="radio" name="browse-searchfuzziness" id="exact" value="0" />Exact
  68                                         </label>
  69                                     </div> <!-- /.form-check.form-check-inline -->
  70                                     <div class="form-check form-check-inline">
  71                                         <label for="fuzzy" class="form-check-label">
  72                                             <input class="form-check-input" type="radio" name="browse-searchfuzziness" id="fuzzy" value="1" checked="checked" /> Fuzzy
  73                                         </label>
  74                                     </div> <!-- /.form-check.form-check-inline -->
  75                                     <div class="form-check form-check-inline">
  76                                         <label for="reallyfuzzy" class="form-check-label">
  77                                             <input class="form-check-input" type="radio" name="browse-searchfuzziness" id="reallyfuzzy" value="2" /> Really fuzzy
  78                                         </label>
  79                                     </div> <!-- /.form-check.form-check-inline -->
  80                                 </div> <!-- /#browse-searchfuzziness -->
  81                             </div> <!-- /.col -->
  82                         </div> <!-- /.form-row -->
  83                         <div class="form-row">
  84                             <div class="col">
  85                                 <button class="btn btn-primary" type="submit" accesskey="s">Search</button>
  86                             </div>
  87                         </div>
  88                     </form>
  89
  90                     <div id="browse-suggestionserror" class="alert alert-warning d-none" role="alert">
  91                         An error occurred, please try again.
  92                     </div>
  93
  94                     <div id="browse-resultswrapper" class="d-none">
  95                         <h2>Results</h2>
  96
  97                         <div class="loading d-none"><img src="[% interface | html %]/[% theme |html %]/images/loading.gif" alt=""> Loading</div>
  98                         <div class="alert alert-warning no-results d-none" role="alert">Sorry, there are no results. Try a different search term.</div>
  99
 100                         <div class="accordion" id="browse-searchresults">
 101                             <div id="card_template" class="card">
 102                                 <div class="card-header" id="heading">
 103                                     <a class="expand-result" href="#" data-toggle="collapse" aria-expanded="false" aria-controls="collapse">
 104                                     </a>
 105                                 </div> <!-- /#heading.card-header -->
 106                                 <div id="collapse" class="collapse" aria-labelledby="heading" data-parent="#browse-searchresults">
 107                                     <div class="card-body">
 108                                     </div>
 109                                 </div> <!-- /#collapse.collapse -->
 110                             </div> <!-- /#card_template.card -->
 111                         </div> <!-- /#browse-searchresults.accordion -->
 112                     </div><!-- / #browse-resultswrapper -->
 113                 </div><!-- /#browse-search -->
 114             [% ELSE %]
 115                 <h1>Browse search</h1>
 116                 <div class="alert alert-info">
 117                     This feature is not enabled
 118                 </div>
 119             [% END %]
 120
 121             </div><!-- / .col/col-10 -->
 122         </div><!-- / .row -->
 123     </div><!-- / .container-fluid -->
 124 </div><!-- / .main -->
 125
 126 [% INCLUDE 'opac-bottom.inc' %]
 127 [% BLOCK jsinclude %]
 128     [% Asset.js("/js/browse.js") | $raw %]
 129 [% END %]