From 9464a5791c1506cf3e37f118ef4084b78897a2a4 Mon Sep 17 00:00:00 2001
From: Vladimir Siljkovic <vladimirs@vast.com>
Date: Wed, 12 Dec 2018 01:08:45 +0100
Subject: [PATCH] New: Add option `blurignore`

---
 cypress/integration/test.js | 15 +++++++++++++++
 index.html                  |  6 ++++++
 jquery.popupoverlay.js      |  8 +++++++-
 3 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/cypress/integration/test.js b/cypress/integration/test.js
index 2e13f51..ef9d803 100644
--- a/cypress/integration/test.js
+++ b/cypress/integration/test.js
@@ -294,6 +294,21 @@ describe("jQuery Popup Overlay", () => {
       cy.get("#dynamic").should("be.visible");
     });
 
+    it("blurignore", () => {
+      cy.window().then(win => {
+        win.$("#dynamic").popup({ blurignore: 'h1', blur: true, autoopen: true });
+      });
+      // Clicking on the popup content should not hide it (this click is also required for a bug in Cypress with pointer-events:none)
+      cy.get("#dynamic").click(1, 1);
+      cy.get("#dynamic").should("be.visible");
+      // Clicking on h1 to test `blurignore`
+      cy.get("h1").click({ force: true });
+      cy.get("#dynamic").should("be.visible");
+      // Clicking outside of the popup
+      cy.get("#dynamic_wrapper").click(1, 1, { force: true }); // Cypress doesn't respect pointer-events:none; so we have to force the click
+      cy.get("#dynamic").should("be.hidden");
+    });
+
     it("setzindex true", () => {
       cy.window().then(win => {
         win.$("#dynamic").popup({ setzindex: true, autoopen: true });
diff --git a/index.html b/index.html
index 813ce9d..2fb88f2 100644
--- a/index.html
+++ b/index.html
@@ -307,6 +307,12 @@ <h2>Options</h2>
             <td>true</td>
             <td>Closes the popup if a user clicks anywhere outside the popup.</td>
         </tr>
+        <tr>
+            <td>blurignore</td>
+            <td>string <small class="text-muted"><i>(CSS&nbsp;selector)</i></small></td>
+            <td>true</td>
+            <td>Sets elements which will be ignored in <code>blur</code> option, even if they are outside.</td>
+        </tr>
         <tr>
             <td>closeelement</td>
             <td>string <small class="text-muted"><i>(CSS&nbsp;selector)</i></small></td>
diff --git a/jquery.popupoverlay.js b/jquery.popupoverlay.js
index da3fca5..a89030f 100644
--- a/jquery.popupoverlay.js
+++ b/jquery.popupoverlay.js
@@ -722,7 +722,12 @@
             }
 
             // If clicked outside of popup
-            if ($(el).data('popupoptions') && $(el).data('popupoptions').blur && !$(event.target).closest('#' + elementId).length && event.which !== 2 && $(event.target).is(':visible')) {
+            if ($(el).data('popupoptions')
+                && $(el).data('popupoptions').blur
+                && !$(event.target).closest($(el).data('popupoptions').blurignore).length
+                && !$(event.target).closest('#' + elementId).length
+                && event.which !== 2
+                && $(event.target).is(':visible')) {
 
                 if ($(el).data('popupoptions').background) {
                     // If clicked on popup cover
@@ -861,6 +866,7 @@
         offsetleft: 0,
         escape: true,
         blur: true,
+        blurignore: null,
         setzindex: true,
         autozindex: false,
         scrolllock: false,