2013-12-04 17:24:04 +00:00
define ( function ( ) {
"use strict" ;
/ *
2014-02-27 06:34:02 +00:00
Yes , you 're not supposed to extend native prototypes. But in Chrome OS, who cares? Nobody' s sharing your context . Why not paper over the cracks in the DOM ? This library extends elements to do the following :
2013-12-04 17:24:04 +00:00
2014-02-27 06:34:02 +00:00
- create a findAll ( ) method that returns an array , instead of a nodeList
- create a findUp ( ) method to work up through ancestors
2013-12-04 17:24:04 +00:00
- create remove ( ) and append ( ) that work the way you expect them to .
- alias event listener methods to the much shorter on ( ) and off ( )
- add a style method that handles prefixed CSS
2014-02-27 06:34:02 +00:00
- ensure that elements have a matches ( ) method
- provide convenience methods for the classList
2013-12-04 17:24:04 +00:00
* /
var el = Element . prototype ;
var doc = Document . prototype ;
var frag = DocumentFragment . prototype ;
var win = Window . prototype ;
2014-02-27 06:34:02 +00:00
//alias of querySelector and qSA
2013-12-04 17:24:04 +00:00
el . find = doc . find = frag . find = function ( selector ) {
return this . querySelector ( selector ) ;
} ;
el . findAll = doc . findAll = frag . findAll = function ( selector ) {
var a = [ ] ;
a . push . apply ( a , this . querySelectorAll ( selector ) ) ;
return a ;
} ;
2014-02-27 06:34:02 +00:00
//equivalent of $().closest()
2014-02-23 22:21:59 +00:00
el . findUp = function ( selector ) {
var target = this ;
while ( target && ! target . matches ( selector ) ) {
target = target . parentElement ;
}
return target ;
}
2013-12-04 17:24:04 +00:00
el . matches = el . matches || el . webkitMatchesSelector ;
el . remove = function ( ) {
this . parentElement . removeChild ( this ) ;
} ;
el . append = frag . append = function ( element ) {
if ( typeof element == "string" ) {
this . innerHTML += element ;
} else {
this . appendChild ( element ) ;
}
} ;
win . on = el . on = function ( type , listener ) {
this . addEventListener ( type , listener ) ;
return this ;
} ;
win . off = el . off = function ( type , listener ) {
this . removeEventListener ( type , listener ) ;
} ;
el . css = function ( style , one ) {
if ( typeof style === "string" ) {
var hash = { } ;
hash [ style ] = one ;
style = hash ;
}
for ( var key in style ) {
var val = style [ key ] ;
if ( key . indexOf ( "-" ) > 0 ) {
key . replace ( /-(\w)/g , function ( _ , match ) {
return match . toUpperCase ( ) ;
} ) ;
}
if ( ! ( key in this . style ) ) {
[ "webkit" , "moz" , "ms" ] . some ( function ( prefix ) {
var test = prefix + key [ 0 ] . toUpperCase ( ) + key . substr ( 1 ) ;
if ( test in this . style ) {
key = test ;
return true ;
}
} , this ) ;
}
this . style [ key ] = val ;
}
} ;
el . addClass = function ( name ) {
this . classList . add ( name ) ;
} ;
el . removeClass = function ( name ) {
this . classList . remove ( name ) ;
} ;
el . toggle = function ( name ) {
this . classList . toggle ( name ) ;
} ;
el . hasClass = function ( name ) {
return this . classList . contains ( name ) ;
}
} )