---
layout: page
# The Home page layout
# © 2017-2019 Cotes Chung
# MIT Licensed
---

{% include date-format.html %}

<div id="post-list">
  {% for post in paginator.posts %}
  <div class="post-preview">
    <h1>
      <a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a>
    </h1>
    <div class="post-content">
      <p>
      {{ post.content | strip_html | truncate: 200 }}
      </p>
    </div>

    <div class="post-meta text-muted pt-1">
      <!-- posted date -->
      <i class="far fa-clock fa-fw"></i>
      <span class="timeago" data-toggle="tooltip" title="{{ post.date | date: TOOLTIP_DATE }}">
      {{ post.date | date: POST_DATE }}
      <i class="hidden">{{ post.date | date_to_xmlschema }}</i>
      </span>
      <!-- page views -->
      {% if site.google_analytics.pv %}
      <i class="far fa-eye fa-fw"></i>
      <span id="pv_{{-post.title-}}" class="pageviews">
        <i class="fas fa-spinner fa-spin"></i>
      </span>
      {% endif %}
    </div>
  </div> <!-- .post-review -->
  {% endfor %}
</div> <!-- #post-list -->

{% if paginator.total_pages > 0 %}
<ul class="pagination mt-4 mb-0 pl-lg-2">
  <!-- left arrow -->
  {% if paginator.previous_page %}
  <li class="page-item">
    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.previous_page_path }}">
      <i class="fas fa-angle-left"></i>
    </a>
  </li>
  {% else %}
  <li class="page-item disabled">
    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-left"></i></a>
  </li>
  {% endif %}
  <!-- endof left arrow -->

  <!-- page numbers -->
  {% assign left_ellipsis = false %}
  {% assign right_ellipsis = false %}

  {% for i in (1..paginator.total_pages) %}

    {% assign pre = paginator.page | minus: 1 %}
    {% assign next = paginator.page | plus: 1 %}
    {% assign pre_less = pre | minus: 1 %}
    {% assign next_more = next | plus: 1 %}
    {% assign show = false %}

    {% if paginator.page == 1 %}
      {% if i <= 3 or i == paginator.total_pages %}
        {% assign show = true %}
      {% endif %}
    {% elsif paginator.page == paginator.total_pages %}
      {% if i == 1 or i >= pre_less %}
        {% assign show = true %}
      {% endif %}
    {% else %}
      {% if i == 1 or i == paginator.total_pages%}
        {% assign show = true %}
      {% elsif i >= pre and i <= next %}
        {% assign show = true %}
      {% endif %}
    {% endif %}

    {% if show %}
        <!-- show number -->
        <li class="page-item {% if i == paginator.page %} active{% endif %}">
          <a class="page-link btn-box-shadow" href="{{ site.baseurl }}/{% if i > 1%}page{{ i }}/{% endif %}">{{ i }}</a>
        </li>
      {% else %}
        <!-- hide number -->
        {% if i < pre and left_ellipsis == false %}
          <li class="page-item disabled">
            <span class="page-link btn-box-shadow">...</span>
          </li>
          {% assign left_ellipsis = true %}
        {% elsif i > next and right_ellipsis == false %}
          <li class="page-item disabled">
            <span class="page-link btn-box-shadow">...</span>
          </li>
          {% assign right_ellipsis = true %}
        {% endif %}
      {% endif %}

  {% endfor %}

  <!-- right arrow -->
  {% if paginator.next_page %}
  <li class="page-item">
    <a class="page-link btn-box-shadow" href="{{ site.baseurl }}{{ paginator.next_page_path }}">
      <i class="fas fa-angle-right"></i>
    </a>
  </li>
  {% else %}
  <li class="page-item disabled">
    <a class="page-link btn-box-shadow" href="#"><i class="fas fa-angle-right"></i></a>
  </li>
  {% endif %}

</ul> <!-- .pagination -->
{% endif %}

<script src="{{ site.baseurl }}/assets/js/dist/timeago.min.js"></script>

{% if site.google_analytics.pv %}
<script src="{{ site.baseurl }}/assets/js/dist/countUp.min.js" async></script>
<script src="{{ site.baseurl }}/assets/js/dist/pageviews.min.js" async></script>
{% endif %}