ampersand-dom-bindings - npm Package Compare versions

Comparing version 3.1.2 to 3.2.0

ampersand-dom-bindings.js

		@@ -165,2 +165,14 @@ var Store = require('key-tree-store');
		};
		} else if (type === 'switchClass') {
		if (!binding.cases) throw Error('switchClass bindings must have "cases"');
		return function (el, value, keyName) {
		var name = makeArray(binding.name \|\| keyName);
		for (var item in binding.cases) {
		getMatches(el, binding.cases[item]).forEach(function (match) {
		name.forEach(function (className) {
		dom[value === item ? 'addClass' : 'removeClass'](match, className);
		});
		});
		}
		};
		} else {
		@@ -167,0 +179,0 @@ throw new Error('no such binding type: ' + type);

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.1.2",
		"version": "3.2.0",
		"author": "'Henrik Joreteg' <henrik@andyet.net>",
		@@ -6,0 +6,0 @@ "bugs": {

README.md

		@@ -100,3 +100,3 @@ # ampersand-dom-bindings

		toggles existance of entire element (uses a comment node as placeholder if gone) based on boolean interpretation of property name.
		toggles existence of entire element (uses a comment node as placeholder if gone) based on boolean interpretation of property name.

		@@ -120,3 +120,3 @@ ```js

		Toggles existance of multiple items based on value of property.
		Toggles existence of multiple items based on value of property.

		@@ -134,2 +134,18 @@ ```js

		### switchClass

		Toggles existence of a class on multiple elements based on value of property.

		```js
		'model.key': {
		type: 'switchClass',
		name: 'is-active',
		cases: {
		'edit': '#edit_tab',
		'new': '#new_tab',
		'details': '#details_tab'
		}
		}
		```

		### innerHTML
		@@ -136,0 +152,0 @@

test/index.js

		@@ -350,2 +350,29 @@ var test = require('tape');

		test('switchClass bindings', function (t) {
		var el = getEl('<div class="foo"></div><div class="bar"></div>');
		var bindings = domBindings({
		'model': {
		type: 'switchClass',
		name: 'yes',
		cases: {
		foo: '.foo',
		bar: '.bar'
		}
		}
		});

		t.notOk(dom.hasClass(el.firstChild, 'yes'), '.foo should have no extra class to start');
		t.notOk(dom.hasClass(el.lastChild, 'yes'), '.bar should have no extra class to start');

		bindings.run('', null, el, 'foo');
		t.ok(dom.hasClass(el.firstChild, 'yes'), '.foo should now have `yes` class');
		t.notOk(dom.hasClass(el.lastChild, 'yes'), '.bar should still have no extra class');

		bindings.run('', null, el, 'bar');
		t.ok(dom.hasClass(el.lastChild, 'yes'), '.bar should now have `yes` class');
		t.notOk(dom.hasClass(el.firstChild, 'yes'), '.foo should now have no extra class');

		t.end();
		});

		test('ensure selector matches root element', function (t) {
		@@ -352,0 +379,0 @@ var el = getEl();

New alerts