4 files changed, 32 insertions, 15 deletions
diff --git a/alias-angular/app/index.html b/alias-angular/app/index.html
index 676dd13..fba5335 100644
--- a/alias-angular/app/index.html
+++ b/alias-angular/app/index.html
@@ -38,19 +38,18 @@
   </div>
   <div id="main" ng-controller="MsgCtl">
     <ul class="nav nav-tabs">
-      <li ng-init="activeConversation=''" ng-repeat="conversation in conversations" ng-class="isActive(conversation)" ng-click="activate(conversation)">
+      <li ng-repeat="conversation in conversations" ng-click="activate(conversation)">
         <!-- why does writing ng-click="activeConversation=conversation" doesn't work? -->
-        <a ng-href="#repeat">{{conversation}} <i class="icon-remove" ng-click="delete(conversation)"></i></a>
+        <a href="#repeat">{{conversation}} <i class="icon-remove" ng-click="delete(conversation)"></i></a>
       </li>
     </ul>
     <div class="tab-content">
-      <div class="tab-pane active" id="repeat" ng-show="activeConversation.length">Je suis {{activeConversation}}</div>
+      <div class="tab-pane" id="repeat">Je suis {{activeConversation}}</div>
     </div>
   </div>
-  <script src="lib/angular/angular.js"></script>
   <script src="lib/jquery-1.7.2.min.js"></script>
+  <script src="lib/angular/angular.js"></script>
   <script src="lib/underscore-min.js"></script>
-  <!-- <script src="lib/bootstrap-tab.js"></script> -->
   <script src="lib/config.js"></script>
   <script src="js/alias.js"></script>
   <script src="lib/strophe.js"></script>
diff --git a/alias-angular/app/js/alias.js b/alias-angular/app/js/alias.js
index b127223..01424cc 100644
--- a/alias-angular/app/js/alias.js
+++ b/alias-angular/app/js/alias.js
@@ -1,3 +1,3 @@
 'use strict';
 // Declare app level module which depends on filters, and services
-angular.module('Alias', ['Alias.services','Alias.filters']);
-\ No newline at end of file
+angular.module('Alias', ['Alias.services', 'Alias.filters', 'Alias.directives']);
+\ No newline at end of file
diff --git a/alias-angular/app/js/controllers.js b/alias-angular/app/js/controllers.js
index 3d88dcc..909754e 100644
--- a/alias-angular/app/js/controllers.js
+++ b/alias-angular/app/js/controllers.js
@@ -104,9 +104,6 @@ function MsgCtl($scope, $log) {
             $scope.activeConversation = contact;
         }
     });
-    $scope.isActive = function(conversation) {
-        return ($scope.activeConversation == conversation) ? 'active' : '';
-    };
     $scope.delete = function(conversation) {
         $scope.conversations.splice(_.indexOf($scope.conversations, conversation),1);
     };
diff --git a/alias-angular/app/js/directives.js b/alias-angular/app/js/directives.js
index 8ed47bb..3b9b652 100644
--- a/alias-angular/app/js/directives.js
+++ b/alias-angular/app/js/directives.js
@@ -2,9 +2,30 @@
 /* http://docs-next.angularjs.org/api/angular.module.ng.$compileProvider.directive */
 
 
-angular.module('myApp.directives', []).
-  directive('appVersion', ['version', function(version) {
-    return function(scope, elm, attrs) {
-      elm.text(version);
-    };
-  }]);
+angular.module('Alias.directives', []).
+    directive('navTabs', function($log) {
+        var directiveDefinition = {
+            restrict: 'C',
+            link: function(scope, elm, attrs) {
+                var tabs = elm.find('li');
+                var selectedTab = tabs.filter('.active');
+                if (!selectedTab.length) {
+                    selectedTab = tabs.filter(':first');
+                    selectedTab.addClass('active');
+                }
+                var selectedPane = $(selectedTab.find('a').attr('href'));
+                selectedPane.addClass('active');
+
+                elm.on('click', function(event) {
+                    selectedTab.removeClass('active');
+                    selectedPane.removeClass('active');
+                    selectedTab = angular.element(event.target).parent();
+                    selectedPane = $(selectedTab.find('a').attr('href'));
+                    selectedTab.addClass('active');
+                    selectedPane.addClass('active');
+                    event.preventDefault();
+                });
+            }
+        };
+        return directiveDefinition;
+    });