--- ../PATCHS/js-standards-current.txt	2013-03-28 12:28:48.697476272 +0100
+++ ../PATCHS/js-standards.txt	2013-03-28 12:24:42.129478625 +0100
@@ -1,5 +1,43 @@
-<h2>Indenting</h2>
-Use an indent of 2 spaces, with no tabs.  No trailing whitespace.
+
+<ul>
+<li>JavaScript is case-sensitive,</li>
+<li>use an indent of 2 spaces,</li>
+<li>no trailing whitespace,</li>
+<li>use JSHint to check most of the rules.</li>
+</ul>
+
+<h2 id="strict">Strict mode</h2>
+All scripts should be using the strict mode by adding <code>"use strict";</code> at the top of the closure.
+
+<code>
+(function ($, Drupal, _) {
+
+  "use strict";
+  
+  // Rest of the code.
+
+})(jQuery, Drupal, _);
+</code>
+
+
+<h2 id="variables">Variable declaration</h2>
+It is not recommended not to mix assignment and no-assignment variables under a single var statement. Additionally, it is preferred to use multiple var statements in combination with new-lines to avoid having variables accidentally leak into the global scope.
+
+<code>
+// confusing
+var foo = 'bar', x, y, meh = 'bla';
+
+// error-prone
+var foo = 'bar',
+    x,
+    y,
+    meh = 'bla';
+
+// Recomended
+var x, y;
+var foo = 'bar';
+var meh = 'bla';
+</code>
 
 
 <h2 id="concatenation">String Concatenation</h2>
@@ -21,10 +59,13 @@
 
 
 <h2 id="camelcasing">CamelCasing</h2>
-Unlike the variables and functions defined in Drupal's PHP, multi-word variables and functions in JavaScript should be lowerCamelCased.  The first letter of each variable or function should be lowercase, while the first letter of subsequent words should be capitalized.  There should be no underscores between the words.
+Multi-word variables and functions in JavaScript should be lowerCamelCased. The first letter of each variable or function should be lowercase, while the first letter of subsequent words should be capitalized. There should be no underscores between the words. 
+
+Constructors should start with a capital letter. 
+
 
 <h2 id="semicolins">Semi-colons</h2>
-JavaScript allows any expression to be used as a statement and uses semi-colons to mark the end of a statement. However, it attempts to make this optional with "semi-colon insertion", which can mask some errors and will also cause JS aggregation to fail.  All statements should be followed by <code>;</code> except for the following:
+JavaScript allows any expression to be used as a statement and uses semi-colons to mark the end of a statement. However, it attempts to make this optional with "semi-colon insertion", which can mask some errors and will also cause JS aggregation to fail. All statements should be followed by <code>;</code> except for the following:
 
 <code>for, function, if, switch, try, while</code>
 
@@ -46,7 +87,8 @@
 
 In addition the <code>return</code> value expression must start on the same line as the return keyword in order to avoid semi-colon insertion.
 
-If the "Optimize JavaScript files" performance option in Drupal 6 is enabled, and there are missing semi-colons, then the JS aggregation will fail.  It is therefore very important that semi-colons are used.
+If the "Optimize JavaScript files" performance option in Drupal 6 is enabled, and there are missing semi-colons, then the JS aggregation will fail. It is therefore very important that semi-colons are used.
+
 
 <h2 id="structures">Control Structures</h2>
 These include <code>if, for, while, switch</code>, etc. Here is an example <code>if</code> statement, since it is the most complicated of them:
@@ -66,6 +108,7 @@
 
 You are strongly encouraged to always use curly braces even in situations where they are technically optional. Having them increases readability and decreases the likelihood of logic errors being introduced when new lines are added.
 
+
 <h3 id="switch">switch</h3>
 For <code>switch</code> statements:
 <code>
@@ -100,15 +143,17 @@
 <h3 id="forin">for in</h3>
 The <code>for in</code> statement allows for looping through the names of all of the properties of an object. Unfortunately, all of the members which were inherited through the prototype chain will also be included in the loop. This has the disadvantage of serving up method functions when the interest is in data members. To prevent this, the body of every <code>for in</code> statement should be wrapped in an <code>if</code> statement that does filtering. It can select for a particular type or range of values, or it can exclude functions, or it can exclude properties from the prototype. For example:
 <code>
