From fa4620b66d660f1c3a9a46efa93078fb840bf0c2 Mon Sep 17 00:00:00 2001 From: "martin.lloves" Date: Mon, 16 Nov 2015 15:34:36 -0300 Subject: [PATCH 1/3] creo directiva numbers y la uso para mostrar la lista de numberos --- controller.js | 2 +- directive.js | 20 ++++++++++++++++++++ index.html | 7 ++++--- tests/directives/numbers.js | 26 ++++++++++++++++++++++++++ 4 files changed, 51 insertions(+), 4 deletions(-) create mode 100644 directive.js create mode 100644 tests/directives/numbers.js diff --git a/controller.js b/controller.js index 9354734..caa7c96 100644 --- a/controller.js +++ b/controller.js @@ -1,4 +1,4 @@ -angular.module('test', []) +angular.module('test', ['test.directives']) .controller('testController', ['$scope', function($scope) { }]); \ No newline at end of file diff --git a/directive.js b/directive.js new file mode 100644 index 0000000..9d7f817 --- /dev/null +++ b/directive.js @@ -0,0 +1,20 @@ +angular.module('test.directives', []) +.directive('numbers', function() { + return { + restrict: 'E', + scope: { + from: '&', + to: '&' + }, + controller: ['$scope', function($scope) { + $scope.numbers = function(from, to) { + var numbers = []; + for (var i = from; i <= to; i++) { + numbers.push(i); + } + return numbers; + }; + }], + template: '
{{number}}
' + }; +}); \ No newline at end of file diff --git a/index.html b/index.html index 4079a43..c6d9dbd 100644 --- a/index.html +++ b/index.html @@ -3,14 +3,15 @@ +
- - + +
@@ -26,7 +27,7 @@
- +
diff --git a/tests/directives/numbers.js b/tests/directives/numbers.js new file mode 100644 index 0000000..a05cc11 --- /dev/null +++ b/tests/directives/numbers.js @@ -0,0 +1,26 @@ +describe('numbers directive test', function() { + var $compile, + $rootScope; + + beforeEach(function() { + module('test'); + + inject(function(_$compile_, _$rootScope_) { + $compile = _$compile_; + $rootScope = _$rootScope_; + }); + }); + + it('should add the list of numbers', function() { + var element = $compile("")($rootScope); + + $rootScope.$digest(); + + expect(element.html()).toContain("3"); + expect(element.html()).toContain("4"); + expect(element.html()).toContain("5"); + + expect(element.html()).not.toContain("2"); + expect(element.html()).not.toContain("6"); + }); +}); \ No newline at end of file From 7db04f8a0d256b973d2a1bdf3fb7e6a8ddb9b9a2 Mon Sep 17 00:00:00 2001 From: "martin.lloves" Date: Mon, 16 Nov 2015 15:52:27 -0300 Subject: [PATCH 2/3] agrego los filtros even y odd soporto su uso en la directiva numbers --- controller.js | 2 +- directive.js | 13 ++++++++----- filters.js | 16 ++++++++++++++++ index.html | 11 +++++++---- tests/directives/numbers.js | 22 ++++++++++++++++++++++ tests/filters/divisibleBy.js | 23 +++++++++++++++++++++++ tests/filters/even.js | 23 +++++++++++++++++++++++ tests/filters/odd.js | 23 +++++++++++++++++++++++ 8 files changed, 123 insertions(+), 10 deletions(-) create mode 100644 filters.js create mode 100644 tests/filters/divisibleBy.js create mode 100644 tests/filters/even.js create mode 100644 tests/filters/odd.js diff --git a/controller.js b/controller.js index caa7c96..2de2ccf 100644 --- a/controller.js +++ b/controller.js @@ -1,4 +1,4 @@ -angular.module('test', ['test.directives']) +angular.module('test', ['test.directives', 'test.filters']) .controller('testController', ['$scope', function($scope) { }]); \ No newline at end of file diff --git a/directive.js b/directive.js index 9d7f817..ec016e7 100644 --- a/directive.js +++ b/directive.js @@ -4,17 +4,20 @@ angular.module('test.directives', []) restrict: 'E', scope: { from: '&', - to: '&' + to: '&', + filter: '&' }, - controller: ['$scope', function($scope) { - $scope.numbers = function(from, to) { + controller: ['$scope', '$filter', function($scope, $filter) { + $scope.numbers = function(from, to, filterName) { var numbers = []; for (var i = from; i <= to; i++) { - numbers.push(i); + if (!filterName || $filter(filterName)(i)) { + numbers.push(i); + } } return numbers; }; }], - template: '
{{number}}
' + template: '
{{number}}
' }; }); \ No newline at end of file diff --git a/filters.js b/filters.js new file mode 100644 index 0000000..160985e --- /dev/null +++ b/filters.js @@ -0,0 +1,16 @@ +angular.module('test.filters', []) +.filter('divisibleBy', function() { + return function(dividend, divisor) { + return dividend % divisor === 0; + }; +}) +.filter('even', ['$filter', function($filter) { + return function(number) { + return $filter('divisibleBy')(number, 2); + }; +}]) +.filter('odd', ['$filter', function($filter) { + return function(number) { + return !$filter('even')(number); + }; +}]); \ No newline at end of file diff --git a/index.html b/index.html index c6d9dbd..bedacea 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,7 @@ + @@ -14,9 +15,9 @@
- - - + + +
@@ -27,7 +28,9 @@
- +
diff --git a/tests/directives/numbers.js b/tests/directives/numbers.js index a05cc11..886177e 100644 --- a/tests/directives/numbers.js +++ b/tests/directives/numbers.js @@ -5,6 +5,18 @@ describe('numbers directive test', function() { beforeEach(function() { module('test'); + module(function($provide) { + $provide.service('$filter', function() { + return function(filterName) { + if (filterName !== 'testFilter') return null; + + return function(number) { + return number !== 4; + }; + }; + }); + }); + inject(function(_$compile_, _$rootScope_) { $compile = _$compile_; $rootScope = _$rootScope_; @@ -23,4 +35,14 @@ describe('numbers directive test', function() { expect(element.html()).not.toContain("2"); expect(element.html()).not.toContain("6"); }); + + it('should filter the list of numbers', function() { + var element = $compile("")($rootScope); + + $rootScope.$digest(); + + expect(element.html()).toContain("3"); + expect(element.html()).not.toContain("4"); + expect(element.html()).toContain("5"); + }); }); \ No newline at end of file diff --git a/tests/filters/divisibleBy.js b/tests/filters/divisibleBy.js new file mode 100644 index 0000000..effc585 --- /dev/null +++ b/tests/filters/divisibleBy.js @@ -0,0 +1,23 @@ +describe('divisibleBy filter test', function() { + 'use strict'; + + var filter; + + beforeEach(function() { + module('test'); + + inject(function($filter) { + filter = $filter('divisibleBy'); + }); + }); + + it('should succeed when given natural divisors', function() { + expect(filter(6,2)).toBe(true); + expect(filter(6,3)).toBe(true); + }); + + it('should fail when given not natural divisors', function() { + expect(filter(6,4)).toBe(false); + expect(filter(6,5)).toBe(false); + }); +}); \ No newline at end of file diff --git a/tests/filters/even.js b/tests/filters/even.js new file mode 100644 index 0000000..39dfe89 --- /dev/null +++ b/tests/filters/even.js @@ -0,0 +1,23 @@ +describe('even filter test', function() { + 'use strict'; + + var filter; + + beforeEach(function() { + module('test'); + + inject(function($filter) { + filter = $filter('even'); + }); + }); + + it('should fail unless given multiples of 2', function() { + expect(filter(7)).toBe(false); + expect(filter(9)).toBe(false); + }); + + it('should succeed when given multiples of 2', function() { + expect(filter(6)).toBe(true); + expect(filter(8)).toBe(true); + }); +}); \ No newline at end of file diff --git a/tests/filters/odd.js b/tests/filters/odd.js new file mode 100644 index 0000000..20f1d96 --- /dev/null +++ b/tests/filters/odd.js @@ -0,0 +1,23 @@ +describe('odd filter test', function() { + 'use strict'; + + var filter; + + beforeEach(function() { + module('test'); + + inject(function($filter) { + filter = $filter('odd'); + }); + }); + + it('should succeed unless given multiples of 2', function() { + expect(filter(7)).toBe(true); + expect(filter(9)).toBe(true); + }); + + it('should fail when given multiples of 2', function() { + expect(filter(6)).toBe(false); + expect(filter(8)).toBe(false); + }); +}); \ No newline at end of file From c968cfb20a2fc3ff56893e3abe78ba21033ed31f Mon Sep 17 00:00:00 2001 From: "martin.lloves" Date: Mon, 16 Nov 2015 16:02:48 -0300 Subject: [PATCH 3/3] agrego posicionamiento --- directive.js | 7 +++++-- index.html | 7 ++++--- styles.css | 8 ++++++++ tests/directives/numbers.js | 8 ++++++++ 4 files changed, 25 insertions(+), 5 deletions(-) diff --git a/directive.js b/directive.js index ec016e7..7d74784 100644 --- a/directive.js +++ b/directive.js @@ -5,7 +5,8 @@ angular.module('test.directives', []) scope: { from: '&', to: '&', - filter: '&' + filter: '&', + position: '&' }, controller: ['$scope', '$filter', function($scope, $filter) { $scope.numbers = function(from, to, filterName) { @@ -18,6 +19,8 @@ angular.module('test.directives', []) return numbers; }; }], - template: '
{{number}}
' + template: '
\ +
{{number}}
\ +
' }; }); \ No newline at end of file diff --git a/index.html b/index.html index bedacea..0f320b9 100644 --- a/index.html +++ b/index.html @@ -22,15 +22,16 @@
- - + +
+ filter="filter" + position="position">
diff --git a/styles.css b/styles.css index 49ac741..ac876a1 100644 --- a/styles.css +++ b/styles.css @@ -26,4 +26,12 @@ html, body { .buttons-holder { float: right; +} + +.pull-right { + float: right; +} + +.pull-left { + float: left; } \ No newline at end of file diff --git a/tests/directives/numbers.js b/tests/directives/numbers.js index 886177e..4021618 100644 --- a/tests/directives/numbers.js +++ b/tests/directives/numbers.js @@ -45,4 +45,12 @@ describe('numbers directive test', function() { expect(element.html()).not.toContain("4"); expect(element.html()).toContain("5"); }); + + it('should add positioning classes', function() { + var element = $compile("")($rootScope); + + $rootScope.$digest(); + + expect(element.find('div').eq(0).hasClass('pull-right')).toBe(true); + }); }); \ No newline at end of file