Skip to content
This repository has been archived by the owner on Sep 8, 2020. It is now read-only.

Commit

Permalink
feat(events): Broadcast events on resize and toggle
Browse files Browse the repository at this point in the history
Events are now broadcast on the ui-layout controller scope when on both resize and toggle.
closes #34
  • Loading branch information
AgDude authored and SomeKittens committed Aug 21, 2015
1 parent 504d35d commit 24e4a54
Show file tree
Hide file tree
Showing 2 changed files with 34 additions and 2 deletions.
24 changes: 24 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,30 @@ percentage
</div>
```

## Events

Events are broadcast on the scope where ui-layout is attached. This means they are available to any controller inside of a ui-layout container.

### ui.layout.toggle

Dispatched when a container is opened or closed using the chevron buttons.
'''
$scope.$on('ui.layout.toggle', function(e, container){
if ( container.size > 0 ){
console.log('container is open!');
}
});
'''

### ui.layout.resize

Dispatched as a splitbar is dragged, debounced to occur only every 50ms.

'''
$scope.$on('ui.layout.resize', function(e, beforeContainer, afterContainer){});
'''


## Testing

We use Karma and jshint to ensure the quality of the code. The easiest way to run these checks is to use grunt:
Expand Down
12 changes: 10 additions & 2 deletions src/ui-layout.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
* UI.Layout
*/
angular.module('ui.layout', [])
.controller('uiLayoutCtrl', ['$scope', '$attrs', '$element', 'LayoutContainer', function uiLayoutCtrl($scope, $attrs, $element, LayoutContainer) {
.controller('uiLayoutCtrl', ['$scope', '$attrs', '$element', '$timeout', 'LayoutContainer', function uiLayoutCtrl($scope, $attrs, $element, $timeout, LayoutContainer) {
var ctrl = this;
var opts = angular.extend({}, $scope.$eval($attrs.uiLayout), $scope.$eval($attrs.options));
var numOfSplitbars = 0;
Expand Down Expand Up @@ -43,6 +43,7 @@ angular.module('ui.layout', [])
ctrl.updateDisplay();
};

var debounceEvent;
function draw() {
var position = ctrl.sizeProperties.flowProperty;
var dividerSize = parseInt(opts.dividerSize);
Expand Down Expand Up @@ -90,7 +91,12 @@ angular.module('ui.layout', [])
// move the splitbar
ctrl.movingSplitbar[position] = newPosition;

//TODO: dispatch container resize event
// broadcast an event that resize happened (debounced to 50ms)
if(debounceEvent) $timeout.cancel(debounceEvent);
debounceEvent = $timeout(function() {
$scope.$broadcast('ui.layout.resize', beforeContainer, afterContainer);
debounceEvent = null;
}, 50);
}
}
}
Expand Down Expand Up @@ -395,6 +401,7 @@ angular.module('ui.layout', [])
}
}
});
$scope.$broadcast('ui.layout.toggle', c);

return c.collapsed;
};
Expand Down Expand Up @@ -439,6 +446,7 @@ angular.module('ui.layout', [])
if(prevContainer) prevContainer.size -= (c.actualSize + endDiff);
}
});
$scope.$broadcast('ui.layout.toggle', c);

return c.collapsed;
};
Expand Down

0 comments on commit 24e4a54

Please sign in to comment.