btford/angular-modal

feat: built-in $animate support

stryju opened this issue · 10 comments

Hey.

Would it be possible to provide a built in $animate support for shown / hidden modals?

with a "hard" dependency of $animate, i managed to achieve it by adding

    function attach (html, locals) {
      // ...
      $animate.addClass( element, 'shown' );
    }
    // ...
    function deactivate () {
      if (element) {
        $animate.removeClass( element, 'shown', function () {
          scope.$destroy();
          element.remove();
          element = null;
        });
      }
    }

Ideal solution would use an optional dependency, but I'm not sure how to solve that.
Or should i use a decorator?

Sorry if the request is noobish - still a fresh-comer

👍

was that 👍 on decorator or the general idea? :)
if the latter - is there a way to achieve "soft" dependency? as in

hey there angular - is there $animate present? if so, use it, if not - whatever :)

$animate is always available for ng ^1.2. It only does animations if you load the ngAnimate module.

sweet!

i'll try to fix up a PR for that, then :-)

I still need to document and add an example for animations, but you should now have the same hooks as ngIf with the modal.

oh cool! thanks!

this is a nice straight forward approach, however something is missing from the mix, would you be able to provide and example of what the modal is expecting as far as classes, as in myclass.ng-enter OR myclasss.enter, or is it arbitrary and can i assign class names?

it works "out of the box" - ng-[enter|leave|move] will be added
automatically

Tomasz Stryjewski
señor front-end developer.

On Sun, May 18, 2014 at 12:51 AM, magicDamo notifications@github.comwrote:

this is a nice straight forward approach, however something is missing
from the mix, would you be able to provide and example of what the modal is
expecting as far as classes, as in myclass.ng-enter OR myclasss.enter, or
is it arbitrary and can i assign class names?


Reply to this email directly or view it on GitHubhttps://github.com//issues/11#issuecomment-43426363
.

so you are saying the merely by virtue of the fact of injecting ngAnimate into the main app module that there nothing else need to enable this? no CSS classes are necessary, and i can just do this:
myApp.factory('myModal', function (btfModal) {
return btfModal({
controller: 'MyModalCtrl',
controllerAs: 'modal', //important
templateUrl: 'views/my-modal.html'
});
})

and it should animate? if this is what you're implying, I have to report that it's not working out of the box. pleas advise.

thank you.

well, you NEED to specify css animations for the given class - just follow
guide @ http://www.nganimate.org/

Tomasz Stryjewski
señor front-end developer.

On Sun, May 18, 2014 at 2:12 AM, magicDamo notifications@github.com wrote:

so you are saying the merely by virtue of the fact of injecting ngAnimate
into the main app module that there nothing else need to enable this? no
CSS classes are necessary, and i can just do this:
myApp.factory('myModal', function (btfModal) {
return btfModal({
controller: 'MyModalCtrl',
controllerAs: 'modal', //important
templateUrl: 'views/my-modal.html'
});
})

and it should animate? if this is what you're implying, I have to report
that it's not working out of the box. pleas advise.

thank you.


Reply to this email directly or view it on GitHubhttps://github.com//issues/11#issuecomment-43427742
.