Koha/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
Wainui Witika-Park d3ab8dbeec Bug 28242: added captions to tables and legends to forms
Ensured that in the OPAC, all tables have relevant captions and all forms have relevant legends.

Many of these have class="sr-only" so they are not visible but will be
available for people who use screen-readers.

To test:
1) Go to OPAC
2) Apply patch and dependencies
3) Check that on all pages, any tables have a caption (many of them will
    not be visible, but will be in the markup code)
4) Check that on all pages, any forms have a legend (many of them will
    not be visible, but will be in the markup code)
5) Check that the captions are appropriate and relevant
6) Check that the legends are appropriate and relevant

Sponsored-by: Catalyst IT

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
2021-06-21 14:05:30 +02:00

300 lines
21 KiB
Text

[% USE Koha %]
[% INCLUDE 'doc-head-open.inc' %]
<title>Your messaging settings &rsaquo; [% IF ( LibraryNameTitle ) %][% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %][% ELSE %]Koha online[% END %] catalog</title>
[% INCLUDE 'doc-head-close.inc' %]
[% BLOCK cssinclude %][% END %]
</head>
[% INCLUDE 'bodytag.inc' bodyid='opac-messaging' %]
[% INCLUDE 'masthead.inc' %]
<div class="main">
<nav aria-label="breadcrumb">
<ul class="breadcrumb">
<li class="breadcrumb-item">
<a href="/cgi-bin/koha/opac-main.pl">Home</a>
</li>
<li class="breadcrumb-item">
<a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
</li>
<li class="breadcrumb-item" aria-current="IsPatronPage">
<a href="#">Your messaging settings</a>
</li>
</ul>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col col-lg-2 order-2 order-lg-1">
<div id="navigation">
[% INCLUDE 'navigation.inc' IsPatronPage=1 %]
</div>
</div>
<div class="col-md-12 col-lg-10 order-1">
[% IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' ) %]
<div id="usermessaging" class="maincontent">
<h1>Your messaging settings</h1>
[% IF ( settings_updated ) %]
<div class="alert alert-success"><p><strong>Settings updated</strong></p></div>
[% END %]
<form action="/cgi-bin/koha/opac-messaging.pl" method="post" name="opacmessaging">
<input type="hidden" name="csrf_token" value="[% csrf_token | html %]" />
<input type="hidden" name="modify" value="yes" />
<table class="table table-bordered table-condensed table-striped">
<caption class="sr-only">Your messaging settings</caption>
<thead>
<tr>
<th>&nbsp;</th>
<th>Days in advance</th>
[% IF ( SMSSendDriver ) %]<th>SMS</th>[% END %]
[% IF ( TalkingTechItivaPhone ) %]<th>Phone</th>[% END %]
[% IF Koha.Preference('PhoneNotification') %]<th>Phone</th>[% END %]
<th>Email</th>
<th>Digests only <i id="info_digests" data-toggle="tooltip" title="You can ask for a digest to reduce the number of messages. Messages will be saved and sent as a single message." data-placement="right" class="fa fa-info-circle"></i></th>
</tr>
</thead>
<tbody>
[% FOREACH messaging_preference IN messaging_preferences %]
[% NEXT IF !Koha.Preference( 'ILLModule' ) && messaging_preference.message_name.match('^Ill_') %]
[% NEXT IF messaging_preference.Auto_Renewals && Koha.Preference('AutoRenewalNotices') != 'preferences' %]
<tr>
<td>[% IF ( messaging_preference.Item_Due ) %]Item due
[% ELSIF ( messaging_preference.Advance_Notice ) %]Advance notice
[% ELSIF ( messaging_preference.Hold_Filled ) %]Hold filled
[% ELSIF ( messaging_preference.Item_Check_in ) %]Item check-in
[% ELSIF ( messaging_preference.Item_Checkout ) %]
[% IF Koha.Preference( 'RenewalSendNotice' ) %]
Item checkout and renewal
[% ELSE %]
Item checkout
[% END %]
[% ELSIF ( messaging_preference.Ill_ready ) %]Interlibrary loan ready
[% ELSIF ( messaging_preference.Ill_unavailable ) %]Interlibrary loan unavailable
[% ELSIF ( messaging_preference.Auto_Renewals ) %]Auto renewal
[% ELSE %]Unknown [% END %]</td>
[% IF ( messaging_preference.takes_days ) %]
<td><select class="input-mini" name="[% messaging_preference.message_attribute_id | html %]-DAYS">
[% FOREACH select_day IN messaging_preference.select_days %]
[% IF ( select_day.selected ) %]
<option value="[% select_day.day | html %]" selected="selected">[% select_day.day | html %]</option>
[% ELSE %]
<option value="[% select_day.day | html %]">[% select_day.day | html %]</option>
[% END %]
[% END %]
</select></td>
[% ELSE %]
<td>-</td>
[% END %]
[% IF ( SMSSendDriver ) %]
[% IF ( messaging_preference.transport_sms ) %]
<td class="selectcol">
[% IF ( messaging_preference.transports_sms ) %]
<input type="checkbox" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" checked="checked" />
[% ELSE %]
<input type="checkbox" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" />
[% END %]
</td>
[% ELSE %]
<td>-</td>
[% END %]
[% END %]
[% IF Koha.Preference('PhoneNotification') %]
[% IF ( messaging_preference.transport_phone ) %]
<td class="selectcol">
[% IF ( messaging_preference.transports_phone ) %]
<input type="checkbox"
class="phone"
id="phone[% messaging_preference.message_attribute_id | html %]"
name="[% messaging_preference.message_attribute_id | html %]"
value="phone" checked="checked" />
[% ELSE %]
<input type="checkbox"
class="phone"
id="phone[% messaging_preference.message_attribute_id | html %]"
name="[% messaging_preference.message_attribute_id | html %]"
value="phone" />
[% END %]
</td>
[% ELSE %]
<td>-</td>
[% END %]
[% END %]
[% IF ( TalkingTechItivaPhone ) %]
[% IF ( messaging_preference.transport_itiva ) %]
<td class="selectcol">
[% IF ( messaging_preference.transports_itiva ) %]
<input type="checkbox"
class="itiva"
id="itiva[% messaging_preference.message_attribute_id | html %]"
name="[% messaging_preference.message_attribute_id | html %]"
value="itiva" checked="checked" />
[% ELSE %]
<input type="checkbox"
class="itiva"
id="itiva[% messaging_preference.message_attribute_id | html %]"
name="[% messaging_preference.message_attribute_id | html %]"
value="itiva" />
[% END %]
</td>
[% ELSE %]
<td>-</td>
[% END %]
[% END %]
[% IF ( messaging_preference.transport_email ) %]
<td class="selectcol">
[% IF ( messaging_preference.transports_email ) %]
<input type="checkbox" class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" checked="checked" />
[% ELSE %]
<input type="checkbox" class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" />
[% END %]
</td>
[% ELSE %]
<td>-</td>
[% END %]
[% IF ( messaging_preference.has_digest ) %]
<td class="selectcol">
[% IF ( messaging_preference.digest ) %]
<input type="checkbox" id="digest[% messaging_preference.message_attribute_id | html %]" value="[% messaging_preference.message_attribute_id | html %]" name="digest" checked="checked" data-toggle="tooltip" title="You must select a digestible transport to select digests" />
[% ELSE %]
<input type="checkbox" id="digest[% messaging_preference.message_attribute_id | html %]" value="[% messaging_preference.message_attribute_id | html %]" name="digest" data-toggle="tooltip" title="You must select a digestible transport to select digests" />
[% END %]
</td>
[% ELSE %]
<td>-</td>
[% END %]
</tr>
[% END # / FOREACH messaging_preferences%]
</tbody>
</table>
[% IF ( SMSSendDriver || Koha.Preference('TranslateNotices') ) %]
<fieldset class="rows">
<ol>
[% IF ( SMSSendDriver ) %]
<li>
<strong>Notice:</strong> Some charges for text messages may be incurred when using this service. Please check with your mobile service provider if you have questions.
</li>
<li>
<label for="SMSnumber">SMS number:</label>
<input type="text" id="SMSnumber" name="SMSnumber" value="[% SMSnumber | html %]" pattern="^(\+[1-9]\d{0,2})?\d{1,12}$" />
<span class="hint sms_number_help">Please enter numbers only. Prefix the number with + if including the country code.</span>
</li>
[% IF ( SMSSendDriver == 'Email' ) %]
<li>
<label for="sms_provider_id">SMS provider:</label>
<select id="sms_provider_id" name="sms_provider_id">
<option value="">Unknown</option>
[% FOREACH s IN sms_providers %]
[% IF s.id == sms_provider_id %]
<option value="[% s.id | html %]" selected="selected">[% s.name | html %]</option>
[% ELSE %]
<option value="[% s.id | html %]">[% s.name | html %]</option>
[% END %]
[% END %]
</select>
<div class="hint">Please contact a library staff member if you are unsure of your mobile service provider, or you do not see your provider in this list.</div>
</li>
[% END # /IF ( SMSSendDriver == 'Email' ) %]
[% END # /IF SMSSendDriver %]
[% IF Koha.Preference('TranslateNotices') %]
<li>
<label for="lang">Preferred language for notices: </label>
<select id="lang" name="lang">
<option value="default">Default</option>
[% FOR language IN languages %]
[% FOR sublanguage IN language.sublanguages_loop %]
[% IF language.plural %]
[% IF sublanguage.rfc4646_subtag == patron_lang %]
<option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% ELSE %]
<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% END %]
[% ELSE %]
[% IF sublanguage.rfc4646_subtag == patron_lang %]
<option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% ELSE %]
<option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
[% END %]
[% END # /IF language.plural %]
[% END # /FOR sublanguage %]
[% END #/FOR language %]
</select> <!-- /#lang -->
</li>
[% END #/IF Koha.Preference('TranslateNotices') %]
</ol>
</fieldset>
[% END #/IF SMSSendDriver || Koha.Preference('TranslateNotices') %]
<fieldset class="action">
<input type="submit" value="Submit changes" class="btn btn-primary" />
<a class="cancel" href="/cgi-bin/koha/opac-user.pl">Cancel</a>
</fieldset>
</form>
</div> <!-- / #usermessaging -->
[% ELSE %]
<p><strong>You are not allowed to call this page directly</strong></p>
[% END # /IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' ) %]
</div> <!-- / .col-lg-10 -->
</div> <!-- / .row -->
</div> <!-- / .container-fluid -->
</div> <!-- / .main -->
[% INCLUDE 'opac-bottom.inc' %]
[% BLOCK jsinclude %]
<script>
$(document).ready(function(){
$("#info_digests").tooltip();
function toggle_digest(id){
if ( $("#email"+id).prop("checked") || $("#sms"+id).prop("checked") ) {
$("#digest"+id).attr("disabled", false).tooltip('disable');
} else {
$("#digest"+id).attr("disabled", true).prop("checked",false).tooltip('enable');
}
}
// At load time, we want digest disabled if no digest using transport is enabled
$(".pmp_email").each(function(){
toggle_digest(Number($(this).attr("id").replace("email", "")));
});
// If user clears all digest using transports for a notice, disable digest checkbox
$(".pmp_email").click(function(){
toggle_digest(Number($(this).attr("id").replace("email", "")));
});
$(".pmp_sms").click(function(){
toggle_digest(Number($(this).attr("id").replace("sms", "")));
});
});
function normalizeSMS(value){
let has_plus = value.charAt(0) === '+';
let new_value = value.replace(/\D/g,'');
if ( has_plus ) new_value = '+' + new_value;
return new_value;
}
var sms_input = document.getElementById('SMSnumber');
if (typeof sms_input !== 'undefined' && sms_input !== null) {
sms_input.addEventListener('keyup', function(){
var field = sms_input.value;
sms_input.value = normalizeSMS(field);
});
sms_input.addEventListener('paste', function(event) {
let paste = (event.clipboardData || window.clipboardData).getData('text');
setTimeout(function () {
sms_input.value = normalizeSMS(paste);
}, 100);
});
}
</script>
[% END %]