bug: exposeAsideWhen doesn't not resize the view body

[5im0n]

Type: bug

Platform: all

This bug is essentially linked to the commit 8187367.

When expose-aside-when="large", the onResize is trigger with the $window.matchMedia function.
However on large device (iPad, Nexus 9) the side menu is open on portrait, when we rotate the tablet in landscape, the resize function is not tigger. So a blank zone appears

In browser when we resize the windows the same problem appears.

So what is the best solutions:
@msalcala11 ?

• Add window.addEventListener('orientationchange', onOrientationChange); ?
• Revert the commit 8187367 ?
• Anything else ?

Samples to illustrate the issue:

[msalcala11]

Thanks for the detailed explanation and screenshots, @5im0n! The problem with the previous implementation was that the resize handler was triggered too often, even when the screen dimensions did not change (such as when tapping a popover), causing the side menu to close for no reason. But looks like my commit went too far, and now the resize handler is not triggered often enough. I think the correct solution is somewhere in the middle. Here's a first pass at a fix (let me know if it resolves your issue):

IonicModule.directive('exposeAsideWhen', ['$window', function($window) {
  return {
    restrict: 'A',
    require: '^ionSideMenus',
    link: function($scope, $element, $attr, sideMenuCtrl) {

      var prevInnerWidth = $window.innerWidth;
      var prevInnerHeight = $window.innerHeight;

      ionic.on('resize', function(){
        if(prevInnerWidth === $window.innerWidth && prevInnerHeight === $window.innerHeight){
          return;
        }
        prevInnerWidth = $window.innerWidth;
        prevInnerHeight = $window.innerHeight;
        onResize();
      }, $window);

      function checkAsideExpose() {
        var mq = $attr.exposeAsideWhen == 'large' ? '(min-width:768px)' : $attr.exposeAsideWhen;
        sideMenuCtrl.exposeAside($window.matchMedia(mq).matches);
        sideMenuCtrl.activeAsideResizing(false);
      }

      function onResize() {
        sideMenuCtrl.activeAsideResizing(true);
        debouncedCheck();
      }

      var debouncedCheck = ionic.debounce(function() {
        $scope.$apply(checkAsideExpose);
      }, 300, false);

      $scope.$evalAsync(checkAsideExpose);
    }
  };
}]);

[5im0n]

@msalcala11 Sounds great for me 👍

Wich this solution the resize is not triggered to often but enough when $window width or height change.
Have you time to make a pull request, or I can do it ?
Would be nice to include this fix is a next release.

[msalcala11]

@5im0n Glad to hear it worked for you 👍
Yeah, if you could make a pull request, that would be awesome!

[mlynch]

Closed with #4908 merged. Thanks everyone!