@(account: model.Account, groupNames: List[String], active: String)(body: Html)(implicit context: app.Context)
@import context._
@import view.helpers._
@html.main(account.userName){
  <div class="container-fluid">
    <div class="row-fluid">
      <div class="span4">
        <div class="block">
          <div class="account-image">@avatar(account.userName, 200)</div>
          <div class="block-header" style="text-align: center">@account.userName</div>
        </div>
        <div class="block">
          @if(account.url.isDefined){
            <div><i class="icon-home"></i> <a href="@account.url">@account.url</a></div>
          }
          <div><i class="icon-time"></i> <span class="muted">Joined on</span> @date(account.registeredDate)</div>
        </div>
        @if(groupNames.nonEmpty){
          <div>
            <div>Groups</div>
            @groupNames.map { groupName =>
              <a href="@url(groupName)">@avatar(groupName, 36, tooltip = true)</a>
            }
          </div>
        }

      </div>
      <div class="span8">
        <ul class="nav nav-tabs">
          <li@if(active == "repositories"){ class="active"}><a href="@url(account.userName)?tab=repositories">Repositories</a></li>
          @if(account.isGroupAccount){
            <li@if(active == "members"){ class="active"}><a href="@url(account.userName)?tab=members">Members</a></li>
          } else {
            <li@if(active == "activity"){ class="active"}><a href="@url(account.userName)?tab=activity">Public Activity</a></li>
          }
          @if(loginAccount.isDefined && loginAccount.get.userName == account.userName){
            <li class="pull-right">
              <div class="button-group">
                <a href="@url(account.userName)/_edit" class="btn">Edit Your Profile</a>
              </div>
            </li>
          }
        </ul>
        @body
      </div>
    </div>
  </div>
}