Open-ILS/src/templates-bootstrap/opac/register.tt2

   1 [%- PROCESS "opac/parts/header.tt2";
   2     PROCESS "opac/parts/org_selector.tt2";
   3     WRAPPER "opac/parts/base.tt2";
   4     INCLUDE "opac/parts/topnav.tt2";
   5     ctx.page_title = l("Request Library Card");
   6
   7 # for privacy, reload the page after (default) 5 minutes
   8 refresh_time = ctx.register.settings.refresh_timeout || 300;
   9 ctx.refresh = refresh_time _ '; ' _ ctx.opac_root _ '/home';
  10
  11 # some useful variables and MACROs for display,
  12 # field validation, and added info display
  13
  14 ctx_org = ctx.physical_loc || ctx.search_ou || ctx.aou_tree.id;
  15
  16 # list of the registration fields to (potentially)
  17 # display in the order they should be shown
  18
  19 # post_code is the only field below that is required in the database and
  20 # post_code is only required if an address is created.
  21 # To prevent any of these fields from showing locally, regardless org unit
  22 # settings, simply remove the fields from this list.  In the case of
  23 # addresses, if all address fields are removed, no attempt at creating
  24 # an address will be made (and post_code will no longer be required).
  25
  26 register_fields = [
  27     {class => 'stgu',  name = 'first_given_name', label => l('First Name')},
  28     {class => 'stgu',  name = 'second_given_name', label => l('Middle Name')},
  29     {class => 'stgu',  name = 'family_name', label => l('Last Name')},
  30     {class => 'stgu',  name = 'pref_first_given_name', label => l('Preferred First Name')},
  31     {class => 'stgu',  name = 'pref_second_given_name', label => l('Preferred Middle Name')},
  32     {class => 'stgu',  name = 'pref_family_name', label => l('Preferred Last Name')},
  33     {class => 'stgma', name = 'street1', label => l('Street Address')},
  34     {class => 'stgma', name = 'street2', label => l('Street Address (2)')},
  35     {class => 'stgma', name = 'city', label => l('City')},
  36     {class => 'stgma', name = 'county', label => l('County')},
  37     {class => 'stgma', name = 'state', label => l('State')},
  38     {class => 'stgma', name = 'post_code', label => l('Zip Code')},
  39     {class => 'stgu',  name = 'dob', label => l('Date of Birth')},
  40     {class => 'stgu',  name = 'day_phone', label => l('Phone Number')},
  41     {class => 'stgu',  name = 'email', label => l('Email Address')}
  42     {class => 'stgu',  name = 'usrname', label => l('Requested Username')}
  43 ];
  44
  45
  46
  47 %]
  48
  49 <h2 class="sr-only">[% l('Account Registration') %]</h2>
  50 <div id="content-wrapper">
  51     <div id="main-content-register" class="container">
  52         <h1>[% l('Request a Library Card')%]</h1>
  53         <span class="validate">&bigstar; = Required Field</span>
  54         <hr/>
  55
  56         [% IF ctx.register.success %]
  57             <h3>[% l('Registration successful!') %]<h3>
  58             <h4>[% l('Please see library staff to complete your registration.') %]</h4>
  59
  60             [% IF ctx.register.username_taken %]
  61             <p>
  62                 [% |l %]
  63                 Note: The selected username may be in use by another patron.
  64                 You may select another username when finalizing your
  65                 registration or in the online catalog.
  66                 [% END %]
  67             </p>
  68             [% END %]
  69
  70             <br/>
  71             <p>
  72                 <a href="[% ctx.opac_root %]/home"
  73                     class="btn btn-confirm">[% l('Return to the Catalog') %]</a>
  74             </p>
  75
  76         [% ELSIF ctx.register.error %]
  77             <h3>[% l('A registration error has occurred') %]</h3>
  78             <h4>[% l('Please see library staff to complete your registration.') %]</h4>
  79
  80             <br/>
  81             <p>
  82                 <a href="[% ctx.opac_root %]/home"
  83                     class="btn btn-confirm">[% l('Return to the Catalog') %]</a>
  84             </p>
  85
  86         [% ELSE %]
  87
  88         [% IF ctx.user %]
  89             <!-- if the user is logged in, make it
  90                 clear we are tracking the requestor -->
  91             <h4>[% l('New account requested by [_1] [_2] [_3] [_4] [_5]',
  92                     ctx.user.prefix, ctx.user.first_given_name,
  93                     ctx.user.second_given_name, ctx.user.family_name,
  94                     ctx.user.suffix
  95                 ) | html %]</h4>
  96         [% END %]
  97
  98         <form method='POST' class="needs-validation" novalidate>
  99             <table class="w-100">
 100                 <tr>
 101                     <td width="30">
 102                         <label for='stgu.home_ou'>[% l('Home Library') %]</label>
 103                     </td>
 104                     <td width="50">[% INCLUDE build_org_selector
 105                             name='stgu.home_ou'
 106                             value=value || ctx_org
 107                             can_have_users_only=1
 108                             valid_org_list=ctx.register.valid_orgs
 109                         %]
 110                     </td>
 111                     <td width="20" >
 112                         [% IF ctx.register.invalid.bad_home_ou %]
 113                         <span class='patron-reg-invalid'>
 114                             [% l('Please select a valid library') %]
 115                         </span>
 116                         [% END %]
 117                 </tr>
 118
 119 [%
 120 # <=== shifting code left for readability
 121
 122 # render the table row for each of the register fields
 123 FOR field_def IN register_fields;
 124     fclass = field_def.class;
 125     fname = field_def.name;
 126     orig_name = fname;
 127
 128     field_path = fclass _ "." _ fname;
 129
 130     IF fname.match('^pref_');
 131         # Preferred name fields adopt most visibility, etc.
 132         # settings from the primary name counterparts.
 133         fname = fname.remove('^pref_');
 134     END;
 135
 136     show = ctx.register.settings.$fclass.$fname.show;
 137     require = ctx.register.settings.$fclass.$fname.require;
 138     example = ctx.register.settings.$fclass.$fname.example;
 139     value = ctx.register.values.$fclass.$fname;
 140
 141     invalid_require = ctx.register.invalid.$fclass.$fname.require;
 142     invalid_regex = ctx.register.invalid.$fclass.$fname.regex;
 143
 144     IF orig_name.match('^pref_');
 145         show = show || require;
 146         require = 0; # pref name values never required
 147     END;
 148
 149     NEXT UNLESS require OR show;
 150 %]
 151 <tr>
 152     <td>
 153         <label for='[% field_path %]'>[% field_def.label | html %]</label>
 154     </td>
 155     <td class="py-3">
 156     [% IF fname == "dob"; %]
 157      <div class="input-group date" data-provide="datepicker-inline">
 158         <input type="text" class="form-control datepicker" id='[% field_path %]'
 159             name='[% field_path %]' value='[% value || CGI.param(field_path) | html %]' [% IF require %]required[% END %] data-date-format="yyyy-mm-dd" />
 160         <div class="input-group-addon">
 161             <span class="glyphicon glyphicon-th"></span>
 162         </div>
 163     </div>
 164     [% ELSE; %]
 165         <input
 166             class='form-control'
 167             type='text'
 168             id='[% field_path %]'
 169             name='[% field_path %]'
 170             value='[% value || CGI.param(field_path) | html %]' [% IF require %]required[% END %]/>
 171      [% END %]
 172         <div class="invalid-feedback">
 173           Please enter a [% field_def.label | html %]
 174         </div>
 175          [% IF example %]
 176         <span class='patron-reg-extra'>
 177             [% l('(Example: [_1])', example) %]
 178         </span>
 179     [% END %]
 180     </td>
 181     <td>
 182         [% IF require %]
 183         <span class="validate">&bigstar;</span>
 184         [% END %]
 185     <!-- display errors and example text -->
 186
 187     [% IF invalid_require %]
 188         <span class='patron-reg-invalid'>
 189             [% l('This field is required') %]
 190         </span>
 191     [% ELSIF invalid_regex %]
 192         <span class='patron-reg-invalid'>
 193             [% l('The value entered does not have the correct format') %]
 194         </span>
 195     [% END %]
 196     [% IF example %]
 197         <span class='patron-reg-extra'>
 198             [% l('(Example: [_1])', example) %]
 199         </span>
 200     [% END %]
 201
 202     </td>
 203 </tr>
 204 [% END %]
 205 <!-- ====> shifting the code back to the right for context -->
 206                     [% IF ctx.register.opt_in_settings.size > 0 %]
 207                         [% FOR optin IN ctx.register.opt_in_settings %]
 208                         <tr>
 209                             <td><label for="stgs.[% optin.name | uri %]'">[% optin.label | html %]</label></td>
 210                             <td>
 211                                 <input type='checkbox'
 212                                     name='stgs.[% optin.name | uri %]'
 213                                     id='stgs.[% optin.name | uri %]'
 214                                     title="[% optin.label | html %]"
 215                                 ></input>
 216                             </td>
 217                             <td><!-- display errors and example text --></td>
 218                         </tr>
 219                         [% END %]
 220                     [% END %]
 221                     <tr>
 222                         <td colspan='3' class="text-center py-4">
 223                             <a href="[% ctx.opac_root %]/home"
 224                                 class="btn btn-confirm">[% l('Go Back') %]</a>
 225                             <input type="submit"
 226                                 value="[% l('Submit Registration') %]"
 227                                 class="btn btn-confirm" />
 228                         </td>
 229                     </tr>
 230                 </table>
 231             </form>
 232             [% END %]
 233         </div>
 234     </div>
 235 [%- END %]
 236 <script>
 237 (function() {
 238   'use strict';
 239   window.addEventListener('load', function() {
 240     // Fetch all the forms we want to apply custom Bootstrap validation styles to
 241     var forms = document.getElementsByClassName('needs-validation');
 242     // Loop over them and prevent submission
 243     var validation = Array.prototype.filter.call(forms, function(form) {
 244       form.addEventListener('submit', function(event) {
 245         if (form.checkValidity() === false) {
 246           event.preventDefault();
 247           event.stopPropagation();
 248         }
 249         form.classList.add('was-validated');
 250       }, false);
 251     });
 252   }, false);
 253 })();
 254
 255 $(document).ready(function(){
 256    $('.datepicker').datepicker({
 257         weekStart: 1,
 258         autoclose: true,
 259         todayHighlight: true,
 260     });
 261     $('.datepicker').datepicker("setDate", new Date());
 262 });
 263 </script>