Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/bhauman/unabjah

Simply Unobtrusive Javascript
https://github.com/bhauman/unabjah

Last synced: 7 days ago
JSON representation

Simply Unobtrusive Javascript

Awesome Lists containing this project

README 

        
= UnabJah.js - Simply Unobtrusive Javascript



Finally unobtrusive javascript the simple way.



Like LowPro this library will map selectors to functions. The selectors will 

select elements in the DOM and will process the matched elements with the associated

function.



Whats cool about this library is that it will reapply those rules only to the elements that haven't

had them applied to already. The is a Ajax hook that automatically reaplies the rules but again

ONLY to those elements on the page that haven't gotten the rules applied.



You can also explicitly reapply the rules when you need to, for instance to create a Jquery Ajax 

Request completion hook.



The library is tested with jspec.



=== Using Unabjah



Prototype 1.6 is required to use UnabJah.



  

  <script type="text/javascript" src="/javascripts/unabjah.js">



=== Creating Rules



Unabjah simply maps CSS selectors to functions that take the matched elements. For example:



  <script>

    var unabjah = new UnabJah({

      'li' : function(element){ element.addClassName('unabja_put_me_here'); },

      'div': function(element){ element.addClassName('unabja_put_me_here_too'); }

    })

  



That code will apply the function to every 'li' element on the page.  



You can also add/overide rules at a later time.

  

  unabjah.add_rules({'.horse_play': function(el){ el.addClassName('highlight'); }});



=== Behavior



The selectors are effectively hash keys. There can only be one function per selector.



    var unabjah = new Unabjah({

      'li' : function(element){ element.addClassName('unabja_put_me_here') },

      'li' : function(element){  element.addClassName('sorry_i_am_the_only_one_who_shows_up') }

    })



Only the second rule will be executed on the 'li' elements.  



IMPORTANT: It will do this on 'dom:loaded' automaticly.  Don't wrap the above

code in function that is waiting for the dom to load or nothing will happen.



Now if you make an Ajax request the above code will cause any new 'li' elements on the page

to be passed to the function on the completeion of the Ajax Request. So they will get the 'unabja_put_me_here' class as well.



If you find that you need to reapply the rules explicitly that you would:



  unabjah.apply_rules();



You can also pass an element to this call to restrict the reapplication area.  For performance?



  unabjah.apply_rules($$('.newstuff')[0]);



Only elements below .newstuff will have the rules reapplied to.



=== Philosophy



I just wanted a slim tested library that doesn't place any strange hacks into 

my namespace.  It's straight up Prototype 1.6 and it should stay fairly compatible 

with Prototype for a good while.  



===  Testing



Unabjah is fairly well tested with Jspec. Look at the tests in the unabja.spec.js file to learn more about usage.  To run the tests simply open spec.html in your browser of choice.



If you want to submit some nasty changes it would be nice to see some of dem tests yah mahn????



== License



(The MIT License)



Copyright (c) 2009 Your Name 



Permission is hereby granted, free of charge, to any person obtaining

a copy of this software and associated documentation files (the

'Software'), to deal in the Software without restriction, including

without limitation the rights to use, copy, modify, merge, publish,

distribute, sublicense, and/or sell copies of the Software, and to

permit persons to whom the Software is furnished to do so, subject to

the following conditions:



The above copyright notice and this permission notice shall be

included in all copies or substantial portions of the Software.



THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,

EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF

MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.

IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY

CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,

TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE

SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.