diff --git a/src/rating/docs/demo.html b/src/rating/docs/demo.html index 142099d712..6e49d682d9 100644 --- a/src/rating/docs/demo.html +++ b/src/rating/docs/demo.html @@ -1,6 +1,6 @@

Default

- + {{percent}}%
Rate: {{rate}} - Readonly is: {{isReadonly}} - Hovering over: {{overStar || "none"}}
@@ -12,4 +12,4 @@

Default

Custom icons

(Rate: {{x}})
(Rate: {{y}})
-
\ No newline at end of file + diff --git a/src/rating/docs/readme.md b/src/rating/docs/readme.md index 0cacddd422..625dbe717e 100644 --- a/src/rating/docs/readme.md +++ b/src/rating/docs/readme.md @@ -16,6 +16,10 @@ Rating directive that will take care of visualising a star rating bar. _(Defaults: false)_ : Prevent user's interaction. + * `titles` + _(Defaults: ["bad","poor","regular","good","gorgeous"])_ : + An array of Strings defining titles for all icons + * `on-hover(value)` : An optional expression called when user's mouse is over a particular icon. diff --git a/src/rating/rating.js b/src/rating/rating.js index 86327c87a3..a853011433 100644 --- a/src/rating/rating.js +++ b/src/rating/rating.js @@ -3,7 +3,8 @@ angular.module('ui.bootstrap.rating', []) .constant('ratingConfig', { max: 5, stateOn: null, - stateOff: null + stateOff: null, + titles : ['bad','poor','regular','good','gorgeous'] }) .controller('RatingController', ['$scope', '$attrs', 'ratingConfig', function($scope, $attrs, ratingConfig) { @@ -22,7 +23,9 @@ angular.module('ui.bootstrap.rating', []) this.stateOn = angular.isDefined($attrs.stateOn) ? $scope.$parent.$eval($attrs.stateOn) : ratingConfig.stateOn; this.stateOff = angular.isDefined($attrs.stateOff) ? $scope.$parent.$eval($attrs.stateOff) : ratingConfig.stateOff; - + var tmpTitles = angular.isDefined($attrs.titles) ? $scope.$parent.$eval($attrs.titles) : ratingConfig.titles ; + this.titles = angular.isArray(tmpTitles) && tmpTitles.length > 0 ? tmpTitles : ratingConfig.titles; + var ratingStates = angular.isDefined($attrs.ratingStates) ? $scope.$parent.$eval($attrs.ratingStates) : new Array( angular.isDefined($attrs.max) ? $scope.$parent.$eval($attrs.max) : ratingConfig.max ); $scope.range = this.buildTemplateObjects(ratingStates); @@ -30,11 +33,20 @@ angular.module('ui.bootstrap.rating', []) this.buildTemplateObjects = function(states) { for (var i = 0, n = states.length; i < n; i++) { - states[i] = angular.extend({ index: i }, { stateOn: this.stateOn, stateOff: this.stateOff }, states[i]); + states[i] = angular.extend({ index: i }, { stateOn: this.stateOn, stateOff: this.stateOff, title:this.getTitle(i) }, states[i]); } return states; }; - + + this.getTitle = function (index) { + if( index >= this.titles.length) { + return index+1; + } + else { + return this.titles[index]; + } + }; + $scope.rate = function(value) { if ( !$scope.readonly && value >= 0 && value <= $scope.range.length ) { ngModelCtrl.$setViewValue(value); @@ -84,4 +96,4 @@ angular.module('ui.bootstrap.rating', []) ratingCtrl.init( ngModelCtrl ); } }; -}); \ No newline at end of file +}); diff --git a/src/rating/test/rating.spec.js b/src/rating/test/rating.spec.js index 038bdd4f39..8b34db97b8 100644 --- a/src/rating/test/rating.spec.js +++ b/src/rating/test/rating.spec.js @@ -27,6 +27,15 @@ describe('rating directive', function () { return state; } + function getTitles() { + var stars = getStars(); + var titles = []; + for (var i = 0, n = stars.length; i < n; i++) { + titles.push( stars.eq(i).attr('title') ); + } + return titles; + } + function triggerKeyDown(keyCode) { var e = $.Event('keydown'); e.which = keyCode; @@ -267,4 +276,48 @@ describe('rating directive', function () { expect(getState('on', 'off')).toEqual([true, true, true, true, true, false, false, false, false, false]); }); }); + + describe('Default title', function() { + it('should return the default title for each star', function() { + expect(getTitles()).toEqual(['bad','poor','regular','good','gorgeous']); + }); + }); + + describe('shows different title when `max` attribute is greater than the titles array ', function() { + var originalConfig = {}; + beforeEach(inject(function(ratingConfig) { + $rootScope.rate = 5; + angular.extend(originalConfig, ratingConfig); + ratingConfig.max = 10; + element = $compile('')($rootScope); + $rootScope.$digest(); + })); + afterEach(inject(function(ratingConfig) { + // return it to the original state + angular.extend(ratingConfig, originalConfig); + })); + + it('should return the default title for each star', function() { + expect(getTitles()).toEqual(['bad','poor','regular','good','gorgeous','6','7','8','9','10']); + }); + }); + + describe('shows custom titles ', function() { + it('should return the custom title for each star', function() { + element = $compile('')($rootScope); + $rootScope.$digest(); + expect(getTitles()).toEqual(['44','45','46','4','5']); + }); + it('should return the default title if the custom title is an empty array', function() { + element = $compile('')($rootScope); + $rootScope.$digest(); + expect(getTitles()).toEqual(['bad','poor','regular','good','gorgeous']); + }); + it('should return the default title if the custom title is not an array', function() { + element = $compile('')($rootScope); + $rootScope.$digest(); + expect(getTitles()).toEqual(['bad','poor','regular','good','gorgeous']); + }); + }); + }); diff --git a/template/rating/rating.html b/template/rating/rating.html index f4ab6bc7ef..3926d7659f 100644 --- a/template/rating/rating.html +++ b/template/rating/rating.html @@ -1,5 +1,5 @@ - + ({{ $index < value ? '*' : ' ' }}) - \ No newline at end of file +