diff --git a/bower.json b/bower.json
index 98c0c9d..5b0426e 100644
--- a/bower.json
+++ b/bower.json
@@ -35,6 +35,7 @@
     "semantic": "latest"
   },
   "devDependencies": {
-    "angular-mocks" : "latest"
+    "angular-mocks": "latest",
+    "ng-describe": "~1.1.0"
   }
 }
diff --git a/dist/angular-semantic-ui.js b/dist/angular-semantic-ui.js
index 6e5d961..7418d08 100644
--- a/dist/angular-semantic-ui.js
+++ b/dist/angular-semantic-ui.js
@@ -586,111 +586,63 @@ function sidebarLink() {
 'use strict';
 
 angular.module('angularify.semantic.rating', [])
-
 .directive('rating', function(){
-    return {
-        restrict: "E",
-        replace: true,
-        transclude: true,
-        scope: {
-            id: "@",
-            size: "@",
-            type: "@",
-            model : '=ngModel'
-        },
-        template: '<div class={{div_class}}>' + 
-                     '<i id="{{id + 1}}" class="{{icon_class}}" ng-click="click(1)" ng-mouseenter="mouse_enter(1)" ng-mouseleave="mouse_leave(1)"></i>' +
-                     '<i id="{{id + 2}}" class="{{icon_class}}" ng-click="click(2)" ng-mouseenter="mouse_enter(2)" ng-mouseleave="mouse_leave(2)"></i>' +
-                     '<i id="{{id + 3}}" class="{{icon_class}}" ng-click="click(3)" ng-mouseenter="mouse_enter(3)" ng-mouseleave="mouse_leave(3)"></i>' +
-                     '<i id="{{id + 4}}" class="{{icon_class}}" ng-click="click(4)" ng-mouseenter="mouse_enter(4)" ng-mouseleave="mouse_leave(4)"></i>' +
-                     '<i id="{{id + 5}}" class="{{icon_class}}" ng-click="click(5)" ng-mouseenter="mouse_enter(5)" ng-mouseleave="mouse_leave(5)"></i>' +
-                   '</div>',
-        link: function(scope, element, attrs){
-            if (scope.model == undefined)
-                scope.model = 0;
-
-            if (scope.model < 1 && scope.model > 5)
-                scope.model = 0;
-
-            // is rating already checked
-            var checked = false;
-            
-            //
-            // Set up icon type
-            //
-            if (scope.type == undefined)
-                scope.type = 'star';
-
-            //
-            // Set up size
-            //
-            if (scope.size == undefined) 
-                scope.div_class = 'ui rating ' + scope.type;
-            else if (scope.size == 'small')
-                scope.div_class = 'ui small ' + scope.type + ' rating';
-            else if (scope.size == 'large')
-                scope.div_class = 'ui large ' + scope.type + ' rating';
-            else if (scope.size == 'huge')
-                scope.div_class = 'ui huge ' + scope.type + ' rating';
-
-            //
-            // set up icon class
-            //
-            scope.icon_class = 'icon';
-
-            //
-            // Handle mouse enter
-            //
-            scope.mouse_enter = function(icon_index){
-                if (checked == true)
-                    return;
-
-                var i = 1;
-                for (i; i <= icon_index; i++){
-                    document.getElementById(scope.id + i).className = 'icon active';
-                }
-
-                return;
-            };
-
-            //
-            // Handle mouse leave
-            //
-            scope.mouse_leave = function(icon_index){
-                if (checked == true)
-                    return;
-
-                var i = 1;
-                for (i; i <= 5; i++){
-                    document.getElementById(scope.id + i).className = 'icon';
-                }
-
-                return;
-            };
-
-            //
-            // Handle click
-            //
-            scope.click = function(icon_index, mode){
-                var i = 1;
-                for (i; i <= icon_index; i++){
-                    document.getElementById(scope.id + i).className = 'icon active';
-                }
-
-                if (icon_index !== 0)
-                    checked = true;
+  return {
+    restrict: "E",
+    replace: true,
+    scope: {
+      ngModel : '=',
+      max: '=',
+      onRate: '&?',
+      interactive: '=',
+      clearable: '='
+    },
+    controller: function() {
+      var vm = this;
 
-                return;
-            };
+      if(!vm.max) vm.max = 5;
+      if(!+vm.ngModel) vm.ngModel = 0;
+      if(+vm.ngModel > vm.max ) vm.ngModel = +vm.max;
+      if(vm.interactive == undefined) vm.interactive = true;
+      if(vm.max == 1 && vm.clearable == undefined) vm.clearable = true;
 
-            //
-            // Watch for model
-            //
-            scope.$watch('model', function(val){
-                scope.click(val);
-            });
+      vm.setRate = function(rate) {
+        if (vm.clearable && rate == +vm.ngModel) {
+          vm.ngModel = 0;
+        } else {
+          vm.ngModel = rate;
+          if (angular.isFunction(vm.onRate)) vm.onRate({ rate: rate });
         }
-    };
+      };
+    },
+    controllerAs: 'vm',
+    bindToController: true,
+    require: 'ngModel',
+    template: '<div class="ui rating" ng-switch="vm.interactive">' +
+                '<i ng-switch-when="true" ' +
+                  'class="icon" ' +
+                  'ng-class="{ active: vm.current >= rate }" ' +
+                  'ng-click="vm.setRate(rate)" ' +
+                  'ng-mouseenter="vm.current = rate" ' +
+                  'ng-mouseleave="vm.current = +vm.ngModel" ' +
+                  'ng-repeat="rate in vm.range track by $index"' +
+                '></i>' +
+                '<i ng-switch-when="false" ' +
+                  'class="icon" ' +
+                  'ng-class="{ active: vm.current >= rate }" ' +
+                  'ng-repeat="rate in vm.range track by $index"' +
+                '></i>' +
+              '</div>',
+    link: function($scope, iElement, iAttrs) {
+      $scope.$watch('vm.max', function (value) {
+        $scope.vm.range = Array.apply(null, Array(+value)).map(function (_, i) {return i+1;});
+      });
+
+      $scope.$watch('vm.ngModel', function(value) {
+        $scope.vm.current = value;
+      });
+    }
+  };
 });
 
 /* globals _:false */
diff --git a/dist/angular-semantic-ui.min.js b/dist/angular-semantic-ui.min.js
index 88c6b46..b0ea9af 100644
--- a/dist/angular-semantic-ui.min.js
+++ b/dist/angular-semantic-ui.min.js
@@ -1 +1 @@
-function sidebar(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="ui inverted left vertical sidebar menu" ng-transclude></div>',scope:{buttonClass:"@"},link:function(a,b,c){b.sidebar("attach events",a.buttonClass,"show")}}}function sidebarItemGroup(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="item"><div class="ui small inverted header">{{ title }}</div><div class="menu" ng-transclude></div></div>',scope:{title:"@"}}}function sidebarItem(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="item" ng-transclude></div>'}}function sidebarLink(){return{restrict:"E",replace:!0,template:'<a class="item" href="{{ href }}"><i class="{{ icon }} icon"></i>{{ title }}</a>',scope:{title:"@",icon:"@",href:"@"}}}function wizardButtonDirective(a){angular.module("angularify.semantic.wizard").directive(a,function(){return{restrict:"A",replace:!1,require:"^wizard",link:function(b,c,d,e){b.noMargin={margin:0},c.on("click",function(c){c.preventDefault(),b.$apply(function(){b.$eval(d[a]),e[a.replace("wz","").toLowerCase()]()})})}}})}angular.module("angularify.semantic",["angularify.semantic.accordion","angularify.semantic.checkbox","angularify.semantic.dimmer","angularify.semantic.dropdown","angularify.semantic.modal","angularify.semantic.popup","angularify.semantic.rating","angularify.semantic.sidebar","angularify.semantic.wizard"]),angular.module("angularify.semantic.accordion",[]).controller("AccordionController",["$scope",function(a){a.accordions=[],this.add_accordion=function(b){a.accordions.push(b);var c=this;return b.$on("$destroy",function(a){c.remove_accordion(b)}),a.accordions},this.closeAll=function(b){var c=0,d=!1,e=a.accordions.indexOf(b);for(c in a.accordions)a.accordions[c].close&&(d=!0);if(1==d){for(c in a.accordions)c!==e&&(a.accordions[c].active=!1);return!0}return!1},this.remove_accordion=function(b){var c=a.accordions.indexOf(b);-1!==c&&a.accordions.splice(c,1)},this.is_close_all=function(){var b=0;for(b in a.accordions)if("true"==a.accordions[b].close)return!0;return!1}}]).directive("accordion",function(){return{restrict:"E",replace:!0,transclude:!0,controller:"AccordionController",scope:{close:"@"},template:'<div class="ui accordion" ng-transclude></div>',link:function(a,b,c,d){"undefined"!=typeof c.styled&&b.addClass("styled"),d.add_accordion(a)}}}).directive("accordionGroup",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{title:"@",open:"@"},require:"^accordion",template:'<div class="ui">                   <div class="title" ng-class="{ active: active }" ng-click="click_on_accordion_tab()">                      <i class="dropdown icon"></i>                      {{ title }}                    </div>                    <div class="content"  ng-class="{ active: active }" ng-transclude>                    </div>                    </div>',link:function(a,b,c,d){a.active="true"===c.open,d.add_accordion(a),a.click_on_accordion_tab=function(){d.closeAll(a),a.active=!a.active,b.children().last().slideToggle()}}}}),angular.module("angularify.semantic.checkbox",[]).directive("checkbox",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{checked:"&?",disabled:"&?",ngModel:"=ngModel"},controller:function(){var a=this;angular.isFunction(a.checked)&&(a.ngModel=!!a.checked()),a.toggle=function(){angular.isFunction(a.disabled)&&a.disabled()||(a.ngModel=!a.ngModel)}},controllerAs:"vm",bindToController:!0,require:"ngModel",template:'<div class="ui checkbox"><input type="checkbox" ng-model="vm.ngModel" ng-disabled="vm.disabled()"/><label ng-click="vm.toggle()" ng-transclude></label></div>',link:function(){}}}),angular.module("angularify.semantic.dimmer",[]).directive("pageDimmer",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{show:"=?",model:"=ngModel"},template:'<div class="{{dimmer_class}}" ng-click="click_on_dimmer()"><div class="content"><div class="center" ng-transclude></div></div></div>',link:function(a,b,c,d){1==a.show?a.dimmer_class="ui page active dimmer":(a.show=!1,a.dimmer_class="ui page disable dimmer"),a.click_on_dimmer=function(){a.model=!1,a.dimmer_class="ui page dimmer"},a.$watch("model",function(b){0!=b&&void 0!=b&&(a.dimmer_class="ui page active dimmer")})}}}),angular.module("angularify.semantic.dropdown",[]).controller("DropDownController",["$scope",function(a){a.options=[],this.add_option=function(b,c){a.options.push({title:b,value:c}),c==a.model&&this.update_title(c)},this.remove_option=function(b,c){for(var d in a.options)if(a.options[d].value==c&&a.options[d].title==b){a.options.splice(d,1);break}},this.update_model=function(b,c){a.model!==c&&(a.model=c)},this.update_title=function(b){var c=!1;for(var d in a.options)a.options[d].value==b&&(a.title=a.options[d].title,c=!0);c?a.text_class="text":(a.title=a.original_title,a.text_class="default text")}}]).directive("dropdown",function(){return{restrict:"E",replace:!0,transclude:!0,controller:"DropDownController",scope:{title:"@",open:"@",model:"=ngModel"},template:'<div class="{{ dropdown_class }}"><div class="{{text_class}}">{{ title }}</div><i class="dropdown icon"></i><div class="{{ menu_class }}"  ng-transclude></div></div>',link:function(a,b,c,d){a.dropdown_class="ui selection dropdown",a.menu_class="menu transition hidden",a.text_class="default text",a.original_title=a.title,"true"===a.open?(a.is_open=!0,a.dropdown_class=a.dropdown_class+" active visible",a.menu_class=a.menu_class+" visible"):a.is_open=!1,a.element=b,a.$watch("model",function(a){d.update_title(a)}),b.bind("click",function(){a.is_open===!1?a.$apply(function(){a.dropdown_class="ui selection dropdown active visible",a.menu_class="menu transition visible"}):a.$apply(function(){a.dropdown_class="ui selection dropdown",a.menu_class="menu transition hidden"}),a.is_open=!a.is_open})}}}).directive("dropdownGroup",function(){return{restrict:"AE",replace:!0,transclude:!0,require:"^dropdown",scope:{title:"=title",value:"=value"},template:'<div class="item" ng-transclude>{{ item_title }}</div>',link:function(a,b,c,d){void 0===a.title?a.item_title=c.title||b.children()[0].innerHTML:a.item_title=a.title,void 0===a.value?a.item_value=c.value||a.item_title:a.item_value=a.value,d.add_option(a.item_title,a.item_value),b.bind("click",function(){d.update_model(a.item_title,a.item_value)}),a.$on("$destroy",function(){d.remove_option(a.item_title,a.item_value)})}}}),angular.module("angularify.semantic.modal",[]).directive("modal",function(){return{restrict:"E",replace:!0,transclude:!0,require:"ngModel",template:'<div class="ui modal" ng-transclude></div>',link:function(a,b,c,d){b.modal({onHide:function(){d.$setViewValue(!1)}}),a.$watch(function(){return d.$modelValue},function(a){b.modal(a?"show":"hide")})}}}),angular.module("angularify.semantic.popup",[]).directive("popup",function($document){return{restrict:"A",scope:{popup:"@"},link:function(scope,element,attrs){function getPos(a){for(var b=0,c=0;;){if(b+=a.offsetLeft,c+=a.offsetTop,null===a.offsetParent)break;a=a.offsetParent}return[b,c]}var class_name="",popup_meta_data=eval("("+scope.popup+")"),title=popup_meta_data.title;void 0==title&&(title="");var content=popup_meta_data.content;void 0==content&&(content="");var position=popup_meta_data.position;void 0==position&&(position="top");var size=popup_meta_data.size;void 0==size&&(size="small"),class_name="left"==position?"ui popup left center transition visible "+size:"right"==position?"ui popup right center transition visible "+size:"bottom"==position?"ui popup bottom center transition visible "+size:"ui popup top center transition visible "+size;var current_element_position_top_left=getPos(element[0]),current_element_height=element[0].offsetHeight,current_element_width=element[0].offsetWidth;NodeList.prototype.remove=HTMLCollection.prototype.remove=function(){for(var a=0,b=this.length;b>a;a++)this[a]&&this[a].parentElement&&this[a].parentElement.removeChild(this[a])},element.bind("mouseenter",function(){var a='<div id="my-popup" class="'+class_name+'" style=""><div class="header">'+title+'</div><div class="content">'+content+"</div></div>";angular.element(element[0]).append(a);var b=document.getElementById("my-popup").clientHeight,c=document.getElementById("my-popup").clientWidth;"left"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height/2-b/2+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.left=current_element_position_top_left[0]-c-10+"px",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):"right"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height/2-b/2+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width+"px",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):"bottom"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height+"px",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width/2-c/2+15+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):(document.getElementById("my-popup").style.top=current_element_position_top_left[1]-b-10+"px",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width/2-c/2+18+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block")}),element.bind("mouseleave",function(){document.getElementsByClassName("ui popup bottom center transition visible").remove(),null!==document.getElementById("my-popup")&&document.getElementById("my-popup").remove()})}}}),angular.module("angularify.semantic.sidebar",[]).directive("sidebar",sidebar).directive("sidebarLink",sidebarLink).directive("sidebarItem",sidebarItem).directive("sidebarItemGroup",sidebarItemGroup),angular.module("angularify.semantic.rating",[]).directive("rating",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{id:"@",size:"@",type:"@",model:"=ngModel"},template:'<div class={{div_class}}><i id="{{id + 1}}" class="{{icon_class}}" ng-click="click(1)" ng-mouseenter="mouse_enter(1)" ng-mouseleave="mouse_leave(1)"></i><i id="{{id + 2}}" class="{{icon_class}}" ng-click="click(2)" ng-mouseenter="mouse_enter(2)" ng-mouseleave="mouse_leave(2)"></i><i id="{{id + 3}}" class="{{icon_class}}" ng-click="click(3)" ng-mouseenter="mouse_enter(3)" ng-mouseleave="mouse_leave(3)"></i><i id="{{id + 4}}" class="{{icon_class}}" ng-click="click(4)" ng-mouseenter="mouse_enter(4)" ng-mouseleave="mouse_leave(4)"></i><i id="{{id + 5}}" class="{{icon_class}}" ng-click="click(5)" ng-mouseenter="mouse_enter(5)" ng-mouseleave="mouse_leave(5)"></i></div>',link:function(a,b,c){void 0==a.model&&(a.model=0),a.model<1&&a.model>5&&(a.model=0);var d=!1;void 0==a.type&&(a.type="star"),void 0==a.size?a.div_class="ui rating "+a.type:"small"==a.size?a.div_class="ui small "+a.type+" rating":"large"==a.size?a.div_class="ui large "+a.type+" rating":"huge"==a.size&&(a.div_class="ui huge "+a.type+" rating"),a.icon_class="icon",a.mouse_enter=function(b){if(1!=d){var c=1;for(c;b>=c;c++)document.getElementById(a.id+c).className="icon active"}},a.mouse_leave=function(b){if(1!=d){var c=1;for(c;5>=c;c++)document.getElementById(a.id+c).className="icon"}},a.click=function(b,c){var e=1;for(e;b>=e;e++)document.getElementById(a.id+e).className="icon active";0!==b&&(d=!0)},a.$watch("model",function(b){a.click(b)})}}}),angular.module("angularify.semantic.wizard",[]).controller("WizardController",["$scope",function(a){function b(){a.steps.forEach(function(a){a.selected=!1}),a.selectedStep=null}a.steps=[],a.currentStep=null,a.stepsLength="",a.$watch("currentStep",function(b){if(b){var c=a.selectedStep.title;a.selectedStep&&c!==a.currentStep&&a.goTo(a.steps.filter(function(b){return b.title==-a.currentStep})[0])}}),a.$watch("[editMode, steps.length]",function(){var b=a.editMode;void 0!==b&&null!==b&&b&&a.steps.forEach(function(a){a.completed=!0})},!0),this.addStep=function(b){a.steps.push(b),1===a.steps.length&&a.goTo(a.steps[0])},a.goTo=function(c){b(),a.selectedStep=c,void 0!==a.currentStep&&(a.currentStep=c.title),c.selected=!0,a.$emit("wizard:stepChanged",{step:c,index:a.steps.indexOf(c)})},this.next=function(){var b=a.steps.indexOf(a.selectedStep);a.selectedStep.completed=!0,b===a.steps.length-1?this.finish():a.goTo(a.steps[b+1])},this.goTo=function(b){var c;c=angular.isNumber(b)?a.steps[b]:a.steps.filter(function(a){return a.title===a})[0],a.goTo(c)},this.finish=function(){a.onFinish&&(a.selectedStep.completed=!0,a.onFinish())},this.cancel=this.previous=function(){var b=a.steps.indexOf(a.selectedStep);if(0===b)throw new Error("Cant go back. Its already in step 0");a.goTo(a.steps[b-1])},a.getStatus=function(a){var b=[];return a.selected&&b.push("active"),a.selected||a.completed||b.push("disabled"),a.completed&&b.push("completed"),b}}]).directive("wizard",function(){return{restrict:"EA",replace:!0,transclude:!0,scope:{fullwidth:"@",currentStep:"=?",onFinish:"&",editMode:"=",name:"@"},controller:"WizardController",template:'<div><div class="ui steps {{stepsLength}} small"><div class="ui step" ng-repeat="step in steps" ng-click="step.completed && goTo(step)" ng-class="getStatus(step)">{{step.title}}</div></div><div class="ui hidden divider"></div><div ng-transclude></div></div>',link:function(a,b,c,d){if("true"===a.fullwidth){var e={0:"",1:"one",2:"two",3:"three",4:"four",5:"five",6:"six",7:"seven",8:"eight",9:"nine",10:"ten"};a.stepsLength=e[a.steps.length]}}}}).directive("wizardPane",function(){return{restrict:"EA",replace:!0,transclude:!0,require:"^wizard",controller:"WizardController",scope:{title:"@"},template:'<div class="ui segment" ng-transclude ng-show="selected" ng-style="noMargin"></div>',link:function(a,b,c,d){d.addStep(a)}}}),wizardButtonDirective("wzNext"),wizardButtonDirective("wzPrevious"),wizardButtonDirective("wzFinish"),wizardButtonDirective("wzCancel");
\ No newline at end of file
+function sidebar(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="ui inverted left vertical sidebar menu" ng-transclude></div>',scope:{buttonClass:"@"},link:function(a,b,c){b.sidebar("attach events",a.buttonClass,"show")}}}function sidebarItemGroup(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="item"><div class="ui small inverted header">{{ title }}</div><div class="menu" ng-transclude></div></div>',scope:{title:"@"}}}function sidebarItem(){return{restrict:"E",replace:!0,transclude:!0,template:'<div class="item" ng-transclude></div>'}}function sidebarLink(){return{restrict:"E",replace:!0,template:'<a class="item" href="{{ href }}"><i class="{{ icon }} icon"></i>{{ title }}</a>',scope:{title:"@",icon:"@",href:"@"}}}function wizardButtonDirective(a){angular.module("angularify.semantic.wizard").directive(a,function(){return{restrict:"A",replace:!1,require:"^wizard",link:function(b,c,d,e){b.noMargin={margin:0},c.on("click",function(c){c.preventDefault(),b.$apply(function(){b.$eval(d[a]),e[a.replace("wz","").toLowerCase()]()})})}}})}angular.module("angularify.semantic",["angularify.semantic.accordion","angularify.semantic.checkbox","angularify.semantic.dimmer","angularify.semantic.dropdown","angularify.semantic.modal","angularify.semantic.popup","angularify.semantic.rating","angularify.semantic.sidebar","angularify.semantic.wizard"]),angular.module("angularify.semantic.accordion",[]).controller("AccordionController",["$scope",function(a){a.accordions=[],this.add_accordion=function(b){a.accordions.push(b);var c=this;return b.$on("$destroy",function(a){c.remove_accordion(b)}),a.accordions},this.closeAll=function(b){var c=0,d=!1,e=a.accordions.indexOf(b);for(c in a.accordions)a.accordions[c].close&&(d=!0);if(1==d){for(c in a.accordions)c!==e&&(a.accordions[c].active=!1);return!0}return!1},this.remove_accordion=function(b){var c=a.accordions.indexOf(b);-1!==c&&a.accordions.splice(c,1)},this.is_close_all=function(){var b=0;for(b in a.accordions)if("true"==a.accordions[b].close)return!0;return!1}}]).directive("accordion",function(){return{restrict:"E",replace:!0,transclude:!0,controller:"AccordionController",scope:{close:"@"},template:'<div class="ui accordion" ng-transclude></div>',link:function(a,b,c,d){"undefined"!=typeof c.styled&&b.addClass("styled"),d.add_accordion(a)}}}).directive("accordionGroup",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{title:"@",open:"@"},require:"^accordion",template:'<div class="ui">                   <div class="title" ng-class="{ active: active }" ng-click="click_on_accordion_tab()">                      <i class="dropdown icon"></i>                      {{ title }}                    </div>                    <div class="content"  ng-class="{ active: active }" ng-transclude>                    </div>                    </div>',link:function(a,b,c,d){a.active="true"===c.open,d.add_accordion(a),a.click_on_accordion_tab=function(){d.closeAll(a),a.active=!a.active,b.children().last().slideToggle()}}}}),angular.module("angularify.semantic.checkbox",[]).directive("checkbox",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{checked:"&?",disabled:"&?",ngModel:"=ngModel"},controller:function(){var a=this;angular.isFunction(a.checked)&&(a.ngModel=!!a.checked()),a.toggle=function(){angular.isFunction(a.disabled)&&a.disabled()||(a.ngModel=!a.ngModel)}},controllerAs:"vm",bindToController:!0,require:"ngModel",template:'<div class="ui checkbox"><input type="checkbox" ng-model="vm.ngModel" ng-disabled="vm.disabled()"/><label ng-click="vm.toggle()" ng-transclude></label></div>',link:function(){}}}),angular.module("angularify.semantic.dimmer",[]).directive("pageDimmer",function(){return{restrict:"E",replace:!0,transclude:!0,scope:{show:"=?",model:"=ngModel"},template:'<div class="{{dimmer_class}}" ng-click="click_on_dimmer()"><div class="content"><div class="center" ng-transclude></div></div></div>',link:function(a,b,c,d){1==a.show?a.dimmer_class="ui page active dimmer":(a.show=!1,a.dimmer_class="ui page disable dimmer"),a.click_on_dimmer=function(){a.model=!1,a.dimmer_class="ui page dimmer"},a.$watch("model",function(b){0!=b&&void 0!=b&&(a.dimmer_class="ui page active dimmer")})}}}),angular.module("angularify.semantic.dropdown",[]).controller("DropDownController",["$scope",function(a){a.options=[],this.add_option=function(b,c){a.options.push({title:b,value:c}),c==a.model&&this.update_title(c)},this.remove_option=function(b,c){for(var d in a.options)if(a.options[d].value==c&&a.options[d].title==b){a.options.splice(d,1);break}},this.update_model=function(b,c){a.model!==c&&(a.model=c)},this.update_title=function(b){var c=!1;for(var d in a.options)a.options[d].value==b&&(a.title=a.options[d].title,c=!0);c?a.text_class="text":(a.title=a.original_title,a.text_class="default text")}}]).directive("dropdown",function(){return{restrict:"E",replace:!0,transclude:!0,controller:"DropDownController",scope:{title:"@",open:"@",model:"=ngModel"},template:'<div class="{{ dropdown_class }}"><div class="{{text_class}}">{{ title }}</div><i class="dropdown icon"></i><div class="{{ menu_class }}"  ng-transclude></div></div>',link:function(a,b,c,d){a.dropdown_class="ui selection dropdown",a.menu_class="menu transition hidden",a.text_class="default text",a.original_title=a.title,"true"===a.open?(a.is_open=!0,a.dropdown_class=a.dropdown_class+" active visible",a.menu_class=a.menu_class+" visible"):a.is_open=!1,a.element=b,a.$watch("model",function(a){d.update_title(a)}),b.bind("click",function(){a.is_open===!1?a.$apply(function(){a.dropdown_class="ui selection dropdown active visible",a.menu_class="menu transition visible"}):a.$apply(function(){a.dropdown_class="ui selection dropdown",a.menu_class="menu transition hidden"}),a.is_open=!a.is_open})}}}).directive("dropdownGroup",function(){return{restrict:"AE",replace:!0,transclude:!0,require:"^dropdown",scope:{title:"=title",value:"=value"},template:'<div class="item" ng-transclude>{{ item_title }}</div>',link:function(a,b,c,d){void 0===a.title?a.item_title=c.title||b.children()[0].innerHTML:a.item_title=a.title,void 0===a.value?a.item_value=c.value||a.item_title:a.item_value=a.value,d.add_option(a.item_title,a.item_value),b.bind("click",function(){d.update_model(a.item_title,a.item_value)}),a.$on("$destroy",function(){d.remove_option(a.item_title,a.item_value)})}}}),angular.module("angularify.semantic.modal",[]).directive("modal",function(){return{restrict:"E",replace:!0,transclude:!0,require:"ngModel",template:'<div class="ui modal" ng-transclude></div>',link:function(a,b,c,d){b.modal({onHide:function(){d.$setViewValue(!1)}}),a.$watch(function(){return d.$modelValue},function(a){b.modal(a?"show":"hide")})}}}),angular.module("angularify.semantic.popup",[]).directive("popup",function($document){return{restrict:"A",scope:{popup:"@"},link:function(scope,element,attrs){function getPos(a){for(var b=0,c=0;;){if(b+=a.offsetLeft,c+=a.offsetTop,null===a.offsetParent)break;a=a.offsetParent}return[b,c]}var class_name="",popup_meta_data=eval("("+scope.popup+")"),title=popup_meta_data.title;void 0==title&&(title="");var content=popup_meta_data.content;void 0==content&&(content="");var position=popup_meta_data.position;void 0==position&&(position="top");var size=popup_meta_data.size;void 0==size&&(size="small"),class_name="left"==position?"ui popup left center transition visible "+size:"right"==position?"ui popup right center transition visible "+size:"bottom"==position?"ui popup bottom center transition visible "+size:"ui popup top center transition visible "+size;var current_element_position_top_left=getPos(element[0]),current_element_height=element[0].offsetHeight,current_element_width=element[0].offsetWidth;NodeList.prototype.remove=HTMLCollection.prototype.remove=function(){for(var a=0,b=this.length;b>a;a++)this[a]&&this[a].parentElement&&this[a].parentElement.removeChild(this[a])},element.bind("mouseenter",function(){var a='<div id="my-popup" class="'+class_name+'" style=""><div class="header">'+title+'</div><div class="content">'+content+"</div></div>";angular.element(element[0]).append(a);var b=document.getElementById("my-popup").clientHeight,c=document.getElementById("my-popup").clientWidth;"left"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height/2-b/2+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.left=current_element_position_top_left[0]-c-10+"px",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):"right"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height/2-b/2+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width+"px",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):"bottom"==position?(document.getElementById("my-popup").style.top=current_element_position_top_left[1]+current_element_height+"px",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width/2-c/2+15+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block"):(document.getElementById("my-popup").style.top=current_element_position_top_left[1]-b-10+"px",document.getElementById("my-popup").style.left=current_element_position_top_left[0]+current_element_width/2-c/2+18+"px",document.getElementById("my-popup").style.right="auto",document.getElementById("my-popup").style.bottom="auto",document.getElementById("my-popup").style.display="inline-block")}),element.bind("mouseleave",function(){document.getElementsByClassName("ui popup bottom center transition visible").remove(),null!==document.getElementById("my-popup")&&document.getElementById("my-popup").remove()})}}}),angular.module("angularify.semantic.sidebar",[]).directive("sidebar",sidebar).directive("sidebarLink",sidebarLink).directive("sidebarItem",sidebarItem).directive("sidebarItemGroup",sidebarItemGroup),angular.module("angularify.semantic.rating",[]).directive("rating",function(){return{restrict:"E",replace:!0,scope:{ngModel:"=",max:"=",onRate:"&?",interactive:"=",clearable:"="},controller:function(){var a=this;a.max||(a.max=5),+a.ngModel||(a.ngModel=0),+a.ngModel>a.max&&(a.ngModel=+a.max),void 0==a.interactive&&(a.interactive=!0),1==a.max&&void 0==a.clearable&&(a.clearable=!0),a.setRate=function(b){a.clearable&&b==+a.ngModel?a.ngModel=0:(a.ngModel=b,angular.isFunction(a.onRate)&&a.onRate({rate:b}))}},controllerAs:"vm",bindToController:!0,require:"ngModel",template:'<div class="ui rating" ng-switch="vm.interactive"><i ng-switch-when="true" class="icon" ng-class="{ active: vm.current >= rate }" ng-click="vm.setRate(rate)" ng-mouseenter="vm.current = rate" ng-mouseleave="vm.current = +vm.ngModel" ng-repeat="rate in vm.range track by $index"></i><i ng-switch-when="false" class="icon" ng-class="{ active: vm.current >= rate }" ng-repeat="rate in vm.range track by $index"></i></div>',link:function(a,b,c){a.$watch("vm.max",function(b){a.vm.range=Array.apply(null,Array(+b)).map(function(a,b){return b+1})}),a.$watch("vm.ngModel",function(b){a.vm.current=b})}}}),angular.module("angularify.semantic.wizard",[]).controller("WizardController",["$scope",function(a){function b(){a.steps.forEach(function(a){a.selected=!1}),a.selectedStep=null}a.steps=[],a.currentStep=null,a.stepsLength="",a.$watch("currentStep",function(b){if(b){var c=a.selectedStep.title;a.selectedStep&&c!==a.currentStep&&a.goTo(a.steps.filter(function(b){return b.title==-a.currentStep})[0])}}),a.$watch("[editMode, steps.length]",function(){var b=a.editMode;void 0!==b&&null!==b&&b&&a.steps.forEach(function(a){a.completed=!0})},!0),this.addStep=function(b){a.steps.push(b),1===a.steps.length&&a.goTo(a.steps[0])},a.goTo=function(c){b(),a.selectedStep=c,void 0!==a.currentStep&&(a.currentStep=c.title),c.selected=!0,a.$emit("wizard:stepChanged",{step:c,index:a.steps.indexOf(c)})},this.next=function(){var b=a.steps.indexOf(a.selectedStep);a.selectedStep.completed=!0,b===a.steps.length-1?this.finish():a.goTo(a.steps[b+1])},this.goTo=function(b){var c;c=angular.isNumber(b)?a.steps[b]:a.steps.filter(function(a){return a.title===a})[0],a.goTo(c)},this.finish=function(){a.onFinish&&(a.selectedStep.completed=!0,a.onFinish())},this.cancel=this.previous=function(){var b=a.steps.indexOf(a.selectedStep);if(0===b)throw new Error("Cant go back. Its already in step 0");a.goTo(a.steps[b-1])},a.getStatus=function(a){var b=[];return a.selected&&b.push("active"),a.selected||a.completed||b.push("disabled"),a.completed&&b.push("completed"),b}}]).directive("wizard",function(){return{restrict:"EA",replace:!0,transclude:!0,scope:{fullwidth:"@",currentStep:"=?",onFinish:"&",editMode:"=",name:"@"},controller:"WizardController",template:'<div><div class="ui steps {{stepsLength}} small"><div class="ui step" ng-repeat="step in steps" ng-click="step.completed && goTo(step)" ng-class="getStatus(step)">{{step.title}}</div></div><div class="ui hidden divider"></div><div ng-transclude></div></div>',link:function(a,b,c,d){if("true"===a.fullwidth){var e={0:"",1:"one",2:"two",3:"three",4:"four",5:"five",6:"six",7:"seven",8:"eight",9:"nine",10:"ten"};a.stepsLength=e[a.steps.length]}}}}).directive("wizardPane",function(){return{restrict:"EA",replace:!0,transclude:!0,require:"^wizard",controller:"WizardController",scope:{title:"@"},template:'<div class="ui segment" ng-transclude ng-show="selected" ng-style="noMargin"></div>',link:function(a,b,c,d){d.addStep(a)}}}),wizardButtonDirective("wzNext"),wizardButtonDirective("wzPrevious"),wizardButtonDirective("wzFinish"),wizardButtonDirective("wzCancel");
\ No newline at end of file
diff --git a/karma.conf.js b/karma.conf.js
index 68c6847..2cd0902 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -6,6 +6,7 @@ files = [
   'bower_components/jquery/dist/jquery.min.js',
   'bower_components/angular/angular.min.js',
   'bower_components/angular-mocks/angular-mocks.js',
+  'bower_components/ng-describe/dist/ng-describe.js',
   'src/**/*.js',
 ];
 
diff --git a/src/rating/docs/controllers.js b/src/rating/docs/controllers.js
index b785fd6..8e543e7 100644
--- a/src/rating/docs/controllers.js
+++ b/src/rating/docs/controllers.js
@@ -1,5 +1,12 @@
-var ratingApp = angular.module('ratingApp', ['angularify.semantic.rating']);
+angular.module('ratingApp', ['angularify.semantic.rating'])
+.controller('RootCtrl', function($scope) {
+  $scope.rate = 3;
+  $scope.rated = function(rate) {
+    alert('Rate is ' + rate);
+  };
+
+  $scope.clearable_rate = 2;
+
+  $scope.fixed_rate = 4;
+});
 
-function RootCtrl ($scope) {
-    // $scope.rating = 1;
-}
diff --git a/src/rating/docs/demo.html b/src/rating/docs/demo.html
index 8bd4790..f7ed645 100644
--- a/src/rating/docs/demo.html
+++ b/src/rating/docs/demo.html
@@ -3,13 +3,18 @@
 <head>
   <meta charset="utf-8" />
   <title>Semantic UI + Angular.JS</title>
-  <link href="../../../bower_components/semantic/build/packaged/css/semantic.min.css" rel="stylesheet" type="text/css" /> 
+  <link href="../../../bower_components/semantic/dist/semantic.min.css" rel="stylesheet" type="text/css" />
 </head>
 <body ng-controller="RootCtrl">
-    <rating id="my-rating" size="large" type="heart" ng-model="rating"></rating>
+    <rating class="massive heart" ng-model="rate" max="6" on-rate="rated(rate);"></rating>
+    <p>Rate is {{ rate }}.</p>
+    <rating class="massive heart" ng-model="clearable_rate" clearable="true"></rating>
+    <p>Rate is {{ clearable_rate }}.</p>
+    <rating class="massive heart" ng-model="fixed_rate" interactive="false"></rating>
+    <p>Rate is {{ fixed_rate }}.</p>
     <script src="../../../bower_components/angular/angular.min.js" type="text/javascript"></script>
     <script src="../../angularify.semantic.js" type="text/javascript"></script>
     <script src="../rating.js" type="text/javascript"></script>
     <script src="controllers.js" type="text/javascript"></script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/src/rating/rating.js b/src/rating/rating.js
index 75e9494..d2dad9a 100644
--- a/src/rating/rating.js
+++ b/src/rating/rating.js
@@ -1,109 +1,61 @@
 'use strict';
 
 angular.module('angularify.semantic.rating', [])
-
 .directive('rating', function(){
-    return {
-        restrict: "E",
-        replace: true,
-        transclude: true,
-        scope: {
-            id: "@",
-            size: "@",
-            type: "@",
-            model : '=ngModel'
-        },
-        template: '<div class={{div_class}}>' + 
-                     '<i id="{{id + 1}}" class="{{icon_class}}" ng-click="click(1)" ng-mouseenter="mouse_enter(1)" ng-mouseleave="mouse_leave(1)"></i>' +
-                     '<i id="{{id + 2}}" class="{{icon_class}}" ng-click="click(2)" ng-mouseenter="mouse_enter(2)" ng-mouseleave="mouse_leave(2)"></i>' +
-                     '<i id="{{id + 3}}" class="{{icon_class}}" ng-click="click(3)" ng-mouseenter="mouse_enter(3)" ng-mouseleave="mouse_leave(3)"></i>' +
-                     '<i id="{{id + 4}}" class="{{icon_class}}" ng-click="click(4)" ng-mouseenter="mouse_enter(4)" ng-mouseleave="mouse_leave(4)"></i>' +
-                     '<i id="{{id + 5}}" class="{{icon_class}}" ng-click="click(5)" ng-mouseenter="mouse_enter(5)" ng-mouseleave="mouse_leave(5)"></i>' +
-                   '</div>',
-        link: function(scope, element, attrs){
-            if (scope.model == undefined)
-                scope.model = 0;
-
-            if (scope.model < 1 && scope.model > 5)
-                scope.model = 0;
-
-            // is rating already checked
-            var checked = false;
-            
-            //
-            // Set up icon type
-            //
-            if (scope.type == undefined)
-                scope.type = 'star';
-
-            //
-            // Set up size
-            //
-            if (scope.size == undefined) 
-                scope.div_class = 'ui rating ' + scope.type;
-            else if (scope.size == 'small')
-                scope.div_class = 'ui small ' + scope.type + ' rating';
-            else if (scope.size == 'large')
-                scope.div_class = 'ui large ' + scope.type + ' rating';
-            else if (scope.size == 'huge')
-                scope.div_class = 'ui huge ' + scope.type + ' rating';
-
-            //
-            // set up icon class
-            //
-            scope.icon_class = 'icon';
-
-            //
-            // Handle mouse enter
-            //
-            scope.mouse_enter = function(icon_index){
-                if (checked == true)
-                    return;
-
-                var i = 1;
-                for (i; i <= icon_index; i++){
-                    document.getElementById(scope.id + i).className = 'icon active';
-                }
-
-                return;
-            };
-
-            //
-            // Handle mouse leave
-            //
-            scope.mouse_leave = function(icon_index){
-                if (checked == true)
-                    return;
-
-                var i = 1;
-                for (i; i <= 5; i++){
-                    document.getElementById(scope.id + i).className = 'icon';
-                }
-
-                return;
-            };
-
-            //
-            // Handle click
-            //
-            scope.click = function(icon_index, mode){
-                var i = 1;
-                for (i; i <= icon_index; i++){
-                    document.getElementById(scope.id + i).className = 'icon active';
-                }
-
-                if (icon_index !== 0)
-                    checked = true;
-
-                return;
-            };
-
-            //
-            // Watch for model
-            //
-            scope.$watch('model', function(val){
-                scope.click(val);
-            });
+  return {
+    restrict: "E",
+    replace: true,
+    scope: {
+      ngModel : '=',
+      max: '=',
+      onRate: '&?',
+      interactive: '=',
+      clearable: '='
+    },
+    controller: function() {
+      var vm = this;
+
+      if(!vm.max) vm.max = 5;
+      if(!+vm.ngModel) vm.ngModel = 0;
+      if(+vm.ngModel > vm.max ) vm.ngModel = +vm.max;
+      if(vm.interactive == undefined) vm.interactive = true;
+      if(vm.max == 1 && vm.clearable == undefined) vm.clearable = true;
+
+      vm.setRate = function(rate) {
+        if (vm.clearable && rate == +vm.ngModel) {
+          vm.ngModel = 0;
+        } else {
+          vm.ngModel = rate;
+          if (angular.isFunction(vm.onRate)) vm.onRate({ rate: rate });
         }
-    };
+      };
+    },
+    controllerAs: 'vm',
+    bindToController: true,
+    require: 'ngModel',
+    template: '<div class="ui rating" ng-switch="vm.interactive">' +
+                '<i ng-switch-when="true" ' +
+                  'class="icon" ' +
+                  'ng-class="{ active: vm.current >= rate }" ' +
+                  'ng-click="vm.setRate(rate)" ' +
+                  'ng-mouseenter="vm.current = rate" ' +
+                  'ng-mouseleave="vm.current = +vm.ngModel" ' +
+                  'ng-repeat="rate in vm.range track by $index"' +
+                '></i>' +
+                '<i ng-switch-when="false" ' +
+                  'class="icon" ' +
+                  'ng-class="{ active: vm.current >= rate }" ' +
+                  'ng-repeat="rate in vm.range track by $index"' +
+                '></i>' +
+              '</div>',
+    link: function($scope, iElement, iAttrs) {
+      $scope.$watch('vm.max', function (value) {
+        $scope.vm.range = Array.apply(null, Array(+value)).map(function (_, i) {return i+1;});
+      });
+
+      $scope.$watch('vm.ngModel', function(value) {
+        $scope.vm.current = value;
+      });
+    }
+  };
 });
diff --git a/src/rating/test/rating.spec.js b/src/rating/test/rating.spec.js
index 101b03f..41b86c5 100644
--- a/src/rating/test/rating.spec.js
+++ b/src/rating/test/rating.spec.js
@@ -1,9 +1,205 @@
-describe('rating', function () {
-    var $scope;
+ngDescribe(
+  {
+    name: 'rating',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate"></rating>',
+    tests: function(deps) {
+      it('should have rate == 0', function() {
+        var scope = deps.element.isolateScope();
+        var vm = scope.vm;
+        expect(deps.element.is('.ui.rating')).toBeTruthy();
+        expect(vm.ngModel).toEqual(0);
+      });
+      it('should be updatable', function() {
+        var scope = deps.element.scope();
+        deps.element.children('i:nth(0)').click()
+        expect(scope.rate).toEqual(1);
+        deps.element.children('i:nth(0)').click()
+        expect(scope.rate).toEqual(1);
+        deps.element.children('i:nth(3)').click()
+        expect(scope.rate).toEqual(4);
+        deps.element.children('i:nth(2)').click()
+        expect(scope.rate).toEqual(3);
+        deps.element.children('i:nth(1)').click()
+        expect(scope.rate).toEqual(2);
+        deps.element.children('i:nth(4)').click()
+        expect(scope.rate).toEqual(5);
+      });
+    }
+  }
+)(
+  {
+    name: 'rating',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" clearable="true"></rating>',
+    tests: function(deps) {
+      it('should be clearable', function() {
+        var scope = deps.element.scope();
+        deps.element.children('i:nth(0)').click()
+        expect(scope.rate).toEqual(1);
+        deps.element.children('i:nth(0)').click()
+        expect(scope.rate).toEqual(0);
+        deps.element.children('i:nth(3)').click()
+        expect(scope.rate).toEqual(4);
+        deps.element.children('i:nth(2)').click()
+        expect(scope.rate).toEqual(3);
+        deps.element.children('i:nth(2)').click()
+        expect(scope.rate).toEqual(0);
+        deps.element.children('i:nth(1)').click()
+        expect(scope.rate).toEqual(2);
+        deps.element.children('i:nth(1)').click()
+        expect(scope.rate).toEqual(0);
+        deps.element.children('i:nth(4)').click()
+        expect(scope.rate).toEqual(5);
+        deps.element.children('i:nth(4)').click()
+        expect(scope.rate).toEqual(0);
+        deps.element.children('i:nth(4)').click()
+        expect(scope.rate).toEqual(5);
+      });
+    }
+  }
+)(
+  {
+    name: 'rating with max 1',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" max="1"></rating>',
+    tests: function(deps) {
+      it('should be clearable', function() {
+        var scope = deps.element.scope();
+        deps.element.children('i').click()
+        expect(scope.rate).toEqual(1);
+        deps.element.children('i').click()
+        expect(scope.rate).toEqual(0);
+        deps.element.children('i').click()
+        expect(scope.rate).toEqual(1);
+      });
+    }
+  }
+)(
+  {
+    name: 'rating with initial value',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate"></rating>',
+    parentScope: {
+      rate: 2
+    },
+    tests: function(deps) {
+      it('should have rate == 2', function() {
+        var scope = deps.element.scope();
+        expect(scope.rate).toEqual(2);
+        deps.element.children('i:last').click()
+        expect(scope.rate).toEqual(5);
+        deps.element.children('i:last').click()
+        expect(scope.rate).toEqual(5);
+        deps.element.children('i:first').click()
+        expect(scope.rate).toEqual(1);
+      });
+    }
+  }
+)(
+  {
+    name: 'rating with max = 10',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" max="10"></rating>',
+    parentScope: {
+      rate: 12
+    },
+    tests: function(deps) {
+      it('should have 10 icons', function() {
+        var scope = deps.element.isolateScope();
+        var vm = scope.vm;
+        expect(vm.ngModel).toEqual(10);
+        expect(deps.element.children('i.icon').length).toEqual(10);
+      });
+    }
+  }
+)(
+  {
+    name: 'rating hearts',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="hearts"></rating>',
+    tests: function(deps) {
+      it('should display hearts', function() {
+        expect(deps.element.is('.hearts')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating star',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="star"></rating>',
+    tests: function(deps) {
+      it('should display star', function() {
+        expect(deps.element.is('.star')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating mini',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="mini"></rating>',
+    tests: function(deps) {
+      it('should display mini', function() {
+        expect(deps.element.is('.mini')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating tiny',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="tiny"></rating>',
+    tests: function(deps) {
+      it('should display tiny', function() {
+        expect(deps.element.is('.tiny')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating small',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="small"></rating>',
+    tests: function(deps) {
+      it('should display small', function() {
+        expect(deps.element.is('.small')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating large',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="large"></rating>',
+    tests: function(deps) {
+      it('should display large', function() {
+        expect(deps.element.is('.large')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating huge',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="huge"></rating>',
+    tests: function(deps) {
+      it('should display huge', function() {
+        expect(deps.element.is('.huge')).toBeTruthy();
+      });
+    }
+  }
+)(
+  {
+    name: 'rating massive',
+    modules: 'angularify.semantic.rating',
+    element: '<rating ng-model="rate" class="massive"></rating>',
+    tests: function(deps) {
+      it('should display massive', function() {
+        expect(deps.element.is('.massive')).toBeTruthy();
+      });
+    }
+  }
+);
 
-    beforeEach(module('angularify.semantic.rating'));
-
-    beforeEach(inject(function ($rootScope) {
-        $scope = $rootScope;
-    }));
-});