-for (var variable in object) if (filter) {
-  // Statements...
+for (var variable in object) {
+  if (filter) {
+    // Statements...
+  }
 }
 </code>
 
 You can use the <code>hasOwnProperty</code> method to distinguish the true members of the object (but always put it inside the loop, not on the same line:
 <code>
-for (var variable in object) {
-  if (object.hasOwnProperty(variable))
+for (var index in object) {
+  if (object.hasOwnProperty(index)) {
     // Statements...
   }
 }
@@ -123,7 +168,7 @@
 
 <h2 id="functions">Functions</h2>
 
-<h3>Function and method names</h3>
+<h3 id="funcname">Function and method names</h3>
 <code>
 Drupal.behaviors.tableDrag = function (context) {
   for (var base in Drupal.settings.tableDrag) {
@@ -149,15 +194,14 @@
   ...
 };
 
-function funStuff(field, settings) {
+function funStuff (field, settings) {
   settings = settings || Drupal.settings;
   alert("This JS file does fun message popups.");
   return field;
 }
 </code>
 <ul>
-<li>There should be no space between the function name and the following left parenthesis.</li>
-<li>Exception: If a function literal is anonymous, there should be a single space between the word "function" and the left parenthesis "(". Otherwise, it can appear that the function's name is actually "function".</li>
+<li>There is always a space between the function declaration and the following left parenthesis.</li>
 <li>Define optional arguments (using default values) at the end of the function signature.</li>
 <li>Always attempt to return a meaningful value from a function if one is appropriate.</li>
 </ul>
@@ -169,16 +213,12 @@
 <code>
 foobar = foo(bar, baz, quux);
 </code>
-As displayed above, there should be one space on either side of an equals sign used to assign the return value of a function to a variable. In the case of a block of related assignments, more space may be inserted to promote readability:
-<code>
-short        = foo(bar);
-longVariable = foo(baz);
-</code>
+
 
 <h2 id="variablesandarrays">Variables and Arrays</h2>
 All variables should be declared with <code>var</code> before they are used and should only be declared once. Doing this makes the program easier to read and makes it easier to detect undeclared variables that may become implied globals.
 
-Variables should not be defined in the global scope; try to define them in a local function scope at all costs.  All variables should be declared at the beginning of a function.
+Variables should never be defined in the global scope; try to define them in a local function scope at all costs.  All variables should be declared at the beginning of a function.
 
 
 <h3 id="constantsandvariables">Constants and Global Variables</h3>
@@ -193,7 +233,7 @@
 
 This variable would then be referenced:
 <code>
-Drupal.settings.myModule.basePath;
+drupalSettings.myModule.basePath;
 </code>
 
 
@@ -211,7 +251,7 @@
 <h2 id="comments">Comments</h2>
 Inline documentation for source files should follow the <a href="http://drupal.org/node/1354">Doxygen formatting conventions</a>.
 
-Non-documentation comments are strongly encouraged.  A general rule of thumb is that if you look at a section of code and think "Wow, I don't want to try and describe that", you need to comment it before you forget how it works.  Comments can be removed by JS compression utilities later, so they don't negatively impact on the file download size.
+Non-documentation comments are strongly encouraged. A general rule of thumb is that if you look at a section of code and think "Wow, I don't want to try and describe that", you need to comment it before you forget how it works. Comments can be removed by JS compression utilities later, so they don't negatively impact on the file download size.
 
 Non-documentation comments should use capitalized sentences with punctuation. All caps are used in comments only when referencing constants, e.g., TRUE. Comments should be on a separate line immediately before the code line or block they reference. For example:
 <code>
@@ -226,23 +266,10 @@
 
 
 <h2 id="with">"with" statement</h2>
-The <code>with</code> statement was intended to provide a shorthand for accessing members in deeply nested objects. For example, it is possible to use the following shorthand (but not recommended) to access <code>foo.bar.foobar.abc</code>, etc:
-<code>
-with (foo.bar.foobar) {
-  var abc = true;
-  var xyz = true;
-}
-</code>
 
-However it's impossible to know by looking at the above code which <code>abc</code> and <code>xyz</code> will get modified. Does <code>foo.bar.foobar</code> get modified? Or is it the global variables <code>abc</code> and <code>xyz</code>?
+Do not use the <code>with</code> statement.
 
-Instead you should use the explicit longer version:
-<code>
-foo.bar.foobar.abc = true;
-foo.bar.foobar.xyz = true;
-</code>
-
-or if you really want to use a shorthand, use the following alternative method: 
+Instead you should use the explicit version:
 <code>
   var o = foo.bar.foobar;
   o.abc = true;
@@ -252,6 +279,8 @@
 
 <h2 id="operators">Operators</h2>
 <h3 id="truefalse">True or false comparisons</h3>
+Always use strict comparaison using <code>===</code> and <code>!==</code>.
+
 The <code>==</code> and <code>!=</code> operators do type coercion before comparing. This is bad because it causes:
 <code>' \t\r\n' == 0</code>
 to be true. This can mask type errors. When comparing to any of the following values, use the <code>===</code> or <code>!==</code> operators, which do not do type coercion:
@@ -301,30 +330,60 @@
 <h2 id="typeof">Typeof</h2>
 When using a <code>typeof</code> check, don't use the parenthesis for the typeof. The following is the correct coding standard:
 <code>
-if (typeof myVariable == 'string') {
+if (typeof myVariable === 'string') {
   // ...
 }
 </code>
 
-<h2 id="createElement">Modifying the DOM</h2>
-When adding new HTML elements to the DOM, don't use <code>document.createElement()</code>.  For cross-browser compatibility reasons and also in an effort to reduce file size, you should use the jQuery equivalent.
-
-Don't:
-<code>
-this.popup = document.createElement('div');
-this.popup.id = 'autocomplete';
-</code>
-Do:
-<code>
-this.popup = $('<div id="autocomplete"></div>')[0];
-</code>
 
 <h2 id="drupal6">Drupal 6 (and later) Specific Stuff</h2>
 
 Drupal 6 saw the introduction of JavaScript theming and translation of JavaScript files.
 
 <h3 id="theming">Theming</h3>
-There is a theming mechanism for JavaScript code. Any modules containing JavaScript which produces HTML content must now provide default theme functions in the Drupal.theme.prototype namespace.
+There is a theming mechanism for JavaScript code. Any modules containing JavaScript which produces HTML content must now provide default theme functions in the <code>Drupal.theme</code> namespace.
 
 <h3 id="translation">String Translation</h3>
 All strings in JavaScript files should be wrapped in <code>Drupal.t()</code> which is an equivalent of the well-known <a href="http://api.drupal.org/t"><code>t()</code></a> function. Likewise, there is also an equivalent to <a href="http://api.drupal.org/format_plural"><code>format_plural()</code></a>, named <code>Drupal.formatPlural()</code>. The parameter order is exactly like their server-side counterparts.
+
+
+<h2 id="closure">File closure</h2>
+All js files should have a closure to avoid adding variables to the global namespace. The parameter of the closure correspond to the dependencies needed for the script to work. If a script declare jQuery, Drupal, drupalSettings and underscore as dependencies in <code>hook_library_info()</code> as so:
+
+<code><?php
+mymodule_library_info() {
+  $libraries['myscript'] = array(
+    'js' => array(
+      'myjsfile.js' => array(),
+    ),
+    'dependencies' => array(
+      array('system', 'jquery'),
+      array('system', 'drupal'),
+      array('system', 'drupalSettings'),
+      array('system', 'underscore'),
+      // The following dependencies do not declare a global
+      // object but adds to the jQuery or Drupal object.
+      // They will not be present in the closure declaration.
+      array('system', 'jquery.once'),
+      array('system', 'drupal.ajax'),
+    ),
+  );
+  
+  return $libraries;
+}
+?></code>
+
+
+Then the js file should contain the following closure declaration:
+
+<code>
+(function ($, Drupal, drupalSettings, _) {
+  
+  "use strict";
+  
+  
+})(jQuery, Drupal, drupalSettings, _);
+</code>
+
+When this script will be minified it will help replace all the global variables by short names inside the closure.
+