ampersand-dom-bindings - npm Package Compare versions

Comparing version 3.7.1 to 3.8.0

ampersand-dom-bindings.js

@@ -129,2 +129,4 @@ /*$AMPERSAND_VERSION*/
                 var name = makeArray(binding.name || keyName);
+                var invert = (binding.invert || false);
+                value = (invert ? (value ? false : true) : value);
                 getMatches(el, selector).forEach(function (match) {
@@ -161,2 +163,4 @@ name.forEach(function (className) {
                 var name = makeArray(binding.name || keyName);
+                var invert = (binding.invert || false);
+                value = (invert ? (value ? false : true) : value);
                 getMatches(el, selector).forEach(function (match) {
@@ -171,2 +175,3 @@ name.forEach(function (attr) {
         var mode = (binding.mode || 'display');
+        var invert = (binding.invert || false);
         // this doesn't require a selector since we can pass yes/no selectors
@@ -184,2 +189,3 @@ if (hasYesNo) {
             return function (el, value) {
+                value = (invert ? (value ? false : true) : value);
                 getMatches(el, selector).forEach(function (match) {
@@ -186,0 +192,0 @@ dom[value ? 'show' : 'hide'](match, mode);

package.json

 {
   "name": "ampersand-dom-bindings",
   "description": "Takes binding declarations and returns key-tree-store of functions that can be used to apply those bindings.",
-  "version": "3.7.1",
+  "version": "3.8.0",
   "author": "'Henrik Joreteg' <[e-mail]>",
@@ -6,0 +6,0 @@ "browserify": {

README.md

@@ -45,5 +45,5 @@ # ampersand-dom-bindings
 
-### attribute 
+### attribute
 sets the whole attribute to match value of property. treats `undefined`, `null`, and `NaN` as `''` (empty string). `name` can also be an array to set multiple attributes to the same value.
-    
+
 ```js
@@ -62,3 +62,3 @@ 'model.key': {
 **note**: The binding will only be applied if the element is not currently in focus. This is done by checking to see if the element is the `document.activeElement` first. The reason it works this way is because if you've set up two-way data bindings you get a circular event: the input changes, which sets the bound model property, which in turn updates the value of the input. This might sound OK but results in the cursor always jumping to the end of the input/textarea. So if you're editing the middle of a bound text field, the cursor keeps jumping to the end. We avoid this by making sure it's not already in focus thus avoiding the bad loop.
-    
+
 ```js
@@ -73,3 +73,3 @@ 'model.key': {
 
-add/removes class based on boolean interpretation of property name. `name`, `yes`, or `no` can also be an array of class names where all the values will be toggled.
+add/removes class based on boolean interpretation of property name. `name`, `yes`, or `no` can also be an array of class names where all the values will be toggled. If you need the opposite effect, (`false` adds class, `true` removes class), specify `invert: true`.
 
@@ -86,2 +86,4 @@ ```js
     no: 'not-active'
+    // if you need inverse interpretation
+    invert: true
 }
@@ -92,3 +94,3 @@ ```
 
-toggles whole attribute on the element (think `checked`) based on boolean interpretation of property name. `name` can also be an array of attribute names where all the values will be toggled.
+toggles whole attribute on the element (think `checked`) based on boolean interpretation of property name. `name` can also be an array of attribute names where all the values will be toggled. If you need the opposite effect, (`false` adds attribute, `true` removes attribute), specify `invert: true`.
 
@@ -105,2 +107,4 @@ ```js
     no: 'data-is-not-awesome'
+    // if you need inverse interpretation
+    invert: true
 }
@@ -120,2 +124,9 @@ ```
 
+// Inverse interpretation of value
+'model.key': {
+    type: 'toggle',
+    invert: true,
+    hook: 'some-element'
+}
+
 // toggle visibility property instead
@@ -308,3 +319,3 @@ 'model.key': {
 
-Previously after having given views the ability to have their own properties (since view inherits from state) it was awkward to bind those to the DOM. Also, for binding things that were not just `this.model` the syntax had to change. 
+Previously after having given views the ability to have their own properties (since view inherits from state) it was awkward to bind those to the DOM. Also, for binding things that were not just `this.model` the syntax had to change.
 
@@ -311,0 +322,0 @@ Now this is fairly simple/obvious:

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

22103

increased by3.73%

Lines of code

249

increased by2.47%

Number of lines in readme file

349

increased by3.25%

No dependency changes