<commit_before><!--
Copyright 2016 Capital One Services, LLC

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and limitations under the License.
-->
<div class="container personal-info">
  <div class="very-wide-layout" [ngClass]="{'application-joint':jointAccount, 'application-single':!jointAccount}">
    <section>
      <h1 class="step-title">First, tell us about yourself.</h1>
      <div class="subheading">We need some basic information to confirm your identity.</div>
      <hr />
    </section>
    <section>
      <app-slide-toggle (onSliderToggle)="onSliderToggle($event)"></app-slide-toggle>
    </section>
    <form #personalInfoForm="ngForm" name="personalInfoForm" novalidate (ngSubmit)="submitPersonalInfo(personalInfoForm)" [ngClass]="{'formSubmitted':submitted}" id="pi-main-form">
      <div class="application-container" [ngClass]="{'dotted-centerline':jointAccount}">

        <div *ngFor="let applicant of depositApplicationModel.applicants; let applicantIndex = index" class="application-section" [ngClass]="{'application-primary':(!jointAccount && applicantIndex==0), 'application-secondary':(jointAccount && applicantIndex==1)}">
          <article *ngIf="depositApplicationModel.applicants.length==2" class="account-heading" aria-hidden="false">
            <h2 *ngIf="applicantIndex==0" sticky-top="123" sticky-container="pi-main-form" class="form-header" aria-hidden="false">Primary account holder</h2>
            <h2 *ngIf="applicantIndex==1" sticky-top="123" sticky-container="pi-main-form" class="form-header" aria-hidden="true">Secondary account holder</h2>
          </article>
          <article>
            <div class="form-row-double">
              <div class="form-element first-element">
                <label><span class="label-show-hide">First Name</span></label>
                <input #firstName="ngModel" type="text" name="first_name-{{applicantIndex}}" label="<NAME>" placeholder="<NAME>" [(ngModel)]="applicant.firstName" required id="input-first-name-{{applicantIndex}}" />
                <span *ngIf="!firstName.valid && (!firstName.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
              <!-- /.form-element -->
              <div class="form-element last-element">
                <label><span class="label-show-hide">Last Name</span></label>
                <input #lastName="ngModel" type="text" name="last_name-{{applicantIndex}}" label="<NAME>" placeholder="<NAME>" [(ngModel)]="applicant.lastName" required id="input-last-name-{{applicantIndex}}" />
                <span *ngIf="!lastName.valid && (!lastName.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
              <!-- /.form-element -->
            </div>
            <!-- /.form-row -->
            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Date of Birth</span></label>
                <input #dob="ngModel" name="dob-{{applicantIndex}}" type="text" label="Date of Birth" placeholder="xxxx-xx-xx" [(ngModel)]="applicant.dateOfBirth" required id="input-dob-{{applicantIndex}}" />
                <span *ngIf="!dob.valid && (!dob.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
            </div>
            <!-- /.form-row" -->

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">SSN</span></label>
                <input #ssn="ngModel" name="ssn-{{applicantIndex}}" type="text" label="SSN" placeholder="SSN" [(ngModel)]="applicant.taxId" required id="input-ssn-{{applicantIndex}}" />
                <span *ngIf="!ssn.valid && (!ssn.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
            </div>

          <div class="form-row">
            <div class="form-element">
              <label><span class="label-show-hide">Citizenship Country</span></label>
            <span class="dropdown">
            <select #citizenshipCountry="ngModel" name="citizenship-country-{{applicantIndex}}" type="text"  placeholder="Citizenship Country" required [(ngModel)]="applicant.citizenshipCountry" class="selectfielddrop">
              <option value="Choose Country" selected>Choose Country</option>
              <option *ngFor="let citizenshipCountry of citizenshipCountryArray" [ngValue]="citizenshipCountry.code">
                {{ citizenshipCountry.name }}
              </option>
            </select>
            <span *ngIf="!citizenshipCountry.valid && (!citizenshipCountry.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
            </div>
          </div>



            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Secondary Citizenship Country</span></label>
            <span class="dropdown">
            <select #citizenshipCountry="ngModel" name="secondary-citizenship-country-{{applicantIndex}}" type="text" placeholder="Secondary Citizenship Country" required [(ngModel)]="applicant.citizenshipCountry" class="selectfielddrop">
              <option value="Secondary Citizenship Country" disabled selected>Secondary Citizenship Country</option>
              <option *ngFor="let citizenshipCountry of citizenshipCountryArray" [ngValue]="citizenshipCountry.code">
                {{ citizenshipCountry.name }}
              </option>
            </select>
            <span *ngIf="!citizenshipCountry.valid && (!citizenshipCountry.pristine || submitted)"
                  class="error-text error-show-hide">
            </span>
            </span>
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Employment Status</span></label>
            <span class="dropdown">
            <select #employmentStatus="ngModel" name="employment-status-{{applicantIndex}}" type="text" placeholder="Employment Status" required [(ngModel)]="applicant.employmentStatus" class="selectfielddrop">
              <option value="Choose Status" disabled selected>Choose Status</option>
              <option *ngFor="let employmentStatus of employmentStatusArray" [ngValue]="employmentStatus">
                {{ employmentStatus }}
              </option>
            </select>
            <span *ngIf="!employmentStatus.valid && (!employmentStatus.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Job Title</span></label>
                <input #jobTitle="ngModel" name="jobTitle-{{applicantIndex}}" type="text" label="jobTitle" placeholder="Job Title" [(ngModel)]="applicant.jobTitle" required id="input-jobTitle-{{applicantIndex}}" />
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Annual Income</span></label>
            <span class="dropdown">
            <select #annualIncome="ngModel" name="annual-income" type="text" placeholder="Annual Income" required [(ngModel)]="applicant.annualIncome" class="selectfielddrop">
              <option value="Choose Range" disabled selected>Choose Range</option>
              <option *ngFor="let annualIncome of annualIncomeArray" [ngValue]="annualIncome">
                {{ annualIncome }}
              </option>
            </select>
            <span *ngIf="!annualIncome.valid(!annualIncome.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
              </div>
            </div>




          </article>
          <!-- /.form-row" -->
          <article>
            <div class="form-row">
              <div class="form-element">
                <div class="input-address-line-one">
                  <label><span class="label-show-hide">Home Address</span></label>
                  <input #addressLine1="ngModel" type="text" name="addressLine1-{{applicantIndex}}" label="Home" placeholder="Home Address" [(ngModel)]="applicant.homeAddress.addressLine1" required id="input-address-{{applicantIndex}}" />
                    <span *ngIf="!addressLine1.valid && (!addressLine1.pristine || submitted)"
                          class="error-text error-show-hide">
                      This field is required.
                    </span><commit_msg>Fix and smoke test.<commit_after><!--
