{% extends 'modal_base.html' %}
{% block icon_name %}fa fa-history{% endblock %}
{% block title %}Patient History{% endblock %}
{% block modal_body %}
<h2>
  [[ episode.demographics[0].name ]]
</h2>

<div class="timeline">

  <!-- Timeline header -->
  <div class="timeline-now">
	<div class="timeline-now-text bg-secondary">Now</div>
  </div>

  <div class="timeline-item" ng-repeat="ep in episode_history">
	<div class="timeline-label">
	  <div class="timeline-icon bg-secondary">
        <i ng-class="{'fa-hospital-o': ep.category == 'inpatient', 'fa-home': ep.category == 'OPAT' || ep.category == 'outpatient'}"
           class="fa fa-lg"></i>
      </div>
	  <div class="timeline-time">
        <span ng-show="ep.date_of_episode">[[ ep.date_of_episode | shortDate ]]</span>
        <span ng-show="ep.date_of_admission">[[ ep.date_of_admission | shortDate ]]</span>
      </div>
	</div>
	<div class="timeline-detail">
      <p class="lead">
        <a ng-click="jump_to_episode(ep)" href="">
          [[ ep.category.charAt(0).toUpperCase() + ep.category.substring(1) ]] Episode
        </a>
        <span ng-show="ep.id == episode.id">(This episode)</span>
      </p>
      <p>
        <span ng-show="ep.date_of_episode">[[ ep.date_of_episode | shortDate ]]</span>
        <span ng-show="ep.date_of_admission">Admitted: [[ ep.date_of_admission | shortDate ]]<br /></span>
        <span ng-show="ep.discharge_date">Discharged: [[ ep.discharge_date | shortDate ]]<br /></span>
      </p>
	</div>
  </div>
</div>

{% endblock %}
{% block modal_save %}{% endblock %}
{% block modal_another %}{% endblock %}
