Bug 33812: Checkboxes need labels in opac-messaging.tt
[koha.git] / koha-tmpl / opac-tmpl / bootstrap / en / modules / opac-messaging.tt
1 [% USE Koha %]
2 [% USE AdditionalContents %]
3 [% SET OpacNav = AdditionalContents.get( location => "OpacNav", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
4 [% SET OpacNavBottom = AdditionalContents.get( location => "OpacNavBottom", lang => lang, library => logged_in_user.branchcode || default_branch, blocktitle => 0 ) %]
5 [% INCLUDE 'doc-head-open.inc' %]
6 <title>Your messaging settings &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
7 [% INCLUDE 'doc-head-close.inc' %]
8 [% BLOCK cssinclude %][% END %]
9 </head>
10 [% INCLUDE 'bodytag.inc' bodyid='opac-messaging' %]
11 [% INCLUDE 'masthead.inc' %]
12
13 <div class="main">
14     <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumbs">
15         <ol class="breadcrumb">
16             <li class="breadcrumb-item">
17                 <a href="/cgi-bin/koha/opac-main.pl">Home</a>
18             </li>
19             <li class="breadcrumb-item">
20                 <a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
21             </li>
22             <li class="breadcrumb-item active">
23                 <a href="#" aria-current="page">Your messaging settings</a>
24             </li>
25         </ol>
26     </nav> <!-- /#breadcrumbs -->
27
28     <div class="container-fluid">
29         <div class="row">
30             <div class="col col-lg-2 order-2 order-lg-1">
31                 <div id="navigation">
32                     [% INCLUDE 'navigation.inc' IsPatronPage=1 %]
33                 </div>
34             </div>
35             <div class="col-md-12 col-lg-10 order-1">
36
37                 [% IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' ) || Koha.Preference('TranslateNotices') %]
38                     <div id="usermessaging" class="maincontent">
39                         <h1>Your messaging settings</h1>
40                         [% IF ( settings_updated ) %]
41                         <div class="alert alert-success"><p><strong>Settings updated</strong></p></div>
42                         [% END %]
43                         <form action="/cgi-bin/koha/opac-messaging.pl" method="post" name="opacmessaging">
44                             <input type="hidden" name="csrf_token" value="[% csrf_token | html %]" />
45                             <input type="hidden" name="modify" value="yes" />
46
47                             [% IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' )  %]
48                                 <table class="table table-bordered table-condensed table-striped">
49                                     <caption class="sr-only">Your messaging settings</caption>
50                                     <thead>
51                                         <tr>
52                                             <th>&nbsp;</th>
53                                             <th>Days in advance</th>
54                                             [% IF ( SMSSendDriver ) %]<th>SMS</th>[% END %]
55                                             [% IF ( TalkingTechItivaPhone ) %]<th>Phone</th>[% END %]
56                                             [% IF Koha.Preference('PhoneNotification') %]<th>Phone</th>[% END %]
57                                             <th>Email</th>
58                                             <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>
59                                             <th></th>
60                                         </tr>
61                                     </thead>
62                                     <tbody>
63                                     [% FOREACH messaging_preference IN messaging_preferences %]
64                                         [% NEXT IF !Koha.Preference( 'ILLModule' ) && messaging_preference.message_name.match('^Ill_') %]
65                                         [% NEXT IF messaging_preference.Auto_Renewals && Koha.Preference('AutoRenewalNotices') != 'preferences' %]
66                                         <tr id="[% messaging_preference.message_name _ "_message" | lower | html %]">
67                                             <td>[% IF ( messaging_preference.Item_Due ) %]<span>Item due</span>
68                                                 [% ELSIF ( messaging_preference.Advance_Notice ) %]<span>Advance notice</span>
69                                                 [% ELSIF ( messaging_preference.Hold_Filled ) %]<span>Hold filled</span>
70                                                 [% ELSIF ( messaging_preference.Hold_Reminder ) %]<span>Hold reminder</span>
71                                                 [% ELSIF ( messaging_preference.Item_Check_in ) %]<span>Item check-in</span>
72                                                 [% ELSIF ( messaging_preference.Item_Checkout ) %]
73                                                     [% IF Koha.Preference( 'RenewalSendNotice' ) %]
74                                                         <span>Item checkout and renewal</span>
75                                                     [% ELSE %]
76                                                         <span>Item checkout</span>
77                                                     [% END %]
78                                                 [% ELSIF ( messaging_preference.Ill_ready ) %]<span>Interlibrary loan ready</span>
79                                                 [% ELSIF ( messaging_preference.Ill_unavailable ) %]<span>Interlibrary loan unavailable</span>
80                                                 [% ELSIF ( messaging_preference.Ill_update ) %]<span>Interlibrary loan updated</span>
81                                                 [% ELSIF ( messaging_preference.Auto_Renewals ) %]<span>Auto renewal</span>
82                                                 [% ELSE %]<span>Unknown</span> [% END %]</td>
83                                             [% IF ( messaging_preference.takes_days ) %]
84                                                 <td><select class="input-mini" name="[% messaging_preference.message_attribute_id | html %]-DAYS" aria-label="Choose how many days in advance you wish to receive notice">
85                                                 [% FOREACH select_day IN messaging_preference.select_days %]
86                                                     [% IF ( select_day.selected ) %]
87                                                         <option value="[% select_day.day | html %]" selected="selected">[% select_day.day | html %]</option>
88                                                     [% ELSE %]
89                                                         <option value="[% select_day.day | html %]">[% select_day.day | html %]</option>
90                                                     [% END %]
91                                                 [% END %]
92                                                 </select></td>
93                                             [% ELSE %]
94                                                 <td>-</td>
95                                             [% END %]
96                                             [% IF ( SMSSendDriver ) %]
97                                                 [% IF ( messaging_preference.transport_sms ) %]
98                                                     <td class="selectcol">
99                                                         [% IF ( messaging_preference.transports_sms ) %]
100                                                         <input type="checkbox" aria-label="Unselect sms messaging" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" checked="checked" />
101                                                         [% ELSE %]
102                                                             <input type="checkbox" aria-label="Select sms messaging" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" />
103                                                         [% END %]
104                                                     </td>
105                                                 [% ELSE %]
106                                                     <td>-</td>
107                                                 [% END %]
108                                             [% END %]
109                                             [% IF Koha.Preference('PhoneNotification') %]
110                                                 [% IF ( messaging_preference.transport_phone ) %]
111                                                     <td class="selectcol">
112                                                         [% IF ( messaging_preference.transports_phone ) %]
113                                                             <input type="checkbox"
114                                                                    aria-label="Unselect notification by phone"
115                                                                    class="pmp_phone"
116                                                                    id="phone[% messaging_preference.message_attribute_id | html %]"
117                                                                    name="[% messaging_preference.message_attribute_id | html %]"
118                                                                    value="phone" checked="checked" />
119                                                         [% ELSE %]
120                                                             <input type="checkbox"
121                                                                    aria-label="Select notification by phone"
122                                                                    class="pmp_phone"
123                                                                    id="phone[% messaging_preference.message_attribute_id | html %]"
124                                                                    name="[% messaging_preference.message_attribute_id | html %]"
125                                                                    value="phone" />
126                                                         [% END %]
127                                                     </td>
128                                                 [% ELSE %]
129                                                     <td>-</td>
130                                                 [% END %]
131                                             [% END %]
132                                             [% IF ( TalkingTechItivaPhone ) %]
133                                                 [% IF ( messaging_preference.transport_itiva ) %]
134                                                 <td class="selectcol">
135                                                 [% IF ( messaging_preference.transports_itiva ) %]
136                                                 <input type="checkbox"
137                                                             aria-label="Unselect itiva messaging"
138                                                             class="itiva"
139                                                             id="itiva[% messaging_preference.message_attribute_id | html %]"
140                                                             name="[% messaging_preference.message_attribute_id | html %]"
141                                                             value="itiva" checked="checked" />
142                                                 [% ELSE %]
143                                                 <input type="checkbox"
144                                                             aria-label="Select notification by phone"
145                                                             class="itiva"
146                                                             id="itiva[% messaging_preference.message_attribute_id | html %]"
147                                                             name="[% messaging_preference.message_attribute_id | html %]"
148                                                             value="itiva" />
149                                                 [% END %]
150                                                 </td>
151                                                 [% ELSE %]
152                                                     <td>-</td>
153                                                 [% END %]
154                                             [% END %]
155
156                                             [% IF ( messaging_preference.transport_email ) %]
157                                                 <td class="selectcol">
158                                                     [% IF ( messaging_preference.transports_email ) %]
159                                                         <input type="checkbox" aria-label="Unselect email messaging"class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" checked="checked" />
160                                                     [% ELSE %]
161                                                         <input type="checkbox" aria-label="Select email messaging" class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" />
162                                                     [% END %]
163                                                 </td>
164                                             [% ELSE %]
165                                                 <td>-</td>
166                                             [% END %]
167
168                                             [% IF ( messaging_preference.has_digest ) %]
169                                                 <td class="selectcol">
170                                                     [% IF ( messaging_preference.digest ) %]
171                                                         <input type="checkbox" aria-label="Unselect digests" 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" />
172                                                     [% ELSE %]
173                                                         <input type="checkbox" aria-label="Select digests"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" />
174                                                     [% END %]
175                                                 </td>
176                                             [% ELSE %]
177                                             <td>-</td>
178                                             [% END %]
179                                             <td></td>
180
181                                         </tr>
182                                     [% END # / FOREACH messaging_preferences%]
183                                     </tbody>
184                                 </table>
185                             [% END %]
186
187                             [% IF ( SMSSendDriver || Koha.Preference('TranslateNotices') ) %]
188                                 <fieldset class="rows">
189                                     <ol>
190                                         [% IF ( SMSSendDriver ) %]
191                                             <li>
192                                                 <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.
193                                             </li>
194                                             <li>
195                                                 <label for="SMSnumber">SMS number:</label>
196                                                 <input type="text" id="SMSnumber" name="SMSnumber" value="[% SMSnumber | html %]" pattern="^(\+[1-9]\d{0,2})?\d{1,12}$" />
197                                                 <span class="hint sms_number_help">Please enter numbers only. Prefix the number with + if including the country code.</span>
198                                             </li>
199
200                                             [% IF ( SMSSendDriver == 'Email' ) %]
201                                                 <li>
202                                                     <label for="sms_provider_id">SMS provider:</label>
203                                                     <select id="sms_provider_id" name="sms_provider_id">
204                                                         <option value="">Unknown</option>
205                                                         [% FOREACH s IN sms_providers %]
206                                                             [% IF s.id == sms_provider_id %]
207                                                                 <option value="[% s.id | html %]" selected="selected">[% s.name | html %]</option>
208                                                             [% ELSE %]
209                                                                 <option value="[% s.id | html %]">[% s.name | html %]</option>
210                                                             [% END %]
211                                                         [% END %]
212                                                     </select>
213                                                     <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>
214                                                 </li>
215                                             [% END # /IF ( SMSSendDriver == 'Email' ) %]
216                                         [% END # /IF SMSSendDriver %]
217
218                                         [% IF Koha.Preference('TranslateNotices') %]
219                                             <li>
220                                                 <label for="lang">Preferred language for notices: </label>
221                                                 <select id="lang" name="lang">
222                                                     <option value="default">Default</option>
223                                                     [% FOR language IN languages %]
224                                                         [% FOR sublanguage IN language.sublanguages_loop %]
225                                                             [% IF language.plural %]
226                                                                 [% IF sublanguage.rfc4646_subtag == patron_lang %]
227                                                                     <option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
228                                                                 [% ELSE %]
229                                                                     <option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
230                                                                 [% END %]
231                                                             [% ELSE %]
232                                                                 [% IF sublanguage.rfc4646_subtag == patron_lang %]
233                                                                     <option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
234                                                                 [% ELSE %]
235                                                                     <option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
236                                                                 [% END %]
237                                                             [% END # /IF language.plural %]
238                                                         [% END # /FOR sublanguage %]
239                                                     [% END #/FOR language %]
240                                                 </select> <!-- /#lang -->
241                                             </li>
242                                         [% END #/IF Koha.Preference('TranslateNotices') %]
243                                     </ol>
244                                 </fieldset>
245                             [% END #/IF SMSSendDriver || Koha.Preference('TranslateNotices') %]
246
247                             <fieldset class="action">
248                                 <input type="submit" value="Submit changes" class="btn btn-primary" />
249                                 <a class="cancel" href="/cgi-bin/koha/opac-user.pl">Cancel</a>
250                             </fieldset>
251                         </form>
252                     </div> <!-- / #usermessaging -->
253                 [% ELSE %]
254                 <p><strong>You are not allowed to call this page directly</strong></p>
255                 [% END # /IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' ) %]
256            </div> <!-- / .col-lg-10 -->
257         </div> <!-- / .row -->
258     </div> <!-- / .container-fluid -->
259 </div> <!-- / .main -->
260
261 [% INCLUDE 'opac-bottom.inc' %]
262 [% BLOCK jsinclude %]
263     [% INCLUDE 'datatables.inc' %]
264     <script>
265         $(document).ready(function(){
266             $("#info_digests").tooltip();
267
268             function toggle_digest(id){
269                 let PhoneNotification = [% Koha.Preference('PhoneNotification') || 0 | html %];
270                 let TalkingTechItivaPhoneNotification = [% Koha.Preference('TalkingTechItivaPhoneNotification') || 0 | html %];
271                 let phone_checked = TalkingTechItivaPhoneNotification ? false : PhoneNotification ? $("#phone"+id).prop("checked") : false;
272
273                 if ( $("#email"+id).prop("checked") || $("#sms"+id).prop("checked") || phone_checked ) {
274                     $("#digest"+id).attr("disabled", false).tooltip('disable');
275                 } else {
276                     $("#digest"+id).attr("disabled", true).prop("checked",false).tooltip('enable');
277                 }
278
279             }
280             // At load time, we want digest disabled if no digest using transport is enabled
281             $(".pmp_email").each(function(){
282                 toggle_digest(Number($(this).attr("id").replace("email", "")));
283             });
284
285             // If user clears all digest using transports for a notice, disable digest checkbox
286             $(".pmp_email").click(function(){
287                 toggle_digest(Number($(this).attr("id").replace("email", "")));
288             });
289             $(".pmp_sms").click(function(){
290                 toggle_digest(Number($(this).attr("id").replace("sms", "")));
291             });
292             $(".pmp_phone").click(function(){
293                 toggle_digest(Number($(this).attr("id").replace("phone", "")));
294             });
295
296         });
297
298         function normalizeSMS(value){
299             let has_plus = value.charAt(0) === '+';
300             let new_value = value.replace(/\D/g,'');
301             if ( has_plus ) new_value = '+' + new_value;
302             return new_value;
303         }
304
305         var sms_input = document.getElementById('SMSnumber');
306
307         if (typeof sms_input !== 'undefined' && sms_input !== null) {
308             sms_input.addEventListener('keyup', function(){
309                 var field = sms_input.value;
310                 sms_input.value = normalizeSMS(field);
311             });
312
313             sms_input.addEventListener('paste', function(event) {
314                 let paste = (event.clipboardData || window.clipboardData).getData('text');
315                 setTimeout(function () {
316                 sms_input.value = normalizeSMS(paste);
317                 }, 100);
318             });
319         }
320         $('.table').dataTable($.extend(true, {}, dataTablesDefaults, {
321             "searching": false,
322             "paging": false,
323             "info": false,
324             "responsive": {
325                 "details": { "type": 'column',"target": -1 }
326             },
327             "columnDefs": [
328                 { "className": 'dtr-control', "orderable": false, "targets": -1 }
329             ],
330         }));
331     </script>
332 [% END %]