displaying list's members

src/app/pages/teams/lists/ListsTabCtrl.js

@@ -9,7 +9,7 @@
     .controller('ListsTabCtrl', ListsTabCtrl);
 
   /** @ngInject */
-  function ListsTabCtrl($scope, baConfig) {
+  function ListsTabCtrl($scope, baConfig, membersList) {
     
     $scope.transparent = baConfig.theme.blur;
     var dashboardColors = baConfig.colors.dashboard;
@@ -24,16 +24,10 @@
     }
 
     $scope.Lists = [
-      { text: 'Check me out yeah' },
-      { text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro' },
-      { text: 'Ex has semper alterum, expetenda dignissim' },
-      { text: 'Vim an eius ocurreret abhorreant, id nam aeque persius ornatus.' },
-      { text: 'Simul erroribus ad usu' },
-      { text: 'Ei cum solet appareat, ex est graeci mediocritatem' },
-      { text: 'Get in touch with akveo team' },
-      { text: 'Write email to business cat' },
-      { text: 'Have fun with blur admin' },
-      { text: 'What do you think?' },
+      { name: 'Check me out yeah', deleted : false, members : ['4563faass', '4563fdfvd'] },
+      { name: 'Lorem ipsum', deleted : false, members : ['4563zxcss', '8955sddf'] },
+      { name: 'Ex has semper', deleted : false, members : ['8955sdfcc', '8955sddf'] },
+      { name: 'Vim an eius', deleted : false, members : ['8955sddf', '4563faass'] },
     ];
 
     $scope.Lists.forEach(function(item) {
@@ -41,17 +35,36 @@
     });
 
     $scope.newTodoText = '';
+    $scope.listMembers = [{ name: 'Nasta Linnie'}];
 
     $scope.addNewList = function (event, clickPlus) {
       if (clickPlus || event.which === 13) {
         $scope.Lists.unshift({
-          text: $scope.newTodoText,
+          name: $scope.newTodoText,
           color: getRandomColor(),
         });
         $scope.newTodoText = '';
       }
     };
 
+    $scope.updateMembers = function (index) {
+	  //uncheck others lists
+	  for(var i = 0; i<$scope.Lists.length; i++)
+		{
+			if(i != index)
+		   		$scope.Lists[i].isChecked = false;
+		}
+
+	  //getting members info
+	  $scope.listMembers = []; 
+      var membersIds = $scope.Lists[index].members;
+      angular.forEach(membersIds, function(id){
+      	 var member = membersList.getMemberById(id);
+	     $scope.listMembers.push( member );
+	    });
+      console.log($scope.listMembers);
+    };
+
     $scope.removeList = function (index) {
       if (confirm("Are you sure?"))
            {

src/app/pages/teams/lists/lists.html

@@ -1,9 +1,21 @@
 <div class="row">
-  <div class="col-xlg-3 col-lg-6 col-md-6 col-xs-12"
+  <div class="col-xlg-4 col-lg-6 col-md-4 col-xs-12"
        ba-panel
        ba-panel-title="Mailing LISTS"
        ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
     <lists-directive></lists-directive>
   </div>
+
+  <div class="col-xlg-4 col-lg-6 col-md-4 col-xs-12"
+       ba-panel
+       ba-panel-title="List members"
+       ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
+       <lists-members-directive></lists-members-directive>
+  </div>
+   <div class="col-xlg-4 col-lg-6 col-md-4 col-xs-12"
+       ba-panel
+       ba-panel-title="Add new members"
+       ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
+  </div>
  
 </div>

src/app/pages/teams/lists/lists.members.directive.js

@@ -0,0 +1,19 @@
+/**
+ * @author v.lugovksy
+ * created on 16.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.teams.lists')
+      .directive('listsMembersDirective', listsMembersDirective);
+
+  /** @ngInject */
+  function listsMembersDirective() {
+    return {
+      restrict: 'EA',
+      controller: 'ListsTabCtrl',
+      templateUrl: 'app/pages/teams/lists/listsMembersDirective.html'
+    };
+  }
+})();

src/app/pages/teams/lists/listsDirective.html

@@ -4,13 +4,13 @@
   <div class="box-shadow-border"></div>
   <ul class="todo-list" ui-sortable ng-model="Lists">
     <li ng-repeat="item in Lists" ng-if="!item.deleted" ng-init="activeItem=false"
-        ng-class="{checked: isChecked, active: activeItem}"
+        ng-class="{checked: item.isChecked, active: activeItem}"
         ng-mouseenter="activeItem=true" ng-mouseleave="activeItem=false">
       <div class="blur-container"><div class="blur-box"></div></div>
       <i class="mark" style="background-color: {{::item.color}}"></i>
       <label class="todo-checkbox custom-checkbox custom-input-success">
-        <input type="checkbox" ng-model="isChecked">
-        <span class="cut-with-dots">{{ item.text }}</span>
+        <input type="checkbox" ng-model="item.isChecked" ng-change="updateMembers($index)">
+        <span class="cut-with-dots">{{ item.name }}</span>
       </label>
       <i class="remove-todo ion-ios-close-empty" ng-click="removeList($index)"></i>
     </li>

src/app/pages/teams/lists/listsMembersDirective.html

@@ -0,0 +1,13 @@
+<div class="feed-messages-container" track-width="smallContainerWidth" min-width="360">
+  <div class="feed-message" ng-repeat="m in listMembers">
+    <div class="message-icon">
+      <img class="photo-icon" ng-src="{{m.name.split(' ')[0] | profilePicture}}">
+    </div>
+    <div class="text-block text-message">
+      <div class="message-header">
+        <span class="author">{{m.name}}</span>
+      </div>
+      
+    </div>
+  </div>
+</div>