From f7e326d9739736e334deccad1053aca304dcb332 Mon Sep 17 00:00:00 2001 From: Ryan Niemeyer Date: Fri, 2 Jan 2015 20:48:13 -0600 Subject: [PATCH] Docs; Code style updates; Update to version 0.5.0 --- README.md | 11 +++++++++++ bower.json | 2 +- build/knockout-delegatedEvents.js | 7 ++++--- build/knockout-delegatedEvents.min.js | 2 +- package.json | 2 +- src/knockout-delegatedEvents.js | 5 +++-- 6 files changed, 21 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index c95262a..b2e315f 100644 --- a/README.md +++ b/README.md @@ -105,6 +105,17 @@ There are a couple of cases where this technique might be necessary: Note: when attaching a handler using the binding, you will need to manage the value of `this` as you would when using the normal `click` and `event` bindings. So, in this case you would have to take care of it in our view model or bind against it like `$parent.removeItem.bind($parent)`. +##Control Bubbling +Normally, when an event is handled, the plugin will prevent further bubbling of the event. In a scenario that you do want an event to continue bubbling, you can add an additional binding per event name to allow bubbling. + +```html +
+... +
+``` + +In this caase, the `delegatedClickBubble` additional binding will signal the plugin that when it handles a `click` event it should allow the event to continue bubbling. For even greater control, the handler could then access the event argument (2nd arg) and choose to prevent bubbling on a case-by-case basis. + ##TODO * Improve example diff --git a/bower.json b/bower.json index 779c11a..7a23c76 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "knockout-delegatedEvents", - "version": "0.4.0", + "version": "0.5.0", "main": "build/knockout-delegatedEvents.min.js", "ignore": [ "examples", diff --git a/build/knockout-delegatedEvents.js b/build/knockout-delegatedEvents.js index 7cb1316..848edb1 100644 --- a/build/knockout-delegatedEvents.js +++ b/build/knockout-delegatedEvents.js @@ -1,4 +1,4 @@ -// knockout-delegatedEvents 0.4.0 | (c) 2014 Ryan Niemeyer | http://www.opensource.org/licenses/mit-license +// knockout-delegatedEvents 0.5.0 | (c) 2015 Ryan Niemeyer | http://www.opensource.org/licenses/mit-license ;(function(factory) { //CommonJS if (typeof require === "function" && typeof exports === "object" && typeof module === "object") { @@ -98,8 +98,9 @@ } //prevent bubbling if not enabled - if(bubble !== true) { + if (bubble !== true) { event.cancelBubble = true; + if (typeof event.stopPropagation === "function") { event.stopPropagation(); } @@ -146,7 +147,7 @@ ko.utils.arrayForEach(events, function(event) { //check if the associated "delegatedBubble" is true (optionally allows bubbling) - var bubble = allBindings.get( createBindingName(event + 'Bubble') ) === true; + var bubble = allBindings.get(createBindingName(event + "Bubble")) === true; createDelegatedBinding(event); ko.utils.registerEventHandler(element, event, createDelegatedHandler(event, element, bubble)); diff --git a/build/knockout-delegatedEvents.min.js b/build/knockout-delegatedEvents.min.js index 44ebe41..fc7b98f 100644 --- a/build/knockout-delegatedEvents.min.js +++ b/build/knockout-delegatedEvents.min.js @@ -1,2 +1,2 @@ -// knockout-delegatedEvents 0.4.0 | (c) 2014 Ryan Niemeyer | http://www.opensource.org/licenses/mit-license +// knockout-delegatedEvents 0.5.0 | (c) 2015 Ryan Niemeyer | http://www.opensource.org/licenses/mit-license !function(a){"function"==typeof require&&"object"==typeof exports&&"object"==typeof module?a(require("knockout"),exports):"function"==typeof define&&define.amd?define(["knockout","exports"],a):a(ko,ko.actions={})}(function(a,b){var c="ko_delegated_",d=function(d,e,f){return function(g){for(var h,i,j,k,l,m,n,o,p=g.target||g.srcElement,q="data-"+d,r=c+d;!i&&p;)i=1===p.nodeType&&!p.disabled&&(p.getAttribute(q)||a.utils.domData.get(p,r)),i||(p=p!==e?p.parentNode:null);if(i){if(j=a.contextFor(p)){for(;p&&p!==e;){if(p.disabled)return;p=p.parentNode}h=j.$data,"string"==typeof i?(i in b?(n=b[i],n&&(k="function"==typeof n?n:n.action,l=n.owner||h)):h&&h[i]&&"function"==typeof h[i]&&(k=h[i],l=h),k||(m=a.utils.arrayFirst(j.$parents,function(a){return a[i]&&"function"==typeof a[i]}),k=m&&m[i],l=m)):"function"==typeof i&&(k=i,l=h)}k&&(o="submit"===d?k.call(h,g.target):k.call(l,h,g),o!==!0&&(g.preventDefault?g.preventDefault():g.returnValue=!1),f!==!0&&(g.cancelBubble=!0,"function"==typeof g.stopPropagation&&g.stopPropagation()))}}},e=function(a){return"delegated"+a.substr(0,1).toUpperCase()+a.slice(1)},f=function(b){var d;b&&(d=e(b),a.bindingHandlers[d]||(a.bindingHandlers[d]={init:function(d,e){var f=e();a.utils.domData.set(d,c+b,f)}}))};a.bindingHandlers.delegatedHandler={init:function(b,c,g){var h=a.utils.unwrapObservable(c())||[];"string"==typeof h&&(h=[h]),a.utils.arrayForEach(h,function(c){var h=g.get(e(c+"Bubble"))===!0;f(c),a.utils.registerEventHandler(b,c,d(c,b,h))})}}}); \ No newline at end of file diff --git a/package.json b/package.json index ebb32f3..9393735 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "knockout-delegatedEvents", - "version": "0.4.0", + "version": "0.5.0", "devDependencies": { "grunt": "~0.4.1", "grunt-contrib-uglify": "0.x.x", diff --git a/src/knockout-delegatedEvents.js b/src/knockout-delegatedEvents.js index 00ec969..09e2a6d 100644 --- a/src/knockout-delegatedEvents.js +++ b/src/knockout-delegatedEvents.js @@ -97,8 +97,9 @@ } //prevent bubbling if not enabled - if(bubble !== true) { + if (bubble !== true) { event.cancelBubble = true; + if (typeof event.stopPropagation === "function") { event.stopPropagation(); } @@ -145,7 +146,7 @@ ko.utils.arrayForEach(events, function(event) { //check if the associated "delegatedBubble" is true (optionally allows bubbling) - var bubble = allBindings.get( createBindingName(event + 'Bubble') ) === true; + var bubble = allBindings.get(createBindingName(event + "Bubble")) === true; createDelegatedBinding(event); ko.utils.registerEventHandler(element, event, createDelegatedHandler(event, element, bubble));