@(pathList: List[String],
  branch: String,
  repository: gitbucket.core.service.RepositoryService.RepositoryInfo,
  commits: Seq[Seq[gitbucket.core.util.JGitUtil.CommitInfo]],
  page: Int,
  hasNext: Boolean,
  hasWritePermission: Boolean,
  getStatuses: String => List[gitbucket.core.model.CommitStatus],
  getSummary: List[gitbucket.core.model.CommitStatus] => (gitbucket.core.model.CommitState, String),
  getTags: String => List[String])(implicit context: gitbucket.core.controller.Context)
@import gitbucket.core.view.helpers
@gitbucket.core.html.main(s"${repository.owner}/${repository.name}", Some(repository)) {
  @gitbucket.core.html.menu("files", repository){
    <div class="head">
      @if(pathList.isEmpty){
        @gitbucket.core.helper.html.branchcontrol(branch, repository, hasWritePermission){
          @repository.branchList.map { x =>
            <li><a href="@helpers.url(repository)/commits/@helpers.encodeRefName(x)">@gitbucket.core.helper.html.checkicon(x == branch) @x</a></li>
          }
        }
      }
      @if(pathList.nonEmpty){
        <span class="muted">History for</span>
        <a class="strong" href="@helpers.url(repository)/tree/@helpers.encodeRefName(branch)">@repository.name</a> /
        @pathList.zipWithIndex.map { case (section, i) =>
          @if(i == pathList.length - 1){
            <span class="strong">@section</span>
          } else {
            <a class="strong" href="@helpers.url(repository)/tree/@helpers.encodeRefName((branch :: pathList.take(i + 1)).mkString("/"))">@section</a> /
          }
        }
      }
    </div>

    <table class="table table-bordered table-hover">
    @commits.map { day =>
      <tr>
        <th rowspan="@day.size" width="100">@helpers.date(day.head.commitTime)</th>
        @day.zipWithIndex.map { case (commit, i) =>
          @if(i != 0){ <tr> }
          <td>
            <div class="pull-right text-right">
              @defining(getTags(commit.id)) { tags =>
                @if(tags.nonEmpty){
                  <span class="muted">
                    <i class="octicon octicon-tag"></i>
                    @tags.map { tag =>
                      <a href="@helpers.url(repository)/tree/@tag" class="tag">@tag</a>
                    }
                  </span>
                }
              }
              <a href="@helpers.url(repository)/commit/@commit.id" class="monospace commit-message strong"><i class="octicon octicon-diff" style="color: black;"></i>@commit.id.substring(0, 7)</a><br>
              <a href="@helpers.url(repository)/tree/@commit.id" class="button-link">Browse files »</a>
            </div>
            <div>
              <div class="commit-avatar-image">@helpers.avatarLink(commit, 40)</div>
              <div>
                @helpers.link(commit.summary, repository)
                @if(commit.description.isDefined){
                  <a href="javascript:void(0)" onclick="$('#description-@commit.id').toggle();" class="omit">...</a>
                }
                <br>
                @if(commit.description.isDefined){
                  <pre id="description-@commit.id" style="display: none;" class="commit-description">@helpers.link(commit.description.get, repository)</pre>
                }
                  <div>
                  @if(commit.isDifferentFromAuthor) {
                    @helpers.user(commit.authorName, commit.authorEmailAddress, "username")
                    <span class="muted">authored @gitbucket.core.helper.html.datetimeago(commit.authorTime)</span>
                    <span class="octicon octicon-arrow-right" style="margin-top : -2px;"></span>
                  }
                  @helpers.user(commit.committerName, commit.committerEmailAddress, "username")
                  <span class="muted">committed @gitbucket.core.helper.html.datetimeago(commit.commitTime)</span>
                    @defining({
                      val statuses = getStatuses(commit.id)
                      val (summary, summaryText) = getSummary(statuses)
                      (statuses, summary, summaryText)
                    }){ case (statuses, summaryState, summaryText) =>
                      @if(statuses.nonEmpty){
                        @helpers.commitStateIcon(summaryState)
                        <strong class="text-@{summaryState.name}">@helpers.commitStateText(summaryState, commit.id)</strong>
                        <span class="text-@{summaryState.name}">- @summaryText checks</span>
                        <a href="#" class="toggle-check">Show all checks</a>
                        <div style="display: none;">
                          @statuses.map{ status =>
                          <div class="build-status-item">
                            <span class="build-status-icon text-@{status.state.name}">@helpers.commitStateIcon(status.state)</span>
                            <strong>@status.context</strong>
                            @status.description.map { desc => <span class="muted">- @desc</span> }
                            <span>
                              @status.targetUrl.map { url => - <a href="@url">Details</a> }
                            </span>
                          </div>
                          }
                        </div>
                      }
                    }
                </div>
              </div>
            </div>
          </td>
          </tr>
        }
    }
    </table>

    <nav style="text-align: center; margin-top: 20px">
      <ul class="pagination">
        @if(page <= 1){
          <li class="disabled"><span>Newer</span></li>
        } else {
          <li><a href="?page=@{page - 1}">Newer</a></li>
        }
        @if(!hasNext){
          <li class="disabled"><span>Older</span></li>
        } else {
          <li><a href="?page=@{page + 1}">Older</a></li>
        }
      </ul>
    </nav>
    <script>
      $(function () {
        $('.toggle-check').click(function(){
          var div = $(this).next('div');
          if(div.is(':visible')){
            $(this).text('Show all checks');
          } else {
            $(this).text('Hide all checks');
          }
          div.toggle();
          return false;
        });
      })
    </script>
    <style type="text/css">
      a.tag {
        color: #888888;
        margin-right: 4px;
      }
    </style>
  }
}