Permalink
Browse files

merge 3.0-pinned-containers

  • Loading branch information...
1 parent e96e19a commit beba1a47f760332c0b2b2a2ff491ac607670011b @swalters swalters committed Aug 4, 2014
Showing with 29,501 additions and 1,254 deletions.
  1. +64 −11 DEVELOPER.md
  2. +6 −5 Gruntfile.js
  3. +63 −3 TODO.md
  4. +1,689 −0 lib/test/angular/1.2.21/angular-animate.js
  5. +2,173 −0 lib/test/angular/1.2.21/angular-mocks.js
  6. +21,883 −0 lib/test/angular/1.2.21/angular.js
  7. +3 −541 misc/demo/grid-directive.html
  8. +49 −0 misc/tutorial/10_pinning.ngdoc
  9. +14 −14 misc/tutorial/2.1_appending_data.ngdoc
  10. +16 −2 misc/tutorial/6_editable.ngdoc
  11. +14 −1 misc/tutorial/6a_editableOnFocus.ngdoc
  12. +77 −0 misc/tutorial/9.1_selection.ngdoc
  13. +21 −11 misc/tutorial/9_cellnav.ngdoc
  14. +105 −29 src/features/cellnav/js/cellnav.js
  15. +20 −3 src/features/cellnav/test/uiGridCellNavService.spec.js
  16. +180 −47 src/features/edit/js/gridEdit.js
  17. +24 −1 src/features/edit/test/uiGridCell.spec.js
  18. +3 −3 src/features/edit/test/uiGridEditDirective.spec.js
  19. +41 −10 src/features/edit/test/uiGridEditService.spec.js
  20. +248 −0 src/features/pinning/js/pinning.js
  21. +42 −0 src/features/pinning/less/pinning.less
  22. +37 −0 src/features/pinning/test/uiGridPinningService.spec.js
  23. +28 −3 src/features/resize-columns/js/ui-grid-column-resizer.js
  24. +12 −11 src/features/resize-columns/test/resizeColumns.spec.js
  25. +2 −2 src/features/resize-columns/test/resizeColumnsService.spec.js
  26. +339 −0 src/features/selection/js/selection.js
  27. +7 −0 src/features/selection/less/selection.less
  28. +61 −0 src/features/selection/test/uiGridSelectionService.spec.js
  29. +1 −0 src/js/core/constants.js
  30. +34 −17 src/js/core/directives/ui-grid-body.js
  31. +4 −8 src/js/core/directives/ui-grid-cell.js
  32. +19 −5 src/js/core/directives/ui-grid-column-menu.js
  33. +138 −128 src/js/core/directives/ui-grid-header-cell.js
  34. +43 −28 src/js/core/directives/ui-grid-header.js
  35. +48 −16 src/js/core/directives/ui-grid-native-scrollbar.js
  36. +256 −0 src/js/core/directives/ui-grid-render-container.js
  37. +13 −6 src/js/core/directives/ui-grid-row.js
  38. +33 −17 src/js/core/directives/ui-grid-viewport.js
  39. +68 −20 src/js/core/directives/ui-grid.js
  40. +272 −22 src/js/core/factories/Grid.js
  41. +217 −0 src/js/core/factories/GridApi.js
  42. +35 −7 src/js/core/factories/GridColumn.js
  43. +0 −90 src/js/core/factories/GridEvents.js
  44. +26 −1 src/js/core/factories/GridOptions.js
  45. +645 −0 src/js/core/factories/GridRenderContainer.js
  46. +31 −2 src/js/core/factories/GridRow.js
  47. +8 −0 src/js/core/services/gridClassFactory.js
  48. +60 −6 src/js/core/services/ui-grid-util.js
  49. +13 −16 src/js/i18n/ui-i18n.js
  50. +3 −2 src/less/body.less
  51. +7 −5 src/less/cell.less
  52. +0 −1 src/less/main.less
  53. +1 −1 src/less/native-scrollbar.less
  54. +0 −8 src/less/pinning.less
  55. +1 −1 src/less/variables.less
  56. +1 −3 src/templates/ui-grid/ui-grid-body.html
  57. +1 −7 src/templates/ui-grid/ui-grid-header.html
  58. +2 −5 src/templates/ui-grid/ui-grid-row.html
  59. +22 −14 src/templates/ui-grid/ui-grid.html
  60. +2 −2 src/templates/ui-grid/uiGridHeaderCell.html
  61. +14 −0 src/templates/ui-grid/uiGridRenderContainer.html
  62. +7 −0 src/templates/ui-grid/uiGridViewport.html
  63. +3 −2 test/unit/core/factories/Grid.spec.js
  64. +220 −0 test/unit/core/factories/GridApi.spec.js
  65. +0 −111 test/unit/core/factories/GridEvents.spec.js
  66. +2 −2 test/unit/core/row-filtering.spec.js
  67. +4 −4 test/unit/core/row-sorting.spec.js
  68. +26 −0 test/unit/core/services/ui-grid-util.spec.js
