[% DOC_IMG = '/images/question-mark.png' %]

<!-- register banner -->
<div ng-if="!patron_id" class='patron-reg-fixed-bar'>

  <div class="container-fluid" style="text-align:center">
    <div class="alert alert-info alert-less-pad strong-text-2">
      <span >[% l('Register Patron') %]</span>
    </div>
  </div>

  <div class="flex-row" class='patron-reg-actions-bar'>
    [% INCLUDE 'staff/circ/patron/reg_actions.tt2' %]
  </div>
</div>


<!-- edit banner -->
<div ng-if="patron_id"
    class="strong-text-2">[% l('Patron Edit') %]</div>

<!-- IDL field documentation window -->
<fieldset id="reg-field-doc" ng-show="selected_field_doc">
  <legend>
  {{idl_fields[selected_field_doc.fm_class()][selected_field_doc.field()].label}}
  </legend>
  <div>{{selected_field_doc.string()}}</div>
</fieldset>

[% MACRO formfield(cls, field, path, input_type) BLOCK;

  # input field generator for common text/number/checkbox fields

  IF NOT input_type; input_type = 'text'; END %] 

<div class="row reg-field-row" 
  ng-show="show_field('[% cls _ '.' _ field %]')">

  <div class="col-md-3 reg-field-label"> <!-- field label -->

    <label>{{idl_fields.[% cls %].[% field %].label}}</label>

    <!-- field documentation img/link -->
    <img ng-show="field_doc.[% cls %].[% field %]" 
      ng-click="selected_field_doc=field_doc.[% cls %].[% field %]"
      src='[% DOC_IMG %]'></img>
  </div>

  <div class="col-md-3 reg-field-input"> <!-- field form input -->

  [% model = path ? 'patron.' _ path _ '.' _ field : 'patron.' _ field %]

  [% IF input_type == 'checkbox' %]

    <div class='checkbox'>
      <input type='checkbox' ng-model='[% model %]'/>
    </div>

  [% ELSE %]
    <!-- text / number input -->

    [% IF field == 'alert_message' %]
      <textarea class="form-control" ng-model="[% model %]"/>
    [% ELSIF field == 'post_code' %]
      <input type="text" ng-blur="post_code_changed(patron.[% path %])"
        class="form-control" ng-model="[% model %]"/>
    [% ELSIF field == 'barcode' %]
      <input type="text" 
        focus-me="focus_bc"
        ng-disabled="disable_bc"
        ng-blur="barcode_changed(patron.card.barcode)"
        class="form-control" ng-model="[% model %]"/>
    [% ELSIF field == 'usrname' %]
      <input type="text" 
        focus-me="focus_usrname"
        ng-blur="usrname_changed(patron.usrname)"
        class="form-control" ng-model="[% model %]"/>
    [% ELSE %]
      <input type="[% input_type %]" 
        class="form-control" ng-model="[% model %]"/>
    [% END %]
  [% END %]

  </div>

  <!-- supplemental actions and example text -->
  <div class="col-md-6 patron-reg-example">

    [% IF field == 'barcode' %]

      <button class="btn btn-default"
        ng-click="replace_card()">[% l('Replace Barcode') %]</button>
      <button class="btn btn-default" 
        ng-click="cards_dialog()">[% l('See All') %]</button>

    [% ELSIF field == 'passwd' %]

      <button class="btn btn-default" ng-click="generate_password()">
        [% l('Generate Password') %]</button>

    [% ELSE %]

      <!-- invalidate buttons -->

      [% IF field.match('phone') OR field.match('email') %]
        <button ng-show="patron.[% field %]" class="btn btn-default"
          ng-click="">[% l('Invalidate') %]</button>
      [% END %]

      <!-- example strings -->

      [% set_str = "org_settings['ui.patron.edit." _ 
          cls _ "." _ field _ ".example']"; %]

      <span ng-if="[% set_str %]">
        [% l('Example: [_1]', "{{" _ set_str _ "}}") %]
      </span>

      <!-- phones have a fall-through example strings -->
      [% IF field.match('phone') %]
        <span ng-if="![% set_str %] && org_settings['ui.patron.edit.phone.example']">
          [% l('Example: [_1]', 
          "{{org_settings['ui.patron.edit.phone.example']}}") %]
        </span>
      [% END %]
    [% END %]
  </div>
