feat(sidenav): track sidenav visibility and enter / leave backdrop if needed

[devversion]

• Revert scope value if sidenav is shown.
• Throttle Resize Events

Fixes #4595

[EladBezalel]

Brackets, scope.isOpen == true is the same as scope.isOpen and ternary operator

[devversion]

@EladBezalel - Completed all your suggestions, thanks for reviewing!

[EladBezalel]

You can use DI to get $window

[devversion]

Will be better, yes!

[devversion]

@EladBezalel - Fixed the suggestions + Improved isHidden Method (more clear and less code) - Can you verify the new version?

[EladBezalel]

why not doing

if (computedStyle && window.getComputedStyle(element[0]).display === 'none' ||
   offsetParent && !element[0].offsetParent) {
  return true;
}

[devversion]

Yes that's also possible, but I thought we should have a clear variant, because this method is really important and needs to be easy to understand, but if you want I can simplify the code?

[EladBezalel]

Isn't that equals to:

scope.isOpen = !(isHidden(true, true) && scope.isOpen);

[devversion]

No that works not, because I noticed that we only should update if that if statements are true, and we should not set the scope always

[EladBezalel]

Sorry i couldn't understand, are we watching for isOpen changes?

[devversion]

Sorry for the late answer. Yes updateIsOpen (the actual method which triggers open and close animations) is called by watching isOpen.

[EladBezalel]

Is this function is generic enough to be on the util service?

[devversion]

Yes, definitely, should I add it?

[EladBezalel]

yes

[devversion]

Done 👍 Added to Util + added tests to validate the functionality.

[EladBezalel]

Please break this line

[devversion]

Done ✋ I should definitely use that conventions (how I call it) in my next PR's so we would save much time 😄 - Already done in my newer PR's

[EladBezalel]

Can't you reuse that?

element.removeClass('md-closed');
if ($mdUtil.isHidden(element, true, false) && !skipSidenav) {
  skipNextUpdate = true;
  scope.isOpen = !!oldValue;
}
element.toggleClass('md-closed', wasClosed);

[devversion]

No, won't work, because I need to revert the class before the scope watcher will be triggered.

[EladBezalel]

element.removeClass('md-closed');
var isHidden = $mdUtil.isHidden(element, true, false);
element.toggleClass('md-closed', wasClosed);

if (isHidden && !skipSidenav) {
  skipNextUpdate = true;
  scope.isOpen = !!oldValue;
}

?

[devversion]

This still needs the return, but yes this will work, because we check before removing the class 👍

-> Updated

[EladBezalel]

@ThomasBurleson please review

[devversion]

@EladBezalel I think this PR is not really a high priority, not much developers are complaining about it. What do you think? Should we remove it from the deprecation progress?

[ThomasBurleson]

This issue is closed as part of our ‘Surge Focus on Material 2' efforts.
For details, see our forum posting @ http://bit.ly/1UhZyWs.