@(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" 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;" class="pull-right">
      @defining(15){ max =>
        <div class="box-header">
          <span class="strong">Pages</span> <span class="label">@pages.length</span>
        </div>
        <div class="box-content-bottom" style="padding: 0px;">
          @pages.zipWithIndex.map { case (page, i) =>
            <div class="box-content-row page-link" style="border: none; @if(i > max - 1){display:none;}">
              <a href="@url(repository)/wiki/@urlEncode(page)" class="strong">@page</a>
            </div>
          }
          @if(pages.size > max){
            <div class="box-content-row show-more">
              <a href="javascript:void(0);" id="show-more-pages">Show more @{pages.size - max} pages...</a>
            </div>
          }
        </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" style="width: 160px;" 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: 700px;" 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>