</div>
[% END %]

[% formfield('ac', 'barcode', 'card') %]
[% formfield('au', 'usrname') %]
[% formfield('au', 'passwd') %]
[% formfield('au', 'prefix') %]
[% formfield('au', 'first_given_name') %]
[% formfield('au', 'second_given_name') %]
[% formfield('au', 'family_name') %]
[% formfield('au', 'suffix') %]
[% formfield('au', 'alias') %]

<div class="row reg-field-row" ng-show="show_field('au.dob')">
  <div class="col-md-3 reg-field-label">
    <label>{{idl_fields.au.dob.label}}</label>
    <img ng-show="field_doc.au.dob" 
      ng-click="selected_field_doc=field_doc.au.dob"
      src='[% DOC_IMG %]'></img>
  </div>
  <div class="col-md-3 reg-field-input">
    <input eg-date-input 
      class="form-control" ng-model="patron.dob"/>
  </div>
</div>

[% formfield('au', 'juvenile', '', 'checkbox') %]

<!-- ident_type -->

<div class="row reg-field-row" ng-show="show_field('au.ident_type')">
  <div class="col-md-3 reg-field-label">
    <label>{{idl_fields.au.ident_type.label}}</label>
    <img ng-show="field_doc.au.ident_type" 
      ng-click="selected_field_doc=field_doc.au.ident_type"
      src='[% DOC_IMG %]'></img>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class="btn-group" dropdown>
      <button type="button" class="btn btn-default dropdown-toggle">
        <span style="padding-right: 5px;">
          {{patron.ident_type.name() || "[% l('Primary Ident Type') %]"}}
        </span>
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        <li ng-repeat="type in ident_types">
          <a href ng-click="patron.ident_type = type">{{type.name()}}</a>
        </li>
      </ul>
    </div>
  </div>
</div>


[% formfield('au', 'ident_value') %]
[% formfield('au', 'ident_value2') %]
[% formfield('au', 'email', '', 'email') %]
[% formfield('au', 'day_phone') %]
[% formfield('au', 'evening_phone') %]
[% formfield('au', 'other_phone') %]

<!-- home org unit selector -->

<div class="row reg-field-row" ng-show="show_field('au.home_ou')">
  <div class="col-md-3 reg-field-label">
    <label>{{idl_fields.au.home_ou.label}}</label>
    <img ng-show="field_doc.au.home_ou" 
      ng-click="selected_field_doc=field_doc.au.home_ou"
      src='[% DOC_IMG %]'></img>
    </div>
    <div class="col-md-3 reg-field-input">
      <eg-org-selector selected="patron.home_ou" onchange="">
      </eg-org-selector>
  </div>
</div>

<!-- profile selector -->

<div class="row reg-field-row" ng-show="show_field('au.profile')">
  <div class="col-md-3 reg-field-label">
    <label>{{idl_fields.au.profile.label}}</label>
    <img ng-show="field_doc.au.profile" 
      ng-click="selected_field_doc=field_doc.au.profile"
      src='[% DOC_IMG %]'></img>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class="btn-group" dropdown>
      <button type="button" class="btn btn-default dropdown-toggle">
        <span style="padding-right: 5px;">
          {{patron.profile.name() || "[% l('Profile Group') %]"}}
        </span>
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        <li ng-repeat="grp in profiles">
          <a href 
            style="padding-left: {{pgt_depth(grp) * 10 + 5}}px"
            ng-click="set_profile(grp)">{{grp.name()}}</a>
        </li>
      </ul>
    </div>
  </div>
  <div class="col-md-3">
    <button class="btn btn-default">[% l('Secondary Groups') %]</button>
  </div> 
