Add dist

dist/css/modalizer.css

@@ -0,0 +1,103 @@
+/*!
+ * Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
+ * Copyright 2011-2020 José Luis Garrido-Labrador
+ * Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
+ */
+body {
+    overflow-x: hidden;
+	overflow-y: scroll !important;
+}
+
+.modal{
+	padding-right: 0px !important;
+}
+
+.modal-backdrop.show{
+	display: none;
+}
+
+.MOD_supreme-container.modal-open{
+    filter:blur(.5rem);
+}
+
+
+.modal-content{
+	border: 0px !important;
+}
+
+.modal-optionable{
+	z-index: 3000000000;
+	background-color: rgba(0,0,0,0.5);
+	padding: 0 !important;
+}
+
+.modal-optionable > .modal-dialog {
+	--animate-duration: 0.5s;
+}
+
+.modal-optionable .modal-dialog {
+	-webkit-transform: translate(0);
+	-moz-transform: translate(0);
+	transform: translate(0);
+}
+
+.modal-dialog.fullscreen {
+	width: 100% !important;
+	height: 100% !important;
+	max-height: -moz-fit-content !important;
+	min-height: -moz-fit-content !important;
+	max-height: fit-content !important;
+	min-height: fit-content !important;
+	
+	margin: 0 !important;
+	padding: 0 !important;
+	max-width:none !important;
+	background-color: var(--white);
+	opacity: 1;
+	
+}
+
+.modal-content.fullscreen  {
+	height: auto !important;
+	min-height: 100% !important;
+	border-radius: 0 !important;
+}
+
+.modal-header.fullscreen  {
+	border-bottom: 1px solid #9ea2a2 !important;
+}
+
+.modal-footer.fullscreen  {
+	border-top: 1px solid #9ea2a2 !important;
+}
+
+@media (max-width: 576px) {
+
+	.modal-dialog.fullscreen-sm {
+		width: 100% !important;
+		height: 100% !important;
+		max-height: -moz-fit-content !important;
+		min-height: -moz-fit-content !important;
+		max-height: fit-content !important;
+		min-height: fit-content !important;
+		margin: 0 !important;
+		padding: 0 !important;
+		max-width:none !important;
+	
+	}
+	
+	.modal-content.fullscreen-sm  {
+		height: auto !important;
+		min-height: 100% !important;
+		max-height: 100% !important;
+		border-radius: 0 !important;
+	}
+	
+	.modal-header.fullscreen-sm  {
+		border-bottom: 1px solid #9ea2a2 !important;
+	}
+	
+	.modal-footer.fullscreen-sm  {
+		border-top: 1px solid #9ea2a2 !important;
+	}
+}

dist/css/modalizer.min.css

