Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 29066: (follow-up) Use tooltip when SearchMyLibraryFirst in effect

Browse source 
This patch proposes to add a Bootstrap tooltip to the OPAC masthead's
search field to indicate to the user when SearchMyLibraryFirst is in
effect. I think this lets the form layout stay clean-looking and is more
informative to the user because they don't have to look for the HTML
title tag tooltip.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

- Go to Administration -> Global system preferences.
- Set the OpacAddMastheadLibraryPulldown preference to "Don't add."
- Set the SearchMyLibraryFirst preference to "Limit."
- Go to the OPAC and confirm that the main search field in the masthead
  has a filter icon in the background, indicating that searches will be
  limited.
- Hover your mouse over the search field and a tooltip should pop up,
  "Searching in <library> only"
- The message should also be triggered when you click inside the form
  field.
- Change the OpacAddMastheadLibraryPulldown and SearchMyLibraryFirst
  preferences again and the form should return to its normal behavior.

Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
This commit is contained in:
Owen Leonard 2022-03-29 14:37:30 +00:00 committed by Fridolin Somers
parent 3fe43f4c86
commit 1ad3d2817d
3 changed files with 13 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
View file

@ -455,6 +455,14 @@ th {
}
}
.form-control-filtered {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-funnel-fill'%3E%3Cpath d='M1.5 1.5A.5.5 0 0 1 2 1h12a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.128.334L10 8.692V13.5a.5.5 0 0 1-.342.474l-3 1A.5.5 0 0 1 6 14.5V8.692L1.628 3.834A.5.5 0 0 1 1.5 3.5v-2z' fill='%23acacac'/%3E%3C/svg%3E");
background-position-x: 6px;
background-position-y: center;
background-repeat: no-repeat;
padding-left: 1.7rem;
}
#numresults {
color: #727272;
}

15
koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
View file

@ -163,15 +163,6 @@
[% ELSE %]
<form name="searchform" method="get" action="/cgi-bin/koha/opac-search.pl" id="searchform">
<div class="form-row align-items-center">
<div class="col-sm-auto order-1 order-sm-1">
[% UNLESS ( Koha.Preference( 'OpacAddMastheadLibraryPulldown' ) == 1 ) %]
[% IF ( mylibraryfirst ) %]
<span title="Search in [% Branches.GetName( mylibraryfirst ) | html %] only">
<i class="fa fa-question-circle-o" aria-hidden="true"></i>
</span>
[% END %]
[% END %]
</div>
<div class="col-sm-auto order-2 order-sm-2">
<select name="idx" id="masthead_search" class="form-control">
[% IF ( ms_kw ) %]
@ -226,10 +217,10 @@
</div> <!-- /.col-sm-auto -->
<div class="col order-4 order-sm-3">
[% IF ( ms_value ) %]
<input type="text" title="Type search term" class="transl1 form-control" id="translControl1" name="q" value="[% ms_value | html %]" /><span id="translControl"></span>
[% IF ( !Koha.Preference( 'OpacAddMastheadLibraryPulldown' ) == 1 && mylibraryfirst ) %]
<input type="text" class="transl1 form-control form-control-filtered" id="translControl1" name="q" value="[% ms_value | html %]" data-toggle="tooltip" data-placement="top" title="Searching in [% Branches.GetName( mylibraryfirst ) | html %] only" /><span id="translControl"></span>
[% ELSE %]
<input type="text" title="Type search term" class="transl1 form-control" id="translControl1" name="q" /><span id="translControl"></span>
<input type="text" class="transl1 form-control" id="translControl1" name="q" value="[% ms_value | html %]" /><span id="translControl"></span>
[% END # /ms_value %]
</div> <!-- /.col -->

2
koha-tmpl/opac-tmpl/bootstrap/js/global.js
View file

@ -229,4 +229,6 @@ $(document).ready(function(){
content.first().find(':focusable').eq(0).focus();
}
});
$('[data-toggle="tooltip"]').tooltip();
});