behavior.js 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248
  1. define("dojo/behavior", ["./_base/kernel", "./_base/lang", "./_base/array", "./_base/connect", "./query", "./ready"], function(dojo, lang, darray, connect, query, ready) {
  2. // module:
  3. // dojo/behavior
  4. // summary:
  5. // TODOC
  6. dojo.behavior = new function(){
  7. // summary:
  8. // Utility for unobtrusive/progressive event binding, DOM traversal,
  9. // and manipulation.
  10. //
  11. // description:
  12. //
  13. // A very simple, lightweight mechanism for applying code to
  14. // existing documents, based around `dojo.query` (CSS3 selectors) for node selection,
  15. // and a simple two-command API: `dojo.behavior.add()` and `dojo.behavior.apply()`;
  16. //
  17. // Behaviors apply to a given page, and are registered following the syntax
  18. // options described by `dojo.behavior.add` to match nodes to actions, or "behaviors".
  19. //
  20. // Added behaviors are applied to the current DOM when .apply() is called,
  21. // matching only new nodes found since .apply() was last called.
  22. //
  23. function arrIn(obj, name){
  24. if(!obj[name]){ obj[name] = []; }
  25. return obj[name];
  26. }
  27. var _inc = 0;
  28. function forIn(obj, scope, func){
  29. var tmpObj = {};
  30. for(var x in obj){
  31. if(typeof tmpObj[x] == "undefined"){
  32. if(!func){
  33. scope(obj[x], x);
  34. }else{
  35. func.call(scope, obj[x], x);
  36. }
  37. }
  38. }
  39. }
  40. // FIXME: need a better test so we don't exclude nightly Safari's!
  41. this._behaviors = {};
  42. this.add = function(/* Object */behaviorObj){
  43. // summary:
  44. // Add the specified behavior to the list of behaviors, ignoring existing
  45. // matches.
  46. // behaviorObj: Object
  47. // The behavior object that will be added to behaviors list. The behaviors
  48. // in the list will be applied the next time apply() is called.
  49. // description:
  50. // Add the specified behavior to the list of behaviors which will
  51. // be applied the next time apply() is called. Calls to add() for
  52. // an already existing behavior do not replace the previous rules,
  53. // but are instead additive. New nodes which match the rule will
  54. // have all add()-ed behaviors applied to them when matched.
  55. //
  56. // The "found" method is a generalized handler that's called as soon
  57. // as the node matches the selector. Rules for values that follow also
  58. // apply to the "found" key.
  59. //
  60. // The "on*" handlers are attached with `dojo.connect()`, using the
  61. // matching node
  62. //
  63. // If the value corresponding to the ID key is a function and not a
  64. // list, it's treated as though it was the value of "found".
  65. //
  66. // dojo.behavior.add() can be called any number of times before
  67. // the DOM is ready. `dojo.behavior.apply()` is called automatically
  68. // by `dojo.addOnLoad`, though can be called to re-apply previously added
  69. // behaviors anytime the DOM changes.
  70. //
  71. // There are a variety of formats permitted in the behaviorObject
  72. //
  73. // example:
  74. // Simple list of properties. "found" is special. "Found" is assumed if
  75. // no property object for a given selector, and property is a function.
  76. //
  77. // | dojo.behavior.add({
  78. // | "#id": {
  79. // | "found": function(element){
  80. // | // node match found
  81. // | },
  82. // | "onclick": function(evt){
  83. // | // register onclick handler for found node
  84. // | }
  85. // | },
  86. // | "#otherid": function(element){
  87. // | // assumes "found" with this syntax
  88. // | }
  89. // | });
  90. //
  91. // example:
  92. // If property is a string, a dojo.publish will be issued on the channel:
  93. //
  94. // | dojo.behavior.add({
  95. // | // dojo.publish() whenever class="noclick" found on anchors
  96. // | "a.noclick": "/got/newAnchor",
  97. // | "div.wrapper": {
  98. // | "onclick": "/node/wasClicked"
  99. // | }
  100. // | });
  101. // | dojo.subscribe("/got/newAnchor", function(node){
  102. // | // handle node finding when dojo.behavior.apply() is called,
  103. // | // provided a newly matched node is found.
  104. // | });
  105. //
  106. // example:
  107. // Scoping can be accomplished by passing an object as a property to
  108. // a connection handle (on*):
  109. //
  110. // | dojo.behavior.add({
  111. // | "#id": {
  112. // | // like calling dojo.hitch(foo,"bar"). execute foo.bar() in scope of foo
  113. // | "onmouseenter": { targetObj: foo, targetFunc: "bar" },
  114. // | "onmouseleave": { targetObj: foo, targetFunc: "baz" }
  115. // | }
  116. // | });
  117. //
  118. // example:
  119. // Bahaviors match on CSS3 Selectors, powered by dojo.query. Example selectors:
  120. //
  121. // | dojo.behavior.add({
  122. // | // match all direct descendants
  123. // | "#id4 > *": function(element){
  124. // | // ...
  125. // | },
  126. // |
  127. // | // match the first child node that's an element
  128. // | "#id4 > :first-child": { ... },
  129. // |
  130. // | // match the last child node that's an element
  131. // | "#id4 > :last-child": { ... },
  132. // |
  133. // | // all elements of type tagname
  134. // | "tagname": {
  135. // | // ...
  136. // | },
  137. // |
  138. // | "tagname1 tagname2 tagname3": {
  139. // | // ...
  140. // | },
  141. // |
  142. // | ".classname": {
  143. // | // ...
  144. // | },
  145. // |
  146. // | "tagname.classname": {
  147. // | // ...
  148. // | }
  149. // | });
  150. //
  151. forIn(behaviorObj, this, function(behavior, name){
  152. var tBehavior = arrIn(this._behaviors, name);
  153. if(typeof tBehavior["id"] != "number"){
  154. tBehavior.id = _inc++;
  155. }
  156. var cversion = [];
  157. tBehavior.push(cversion);
  158. if((lang.isString(behavior))||(lang.isFunction(behavior))){
  159. behavior = { found: behavior };
  160. }
  161. forIn(behavior, function(rule, ruleName){
  162. arrIn(cversion, ruleName).push(rule);
  163. });
  164. });
  165. };
  166. var _applyToNode = function(node, action, ruleSetName){
  167. if(lang.isString(action)){
  168. if(ruleSetName == "found"){
  169. connect.publish(action, [ node ]);
  170. }else{
  171. connect.connect(node, ruleSetName, function(){
  172. connect.publish(action, arguments);
  173. });
  174. }
  175. }else if(lang.isFunction(action)){
  176. if(ruleSetName == "found"){
  177. action(node);
  178. }else{
  179. connect.connect(node, ruleSetName, action);
  180. }
  181. }
  182. };
  183. this.apply = function(){
  184. // summary:
  185. // Applies all currently registered behaviors to the document.
  186. //
  187. // description:
  188. // Applies all currently registered behaviors to the document,
  189. // taking care to ensure that only incremental updates are made
  190. // since the last time add() or apply() were called.
  191. //
  192. // If new matching nodes have been added, all rules in a behavior will be
  193. // applied to that node. For previously matched nodes, only
  194. // behaviors which have been added since the last call to apply()
  195. // will be added to the nodes.
  196. //
  197. // apply() is called once automatically by `dojo.addOnLoad`, so
  198. // registering behaviors with `dojo.behavior.add` before the DOM is
  199. // ready is acceptable, provided the dojo.behavior module is ready.
  200. //
  201. // Calling appy() manually after manipulating the DOM is required
  202. // to rescan the DOM and apply newly .add()ed behaviors, or to match
  203. // nodes that match existing behaviors when those nodes are added to
  204. // the DOM.
  205. //
  206. forIn(this._behaviors, function(tBehavior, id){
  207. query(id).forEach(
  208. function(elem){
  209. var runFrom = 0;
  210. var bid = "_dj_behavior_"+tBehavior.id;
  211. if(typeof elem[bid] == "number"){
  212. runFrom = elem[bid];
  213. if(runFrom == (tBehavior.length)){
  214. return;
  215. }
  216. }
  217. // run through the versions, applying newer rules at each step
  218. for(var x=runFrom, tver; tver = tBehavior[x]; x++){
  219. forIn(tver, function(ruleSet, ruleSetName){
  220. if(lang.isArray(ruleSet)){
  221. darray.forEach(ruleSet, function(action){
  222. _applyToNode(elem, action, ruleSetName);
  223. });
  224. }
  225. });
  226. }
  227. // ensure that re-application only adds new rules to the node
  228. elem[bid] = tBehavior.length;
  229. }
  230. );
  231. });
  232. };
  233. };
  234. ready(dojo.behavior, "apply"); // FIXME: should this use a priority? before/after parser priority?
  235. return dojo.behavior;
  236. });