View
@@ -4,6 +4,25 @@
Thanks for considering contributions to the ui-grid project. This doc will give you a jump start on the development standards we use.
+# Running Dev Server
+Grunt task dev will run jshint, compile less, run fontella, run unit tests, run protractor tests, and start a local
+webserver on port 9003. A watch is started to rerun all the tasks if any source file changes.
+
+<br>
+```
+grunt dev
+```
+<br>
+http://localhost:9003/docs/#/tutorial to browse each tutorial.
+
+<br/>options
+<br/> no-e2e - eliminate protractor tests
+<br/> angular=n.n.n - specify a specify angular version to run unit tests against
+
+```
+grunt dev --no-e2e --angular=1.2.16
+```
+
# Code Structure
The development goal of ui-grid (ng-grid 3.0) is a fast, testable, and extensible grid component.
@@ -22,7 +41,7 @@ Everything else should be added as new angular modules unless the grid team agre
* feature folder is added below src
* One js file per feature
* no global variables
-* public events are registered in grid.events (more on that later)
+* public methods and events are registered in grid.api (more on that later)
* design and code the angular way. What do we main by that? Dependency injection, small directives, emphasis the model, not the DOM, tests!
* feature.js contains an enclosure:
@@ -155,7 +174,7 @@ column and row builders (see below). See ui.grid.edit unit tests on how to easi
compile: function () {
return {
pre: function ($scope, $elm, $attrs, uiGridCtrl) {
- uiGridCtrl.grid.events.registerEventsFromObject(uiGridFeatureConstants.publicEvents);
+ uiGridCtrl.grid.api.registerEventsFromObject(uiGridFeatureConstants.publicEvents);
uiGridCtrl.grid.registerColumnBuilder(uiGridFeatureService.featureColumnBuilder);
uiGridCtrl.grid.registerRowBuilder(uiGridFeatureService.featureRowBuilder);
uiGridCtrl.grid.RowsProcessor(uiGridFeatureService.featureRowsProcessor);
@@ -227,14 +246,13 @@ RowsProcessor allows your feature to affect the entire rows collections. Gives
uiGridCtrl.grid.RowsProcessor(uiGridFeatureService.featureRowsProcessor);
```
-## Public Events
-The grid provides public events via the GridEvents object. This object allows you to register your feature's public
-events and raise/consume events. It guarantees that your events are specific to a grid instance. Internally, angular
+## Public Methods and Events
+The grid provides public api via the GridApi object. This object allows you to register your feature's public
+api methods and events. It guarantees that your events are specific to a grid instance. Internally, angular
scope $broadcast and $on are used.
```javascript
- //preferred method is to use a publicEvents map from constants
- module.constant('uiGridFeatureConstants', {
- publicEvents: {
+ //preferred method is to use a map so ide's can pick up on the signatures
+ var publicEvents = {
featureName : {
event1 : function(scope, function(newRowCol, oldRowCol)){},
event2 : function(scope, function(){}){}
@@ -243,13 +261,48 @@ scope $broadcast and $on are used.
});
//from feature directive pre-link
- uiGridCtrl.grid.events.registerEventsFromObject(uiGridFeatureConstants.publicEvents);
+ uiGridCtrl.grid.api.registerEventsFromObject(publicEvents);
+
+ //more stringy registration
+ uiGridCtrl.grid.api.registerEvents('featureName', 'eventName');
//raise event
- uiGridCtrl.grid.events.featureName.event1(newRowCol, oldRowCol);
+ uiGridCtrl.grid.api.featureName.raise.event1(newRowCol, oldRowCol);
//subscribe to event. You must provide a scope object so the listener will be destroyed when scope is destroyed
- uiGridCtrl.grid.events.featureName.on.event1($scope, function(newRowCol, oldRowCol){});
+ //function's this variable will be grid.api
+ uiGridCtrl.grid.api.featureName.on.event1($scope, function(newRowCol, oldRowCol){});
+
+ //register methods
+ var methods = {
+ featureName : {
+ methodName1 : function(yourVar1, yourVar2){
+ //whatever you method needs to do
+ },
+ methodName2 : function(var2){
+ //do something else
+ }
+ }
+ }
+
+ uiGridCtrl.grid.api.registerMethodsFromObject(uiGridFeatureConstants.publicEvents);
+
+ //way of the string
+ uiGridCtrl.grid.api.registerMethod('featureName', 'methodName', function(yourVar){//do something});
+
+ //external use
+ $scope.gridOptions.onRegisterApi = function(gridApi){
+
+ //subscribe to event
+ gridApi.feature.on.event1($scope,function(scope, function(newRowCol, oldRowCol)){
+ var self = this; //grid.api
+ var msg = 'row selected ' + row.isSelected;
+ $log.log(msg);
+ });
+
+ //call method
+ gridApi.featureName.methodName1('abc','123');
+ };
```
View
@@ -326,10 +326,9 @@ module.exports = function(grunt) {
// },
rebuild: {
files: util.testFiles.unit,
- tasks: ['jshint:src_test', 'jscs', 'karmangular:run', 'concat', 'uglify', 'ngdocs'],
- options: {
- // livereload: true
- }
+ // NOTE(c0bra): turn back on after render containers works
+ // tasks: ['jshint:src_test', 'jscs', 'karmangular:run', 'concat', 'uglify', 'ngdocs'],
+ tasks: ['jshint:src_test', 'jscs', 'concat', 'uglify', 'ngdocs'],
},
protractor: {
files: ['.tmp/doc-scenarios/**/*.spec.js', 'test/e2e/**/*.spec.js'],
@@ -563,7 +562,9 @@ module.exports = function(grunt) {
var tasks = ['before-test', 'after-test', 'connect', 'autotest:unit', 'autotest:e2e', 'watch'];
if (e2e === false) {
- tasks = ['before-test', 'after-test', 'connect', 'autotest:unit', 'watch'];
+ // NOTE(c0bra): turn back on after render containers works
+ // tasks = ['before-test', 'after-test', 'connect', 'autotest:unit', 'watch'];
+ tasks = ['before-test', 'after-test', 'connect', 'watch'];
}
grunt.task.run(tasks);
View
@@ -2,11 +2,71 @@
# CURRENT
-1. [TODO] - header-cell and thus .ui-grid-vertical-bar not filling the full vertical space when a column has filtering disabled but its neighbors DON'T.
+# Pinning
+
+1. [TODO] - Add tests for new getBorderSize() and closestElm() methods in gridUtil
+1. [BUG] - With multiple columns left-pinned, they are wrapping as it appears the render container is 1px too small
+1. [BUG] - Column menu not in right place when grid is horizontally scrolled
+1. [BUG/MINOR] - If you pin one column and then use the scrollbar to scroll quickly scroll down, the body container will scroll correctly but the pinned container will be missing some rows, visibly.
+ - Also it seems like the scroll amount can get out of sync by a few pixels.
+1. Right-pinned container needs to have a vertical-scrollbar, if visible then the body should hide its own scrollbar, however we determine to handle that.
+
+
+# Render containers
+
+*** [NOTE] *** - I turned off test running (karmangular, etc) for render container development
+
+1. [TODO] - headerHeight when vertical scrollbar renders doesn't include the border width.
+ - Somehow need a way to re-run buildStyles after any header height updates...
+1. [TODO] - Render container header viewport (and maybe main viewport) are too wide. Also the vertical scrollbar is too high. If the header is present the scrollbar needs
+ to size down...
+
+1. [NOTE] - refreshCanvas() needs to QUEUE a refresh. It cannot directly call one. We need to debounce it somehow. Otherwise every render container refresh call will
+ make the grid refresh itself WAY too much. Can we just use $timeout() and $timeout.cancel() with no delay?
+ - Maybe make a `queueRefresh` method that GridRenderContainer can call...
+
+1. [NOTE] - On grid init we need to redrawInPlace all containers, or rather update the scrollTop and scrollLeft of all registered container to '0' pixels.
+1. [BUG] - The pinning menu actions ARE putting the columns into the renderContainer caches, but it's not immediately updating (re-rendering) the grid. If I then scroll I
+ see the column is gone, but it's also still accounts for the column's width when setting the canvas width (so two separate bugs).
+ - NOTE - The viewport width adjustment needs to subtract the pinned viewports' dimensions from the main viewport
+ - NOTE - Is the canvasWidth updating running in uiGridHeader BEFORE the visible/renderContainer updates which columns are in the body container?
+ - NOTE - The main viewport and main header will need their left/right dimensions updated as well as their width/height. The header isn't being updated at all!
+ - NOTE - We'd need to subtract the cumulative horizontal-pinned containers width from the top-panel and offset the header's left position based on the left container
+
+1. [TODO] - Horizontal-pinned container will need their OWN header... sigh.
+ - Their repeater will need to be based on their render container
+
+1. [IDEA] - Should grid have an `addRenderContainer` method? Rather than just popping them in to the renderContainers properties with no validation?
+1. [NOTE] - We can add headerHeight back into the left/right-pinned containers if we don't want a scrollbar at the bottom (we probably don't).
+1. [NOTE] - We probably need getAdjustedViewportWidth/Height() methods, the idea being that the normal methods return the full width/height and the others return the adjusted value.
+ The pinned containers will need the FULL value so they can fill out the body's width or height based on which side they're pinned to, and then the viewport will use the adjusted
+ value to render smaller to make room for the other one.
+1. [TODO] - Main viewport will need top/left CSS positioning values to adjust for the left/top-pinned containers (right?)
+1. [TODO] - Make viewports generic, so they can be sized to their contents no matter what they are, so they can listen for scroll events. Also need to give the a
+ viewports controller that child elements (rows, columns) can communicate with to handle column resizing, etc.
+ - Render containers need to have max and min width/height values, and they need to be able to take percentages (i.e. make the left pinned container 30% of the total grid
+ width).
+ - Need to somehow keep pinned viewports from listening to scroll events that they should ignore, like left/right-pinned containers shouldn't scroll left/right when the
+ body scrolls, but it DOES need to listen to vertical scroll events.
+ - I guess we can just add attributes like `bind-scroll-vertical` + `bind-scroll-horizontal` to make them both fire those events and listen for them... That ought to be
+ the RIGHT thing (yay).
+ - Create a registry of functions that alter the grid viewport's dimensions. For instance, a left-pinned render container will need to substract its own width from the width
+ of the main (body) viewport. Basically the body's viewport has to resize around any other viewport inside the main render area, the scrollbar-box or whatever you want to call it.
+ - Almost done, just need to split the functionality out so there are "normal" methods and "adjusted" methods.
+ - Need to flesh out update() method in ui-grid-render-container to update the renderContainer canvas/viewport styles.
+ - i.e. canvas width = sum of columnCache widths, canvas height = sum of rowCache heights
+
+ ** uiGridRenderContainer **
+ - Needs to register to the specific renderContainer to get its rows and columns
+ - Needs to find its canvas, and its viewport. Or maybe the render container IS a viewport. That's probably easier
+ - Needs to get its canvas height
+
+1. [TODO] - uiGridRow needs to take render container so it knows which column cache to look in
+1. [TODO] - Within column resizer we need to only account for columns within OUR render container, which means we need to be able to access the contain details from its
+ controller, which will be above us.
+
-1. [PERF] - Try to improve horizontal scroll performance with cellTemplates
1. [TODO] - remove gridBorderWidth on column menu top-left, top-right
-1. [TODO] - Try using a $cacheFactory for the cellValueGetterCache.
1. [TODO] - Move row filtering to feature module.
1. [IDEA] - Look at using Istanbul for code coverage reporting.
Oops, something went wrong.

0 comments on commit beba1a4

Please sign in to comment.