diff --git a/angular-floatThead.js b/angular-floatThead.js index b93a93b..a66db02 100644 --- a/angular-floatThead.js +++ b/angular-floatThead.js @@ -1,50 +1,65 @@ /** * floatThead wrapper for AngularJS - * @version v0.0.1 - 2014-08-19 - * @link https://github.com/brandon-barker/ng-floatThead + * @version v0.1.0 - 2015-10-25 + * @link https://github.com/brandon-barker/angular-floatThead * @author Brandon Barker * @license MIT License, http://www.opensource.org/licenses/MIT */ (function () { - 'use strict'; - - angular - .module('floatThead', []) - .directive('floatThead', ['$timeout', '$log', floatThead]); - - function floatThead ($timeout, $log) { - // Usage: - // Specify float-thead on any table element and optionally pass through a floatThead options object to initialize the library. - // Optionally specify ng-model to have the directive watch any objects for changes and call 'reflow' on floatThead. - // You can also manually trigger a reflow by triggering an event on the table element called 'update', eg: jQuery('.table').trigger('update'); - var directive = { - require: '?ngModel', - link: link, - restrict: 'A' - }; - return directive; - - function link(scope, element, attrs, ngModel) { - jQuery(element).floatThead(scope.$eval(attrs.floatThead)); - - if (ngModel) { - // Set $watch to do a deep watch on the ngModel (collection) by specifying true as a 3rd parameter - scope.$watch(attrs.ngModel, function () { - jQuery(element).floatThead('reflow'); - }, true); - } else { - $log.info('floatThead: ngModel not provided!'); - } - - element.bind('update', function () { - $timeout(function() { - jQuery(element).floatThead('reflow'); - }, 0); - }); - - element.bind('$destroy', function() { - jQuery(element).floatThead('destroy'); - }); + 'use strict'; + + angular + .module('floatThead', []) + .directive('floatThead', ['$timeout', '$log', floatThead]); + + function floatThead($timeout, $log) { + // Usage: + // Specify float-thead on any table element and optionally pass through a floatThead options object to initialize the library. + // Optionally specify ng-model to have the directive watch any objects for changes and call 'reflow' on floatThead. + // You can also manually trigger a reflow by triggering an event on the table element called 'update', eg: jQuery('.table').trigger('update'); + var directive = { + require: '?ngModel', + scope: { + floatTheadEnabled: '=' + }, + link: link, + restrict: 'A' + }; + return directive; + + function link(scope, element, attrs, ngModel) { + var isEnabled = (scope.floatTheadEnabled === true); + + if (isEnabled) { + jQuery(element).floatThead(scope.$eval(attrs.floatThead)); + } + + scope.$watch('floatTheadEnabled', function (newVal) { + if (newVal === true) { + jQuery(element).floatThead(scope.$eval(attrs.floatThead)); + } else { + jQuery(element).floatThead('destroy'); } + }); + + if (ngModel) { + // Set $watch to do a deep watch on the ngModel (collection) by specifying true as a 3rd parameter + scope.$watch(attrs.ngModel, function () { + jQuery(element).floatThead('reflow'); + }, true); + } else { + $log.info('floatThead: ngModel not provided!'); + } + + element.bind('update', function () { + $timeout(function () { + jQuery(element).floatThead('reflow'); + }, 0); + }); + + element.bind('$destroy', function () { + jQuery(element).floatThead('destroy'); + }); } + } })(); diff --git a/bower.json b/bower.json index ef711d3..6980c86 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,7 @@ { "name": "angular-floatThead", "main": "angular-floatThead.js", - "version": "0.0.1", + "version": "0.1.0", "homepage": "https://github.com/brandon-barker/angular-floatThead", "authors": [ "Brandon Barker " diff --git a/test/index.html b/test/index.html new file mode 100644 index 0000000..e938628 --- /dev/null +++ b/test/index.html @@ -0,0 +1,175 @@ + + + + + angular-floatThead test + + + + + + + + + + + + + + + + +
+
+
+ + +
+
+ +
+ +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
click memouse over meHeader...3
Cell Content 1Cell Content 2Cell Content 3
More Cell Content 1More Cell Content 2More Cell Content 3
Even More Cell Content 1Even More Cell Content 2Even More Cell Content 3
And Repeat 1And Repeat 2And Repeat 3
Cell Content 1Cell Content 2Cell Content 3
More Cell Content 1More Cell Content 2More Cell Content 3
Even More Cell Content 1Even More Cell Content 2Even More Cell Content 3
And Repeat 1And Repeat 2And Repeat 3
Cell Content 1Cell Content 2Cell Content 3
More Cell Content 1More Cell Content 2More Cell Content 3
Even More Cell Content 1Even More Cell Content 2Even More Cell Content 3
And Repeat 1And Repeat 2And Repeat 3
Cell Content 1Cell Content 2Cell Content 3
More Cell Content 1More Cell Content 2More Cell Content 3
Even More Cell Content 1Even More Cell Content 2Even More Cell Content 3
And Repeat 1And Repeat 2And Repeat 3
Cell Content 1Cell Content 2Cell Content 3
More Cell Content 1More Cell Content 2More Cell Content 3
Even More Cell Content 1Even More Cell Content 2Even More Cell Content 3
+
+
+
+
+ + \ No newline at end of file