</div>

<div class="row reg-field-row" ng-show="show_field('au.expire_date')">
  <div class="col-md-3 reg-field-label">
  <label>{{idl_fields.au.expire_date.label}}</label>
    <img ng-show="field_doc.au.expire_date" 
    ng-click="selected_field_doc=field_doc.au.expire_date"
    src='[% DOC_IMG %]'></img>
  </div>
  <div class="col-md-3 reg-field-input">
    <input eg-date-input 
      class="form-control" ng-model="patron.expire_date"/>
  </div>
  <div class="col-md-3">
    <button class="btn btn-default" ng-click="set_expire_date()">
      [% l('Update Expire Date') %]</button>
  </div>
</div>

<!-- net_access_level -->

<div class="row reg-field-row" ng-show="show_field('au.net_access_level')">
  <div class="col-md-3 reg-field-label">
    <label>{{idl_fields.au.net_access_level.label}}</label>
    <img ng-show="field_doc.au.net_access_level" 
      ng-click="selected_field_doc=field_doc.au.net_access_level"
      src='[% DOC_IMG %]'></img>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class="btn-group" dropdown>
      <button type="button" class="btn btn-default dropdown-toggle">
        <span style="padding-right: 5px;">
          {{patron.net_access_level.name() || "[% l('Net Access Level') %]"}}
        </span>
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        <li ng-repeat="level in net_access_levels">
          <a href 
            ng-click="patron.net_access_level = level">{{level.name()}}</a>
        </li>
      </ul>
    </div>
  </div>
</div>

[% formfield('au', 'active', '', 'checkbox') %]
[% formfield('au', 'barred', '', 'checkbox') %]
[% formfield('au', 'master_account', '', 'checkbox') %]
[% formfield('au', 'claims_returned_count', '', 'number') %]
[% formfield('au', 'claims_never_checked_out_count', '', 'number') %]
[% formfield('au', 'alert_message') %]

<div class="alert alert-success row" role="alert">
  <div class="col-md-6">[% l('User Settings') %]</div>
</div>

<div class="row reg-field-row">
  <div class="col-md-3 reg-field-label">
    <label>{{user_setting_types['opac.default_phone'].label()}}</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <input type='text' ng-model="user_settings['opac.default_phone']"/>
  </div>
</div>

<div class="row reg-field-row">
  <div class="col-md-3 reg-field-label">
    <label>{{user_setting_types['opac.default_pickup_location'].label()}}</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <eg-org-selector selected="patron.home_ou" onchange=""></eg-org-selector>
  </div>
</div>

<div class="row reg-field-row">
  <div class="col-md-3 reg-field-label">
    <label>{{user_setting_types['circ.holds_behind_desk'].label()}}</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class='checkbox'>
      <input type='checkbox' ng-model="user_settings['circ.holds_behind_desk']"/>
    </div>
  </div>
</div>

<div class="row reg-field-row">
  <div class="col-md-3 reg-field-label">
    <label>[% l('Holds Notices') %]</label>
  </div>
  <div class="col-md-3 reg-field-input flex-row">
    <div class='flex-cell'>
      <input type='checkbox' ng-model="hold_notify_phone"/>
      [% l('Phone') %]
    </div>
    <div class='flex-cell'>
      <input type='checkbox' ng-model="hold_notify_email"/>
      [% l('Email') %]
    </div>
    <div class='flex-cell' ng-if="org_settings['sms.enable']">
      <input type='checkbox' ng-model="hold_notify_sms"/>
      [% l('SMS') %]
    </div>
  </div>
</div>

<div class="row reg-field-row" ng-if="org_settings['sms.enable']">
  <div class="col-md-3 reg-field-label">
    <label>[% l('Default SMS/Text Number') %]</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <input type='text'/>
  </div>
</div>

