Modal : open() and not close on overlay

[baurez]

Hi,

Very nice framework !!
But I have two question :
Could we open a modal without having a trigger in a button, directly in javascript ?
like : $('#modal_ID').openModal()

Could we chose if a click in overlay will close or not the modal ?

:)

Thx !!

[Dogfalo]

Yep, I like the idea. We do have a large number of other things to work on as well however. If you or someone else would like to try and implement this, that would be great as well.

Information about how to accomplish this: http://stackoverflow.com/questions/6982948/jquery-bind-custom-functions-to-dom-elements

[thebergamo]

Maybe is good you can generate an ID for the leanModal automatically, because sometimes you need adding 2 or more modals, and when I see the code, you set the I on hard code.

[afifsohaili]

@marcosbergamo I can't think of any use case where I want to open two modal/dialogs at once, and I think that defeats the purpose of a dialog/modal, too. Is there any example use case you can provide?

[Dogfalo]

I also do not think there should be two modal dialogs open on the screen. Feel free to keep discussing or open another issue.

Fixed by @afifsohaili in 1071f0a

[davilocho]

hello
I share a few lines that offer a solution to add multiple modal windows open and close properly

$.fn.extend({
    closeModal: function(options) {
      var defaults = {
        out_duration: 250,
        complete: undefined
      }
      var options = $.extend(defaults, options);
        if($("div#lean-overlay").size()==1){
            $('.modal-close').off();
            $(document).off('keyup.leanModal');
        }

       $("div#lean-overlay:last").velocity( { opacity: 0}, {duration: options.out_duration, queue: false, ease: "easeOutQuart"});

      // Define Bottom Sheet animation
      if ($(this).hasClass('bottom-sheet')) {
        $(this).velocity({bottom: "-100%", opacity: 0}, {
          duration: options.out_duration,
          queue: false,
          ease: "easeOutCubic",
          // Handle modal ready callback
          complete: function() {

            $("div#lean-overlay:last").css({display:"none"});

            // Call complete callback
            if (typeof(options.complete) === "function") {
              options.complete();
            }

            $('div#lean-overlay:last').remove();
          }
        });
      }
      else {
        $(this).fadeOut(options.out_duration, function() {
          $(this).css({ top: 0});

          $("div#lean-overlay:last").css({display:"none"});

          // Call complete callback
          if (typeof(options.complete) === "function") {
            options.complete();
          }
          $('div#lean-overlay:last').remove();
        });
      }

    }
  })