@(pageName: String,
  page: gitbucket.core.service.WikiService.WikiPageInfo,
  pages: List[String],
  repository: gitbucket.core.service.RepositoryService.RepositoryInfo,
  hasWritePermission: Boolean)(implicit context: gitbucket.core.controller.Context)
@import context._
@import gitbucket.core.view.helpers._
@import gitbucket.core.service.WikiService._
@html.main(s"${pageName} - ${repository.owner}/${repository.name}", Some(repository)){
  @html.menu("wiki", repository){
    <ul class="nav nav-tabs fill-width pull-left">
      <li>
        <h1 class="wiki-title">@pageName</h1>
        <div class="small">
          <span class="muted"><strong>@page.committer</strong> edited this page @helper.html.datetimeago(page.time)</span>
        </div>
      </li>
      <li class="pull-right">
        @if(hasWritePermission){
          <div>
            <a class="btn btn-small btn-default" href="@url(repository)/wiki/@urlEncode(pageName)/_edit">Edit Page</a>
            <a class="btn btn-small btn-success" href="@url(repository)/wiki/_new">New Page</a>
          </div>
        }
      </li>
    </ul>
    <div style="width: 200px; margin-top: 20px;" class="pull-right">
      @defining(15){ max =>
        <div class="panel panel-default">
          <div class="panel-heading strong">
            Pages <span class="badge">@pages.length</span>
          </div>
          <ul class="list-group list-group-flush">
            @pages.zipWithIndex.map { case (page, i) =>
              <li class="list-group-item page-link" style="border: none; @if(i > max - 1){display:none;}">
                <a href="@url(repository)/wiki/@urlEncode(page)" class="strong">@page</a>
              </li>
            }
            @if(pages.size > max){
              <li class="list-group-item show-more">
                <a href="javascript:void(0);" id="show-more-pages">Show more @{pages.size - max} pages...</a>
              </li>
            }
          </ul>
        </div>
      }
      <div class="small">
        <strong>Clone this wiki locally</strong>
      </div>
      @helper.html.copy("repository-url-copy", httpUrl(repository)){
        <input type="text" value="@httpUrl(repository)" id="repository-url" class="form-control input-sm" readonly>
      }
      @if(settings.ssh && loginAccount.isDefined){
        <div class="small">
          <span class="mute">You can clone <a href="javascript:void(0);" id="repository-url-http">HTTP</a> or <a href="javascript:void(0);" id="repository-url-ssh">SSH</a>.</span>
        </div>
      }
    </div>
    <div style="width: 680px;" class="pull-left">
      <div class="markdown-body">
        @markdown(page.content, repository, true, false, false, false, pages)
      </div>
    </div>
  }
}
<script>
$(function(){
  $('#show-more-pages').click(function(e){
    $('div.page-link').show();
    $(e.target).parents('div.show-more').remove();
  });

  @if(settings.ssh && loginAccount.isDefined){
    $('#repository-url-http').click(function(){
      $('#repository-url').val('@httpUrl(repository)');
      $('#repository-url-copy').attr('data-clipboard-text', $('#repository-url').val());
    });
    $('#repository-url-ssh').click(function(){
      $('#repository-url').val('@sshUrl(repository, settings, loginAccount.get.userName)');
      $('#repository-url-copy').attr('data-clipboard-text', $('#repository-url').val());
    });
  }
});
</script>