diff --git a/.travis.yml b/.travis.yml
index 8385de2..70e634e 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -3,6 +3,4 @@ node_js:
   - 0.10
 before_script:
   - export DISPLAY=:99.0
-  - sh -e /etc/init.d/xvfb start
-notifications:
-  slack: picardy:1mUjogRmeRd1mUdr5a4quAfs
\ No newline at end of file
+  - sh -e /etc/init.d/xvfb start
\ No newline at end of file
diff --git a/src/angular-fontawesome.js b/src/angular-fontawesome.js
index 4acc224..b76cb8e 100644
--- a/src/angular-fontawesome.js
+++ b/src/angular-fontawesome.js
@@ -1,91 +1,18 @@
 'use strict';
 
 angular.module('picardy.fontawesome', [])
-  .directive('fa', function () {
+  .directive('fa', ['util',function (util) {
     return {
       restrict: 'E',
       template: '<span class="fa" aria-hidden="true"></span>',
       replace: true,
       link: function (scope, element, attrs) {
-
-        /*** STRING ATTRS ***/
-        // keep a state of the current attrs so that when they change,
-        // we can remove the old attrs before adding the new ones.
-        var currentClasses = {};
-
-        // generic function to bind string attrs
-        function _observeStringAttr (attr, baseClass) {
-          var className;
-
-          attrs.$observe(attr, function () {
-            baseClass = baseClass || 'fa-' + attr;
-            element.removeClass(currentClasses[attr]);
-            if (attrs[attr]) {
-              className = [baseClass, attrs[attr]].join('-');
-              element.addClass(className);
-              currentClasses[attr] = className;
-            }
-          });
-        }
-
-        _observeStringAttr('name', 'fa');
-        _observeStringAttr('rotate');
-        _observeStringAttr('flip');
-        _observeStringAttr('stack');
-
-        /**
-         * size can be passed "large" or an integer
-         */
-        attrs.$observe('size', function () {
-          var className;
-          element.removeClass(currentClasses.size);
-
-          if (attrs.size === 'large') {
-            className = 'fa-lg';
-          } else if (!isNaN(parseInt(attrs.size, 10))) {
-            className = 'fa-' + attrs.size + 'x';
-          }
-
-          element.addClass(className);
-          currentClasses.size = className;
-        });
-
-        /**
-         * stack can be passed "large" or an integer
-         */
-        attrs.$observe('stack', function () {
-          var className;
-          element.removeClass(currentClasses.stack);
-
-          if (attrs.stack === 'large') {
-            className = 'fa-stack-lg';
-          } else if (!isNaN(parseInt(attrs.stack, 10))) {
-            className = 'fa-stack-' + attrs.stack + 'x';
-          }
-
-          element.addClass(className);
-          currentClasses.stack = className;
+        var _observeAttrWrapper = util._observeAttrWrapper(attrs, element);
+        util._keys(attrs).forEach(function (e) {
+          _observeAttrWrapper._observeAttr(e);
         });
-
-        /*** BOOLEAN ATTRS ***/
-        // generic function to bind boolean attrs
-        function _observeBooleanAttr (attr, className) {
-          var value;
-
-          attrs.$observe(attr, function () {
-            className = className || 'fa-' + attr;
-            value = attr in attrs && attrs[attr] !== 'false' && attrs[attr] !== false;
-            element.toggleClass(className, value);
-          });
-        }
-
-        _observeBooleanAttr('border');
-        _observeBooleanAttr('fw');
-        _observeBooleanAttr('inverse');
-        _observeBooleanAttr('spin');
-
         /*** CONDITIONAL ATTRS ***/
-          // automatically populate fa-li if DOM structure indicates
+        // automatically populate fa-li if DOM structure indicates
         element.toggleClass('fa-li',
           element.parent() &&
           element.parent().prop('tagName') === 'LI' &&
@@ -95,7 +22,87 @@ angular.module('picardy.fontawesome', [])
           attrs.list !== 'false' &&
           attrs.list !== false
         );
+      }
+    };
+  }])
+  .directive('faStack',['util', function (util) {
+    return {
+      restrict: 'E',
+      transclude: true,
+      template: '<span ng-transclude class="fa-stack fa-lg"></span>',
+      replace: true,
+      link: function (scope, element, attrs) {
+        var _observeAttrWrapper = util._observeAttrWrapper(attrs, element);
+        _observeAttrWrapper._observeAttr('size');
+      }
+    };
+  }])
+  .factory('util',function () {
+    function _observeAttrWrapper (attrs, element) {
+      /*** STRING ATTRS ***/
+      // keep a state of the current attrs so that when they change,
+      // we can remove the old attrs before adding the new ones.
+      var currentClasses = {};
+
+      // generic function to bind string attrs
+      // attributes like name、rotate、flip
+      function _observeStringAttr (attr, baseClass) {
+        // check attrs[attr] string or empty
+        var className;
+        /*
+        if (!angular.isString(attrs[attr] || !!attrs[attr])) {
+          return;
+        }
+        */
+        attrs.$observe(attr, function () {
+          baseClass = baseClass || 'fa-' + attr;                    // make baseClass
+          element.removeClass(currentClasses[attr]);                // remove old className from dom element
+          className = [baseClass, attrs[attr]].join('-');           // connnect baseClass and attrs[attr] with '-'
+          element.addClass(className);                              // add className to dom element
+          currentClasses[attr] = className;                         // override className within currentClass Object
+        });
+      }
 
+      // generic function to bind string attrs
+      // attributes like size、stack
+      function _observeNumberAttr (attr, baseClass) {
+        // check attrs[attr] String or empty (ignore 0)
+        //var className;
+        /*
+        if (!angular.isString(attrs[attr] || !!attrs[attr])) {
+          return;
+        }
+        */
+        attrs.$observe(attr, function () {
+          var className;
+          baseClass = baseClass || 'fa-' + attr;                        // make baseClass
+          element.removeClass(currentClasses[attr]);                  // remove old className from dom element
+          if (attrs[attr] === 'large') {
+            className = [baseClass,'lg'].join('-');                   // connnect baseClass and attrs[attr] with '-'
+          } else if (!isNaN(parseInt(attrs[attr], 10))) {
+            className = [baseClass,attrs[attr] + 'x'].join('-');
+          }
+
+          element.addClass(className);                                // add className to dom element
+          currentClasses.size = className;                            // override className within currentClass Object
+        });
+
+      }
+
+
+      // generic function to bind boolean attrs
+      function _observeBooleanAttr (attr, className) {
+        var value;
+
+        attrs.$observe(attr, function () {
+          className = className || 'fa-' + attr;
+          value = attr in attrs && attrs[attr] !== 'false' && attrs[attr] !== false;
+          element.toggleClass(className, value);
+        });
+      }
+
+
+      function _observeAltAttr () {
         attrs.$observe('alt', function () {
           var altText = attrs.alt,
               altElem = element.next(),
@@ -117,55 +124,56 @@ angular.module('picardy.fontawesome', [])
           }
         });
       }
-    };
-  })
-  .directive('faStack', function () {
-    return {
-      restrict: 'E',
-      transclude: true,
-      template: '<span ng-transclude class="fa-stack fa-lg"></span>',
-      replace: true,
-      link: function (scope, element, attrs) {
-
-        /*** STRING ATTRS ***/
-        // keep a state of the current attrs so that when they change,
-        // we can remove the old attrs before adding the new ones.
-        var currentClasses = {};
-
-        // generic function to bind string attrs
-        function _observeStringAttr (attr, baseClass) {
-          var className;
-
-          attrs.$observe(attr, function () {
-            baseClass = baseClass || 'fa-' + attr;
-            element.removeClass(currentClasses[attr]);
-            if (attrs[attr]) {
-              className = [baseClass, attrs[attr]].join('-');
-              element.addClass(className);
-              currentClasses[attr] = className;
-            }
-          });
-        }
 
-        _observeStringAttr('size');
-
-        /**
-         * size can be passed "large" or an integer
-         */
-        attrs.$observe('size', function () {
-          var className;
-
-          element.removeClass(currentClasses.size);
-
-          if (attrs.size === 'large') {
-            className = 'fa-lg';
-          } else if (!isNaN(parseInt(attrs.size, 10))) {
-            className = 'fa-' + attrs.size + 'x';
+      function _observeAttr (attr) {
+        switch (attr) {
+            case 'name':
+                 _observeStringAttr(attr, 'fa');
+                  break;
+            case 'rotate':
+            case 'flip':
+                 _observeStringAttr(attr);
+                  break;
+            case 'size':
+                 _observeNumberAttr(attr,'fa');
+                  break;
+            case 'stack':
+                 _observeNumberAttr(attr);
+                  break;
+            case 'border':
+            case 'fw':
+            case 'inverse':
+            case 'spin':
+                 _observeBooleanAttr(attr);
+                  break;
+            case 'alt':
+                 _observeAltAttr();
+                  break;
           }
-
-          element.addClass(className);
-          currentClasses.size = className;
-        });
       }
+      return {
+          _observeStringAttr  : _observeStringAttr,
+          _observeNumberAttr  : _observeNumberAttr,
+          _observeBooleanAttr : _observeBooleanAttr,
+          _observeAltAttr     : _observeAltAttr,
+          _observeAttr        : _observeAttr
+      };
+    }
+
+    // get object keys and filter keys according keyWhiteList
+    // var keyWhiteList = ['name','rotate','flip','size','stack','border','fw','inverse','spin','alt'];
+    function _keys (obj, keyWhiteList) {
+      var keys = [],key;
+      keyWhiteList = keyWhiteList || ['name','rotate','flip','size','stack','border','fw','inverse','spin','alt'];
+      for (key in obj) {
+        if (keyWhiteList.indexOf(key) !== -1) {
+          keys.push(key);
+        }
+      }
+      return keys;
+    }
+    return {
+      _observeAttrWrapper : _observeAttrWrapper,
+      _keys : _keys
     };
   });