@@ -0,0 +1,5 @@
+/*!
+ * Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
+ * Copyright 2011-2020 José Luis Garrido-Labrador
+ * Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
+ */body{overflow-x:hidden;overflow-y:scroll!important}.modal{padding-right:0!important}.modal-backdrop.show{display:none}.MOD_supreme-container.modal-open{filter:blur(.5rem)}.modal-content{border:0!important}.modal-optionable{z-index:3000000000;background-color:rgba(0,0,0,.5);padding:0!important}.modal-optionable>.modal-dialog{--animate-duration:0.5s}.modal-optionable .modal-dialog{-webkit-transform:translate(0);-moz-transform:translate(0);transform:translate(0)}.modal-dialog.fullscreen{width:100%!important;height:100%!important;max-height:-moz-fit-content!important;min-height:-moz-fit-content!important;max-height:fit-content!important;min-height:fit-content!important;margin:0!important;padding:0!important;max-width:none!important;background-color:var(--white);opacity:1}.modal-content.fullscreen{height:auto!important;min-height:100%!important;border-radius:0!important}.modal-header.fullscreen{border-bottom:1px solid #9ea2a2!important}.modal-footer.fullscreen{border-top:1px solid #9ea2a2!important}@media (max-width:576px){.modal-dialog.fullscreen-sm{width:100%!important;height:100%!important;max-height:-moz-fit-content!important;min-height:-moz-fit-content!important;max-height:fit-content!important;min-height:fit-content!important;margin:0!important;padding:0!important;max-width:none!important}.modal-content.fullscreen-sm{height:auto!important;min-height:100%!important;max-height:100%!important;border-radius:0!important}.modal-header.fullscreen-sm{border-bottom:1px solid #9ea2a2!important}.modal-footer.fullscreen-sm{border-top:1px solid #9ea2a2!important}}

dist/js/modalizer.js

@@ -0,0 +1,279 @@
+/*!
+ * Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
+ * Copyright 2011-2020 José Luis Garrido-Labrador
+ * Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
+ */
+
+let MOD_howManyModals = 0;
+let MOD_modalz = 9999;
+let MOD_animate = "";
+let MOD_oc = null;
+
+let MOD_optionable = null;
+let MOD_actioned = false;
+
+if (typeof $().modal != 'function') {  
+    // jQuery is not loaded
+    console.error("Bootstrap modals not loaded")    
+}else{
+    $(document).ready(function(){
+        /**
+         * Launch modals
+         */
+        $(".modalinit").each(function(){
+            $(this).click(function(){
+                let btn = $(this);
+                let modal = $("#"+btn.data('modal'));
+                if(modal.length != 0)
+                    launchModal(modal);
+            })
+        });
+
+        /**
+         * Add funcionalitiy for all nextaction blocks
+         */
+        $(".nextaction").each(function(){
+            $(this).click(function(){
+                let btn = $(this);
+                let stack = eval(MOD_CURRENTMODAL.peek().data('stack'));
+                let nexttext = btn.data('next') || "";
+                let dialog = btn.closest("div.modal-dialog");
+                MOD_optionable = {dialog: dialog, nexttext: nexttext, stack: stack, next:true};
+                MOD_actioned = true;
+                boostrapAnimation(dialog, "fadeOutLeftBig");
+                
+            });
+        });
+    
+        /**
+         * Add funcionalitiy for all nextaction blocks
+         */
+        $(".beforeaction").each(function(){
+            $(this).click(function(){
+                let btn = $(this);
+                let stack = eval(MOD_CURRENTMODAL.peek().data('stack'));
+                let before = stack.pop()
+                let dialog = btn.closest("div.modal-dialog");
+                MOD_optionable = {before: before, dialog: dialog, next:false};
+                MOD_actioned = true;
+                boostrapAnimation(dialog, "fadeOutRightBig");                
+            });            
+        });
+
+        // Finish animation for modal dialog
+        $(".modal-dialog.animate__animated").each(function(){
+            $(this).on('animationend', function(e) {
+                if (MOD_optionable != null && MOD_actioned){
+                    MOD_actioned = false;
+                    MOD_optionable.dialog.hide();
+
+                    if(MOD_optionable.next){
+                        MOD_optionable.stack.push(MOD_optionable.dialog.attr("id"));
+                        if(MOD_optionable.nexttext != ""){
+                            let next = $("#"+MOD_optionable.nexttext);
+                            boostrapAnimation(next, "fadeInRightBig"); 
+                            next.show();
+                        }else{     
+                            resetmodals();          
+                        }
+                    }else{
+                        if(MOD_optionable.before != null){
+                            let before = $("#"+MOD_optionable.before)
+                            boostrapAnimation(before, "fadeInLeftBig");
+                            before.show();
+                        }else{
+                            MOD_optionable.dialog.show();
+                            resetmodals();
+                        }
+                    }
+
+                }
+                
+            })
+        })
+    
+        // Add a show and bs function for each modal
+        $(".modal.modalizer").each(function(){
+            $(this).on("show.bs.modal", function(){
+                let it = $(this);
+                
+                if(!it.hasClass("modal-optionable")){
+                    // If modal is already open don't add in how_manyModals
+                    $("#MOD_supreme-container").addClass("modal-open");
+                    it.css("z-index", ++MOD_modalz);          
+                }
+            });
+    
+            $(this).on("hide.bs.modal", function(e){
+                e.preventDefault();
+                let it = $(this);
+                var animation = it.data("animate-out") || null;
+                if(animation != null){
+                    it.addClass("animate__"+animation);
+                }
+                MOD_animate = animation;
+                MOD_oc = it;
+                it.removeClass("show");
+                MOD_modalz--;
+
+                if($('.modal[style*="display: block"]').length > 1){
+                    $("#MOD_supreme-container").addClass("modal-open");          
+                }else{
+                    $("#MOD_supreme-container").removeClass("modal-open");
+                    $("body").removeClass("modal-open");
+                }    
+                
+            });
+        })
+    
+        // Close modal function
+        $(".closemodal").each(function(){
+            $(this).click(function(){
+                let modal = $(this).closest("div.modal");
+                modal.modal("hide");
+                resetmodals();  
+            });        
+        });
+
+        //Finished animation
+        $(".modal.modalizer.animate__animated").each(function(){
+            $(this).on('animationend', function(e) {
+                let it = $(this);
+                if (MOD_animate != null)
+                    it.removeClass("animate__"+MOD_animate);
+                if(MOD_oc != null){
+                    MOD_oc.css("display","none");
+                    if (MOD_oc.hasClass("modal-optionable")){
+                        afterresetmodal(MOD_oc);
+                    }
+                }
+                MOD_oc = null;
+                MOD_animate = null;
+            })
+        });
+
+        $("#MOD_supreme-container").click(function(e){
+            e.preventDefault();
+        })
+    
+    });  
+    
+}
+
+
+function boostrapAnimation(modal, animation){
+    var cls = modal.attr("class").split(" ");
+    cls.pop();
+    cls.push("animate__"+animation);
+    modal.attr("class", cls.join(" "));
+}
+
+function launchModal(modal){
+    var animation = modal.data("animate-in") || null;
+    if(animation != null){
+        modal.addClass("animate__"+animation);
+    }
+    if(modal.hasClass("show")){ 
+        modal.removeClass("show");
+        setTimeout(function() {
+            modal.css("z-index", ++MOD_modalz);
+            modal.addClass("show");
+        }, 500);
+    }else{
+        setCurrentModal(modal);
+        if(!modal.hasClass("modal-optionable"))
+            MOD_howManyModals++;
+        modal.modal("show");
+    }
+    modal.css("display","block");
+    setTimeout(function(){
+        if(animation != null){
+            modal.removeClass("animate__"+animation);
+        }
+    }, 1000);
+    $("#MOD_supreme-container").addClass("modal-open");
+    
+}
+
+function resetmodals(){
+    let curmodal = MOD_CURRENTMODAL.pop();
+    curmodal.modal("hide");
+}
+
+function afterresetmodal(curmodal){
+    let stack = eval(curmodal.data('stack'));
+    if(stack != null){
+        stack.clean();
+    }
+    let loop = 0;
+    let anim = curmodal.data('animate-in') || null;
+    curmodal.children('div').each(function(){
+        let modal = $(this);
+        boostrapAnimation(modal, "fadeInRight");
+        if(loop == 0){
+            modal.css("display", "");
+            if(anim != null)
+                boostrapAnimation(modal, anim)
+        }else{
+            modal.css("display", "none");
+        }
+        loop++;        
+    });
+}
+
+function setCurrentModal(modal){
+    MOD_CURRENTMODAL.push(modal);
+}
+
+// Utils
+
+class MOD_Stack {
+    constructor(){
+        this.items = [];
+    }
+
+    push(element) 
+    { 
+        // push element into the items 
+        this.items.push(element); 
+    } 
+
+    pop() 
+    { 
+        // return top most element in the stack 
+        // and removes it from the stack 
+        // Underflow if stack is empty 
+        if (this.isEmpty()) 
+            return null; 
+        return this.items.pop(); 
+    } 
+
+    peek() 
+    { 
+        // return the top most element from the stack 
+        // but does'nt delete it. 
+        return this.items[this.items.length - 1]; 
+    } 
+
+    isEmpty() 
+    { 
+        // return true if stack is empty 
+        return this.items.length == 0; 
+    } 
+
+    clean(){
+        this.items = [];
+    }
+
+}
+
+function removeItemOnce(arr, value) { 
+    var index = arr.indexOf(value);
+    if (index > -1) {
+        arr.splice(index, 1);
+    }
+    return arr;
+}
+
+// Current modal stack
+const MOD_CURRENTMODAL = new MOD_Stack();

dist/js/modalizer.min.js

@@ -0,0 +1,6 @@
+/*!
+ * Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
+ * Copyright 2011-2020 José Luis Garrido-Labrador
+ * Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
+ */
+let MOD_howManyModals=0,MOD_modalz=9999,MOD_animate="",MOD_oc=null,MOD_optionable=null,MOD_actioned=!1;function boostrapAnimation(modal,animation){var cls=modal.attr("class").split(" ");cls.pop(),cls.push("animate__"+animation),modal.attr("class",cls.join(" "))}function launchModal(modal){var animation=modal.data("animate-in")||null;null!=animation&&modal.addClass("animate__"+animation),modal.hasClass("show")?(modal.removeClass("show"),setTimeout((function(){modal.css("z-index",++MOD_modalz),modal.addClass("show")}),500)):(setCurrentModal(modal),modal.hasClass("modal-optionable")||MOD_howManyModals++,modal.modal("show")),modal.css("display","block"),setTimeout((function(){null!=animation&&modal.removeClass("animate__"+animation)}),1e3),$("#MOD_supreme-container").addClass("modal-open")}function resetmodals(){let curmodal;MOD_CURRENTMODAL.pop().modal("hide")}function afterresetmodal(curmodal){let stack=eval(curmodal.data("stack"));null!=stack&&stack.clean();let loop=0,anim=curmodal.data("animate-in")||null;curmodal.children("div").each((function(){let modal=$(this);boostrapAnimation(modal,"fadeInRight"),0==loop?(modal.css("display",""),null!=anim&&boostrapAnimation(modal,anim)):modal.css("display","none"),loop++}))}function setCurrentModal(modal){MOD_CURRENTMODAL.push(modal)}"function"!=typeof $().modal?console.error("Bootstrap modals not loaded"):$(document).ready((function(){$(".modalinit").each((function(){$(this).click((function(){let btn=$(this),modal=$("#"+btn.data("modal"));0!=modal.length&&launchModal(modal)}))})),$(".nextaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),nexttext=btn.data("next")||"",dialog=btn.closest("div.modal-dialog");MOD_optionable={dialog:dialog,nexttext:nexttext,stack:stack,next:!0},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutLeftBig")}))})),$(".beforeaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),before=stack.pop(),dialog=btn.closest("div.modal-dialog");MOD_optionable={before:before,dialog:dialog,next:!1},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutRightBig")}))})),$(".modal-dialog.animate__animated").each((function(){$(this).on("animationend",(function(e){if(null!=MOD_optionable&&MOD_actioned)if(MOD_actioned=!1,MOD_optionable.dialog.hide(),MOD_optionable.next)if(MOD_optionable.stack.push(MOD_optionable.dialog.attr("id")),""!=MOD_optionable.nexttext){let next=$("#"+MOD_optionable.nexttext);boostrapAnimation(next,"fadeInRightBig"),next.show()}else resetmodals();else if(null!=MOD_optionable.before){let before=$("#"+MOD_optionable.before);boostrapAnimation(before,"fadeInLeftBig"),before.show()}else MOD_optionable.dialog.show(),resetmodals()}))})),$(".modal.modalizer").each((function(){$(this).on("show.bs.modal",(function(){let it=$(this);it.hasClass("modal-optionable")||($("#MOD_supreme-container").addClass("modal-open"),it.css("z-index",++MOD_modalz))})),$(this).on("hide.bs.modal",(function(e){e.preventDefault();let it=$(this);var animation=it.data("animate-out")||null;null!=animation&&it.addClass("animate__"+animation),MOD_animate=animation,MOD_oc=it,it.removeClass("show"),MOD_modalz--,$('.modal[style*="display: block"]').length>1?$("#MOD_supreme-container").addClass("modal-open"):($("#MOD_supreme-container").removeClass("modal-open"),$("body").removeClass("modal-open"))}))})),$(".closemodal").each((function(){$(this).click((function(){let modal;$(this).closest("div.modal").modal("hide"),resetmodals()}))})),$(".modal.modalizer.animate__animated").each((function(){$(this).on("animationend",(function(e){let it=$(this);null!=MOD_animate&&it.removeClass("animate__"+MOD_animate),null!=MOD_oc&&(MOD_oc.css("display","none"),MOD_oc.hasClass("modal-optionable")&&afterresetmodal(MOD_oc)),MOD_oc=null,MOD_animate=null}))})),$("#MOD_supreme-container").click((function(e){e.preventDefault()}))}));class MOD_Stack{constructor(){this.items=[]}push(element){this.items.push(element)}pop(){return this.isEmpty()?null:this.items.pop()}peek(){return this.items[this.items.length-1]}isEmpty(){return 0==this.items.length}clean(){this.items=[]}}function removeItemOnce(arr,value){var index=arr.indexOf(value);return index>-1&&arr.splice(index,1),arr}const MOD_CURRENTMODAL=new MOD_Stack;

doc/index.html

@@ -1,7 +1,7 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <title>Modalizer.js - Examples</title>
+        <title>Modalizer.js</title>
         <link href="https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"> 
         <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
         <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootswatch/4.5.2/lux/bootstrap.min.css" integrity="sha384-9+PGKSqjRdkeAU7Eu4nkJU8RFaH8ace8HGXnkiKMP9I9Te0GJ4/km3L1Z8tXigpG" crossorigin="anonymous">        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.0/animate.min.css" />