<div class="loading" ng-show="loading">
  <i class="fa fa-spinner fa-spin fa-3x"></i>
</div>

<div class="loading" ng-show="!loading && !organization">
  No matching team found
</div>

<div class="team-view container" ng-show="!loading && organization">
  <div class="organization-header" organization="organization" team-name="teamname"></div>
  
  <div class="description markdown-input" content="team.description" can-write="organization.is_admin"
       content-changed="updateForDescription" field-title="'team description'"></div>       

  <div class="panel panel-default">
    <div class="panel-heading">Team Members
      <i class="info-icon fa fa-info-circle" data-placement="left" data-content="Users that inherit all permissions delegated to this team"></i>
    </div>
    <div class="panel-body">
      <table class="permissions">        
        <tr ng-repeat="(name, member) in members">
          <td class="user entity">
            <i class="fa fa-user"></i> 
            <span>{{ member.username }}</span>
          </td>
          <td>
            <span class="delete-ui" tabindex="0" title="Remove User" ng-show="canEditMembers">
              <span class="delete-ui-button" ng-click="removeMember(member.username)"><button class="btn btn-danger">Remove</button></span>
              <i class="fa fa-times"></i>
            </span>
          </td>
        </tr>
        
        <tr ng-show="canEditMembers">
          <td colspan="2">
            <span class="entity-search" organization="''" input-title="'Add a user...'" entity-selected="addNewMember"></span>
          </td>
        </tr>
      </table>
    </div>
  </div>
</div>


<!-- Modal message dialog -->
<div class="modal fade" id="cannotChangeTeamModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Cannot change team</h4>
      </div>
      <div class="modal-body">
        You do not have permission to change properties of this team.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- Modal message dialog -->
<div class="modal fade" id="cannotChangeMembersModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">Cannot change members</h4>
      </div>
      <div class="modal-body">
        You do not have permission to change the members of this team.
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->