YaleSTC/cardswipr

<br>
<div class="container">
  <div class='row p-3'>
    <div class="col-sm">
      <div class="shadow text-center" aria-label="Person Lookup">
        <div class="text-white bg-yale p-3">
          <h1><b>Person Lookup</b></h1>
        </div>

        <div class='p-3'>
          <br />
          <p><b>Card Swipe</b> or <b>Card Tap</b> or <b>NetID</b></p>
          <%= form_tag lookups_path, id: 'swipr_swipe_form' do %>
            <%= text_field_tag :search_param, '', autofocus: true, :class => 'p-2' %>
            <%= submit_tag 'Submit', :class => 'btn btn-primary' %>
          <% end %>
          <br />
          <p>When a client swipes their card, we'll figure out who they are. Then we'll create a link to their Yale Phonebook entry.</p>
        </div>
      </div>
    </div>

    <div class='col-sm'>
      <% if local_assigns[:lookup] %>
        <div class="shadow text-center" aria-label="Lookup Result">
          <div class="text-white bg-primary p-3">
            <h1><b>Lookup Result</b></h1>
          </div>
          <br />
          <div class="container p-3">
            <dl class="row text-left">
              <dt class="col-sm-3">Name:</dt>
              <dd class="col-sm-9"><%= lookup.first_name + ' ' + lookup.last_name %>
              <dt class="col-sm-3">Email:</dt>
              <dd class="col-sm-9"><%= lookup.email %></dd>
              <dt class="col-sm-3">Phone:</dt>
              <dd class="col-sm-9"><%= lookup.phone %></dd>
              <dt class="col-sm-3">NetID:</dt>
              <dd class="col-sm-9"><%= lookup.net_id %></dd>
              <dt class="col-sm-3">UPI:</dt>
              <dd class="col-sm-9"><%= lookup.upi %></dd>
            </dl>
            <div class="container row">
              <%= link_to 'Yale Phonebook Entry',
                  "http://directory.yale.edu/?queryType=field&upi=#{lookup.upi}", target: '_blank', id: 'yale-phonebook', :class => 'btn btn-primary'
              %>
            </div>
          </div>
        </div>
      <% end %>
    </div>
  </div>
</div>