Streamline and cleanup the entity-reference so it can be used everywhere in a simple fashion. Also changes the entity-search to use the reference as its icon source when in persistent mode

endpoints/api.py

@@ -672,7 +672,8 @@ def get_organization_members(orgname):
     members = model.get_organization_members_with_teams(org)    
     for member in members:
       if not member.user.username in members_dict:
-        members_dict[member.user.username] = {'username': member.user.username,
+        members_dict[member.user.username] = {'name': member.user.username,
+                                              'kind': 'user',
                                               'is_robot': member.user.robot,
                                               'teams': []}
     
@@ -697,7 +698,8 @@ def get_organization_member(orgname, membername):
     member_teams = model.get_organization_members_with_teams(org, membername=membername)
     for member in member_teams:
       if not member_dict:
-        member_dict = {'username': member.user.username,
+        member_dict = {'name': member.user.username,
+                       'kind': 'user',
                        'is_robot': member.user.robot,
                        'teams': []}
     
@@ -741,7 +743,8 @@ def get_organization_private_allowed(orgname):
 
 def member_view(member):
   return {
-    'username': member.username,
+    'name': member.username,
+    'kind': 'user',
     'is_robot': member.robot,
   }
 
@@ -2064,7 +2067,8 @@ def log_view(log):
 
   if log.performer:
     view['performer'] = {
-      'username': log.performer.username,
+      'kind': 'user',
+      'name': log.performer.username,
       'is_robot': log.performer.robot,
     }
 

static/css/quay.css

@@ -77,10 +77,17 @@
   position: relative;
 }
 
-.entity-search-element .entity-icon {
+.entity-search-element .entity-reference {
-  position: absolute;
+  position: absolute !important;
   top: 0px;
   left: 8px;
+  right: 36px;
+  z-index: 0;
+  pointer-events: none;
+}
+
+.entity-search-element .entity-reference .entity-name {
+  display: none;
 }
 
 .entity-search-element input {
@@ -89,6 +96,7 @@
 
 .entity-search-element.persistent input {
   padding-left: 28px;
+  padding-right: 28px;
 }
 
 .entity-search-element .twitter-typeahead {
@@ -155,6 +163,26 @@ i.toggle-icon:hover {
   color: #aaa;
 }
 
+.entity-reference.block-reference {
+  position: relative;
+  display: block;
+}
+
+.entity-reference.block-reference .entity-reference-element {
+  display: block;
+}
+
+.entity-reference.block-reference i.fa-exclamation-triangle {
+  position: absolute;
+  right: 10px;
+  top: 4px;
+}
+
+.entity-reference-element i.fa-exclamation-triangle {
+  color: #c09853;
+  margin-left: 10px;
+}
+
 .entity-reference-element i.fa-user {
   margin-left: 2px;
   margin-right: 7px;
@@ -1127,7 +1155,7 @@ form input.ng-valid.ng-dirty,
 
 .entity-mini-listing i.fa-exclamation-triangle {
   position: absolute;
-  right: -16px;
+  right: -14px;
   top: 4px;
   color: #c09853;
 }

static/directives/entity-reference.html

@@ -1,8 +1,19 @@
 <span class="entity-reference-element">
-  <i class="fa fa-user" ng-show="!team && !isrobot" title="User" bs-tooltip="tooltip.title" data-container="body"></i>
+  <span ng-show="entity.kind == 'team'">
-  <i class="fa fa-wrench" ng-show="!team && isrobot" title="Robot Account" bs-tooltip="tooltip.title" data-container="body"></i> 
+    <i class="fa fa-group" title="Team" bs-tooltip="tooltip.title" data-container="body"></i> 
-  <i class="fa fa-group" ng-show="team" title="Team" bs-tooltip="tooltip.title" data-container="body"></i> 
+    <span class="entity-name">
-  <span ng-show="team && getIsAdmin(orgname)"><a href="/organization/{{ orgname }}/teams/{{ team }}">{{team}}</a></span>
+      <span ng-show="!getIsAdmin(namespace)">{{entity.name}}</span>
-  <span ng-show="team && !getIsAdmin(orgname)">{{team}}</span>
+      <span ng-show="getIsAdmin(namespace)"><a href="/organization/{{ namespace }}/teams/{{ entity.name }}">{{entity.name}}</a></span>
-  <span ng-show="isrobot" class="prefix">{{getPrefix(name)}}</span><span>{{getShortenedName(name)}}</span>
+    </span>
+  </span>
+  <span ng-show="entity.kind != 'team'">
+    <i class="fa fa-user" ng-show="!entity.is_robot" title="User" bs-tooltip="tooltip.title" data-container="body"></i>
+    <i class="fa fa-wrench" ng-show="entity.is_robot" title="Robot Account" bs-tooltip="tooltip.title" data-container="body"></i> 
+    <span class="entity-name">
+      <span ng-show="entity.is_robot" class="prefix">{{getPrefix(entity.name)}}</span><span>{{getShortenedName(entity.name)}}</span>
+    </span>
+  </span>
+  <i class="fa fa-exclamation-triangle" ng-show="entity.is_org_member === false"
+     title="This user is not a member of the organization" bs-tooltip="tooltip.title" data-container="body">
+  </i>
 </span>

static/directives/entity-search.html

@@ -1,12 +1,5 @@
 <span class="entity-search-element" ng-class="isPersistent ? 'persistent' : ''"><input class="entity-search-control form-control">
-  <span class="entity-icon" ng-show="isPersistent">
+  <span class="entity-reference block-reference" ng-show="isPersistent && currentEntity" entity="currentEntity"></span>
-    <i class="fa fa-user" ng-show="currentEntity.kind == 'user' && !currentEntity.is_robot" title="User"
-       bs-tooltip="tooltip.title" data-container="body"></i>
-    <i class="fa fa-wrench" ng-show="currentEntity.kind == 'user' && currentEntity.is_robot" title="Robot Account"
-       bs-tooltip="tooltip.title" data-container="body"></i> 
-    <i class="fa fa-group" ng-show="currentEntity.kind == 'team'" title="Team"
-       bs-tooltip="tooltip.title" data-container="body"></i> 
-  </span>
   <div class="dropdown">
     <button class="btn btn-default dropdown-toggle" type="button" id="entityDropdownMenu" data-toggle="dropdown"
             ng-click="lazyLoad()">

static/directives/logs-view.html

@@ -54,7 +54,7 @@
           <td>{{ log.datetime }}</td>
           <td>
             <span ng-show="log.performer">              
-              <span class="entity-reference" name="log.performer.username" isrobot="log.performer.is_robot"></span>
+              <span class="entity-reference" entity="log.performer" namespace="organization.name"></span>
             </span>
             <span ng-show="!log.performer && log.metadata.token">
               <i class="fa fa-key"></i>

static/directives/prototype-manager.html

@@ -33,14 +33,10 @@
       
       <tr ng-repeat="prototype in prototypes">
         <td>
-          <span class="entity-reference" orgname="organization.name" name="prototype.activating_user.name"
+          <span class="entity-reference block-reference" entity="prototype.activating_user" namespace="organization.name"></span>
-                isrobot="prototype.activating_user.is_robot"></span>
         </td>
         <td>
-          <span class="entity-reference" orgname="organization.name"
+          <span class="entity-reference block-reference" entity="prototype.delegate" namespace="organization.name"></span>
-                name="prototype.delegate.kind == 'team' ? null :prototype.delegate.name"
-                team="prototype.delegate.kind == 'team' ? prototype.delegate.name : null"
-                isrobot="prototype.delegate.is_robot"></span>
         </td>
         <td>
           <span class="role-group" current-role="prototype.role" role-changed="setRole(role, prototype)" roles="roles"></span>
@@ -66,9 +62,9 @@
         <div class="modal-body">
           <table>
             <tr>
-              <td>Activating User/Robot:</td>
+              <td>Creating User/Robot:</td>
               <td>
-                <span class="entity-search" namespace="organization.name" input-title="'Activating User/Robot'"
+                <span class="entity-search" namespace="organization.name" input-title="'Creating User/Robot'"
                       is-organization="true" include-teams="false" current-entity="activatingForNew" is-persistent="true"
                       clear-now="clearCounter">
                 </span>

static/js/app.js

@@ -805,14 +805,12 @@ quayApp.directive('entityReference', function () {
     transclude: false,
     restrict: 'C',
     scope: {
-      'name': '=name',
+      'entity': '=entity',
-      'orgname': '=orgname',
+      'namespace': '=namespace'
-      'team': '=team',
-      'isrobot': '=isrobot'
     },
     controller: function($scope, $element, UserService) {
-      $scope.getIsAdmin = function(orgname) {
+      $scope.getIsAdmin = function(namespace) {
-        return UserService.isNamespaceAdmin(orgname);
+        return UserService.isNamespaceAdmin(namespace);
       };
 
       $scope.getPrefix = function(name) {
@@ -1354,7 +1352,7 @@ quayApp.directive('logsView', function () {
           'username': 'user',
           'team': 'group',
           'token': 'key',
-          'repo': 'hdd',
+          'repo': 'hdd-o',
           'robot': 'wrench'
         };
 

static/js/controllers.js

@@ -624,6 +624,15 @@ function RepoAdminCtrl($scope, Restangular, ApiService, $routeParams, $rootScope
   $scope.logsShown = 0;
   $scope.deleting = false;
   
+  $scope.buildEntityForPermission = function(name, permission, kind) {
+    return {
+      'kind': kind,
+      'name': name,
+      'is_robot': permission.is_robot,
+      'is_org_member': permission.is_org_member
+    };
+  };
+
   $scope.loadLogs = function() {
     $scope.logsShown++;
   };

static/partials/org-admin.html

@@ -92,12 +92,11 @@
                             
               <tr ng-repeat="memberInfo in (membersFound | filter:search | limitTo:50)">
                 <td>
-                  <span class="entity-reference" name="memberInfo.username" isrobot="memberInfo.is_robot" isorgadmin="true"></span>
+                  <span class="entity-reference" entity="memberInfo" namespace="organization.name"></span>
                 </td>
                 <td>
                   <span class="team-link" ng-repeat="team in memberInfo.teams">
-                    <i class="fa fa-group"></i>
+                    <span class="entity-reference" namespace="organization.name" entity="{'kind': 'team', 'name': team}"></span>
-                    <a href="/organization/{{ organization.name }}/teams/{{ team }}">{{ team }}</a>
                   </span>
                 </td>
                 <td>

static/partials/repo-admin.html

@@ -51,7 +51,9 @@
                 <!-- Team Permissions -->
                 <tr ng-repeat="(name, permission) in permissions['team']">
                   <td class="team entity">
-                    <span class="entity-reference" orgname="repo.namespace" team="name"></span>
+                    <span class="entity-reference" namespace="repo.namespace"
+                          entity="buildEntityForPermission(name, permission, 'team')">
+                    </span>
                   </td>
                   <td class="user-permissions">
                     <span class="role-group" current-role="permission.role" role-changed="setRole(role, name, 'team')" roles="roles"></span>
@@ -67,8 +69,9 @@
                 <!-- User Permissions -->
                 <tr ng-repeat="(name, permission) in permissions['user']">
                   <td class="{{ 'user entity ' + (permission.is_org_member ? '' : 'outside') }}">
-                    <span class="entity-reference" name="name" isrobot="permission.is_robot"></span>
+                    <span class="entity-reference" namespace="repo.namespace"
-                    <i class="fa fa-exclamation-triangle" ng-show="permission.is_org_member === false" data-trigger="hover" bs-popover="{'content': 'This user is not a member of the organization'}"></i>
+                          entity="buildEntityForPermission(name, permission, 'user')">
+                    </span>
                   </td>
                   <td class="user-permissions">
                     <div class="btn-group btn-group-sm">

static/partials/team-view.html

@@ -14,11 +14,11 @@
           <table class="permissions">        
             <tr ng-repeat="(name, member) in members">
               <td class="user entity">
-                <span class="entity-reference" name="member.username" isrobot="member.is_robot"></span>
+                <span class="entity-reference" entity="member" namespace="organization.name"></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>
+                  <span class="delete-ui-button" ng-click="removeMember(member.name)"><button class="btn btn-danger">Remove</button></span>
                   <i class="fa fa-times"></i>
                 </span>
               </td>