Skip to content

Commit

Permalink
Merge pull request #3527 from edparsons/backdrop-broadcast
Browse files Browse the repository at this point in the history
Add a broadcast for when the backdrop is shown or hidden
  • Loading branch information
mlynch committed Dec 6, 2015
2 parents 482dba9 + fee6ec2 commit 9956de4
Showing 1 changed file with 20 additions and 3 deletions.
23 changes: 20 additions & 3 deletions js/angular/service/backdrop.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,24 +18,39 @@
* For example, if `retain` is called three times, the backdrop will be shown until `release`
* is called three times.
*
* **Notes:**
* - The backdrop service will broadcast 'backdrop.shown' and 'backdrop.hidden' events from the root scope,
* this is useful for alerting native components not in html.
*
* @usage
*
* ```js
* function MyController($scope, $ionicBackdrop, $timeout) {
* function MyController($scope, $ionicBackdrop, $timeout, $rootScope) {
* //Show a backdrop for one second
* $scope.action = function() {
* $ionicBackdrop.retain();
* $timeout(function() {
* $ionicBackdrop.release();
* }, 1000);
* };
*
* // Execute action on backdrop disappearing
* $scope.$on('backdrop.hidden', function() {
* // Execute action
* });
*
* // Execute action on backdrop appearing
* $scope.$on('backdrop.shown', function() {
* // Execute action
* });
*
* }
* ```
*/
IonicModule
.factory('$ionicBackdrop', [
'$document', '$timeout', '$$rAF',
function($document, $timeout, $$rAF) {
'$document', '$timeout', '$$rAF', '$rootScope',
function($document, $timeout, $$rAF, $rootScope) {

var el = jqLite('<div class="backdrop">');
var backdropHolds = 0;
Expand Down Expand Up @@ -67,6 +82,7 @@ function($document, $timeout, $$rAF) {
backdropHolds++;
if (backdropHolds === 1) {
el.addClass('visible');
$rootScope.$broadcast('backdrop.shown');
$$rAF(function() {
// If we're still at >0 backdropHolds after async...
if (backdropHolds >= 1) el.addClass('active');
Expand All @@ -76,6 +92,7 @@ function($document, $timeout, $$rAF) {
function release() {
if (backdropHolds === 1) {
el.removeClass('active');
$rootScope.$broadcast('backdrop.hidden');
$timeout(function() {
// If we're still at 0 backdropHolds after async...
if (backdropHolds === 0) el.removeClass('visible');
Expand Down

0 comments on commit 9956de4

Please sign in to comment.