Copyright 2016 Capital One Services, LLC

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and limitations under the License.
-->
<div class="container personal-info">
  <div class="very-wide-layout" [ngClass]="{'application-joint':jointAccount, 'application-single':!jointAccount}">
    <section>
      <h1 class="step-title">First, tell us about yourself.</h1>
      <div class="subheading">We need some basic information to confirm your identity.</div>
      <hr />
    </section>
    <section>
      <app-slide-toggle (onSliderToggle)="onSliderToggle($event)"></app-slide-toggle>
    </section>
    <form #personalInfoForm="ngForm" name="personalInfoForm" novalidate (ngSubmit)="submitPersonalInfo(personalInfoForm)" [ngClass]="{'formSubmitted':submitted}" id="pi-main-form">
      <div class="application-container" [ngClass]="{'dotted-centerline':jointAccount}">

        <div *ngFor="let applicant of depositApplicationModel.applicants; let applicantIndex = index" class="application-section" [ngClass]="{'application-primary':(!jointAccount && applicantIndex==0), 'application-secondary':(jointAccount && applicantIndex==1)}">
          <article *ngIf="depositApplicationModel.applicants.length==2" class="account-heading" aria-hidden="false">
            <h2 *ngIf="applicantIndex==0" sticky-top="123" sticky-container="pi-main-form" class="form-header" aria-hidden="false">Primary account holder</h2>
            <h2 *ngIf="applicantIndex==1" sticky-top="123" sticky-container="pi-main-form" class="form-header" aria-hidden="true">Secondary account holder</h2>
          </article>
          <article>
            <div class="form-row-double">
              <div class="form-element first-element">
                <label><span class="label-show-hide">First Name</span></label>
                <input #firstName="ngModel" type="text" name="first_name-{{applicantIndex}}" label="First Name" placeholder="<NAME>" [(ngModel)]="applicant.firstName" required id="input-first-name-{{applicantIndex}}" />
                <span *ngIf="!firstName.valid && (!firstName.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
              <!-- /.form-element -->
              <div class="form-element last-element">
                <label><span class="label-show-hide">Last Name</span></label>
                <input #lastName="ngModel" type="text" name="last_name-{{applicantIndex}}" label="Last Name" placeholder="<NAME>" [(ngModel)]="applicant.lastName" required id="input-last-name-{{applicantIndex}}" />
                <span *ngIf="!lastName.valid && (!lastName.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
              <!-- /.form-element -->
            </div>
            <!-- /.form-row -->
            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Date of Birth</span></label>
                <input #dob="ngModel" name="dob-{{applicantIndex}}" type="text" label="Date of Birth" placeholder="xxxx-xx-xx" [(ngModel)]="applicant.dateOfBirth" required id="input-dob-{{applicantIndex}}" />
                <span *ngIf="!dob.valid && (!dob.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
            </div>
            <!-- /.form-row" -->

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">SSN</span></label>
                <input #ssn="ngModel" name="ssn-{{applicantIndex}}" type="text" label="SSN" placeholder="SSN" [(ngModel)]="applicant.taxId" required id="input-ssn-{{applicantIndex}}" />
                <span *ngIf="!ssn.valid && (!ssn.pristine || submitted)"
                      class="error-text error-show-hide">
                  This field is required.
                </span>
              </div>
            </div>

          <div class="form-row">
            <div class="form-element">
              <label><span class="label-show-hide">Citizenship Country</span></label>
            <span class="dropdown">
            <select #citizenshipCountry="ngModel" name="citizenship-country-{{applicantIndex}}" type="text"  placeholder="Citizenship Country" required [(ngModel)]="applicant.citizenshipCountry" class="selectfielddrop">
              <option value="Choose Country" selected>Choose Country</option>
              <option *ngFor="let citizenshipCountry of citizenshipCountryArray" [ngValue]="citizenshipCountry.code">
                {{ citizenshipCountry.name }}
              </option>
            </select>
            <span *ngIf="!citizenshipCountry.valid && (!citizenshipCountry.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
            </div>
          </div>



            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Secondary Citizenship Country</span></label>
            <span class="dropdown">
            <select #citizenshipCountry="ngModel" name="secondary-citizenship-country-{{applicantIndex}}" type="text" placeholder="Secondary Citizenship Country" required [(ngModel)]="applicant.citizenshipCountry" class="selectfielddrop">
              <option value="Secondary Citizenship Country" disabled selected>Secondary Citizenship Country</option>
              <option *ngFor="let citizenshipCountry of citizenshipCountryArray" [ngValue]="citizenshipCountry.code">
                {{ citizenshipCountry.name }}
              </option>
            </select>
            <span *ngIf="!citizenshipCountry.valid && (!citizenshipCountry.pristine || submitted)"
                  class="error-text error-show-hide">
            </span>
            </span>
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Employment Status</span></label>
            <span class="dropdown">
            <select #employmentStatus="ngModel" name="employment-status-{{applicantIndex}}" type="text" placeholder="Employment Status" required [(ngModel)]="applicant.employmentStatus" class="selectfielddrop">
              <option value="Choose Status" disabled selected>Choose Status</option>
              <option *ngFor="let employmentStatus of employmentStatusArray" [ngValue]="employmentStatus">
                {{ employmentStatus }}
              </option>
            </select>
            <span *ngIf="!employmentStatus.valid && (!employmentStatus.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Job Title</span></label>
                <input #jobTitle="ngModel" name="jobTitle-{{applicantIndex}}" type="text" label="jobTitle" placeholder="Job Title" [(ngModel)]="applicant.jobTitle" required id="input-jobTitle-{{applicantIndex}}" />
              </div>
            </div>

            <div class="form-row">
              <div class="form-element">
                <label><span class="label-show-hide">Annual Income</span></label>
            <span class="dropdown">
            <select #annualIncome="ngModel" name="annual-income" type="text" placeholder="Annual Income" required [(ngModel)]="applicant.annualIncome" class="selectfielddrop">
              <option value="Choose Range" disabled selected>Choose Range</option>
              <option *ngFor="let annualIncome of annualIncomeArray" [ngValue]="annualIncome">
                {{ annualIncome }}
              </option>
            </select>
            <span *ngIf="!annualIncome.valid && (!annualIncome.pristine || submitted)"
                  class="error-text error-show-hide">
              This field is required.
            </span>
            </span>
              </div>
            </div>




          </article>
          <!-- /.form-row" -->
          <article>
            <div class="form-row">
              <div class="form-element">
                <div class="input-address-line-one">
                  <label><span class="label-show-hide">Home Address</span></label>
                  <input #addressLine1="ngModel" type="text" name="addressLine1-{{applicantIndex}}" label="Home" placeholder="Home Address" [(ngModel)]="applicant.homeAddress.addressLine1" required id="input-address-{{applicantIndex}}" />
                    <span *ngIf="!addressLine1.valid && (!addressLine1.pristine || submitted)"
                          class="error-text error-show-hide">
                      This field is required.
                    </span>
{'fraction_non_alphanumeric': 0.14926382602362, 'fraction_numerical': 0.003121585765568909, 'mean_word_length': 2.3847508364148617, 'pattern_counts': {'":': 0, '<': 337, '<?xml version=': 0, '>': 337, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3017429', 'n_tokens_mistral': 5324, 'n_tokens_neox': 4961, 'n_words': 1043}