rkd-modal - npm Package Compare versions

Comparing version 1.2.3 to 1.3.0

dist/rkd-modal.js

@@ -0,10 +1,40 @@
+/**
+ * Escape key keyCode
+ */
+var ESC_KEY = 27;
+var ESC_KEY_NAMESPACE = 'rkd-modal-escape';
+var isEscKeyEnabled = function() {
+  return !window.rkdModal || window.rkdModal.escKey;
+};
+
 $(function() {
   var openModal = function($modal) {
+    $(document).trigger('rkd-modal:before:open', $modal);
+
     $modal.addClass('modal-open');
     $modal.find('input.modal-state').prop('checked', true).trigger('change');
+
+    if (isEscKeyEnabled()) {
+      $(document).on('keyup.'+ESC_KEY_NAMESPACE, function(e) {
+        if (e.keyCode === ESC_KEY) {
+          closeModal($modal);
+        }
+      });
+    }
+
+    $(document).trigger('rkd-modal:after:open', $modal);
   };
 
   var closeModal = function($modal) {
+    $(document).trigger('rkd-modal:before:close', $modal);
+
     $modal.removeClass('modal-open');
     $modal.find('input.modal-state').prop('checked', false).trigger('change');
+
+    // Remove ESC key listener
+    if (isEscKeyEnabled()) {
+      $(document).unbind('keyup.'+ESC_KEY_NAMESPACE);
+    }
+
+    $(document).trigger('rkd-modal:after:close', $modal);
   };
@@ -11,0 +41,0 @@

dist/rkd-modal.min.js

@@ -1,1 +0,1 @@
-$(function(){var a=function(a){a.addClass("modal-open"),a.find("input.modal-state").prop("checked",!0).trigger("change")},b=function(a){a.removeClass("modal-open"),a.find("input.modal-state").prop("checked",!1).trigger("change")};$(document).on("click",".modal-fade-screen, .modal-close",function(){var a=$(this).closest(".modal");b(a)}),$(document).on("click",".modal-inner",function(a){a.stopPropagation()}),$(document).on("click",".rkd-modal",function(b){b.preventDefault();var c=$("#"+$(this).data("rkd-modal-id"));a(c)}),$(document).on("click",".rkd-modal-ajax, .rkd-modal-this",function(b){b.preventDefault();var c,d=$(this).data("rkd-modal-id");d?c=$("#"+d):(c=createAjaxModal(),$(this).data("rkd-modal-id",c.attr("id")));var e=c.find(".loading");if(a(c),$(this).hasClass("rkd-modal-this"))return c.find(".modal-content").html($(this).html()),void e.hide();if(!c.hasClass("content-loaded")){var f=$(this).data("rkd-modal-selector");e.show(),$.ajax($(this).attr("href")).done(function(a){f?a=$(a).find(f):$(a).find(".rkd-modal-content")&&(a=$(a).find(".rkd-modal-content")),c.find(".modal-content").html(a),c.addClass("content-loaded")}).fail(function(){c.find(".modal-content").html("Something went wrong. Please try again later.")}).always(function(){e.hide()})}})});var createAjaxModal=function(){var a="_"+Math.random().toString(36).substr(2,9),b='<div class="modal" id="'+a+'"><input class="modal-state" type="checkbox" /><div class="modal-fade-screen"><div class="modal-inner"><!-- Close button--><div class="modal-close"></div><!-- Loader --><div class="sk-three-bounce loading"><div class="sk-child sk-bounce1"></div><div class="sk-child sk-bounce2"></div><div class="sk-child sk-bounce3"></div></div><!-- Content will be loaded in here with AJAX --><div class="modal-content"></div></div></div></div>';return $("body").append(b),$("#"+a)};
+var ESC_KEY=27,ESC_KEY_NAMESPACE="rkd-modal-escape",isEscKeyEnabled=function(){return!window.rkdModal||window.rkdModal.escKey};$(function(){var a=function(a){$(document).trigger("rkd-modal:before:open",a),a.addClass("modal-open"),a.find("input.modal-state").prop("checked",!0).trigger("change"),isEscKeyEnabled()&&$(document).on("keyup."+ESC_KEY_NAMESPACE,function(c){c.keyCode===ESC_KEY&&b(a)}),$(document).trigger("rkd-modal:after:open",a)},b=function(a){$(document).trigger("rkd-modal:before:close",a),a.removeClass("modal-open"),a.find("input.modal-state").prop("checked",!1).trigger("change"),isEscKeyEnabled()&&$(document).unbind("keyup."+ESC_KEY_NAMESPACE),$(document).trigger("rkd-modal:after:close",a)};$(document).on("click",".modal-fade-screen, .modal-close",function(){var a=$(this).closest(".modal");b(a)}),$(document).on("click",".modal-inner",function(a){a.stopPropagation()}),$(document).on("click",".rkd-modal",function(b){b.preventDefault();var c=$("#"+$(this).data("rkd-modal-id"));a(c)}),$(document).on("click",".rkd-modal-ajax, .rkd-modal-this",function(b){b.preventDefault();var c,d=$(this).data("rkd-modal-id");d?c=$("#"+d):(c=createAjaxModal(),$(this).data("rkd-modal-id",c.attr("id")));var e=c.find(".loading");if(a(c),$(this).hasClass("rkd-modal-this"))return c.find(".modal-content").html($(this).html()),void e.hide();if(!c.hasClass("content-loaded")){var f=$(this).data("rkd-modal-selector");e.show(),$.ajax($(this).attr("href")).done(function(a){f?a=$(a).find(f):$(a).find(".rkd-modal-content")&&(a=$(a).find(".rkd-modal-content")),c.find(".modal-content").html(a),c.addClass("content-loaded")}).fail(function(){c.find(".modal-content").html("Something went wrong. Please try again later.")}).always(function(){e.hide()})}})});var createAjaxModal=function(){var a="_"+Math.random().toString(36).substr(2,9),b='<div class="modal" id="'+a+'"><input class="modal-state" type="checkbox" /><div class="modal-fade-screen"><div class="modal-inner"><!-- Close button--><div class="modal-close"></div><!-- Loader --><div class="sk-three-bounce loading"><div class="sk-child sk-bounce1"></div><div class="sk-child sk-bounce2"></div><div class="sk-child sk-bounce3"></div></div><!-- Content will be loaded in here with AJAX --><div class="modal-content"></div></div></div></div>';return $("body").append(b),$("#"+a)};

package.json

 {
   "name": "rkd-modal",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "description": "Plain content and AJAX supported modal.",
@@ -5,0 +5,0 @@ "main": "Gruntfile.js",

README.md

@@ -15,3 +15,3 @@ [![npm](https://img.shields.io/npm/dt/rkd-modal.svg)](https://www.npmjs.com/package/rkd-modal)
 
-### AJAX modal
+## AJAX modal
 
@@ -30,3 +30,3 @@ **Create a link to modal**
 
-#### Options
+### Options
 
@@ -37,3 +37,3 @@ `data` attributes:
 
-### Content modal with current item contents
+## Content modal with current item contents
 
@@ -44,3 +44,3 @@ ````html
 
-### Content modal
+## Content modal
 
@@ -70,3 +70,3 @@ **Create a link to modal**
 
-#### Options
+### Options
 
@@ -77,2 +77,32 @@ `data` attributes:
 
+# Events
+
+**Possible events:**
+
+- `rkd-modal:before:open`
+- `rkd-modal:after:open`
+- `rkd-modal:before:close`
+- `rkd-modal:after:close`
+
+Events are fired on `$(document)` object, so listen like this:
+
+````javascript
+$(document).on('rkd-modal:before:open', function(e, $modal) {
+  // Do whatever you need
+  // $modal is jQuery object representing current modal
+});
+````
+
+# Disable ESC key from closing modal
+
+Just create `window.rkdModal` global object and set `escKey` to `false`.
+
+````javascript
+window.rkdModal = {
+  escKey: false
+};
+````
+
+It gets validated on every modal open, so you could change this setting whenever you need.
+
 # Customise
@@ -79,0 +109,0 @@

src/rkd-modal.js

@@ -0,10 +1,40 @@
+/**
+ * Escape key keyCode
+ */
+var ESC_KEY = 27;
+var ESC_KEY_NAMESPACE = 'rkd-modal-escape';
+var isEscKeyEnabled = function() {
+  return !window.rkdModal || window.rkdModal.escKey;
+};
+
 $(function() {
   var openModal = function($modal) {
+    $(document).trigger('rkd-modal:before:open', $modal);
+
     $modal.addClass('modal-open');
     $modal.find('input.modal-state').prop('checked', true).trigger('change');
+
+    if (isEscKeyEnabled()) {
+      $(document).on('keyup.'+ESC_KEY_NAMESPACE, function(e) {
+        if (e.keyCode === ESC_KEY) {
+          closeModal($modal);
+        }
+      });
+    }
+
+    $(document).trigger('rkd-modal:after:open', $modal);
   };
 
   var closeModal = function($modal) {
+    $(document).trigger('rkd-modal:before:close', $modal);
+
     $modal.removeClass('modal-open');
     $modal.find('input.modal-state').prop('checked', false).trigger('change');
+
+    // Remove ESC key listener
+    if (isEscKeyEnabled()) {
+      $(document).unbind('keyup.'+ESC_KEY_NAMESPACE);
+    }
+
+    $(document).trigger('rkd-modal:after:close', $modal);
   };
@@ -11,0 +41,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

32269

increased by8.64%

Lines of code

540

increased by9.31%

Number of lines in readme file

108

increased by38.46%

No dependency changes