Permalink
Browse files

Added chaining support

  • Loading branch information...
1 parent 839e8f6 commit 21a4e30ffca13b5672916fe4553d3a59d6aed0ae @DamonOehlman committed Oct 18, 2011
Showing with 63 additions and 2 deletions.
  1. +24 −0 README.md
  2. +3 −1 classtweak.js
  3. +1 −1 classtweak.min.js
  4. +1 −0 test/index.html
  5. +34 −0 test/specs/chaining.js
View
@@ -84,4 +84,28 @@ classtweak(el, '.bounce.');
// add class 'bounce' and toggle class 'slide'
classtweak(el, '.bounce .slide.');
+```
+
+## Chaining
+
+I've also added chaining to classtweak so you can be really, really terse. The behaviour of chaining is sensitive to the context of the `classtweak` call though so be aware of that.
+
+If you want to tweak classes on a number of different elements with different class modifications you would call classtweak like:
+
+```js
+classtweak
+ ('section', '-active')
+ ('section[data-route="/"]', '+active');
+```
+
+Alternatively if you have created a tweaker on a set of target elements, you can chain those calls too:
+
+```js
+classtweak('section')('+slide')('+bounce');
+```
+
+In reality, though, this probably has limited value as you can achieve the same by simply passing through a space delimited string of all the class tweaks:
+
+```js
+classtweak('section')('+slide +bounce');
```
View
@@ -84,6 +84,8 @@ function classtweak(elements, initAction, scope) {
// update the element classname
element.className = activeClasses.join(' ');
} // for
+
+ return tweak;
} // tweak
// check the elements
@@ -100,5 +102,5 @@ function classtweak(elements, initAction, scope) {
} // if
// return the tweak
- return tweak;
+ return initAction ? classtweak : tweak;
} // classtweak
View
Oops, something went wrong.
View
@@ -20,6 +20,7 @@
<script src="specs/basic-multi.js"></script>
<script src="specs/queryselector.js"></script>
<script src="specs/alternate-syntax.js"></script>
+<script src="specs/chaining.js"></script>
<!-- run the tests -->
<script defer="true">
jasmine.getEnv().addReporter(new jasmine.TrivialReporter());
@@ -0,0 +1,34 @@
+describe('query selector tweaks', function() {
+ // get the first section by id
+ var ids = ['test', 'test2', 'test3'],
+ elements = [], ii;
+
+ // initialise the elements
+ for (ii = 0; ii < ids.length; ii++) {
+ elements[ii] = document.getElementById(ids[ii]);
+ } // for
+
+ beforeEach(function() {
+ for (ii = 0; ii < elements.length; ii++) {
+ elements[ii].className = '';
+ } // for
+ });
+
+ it('classtweak with actions can be chained', function() {
+ classtweak
+ ('#test', '+bounce')
+ ('#test2', '+bounce');
+
+ expect(elements[0].className).toEqual('bounce');
+ expect(elements[1].className).toEqual('bounce');
+ expect(elements[2].className).toEqual('');
+ });
+
+ it('a tweaker can be chained', function() {
+ classtweak('#test')('+bounce')('+slide');
+ expect(elements[0].className).toContain('bounce');
+ expect(elements[0].className).toContain('slide');
+ expect(elements[1].className).toEqual('');
+ expect(elements[2].className).toEqual('');
+ });
+});

0 comments on commit 21a4e30

Please sign in to comment.