<ion-view class="wordpress-view">
  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-nav-title>
    <span>WordPress</span>
  </ion-nav-title>
  <ion-content>
    <!-- Refresh to get the new posts -->
    <ion-refresher pulling-text="Pull to refresh..." on-refresh="doRefresh()">
    </ion-refresher>

    <div class="posts-list">
      <div ng-repeat="post in posts" class="list card post-item">
        <div class="post-heading item item-text-wrap">
          <h2 class="post-title" ng-bind-html="post.title | rawHtml"></h2>
          <p class="post-author">
            By <span>{{post.author.nickname}}</span> <span am-time-ago="post.date"></span>
          </p>
        </div>
        <div class="post-content item item-text-wrap" post-content>
          <p class="post-excerpt" dynamic-anchor-fix ng-bind-html="post.content | rawHtml"></p>
          <div class="post-actions row">
            <div class="actions col col-center col-66">
              <a class="button button-icon icon ion-bookmark" ng-click="bookmarkPost(post)"></a>
            </div>
            <div class="read-more col col-center col-33">
              <a ui-sref="app.post({postId: post.id})" class="button button-small button-block button-assertive">
                Read more
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- Infinit scroll -->
    <ion-infinite-scroll ng-if="moreDataCanBeLoaded()" on-infinite="loadMoreData()" distance="1%" icon="ion-loading-c">
    </ion-infinite-scroll>
  </ion-content>
</ion-view>
