[Jifty-commit] jifty branch, master, updated. 9e072ae08af1d44a2697e42e9aabdc2308c491b1

Jifty commits jifty-commit at lists.jifty.org
Thu Jan 14 17:42:31 EST 2010


The branch, master has been updated
       via  9e072ae08af1d44a2697e42e9aabdc2308c491b1 (commit)
      from  4f64d90ea93136029b947da74e487dd73540f646 (commit)

Summary of changes:
 share/web/static/js/app_behaviour.js |   60 +++++++++++++++++++--------------
 1 files changed, 34 insertions(+), 26 deletions(-)

- Log -----------------------------------------------------------------
commit 9e072ae08af1d44a2697e42e9aabdc2308c491b1
Author: Thomas Sibley <trs at bestpractical.com>
Date:   Thu Jan 14 17:41:30 2010 -0500

    Update app behaviour doc

diff --git a/share/web/static/js/app_behaviour.js b/share/web/static/js/app_behaviour.js
index 4511ab5..c7ef6c7 100644
--- a/share/web/static/js/app_behaviour.js
+++ b/share/web/static/js/app_behaviour.js
@@ -1,18 +1,15 @@
 /*
 
   This file is intended for you to add application-specific Javascript
-  behaviours. See http://bennolan.com/behaviour/ for an introduction
-  to the Behaviour library.
-
-  Behaviour lets you apply javascript to elements of the DOM using CSS
-  selectors. A simple example:
+  behaviours. Behaviour lets you apply javascript to elements of the DOM using
+  CSS selectors. A simple example:
 
   var myrules = {
       "h2.rounded": function(element) {
-  	Rico.Corner.round(element);
+          doRounding(element);
       }
   };
-          
+  
   Behaviour.register(myrules);
 
   In general, you'll rarely if ever have to worry about calling
@@ -23,12 +20,12 @@
   Some Notes About Writing Behaviours
   ===================================
 
-  * Jifty's Behaviour.js uses the cssQuery[1] library to do our DOM
-    lookups by CSS selector. cssQuery is very powerful, but can be
-    slow as DOM size grows. For best performance, follow these
+  * Jifty's Behaviour.js uses the jQuery[1] library to do our DOM
+    lookups by CSS selector. jQuery is very powerful, but can be
+    slower as the DOM size grows. For best performance, follow these
     guidelines when writing behaviours, whenever possible:
 
-    * Prefer selectors that begin with '#id'. cssQuery will use
+    * Prefer selectors that begin with '#id'. jQuery will use
       document.getElementByID to get the ID in question, meaning we
       only have to search a small fragment of the DOM by hand
 
@@ -37,7 +34,7 @@
       specifically using DOM calls, again hugely reducing the amount
       of DOM walking we have to do. 
 
-    [1] http://dean.edwards.name/my/cssQuery/
+    [1] http://jquery.com
 
 
   * Behaviour has something of a reputation for leaking memory. The
@@ -47,8 +44,8 @@
     Behaviour.register({
         'a.help': function(e) {
             e.onclick = function() {
-        	openInHelpWindow(this);
-        	return false;
+                openInHelpWindow(this);
+                return false;
             }
         }
     });
@@ -57,7 +54,18 @@
     garbage collection (See the footnote for details). To avoid this,
     you can use one of the following two idioms:
 
-    (a) declare the onclick function elsewhere:
+    (a) Use jQuery to bind events like onclick:
+
+    Behaviour.register({
+        'a.help': function(e) {
+            jQuery(e).click(function() {
+                openInHelpWindow(this);
+                return false;
+            });
+        }
+    });
+
+    (b) Declare the onclick function elsewhere:
 
     function openHelpLink() {
         openInHelpWindow(this);
@@ -70,15 +78,15 @@
         }
     });
 
-    (b) Set the element to 'null' at the end of the Behaviour function:
+    (c) Set the element to 'null' at the end of the Behaviour function:
 
     Behaviour.register({
         'a.help': function(e) {
             e.onclick = function() {
-        	openInHelpWindow(this);
-        	return false;
+                openInHelpWindow(this);
+                return false;
             }
-	    e = null;
+            e = null;
         }
     });
 
@@ -94,7 +102,7 @@
     ``Behaviour profile'' link at the bottom left hand corner of the
     screen. Click it to get a breakdown of how much time your
     javascript is spending in which behaviours, and whether the time
-    is spent in looking up the CSS Selector you passed (cssQuery
+    is spent in looking up the CSS Selector you passed (jQuery
     time), or in applying the Behaviour function (function time).
     
 
@@ -106,10 +114,10 @@
     write this code:
 
     Behaviour.register({
-        'a.help': function(e) {		// <-- FUNCTION A
-            e.onclick = function() {	// <-- FUNCTION B 
-        	openInHelpWindow(this);
-        	return false;
+        'a.help': function(e) {         // <-- FUNCTION A
+            e.onclick = function() {    // <-- FUNCTION B
+                openInHelpWindow(this);
+                return false;
             }
         }
     });
@@ -121,8 +129,8 @@
     `onclick' property, and this a circular chain of references is
     created, which IE will never garbage collect.
 
-    Solution (a) addresses this by moving function `b' outside of the
-    scope where `e' is defined. Solution (b) addresses it by setting
+    Solution (b) addresses this by moving function `b' outside of the
+    scope where `e' is defined. Solution (c) addresses it by setting
     `e' to null in the environment around `b', which means that that
     environment no longer contains a reference to that DOM node, and
     the loop no longer exists.

-----------------------------------------------------------------------


More information about the Jifty-commit mailing list