<div class="row reg-field-row" ng-if="org_settings['sms.enable']">
  <div class="col-md-3 reg-field-label">
    <label>[% l('Default SMS Carrier') %]</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class="btn-group" dropdown>
      <button type="button" class="btn btn-default dropdown-toggle">
        <span style="padding-right: 5px;"></span>
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        <li ng-repeat="carrier in sms_carriers">
          <a href 
            ng-click="user_settings['opac.default_sms_carrier'] = carrier">
                {{carrier.name()}}
          </a>
        </li>
      </ul>
    </div>
  </div>
</div>


<!-- addresses -->


<div ng-repeat="addr in patron.addresses">
  <div class="alert alert-success row" role="alert">
      <div class="col-md-3">[% l('Address') %]</div>
      <div class="col-md-3">
          <span class='pad-all-min'>
            [% l('Mailing') %] <input type='checkbox' 
              ng-change="set_addr_type(addr, 'mailing')" 
              ng-model="addr._is_mailing"/>
          </span>
          <span class='pad-all-min'>
            [% l('Physical') %] <input type='checkbox' 
              ng-change="set_addr_type(addr, 'billing')" 
              ng-model="addr._is_billing"/>
          </span>
          <span class='pad-all-min'>
            <button type="button" ng-click="delete_address(addr.id)" 
              class="btn btn-danger">[% l('X') %]</button>
          </span>
      </div>
  </div>

  [% formfield('aua', 'address_type', 'addresses[$index]') %]
  [% formfield('aua', 'post_code', 'addresses[$index]') %]
  [% formfield('aua', 'street1', 'addresses[$index]') %]
  [% formfield('aua', 'street2', 'addresses[$index]') %]
  [% formfield('aua', 'city', 'addresses[$index]') %]
  [% formfield('aua', 'county', 'addresses[$index]') %]
  [% formfield('aua', 'state', 'addresses[$index]') %]
  [% formfield('aua', 'country', 'addresses[$index]') %]
  [% formfield('aua', 'valid', 'addresses[$index]', 'checkbox') %]
  [% formfield('aua', 'within_city_limits', 'addresses[$index]', 'checkbox') %]

  <div class="row" ng-if="$last">
    <button type="button" ng-click="new_address()" 
      class="btn btn-success">[% l('New Address') %]</button>
  </div>

  <!-- pending address -->

</div> <!-- addresses -->

<div class="alert alert-success row" role="alert" 
    ng-show="show_field('stat_cats')" ng-if="stat_cats.length > 0">
    <div class="col-md-6">[% l('Statistical Categories') %]</div>
</div>

<div class="row reg-field-row" 
    ng-show="show_field('stat_cats')" ng-repeat="cat in stat_cats">
  <div class="col-md-3 reg-field-label">
    <label>{{cat.name()}}</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <div ng-if="cat.entries().length == 0">
      <input type="text" class="form-control"/>
    </div>
    <div ng-if="cat.entries().length != 0">
      <div class="btn-group" dropdown>
        <button type="button" class="btn btn-default dropdown-toggle">
          <span style="padding-right: 5px;"></span>
          <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
          <li ng-repeat="entry in cat.entries()">
            <a href ng-click=""> {{entry.value()}} </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>

<!-- surveys -->

<div class="alert alert-success row" role="alert" 
    ng-show="show_field('surveys')" ng-if="surveys.length > 0">
    <div class="col-md-6">[% l('Surveys') %]</div>
</div>

<div class="row reg-field-row" 
    ng-show="show_field('surveys')" ng-repeat="survey in surveys">
  <div class="col-md-3 reg-field-label">
    <label>{{survey.name()}}</label>
  </div>
  <div class="col-md-3 reg-field-input">
    <div class="btn-group" dropdown>
      <button type="button" class="btn btn-default dropdown-toggle">
        <span style="padding-right: 5px;"></span>
        <span class="caret"></span>
      </button>
      <ul class="dropdown-menu">
        <li ng-repeat="question in survey.questions()">
          <a href ng-click=""> {{question.question()}} </a>
        </li>
      </ul>
    </div>
  </div>
</div>