@(active: String, repository: service.RepositoryService.RepositoryInfo, id: Option[String] = None)(body: Html)(implicit context: app.Context)
@import context._
@import view.helpers._

<div class="container">
  @if(repository.commitCount > 0){
    <div class="pull-right">
      <div class="input-prepend">
        <a href="@path/@repository.owner/@repository.name/fork" class="btn" style="margin-bottom: 10px;">Fork</a>
        <span class="add-on count"><a href="@url(repository)/network/members">@repository.forkedCount</a></span>
      </div>
    </div>
  }
  <div class="head">
    @helper.html.repositoryicon(repository, true)
    <a href="@url(repository.owner)">@repository.owner</a> / <a href="@url(repository)" class="strong">@repository.name</a>

    @defining(repository.repository){ x =>
      @if(repository.repository.originRepositoryName.isDefined){
        <div class="forked">
          forked from <a href="@path/@x.parentUserName/@x.parentRepositoryName">@x.parentUserName/@x.parentRepositoryName</a>
        </div>
      }
    }
  </div>
</div>
<hr style="margin-bottom: 20px;"/>
<style type="text/css">
ul.sidemenu {
  margin-left: 0px;
}

ul.sidemenu li.active {
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  border-right: 4px solid #bb4444;
  border-left: 1px solid white;
}

ul.sidemenu div.gradient {
  width: 5px;
  height: 35px;
  background: linear-gradient(to right, #eee, #fff);
  margin-right: 4px;
}

ul.sidemenu div.margin {
  width: 5px;
  height: 35px;
  margin-right: 4px;
}

ul.sidemenu li {
  line-height: 35px;
  height: 35px;
  border-left: 1px solid #eee;
  margin-left:0px;
  list-style-type: none;
}

ul.sidemenu li.separator {
  border-top: 1px solid #eee;
  height: 1px;
}
</style>
<div class="container body">
  <div style="width: 170px;" class="pull-right">
    <ul class="sidemenu">
      <li style="height: 12px"><div class="gradient pull-left" style="height: 12px"></div></li>
      <li class="active">
        <div class="margin pull-left"></div><a href="@url(repository)"><img src="@assets/common/images/menu-code.png"> Code</a>
      </li>
      <li>
        <div class="gradient pull-left"></div><a href="@url(repository)/issues"><img src="@assets/common/images/menu-issues.png"> Issues</a>
        @if(repository.issueCount > 0){
          <div class="pull-right"><span class="label">@repository.issueCount</span></div>
        }
      </li>
      <li>
        <div class="gradient pull-left"></div><a href="@url(repository)/pulls"><img src="@assets/common/images/menu-pulls.png"> Pull Requests</a>
        @if(repository.pullCount > 0){
          <div class="pull-right"><span class="label">@repository.pullCount</span></div>
        }
      </li>
      <li>
        <div class="gradient pull-left"></div><a href="@url(repository)/wiki"><img src="@assets/common/images/menu-wiki.png"> Wiki</a>
      </li>
      <li class="separator"></li>
      <li>
        <div class="gradient pull-left"></div>Settings
      </li>
    </ul>
    <div class="small">
      <strong>HTTP</strong> <span class="mute">clone URL</span>
    </div>
    @helper.html.copy("repository-url-copy", repository.httpUrl){
      @*
      @if(settings.ssh && loginAccount.isDefined){
        <div class="btn-group add-on" data-toggle="buttons-radio" style="padding: 0px; border-width: 0px;">
          <button type="button" class="btn active" id="repository-url-http">HTTP</button><button type="button" class="btn" id="repository-url-ssh">SSH</button>
        </div>
      } else {
        <span class="add-on">HTTP</span>
      }
      *@
      <input type="text" value="@repository.httpUrl" id="repository-url" readonly>
    }
    @if(settings.ssh && loginAccount.isDefined){
      <div class="small">
        You can clone <a href="#">HTTP</a> or <a href="#">SSH</a>.
      </div>
    }
    <div>
      @*
      <a href="@{url(repository)}/archive/@{encodeRefName(id)}.zip" class="btn"><i class="icon-download-alt"></i>Download ZIP</a>
      *@
      <a href="#" class="btn btn-small" style="width: 147px;"><i class="icon-download-alt"></i>Download ZIP</a>
    </div>
  </div>
  <div style="margin-right: 180px;">
    @repository.repository.description.map { description =>
      <p class="muted">@description</p>
    }
    <style type="text/css">
    a.header-link {
      color: #888;
    }
    a.header-link strong {
      color: black;
    }
    a.header-link:hover {
      color: #0088cc;
      text-decoration: none;
    }
    </style>
    <div style="border: 1px solid silver; padding: 4px; margin-bottom: 10px;">
      <table style="width: 100%;">
        <tr>
          <td style="width: 33%; text-align: center;">
            <a href="@url(repository)/commits/@encodeRefName(id.getOrElse(""))" class="header-link">
              <img src="@assets/common/images/header-commits.png"/> <strong>@repository.commitCount</strong> commits
            </a>
          </td>
          <td style="width: 33%; text-align: center;">
            <a href="@url(repository)/branches" class="header-link" class="header-link">
              <img src="@assets/common/images/header-branches.png"/> <strong>@repository.branchList.length</strong> branches
            </a>
          </td>
          <td style="width: 33%; text-align: center;">
            <a href="@url(repository)/tags" class="header-link" class="header-link">
              <img src="@assets/common/images/header-tags.png"/> <strong>@repository.tags.length</strong> releases
            </a>
          </td>
        </tr>
      </table>
    </div>
    @body
  </div>
</div>
<script type="text/javascript">
$(function(){
  $('table.global-nav th.box-header').click(function(){
    location.href = $(this).find('a').attr('href');
    return false;
  });
});
</script>