outclick - npm Package Compare versions

Comparing version 0.0.4 to 0.0.6

package.json

 {
   "name": "outclick",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "A library used to detect DOM clicks outside specific elements, useful for closing menus",
@@ -5,0 +5,0 @@ "main": "src/index.js",

README.md

@@ -10,3 +10,3 @@ # outclick 👉
 ## Warning
-If you don't specifiy otherwise, this library will alter the addEventListener property. This should be okay for most cases but may lead to complications with other libraries. 
+If you don't specifiy otherwise, this library will alter the addEventListener and removeEventListener properties. This should be okay for most cases but may lead to complications with other libraries. 
 
@@ -37,2 +37,26 @@ ## Installation
 ```
+the exceptions parameter, is an array of elements that are an exception to the outclick event.
+```javascript
+var menu = document.getElementById('menu')
+var exceptions = [
+ document.getElementById('menuBtn'),
+ document.getElementById('dontCloseTheMenu')
+]
+
+menu.addEventListener('outclick', function (e) {
+	hide(menu)
+}, exceptions)
+```
+removing a listener is the same, however we've modified addEventListener to return the listening function to make it easier for you e.g.
+
+```javascript
+var menu = document.getElementById('menu')
+
+var menuFunc = menu.addEventListener('outclick', function (e) {
+	hide(menu)
+})
+
+menu.removeEventListener('outclick', menuFunc)
+```
+
 Alternatively, you can also use the html attribute outclick to trigger an event.
@@ -39,0 +63,0 @@ This does not handle dynamic HTML, and we have no plans to add that, yet

release/outclick.min.js

@@ -5,3 +5,3 @@ /**
  */
-(function(d){var e=[{listener:null,exceptions:[]}],g=Node.prototype.addEventListener;Object.defineProperty(Node.prototype,"onoutclick",{set:function(a){e[0]={exceptions:[this],listener:a};return a}});d.Node.prototype.addEventListener=function(a,c,b){"outclick"==a?(b=b||[],b.push(this),e.push({exceptions:b,listener:c})):g.apply(this,arguments)};d.document.addEventListener("click",function(a){for(var c=e.length;c--;){for(var b=e[c],d=!1,f=b.exceptions.length;f--;)if(b.exceptions[f].contains(a.target)){d=
-!0;break}d||b.listener&&b.listener(a)}});d=document.querySelectorAll("[outclick]");[].forEach.call(d,function(a){var c=a.getAttribute("outclick"),c=Function(c);e.push({listener:c,exceptions:[a]})})})(window);
+(function(a){var d=[{listener:null,exceptions:[]}],g=Node.prototype.addEventListener,h=Node.prototype.removeEventListener;Object.defineProperty(Node.prototype,"onoutclick",{set:function(c){d[0]={exceptions:[this],listener:c};return c}});a.Node.prototype.addEventListener=function(c,e,b){if("outclick"==c)return b=b||[],b.push(this),d.push({exceptions:b,listener:e}),e;g.apply(this,arguments)};a.document.addEventListener("click",function(c){for(var e=d.length;e--;){for(var b=d[e],a=!1,f=b.exceptions.length;f--;)if(b.exceptions[f].contains(c.target)){a=
+!0;break}a||b.listener&&b.listener(c)}});a.Node.prototype.removeEventListener=function(c,e){if("outclick"==c)for(var b=d.length;b--;){var a=d[b];if(a.exceptions[0]==this&&a.listener.toString()==e.toString()){d.splice(b,1);break}}else h(this,arguments)};a=document.querySelectorAll("[outclick]");[].forEach.call(a,function(c){var a=c.getAttribute("outclick"),a=Function(a);d.push({listener:a,exceptions:[c]})})})(window);

src/index.js

 /**
- * Version: 0.0.1
+ * Version: 0.0.6
  * Author: Joseph Thomas
@@ -10,2 +10,3 @@ */
   var addEventListener = Node.prototype.addEventListener
+  var removeEventListener = Node.prototype.removeEventListener
 
@@ -33,4 +34,5 @@ /** This handles any listener set by .onclick prototype property */
       })
+      return listener
     } else {
-      addEventListener.apply(this,arguments)
+      addEventListener.apply(this, arguments)
     }
@@ -57,3 +59,18 @@ }
 
-  /** This handels the HTML onclick property */
+  /** Getting rid of event listeners */
+  window.Node.prototype.removeEventListener = function (event, listener) {
+    if (event == 'outclick') {
+      for(var i = OutClickListeners.length; i--;){
+        var outListener = OutClickListeners[i]
+        if(outListener.exceptions[0] == this && outListener.listener.toString() == listener.toString()) {
+          OutClickListeners.splice(i,1)
+          break
+        }
+      }
+    } else {
+      removeEventListener(this, arguments)
+    }
+  } 
+
+  /** This handles the HTML onclick property */
   var elements = document.querySelectorAll('[outclick]')
@@ -69,2 +86,3 @@
   })
+
 })(window)

test/test.js

@@ -10,4 +10,4 @@ var assert = chai.assert
 }
-box2.addEventListener('outclick', function () {
-	box2.setAttribute('data-test','GOOD')
+var eventListen = box2.addEventListener('outclick', function () {
+  box2.setAttribute('data-test','GOOD')
 })
@@ -48,2 +48,8 @@ var box3func = function () {
   })
+  it('Should have removed the listener', function () {
+    box2.removeEventListener('outclick', eventListen)
+    testBtn.click()
+    assert(!box2.getAttribute('data-test'),'data-test is empty')
+    clear()
+  })
 })
@@ -50,0 +56,0 @@

No alert changes

Improved metrics

Total package byte prevSize

122464

increased by1.49%

Lines of code

141

increased by21.55%

Number of lines in readme file

64

increased by60%

No dependency changes