renemonroy · August 29, 2015 14:14 · May 5, 2013 · May 5, 2013 · Apr 15, 2013 · Apr 15, 2013
diff --git a/Log-portable.js b/Log-portable.js
@@ -7,8 +7,8 @@
 
   // Your code here...  log() away
 
-  /* jshint -W021 */
   function log () { 
+    /* jshint -W021 */
     if (window.console) {
 
       // Only run on the first time through - reset this function to the appropriate console.log helper
@@ -29,5 +29,5 @@
 
 // All at once (minified version): 
 
-/* jshint -W021 */
-function log(){if(window.console){if(Function.prototype.bind)log=Function.prototype.bind.call(console.log,console);else log=function(){Function.prototype.apply.call(console.log,console,arguments);};log.apply(this,arguments);}}
+
+function log(){/* jshint -W021 */if(window.console){if(Function.prototype.bind)log=Function.prototype.bind.call(console.log,console);else log=function(){Function.prototype.apply.call(console.log,console,arguments);};log.apply(this,arguments);}}
diff --git a/Log-portable.js b/Log-portable.js
@@ -7,6 +7,7 @@
 
   // Your code here...  log() away
 
+  /* jshint -W021 */
   function log () { 
     if (window.console) {
 
@@ -26,6 +27,7 @@
 
 })();
 
-/* All at once (minified version):
+// All at once (minified version): 
+
+/* jshint -W021 */
 function log(){if(window.console){if(Function.prototype.bind)log=Function.prototype.bind.call(console.log,console);else log=function(){Function.prototype.apply.call(console.log,console,arguments);};log.apply(this,arguments);}}
-*/
diff --git a/Test.js b/Test.js
@@ -1,3 +1,5 @@
+/* Log statements with `log` and `console.log` should appear the same, and show the correct line numbers */
+
 function Test() {}
 Test.prototype.extraMethod = function() { }
 Test.methodAttachedToFunction = function(withParam) { }
@@ -18,7 +20,8 @@ function logAllWithWrapper() {
   log(document.body.childNode);
 }
 
-function logAllWithNative() {console.log("A single string");
+function logAllWithNative() {
+  console.log("A single string");
   console.log(123);
   console.log(["An", "Array", "Of", "Strings"]);
   console.log("The %s jumped over %d tall buildings", "person", 100);

diff --git a/Test.js b/Test.js
@@ -2,33 +2,35 @@ function Test() {}
 Test.prototype.extraMethod = function() { }
 Test.methodAttachedToFunction = function(withParam) { }
 
-var expressions = [
-  ["A single string"],
-  [123],
-  [["An", "Array", "Of", "Strings"]],
-  ["The %s jumped over %d tall buildings", "person", 100],
-  ["The", "person", "jumped over ", 100, " tall buildings"],
-  ["The object %o is inspectable!", { person: { jumpedOver: [100, "tall buildings"]}}],
-  ['%cThis is red text on a green background', 'color:red; background-color:green'],
-  [{ an: "obj", withNested: { objects: { inside: "of", it: true }}}],
-  [Test, Test.methodAttachedToFunction],
-  [new Test()],
-  [document],
-  [document.body],
-  [document.body.childNodes]
-];
-
-
 function logAllWithWrapper() {
-  for (var i = 0; i < expressions.length; i++) {
-    log.apply(log, expressions[i]);
-  }
+  log("A single string");
+  log(123);
+  log(["An", "Array", "Of", "Strings"]);
+  log("The %s jumped over %d tall buildings", "person", 100);
+  log("The", "person", "jumped over ", 100, " tall buildings");
+  log("The object %o is inspectable!", { person: { jumpedOver: [100, "tall buildings"]}});
+  log('%cThis is red text on a green background', 'color:red; background-color:green');
+  log({ an: "obj", withNested: { objects: { inside: "of", it: true }}});
+  log(Test, Test.methodAttachedToFunction);
+  log(new Test());
+  log(document);
+  log(document.body);
+  log(document.body.childNode);
 }
 
-function logAllWithNative() {
-  for (var i = 0; i < expressions.length; i++) {
-    Function.prototype.apply.call(console.log, console, expressions[i]);
-  }
+function logAllWithNative() {console.log("A single string");
+  console.log(123);
+  console.log(["An", "Array", "Of", "Strings"]);
+  console.log("The %s jumped over %d tall buildings", "person", 100);
+  console.log("The", "person", "jumped over ", 100, " tall buildings");
+  console.log("The object %o is inspectable!", { person: { jumpedOver: [100, "tall buildings"]}});
+  console.log('%cThis is red text on a green background', 'color:red; background-color:green');
+  console.log({ an: "obj", withNested: { objects: { inside: "of", it: true }}});
+  console.log(Test, Test.methodAttachedToFunction);
+  console.log(new Test());
+  console.log(document);
+  console.log(document.body);
+  console.log(document.body.childNode);
 }
 
 log("\n-----------");

diff --git a/Log-portable.js b/Log-portable.js
@@ -27,7 +27,5 @@
 })();
 
 /* All at once (minified version):
-
-function log(){window.console&&(log=Function.prototype.bind?Function.prototype.bind.call(console.log,console):function(){Function.prototype.apply.call(console.log,console,arguments)},log.apply(this,arguments))};
-
+function log(){if(window.console){if(Function.prototype.bind)log=Function.prototype.bind.call(console.log,console);else log=function(){Function.prototype.apply.call(console.log,console,arguments);};log.apply(this,arguments);}}
 */
diff --git a/Log-portable.js b/Log-portable.js
@@ -24,4 +24,10 @@
     }
   }
 
-})();
+})();
+
+/* All at once (minified version):
+
+function log(){window.console&&(log=Function.prototype.bind?Function.prototype.bind.call(console.log,console):function(){Function.prototype.apply.call(console.log,console,arguments)},log.apply(this,arguments))};
+
+*/
diff --git a/LogJS.md → Log-.md b/LogJS.md → Log-.md
diff --git a/Log.md → LogJS.md b/Log.md → LogJS.md
diff --git a/Log-js.md → Log.md b/Log-js.md → Log.md
diff --git a/Log → Log-js.md b/Log → Log-js.md
diff --git a/Description.md → Log b/Description.md → Log
diff --git a/Log-full.js b/Log-full.js
@@ -1,4 +1,3 @@
-
 // Full version of `log` that:
 //  * Prevents errors on console methods when no console present.
 //  * Exposes a global 'log' function that preserves line numbering and formatting.

diff --git a/Log-full.js b/Log-full.js
@@ -1,4 +1,7 @@
-// Prevent errors on console methods when no console present and expose a global 'log' function.
+
+// Full version of `log` that:
+//  * Prevents errors on console methods when no console present.
+//  * Exposes a global 'log' function that preserves line numbering and formatting.
 (function () {
   var method;
   var noop = function () { };

diff --git a/Description.md b/Description.md
@@ -6,7 +6,7 @@ There are a lot of ways to do this, but many are lacking.  A common problem with
 
 This is an attempt to once and for all document the function that I pull in to new projects.  There are two different options:
 
-* **The full version**: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js), this will set all the `console` methods to an empty function if they don't exist and then create the handy log function.  *Put this snippet at the top of the rest of your scripts*.  It will need to be evaluated first thing to work.
+* **The full version**: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js).  Use this **if you are writing an application and want to create a window.log function**.   Additionally, this will set all the `console` methods to an empty function if they don't exist to prevent errors from accidental `console.log` calls left in your code.  Put this snippet at the top of the rest of your scripts - it will need to be evaluated first thing to work.
 * **The portable version**: Use this **if you want to use it inside a plugin** and/or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  `log` can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
 
 View a live demo here: http://jsfiddle.net/bgrins/MZWtG/
diff --git a/Description.md b/Description.md
@@ -4,11 +4,9 @@ Every time I start a new project, I want to pull in a `log` function that allows
 
 There are a lot of ways to do this, but many are lacking.  A common problem with wrapper functions is that the line number that shows up next to the log is the line number of the log function itself, not where `log` was invoked.  There are also times where the arguments get logged in a way that isn't quite the same as the native function.
 
-This is an attempt to once and for all document the function that I pull in to new projects.
-
-There are two different options
+This is an attempt to once and for all document the function that I pull in to new projects.  There are two different options:
 
 * **The full version**: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js), this will set all the `console` methods to an empty function if they don't exist and then create the handy log function.  *Put this snippet at the top of the rest of your scripts*.  It will need to be evaluated first thing to work.
-* **The portable version**: Use this *if you want to use it inside a plugin* or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  It can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
+* **The portable version**: Use this **if you want to use it inside a plugin** and/or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  `log` can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
 
 View a live demo here: http://jsfiddle.net/bgrins/MZWtG/
diff --git a/Log-portable.js b/Log-portable.js
@@ -1,4 +1,3 @@
-
 // Portable version of `log` that:
 //  * Doesn't expose log to the window.  
 //  * Allows log() to be called above the function declaration.

diff --git a/Test.js b/Test.js
@@ -1,4 +1,3 @@
-
 function Test() {}
 Test.prototype.extraMethod = function() { }
 Test.methodAttachedToFunction = function(withParam) { }

diff --git a/Description.md b/Description.md
@@ -8,7 +8,7 @@ This is an attempt to once and for all document the function that I pull in to n
 
 There are two different options
 
-* *The full version*: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js), this will set all the `console` methods to an empty function if they don't exist and then create the handy log function.  *Put this snippet at the top of the rest of your scripts*.  It will need to be evaluated first thing to work.
-* *The portable version*: Use this *if you want to use it inside a plugin* or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  It can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
+* **The full version**: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js), this will set all the `console` methods to an empty function if they don't exist and then create the handy log function.  *Put this snippet at the top of the rest of your scripts*.  It will need to be evaluated first thing to work.
+* **The portable version**: Use this *if you want to use it inside a plugin* or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  It can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
 
 View a live demo here: http://jsfiddle.net/bgrins/MZWtG/
diff --git a/Log-full.js b/Log-full.js
@@ -1,31 +1,32 @@
 // Prevent errors on console methods when no console present and expose a global 'log' function.
 (function () {
-    var method;
-    var noop = function () { };
-    var methods = [
-        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
-        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
-        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
-        'timeStamp', 'trace', 'warn'
-    ];
-    var length = methods.length;
-    var console = (window.console = window.console || {});
+  var method;
+  var noop = function () { };
+  var methods = [
+      'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
+      'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
+      'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
+      'timeStamp', 'trace', 'warn'
+  ];
+  var length = methods.length;
+  var console = (window.console = window.console || {});
 
-    while (length--) {
-        method = methods[length];
+  while (length--) {
+    method = methods[length];
 
-        // Only stub undefined methods.
-        if (!console[method]) {
-            console[method] = noop;
-        }
+    // Only stub undefined methods.
+    if (!console[method]) {
+        console[method] = noop;
     }
+  }
 
-    if (Function.prototype.bind) {
-        window.log = Function.prototype.bind.call(console.log, console);
-    }
-    else {
-        window.log = function() { 
-            Function.prototype.apply.call(console.log, console, arguments);
-        }
-    }
+
+  if (Function.prototype.bind) {
+    window.log = Function.prototype.bind.call(console.log, console);
+  }
+  else {
+    window.log = function() { 
+      Function.prototype.apply.call(console.log, console, arguments);
+    };
+  }
 })();
diff --git a/Log-portable.js b/Log-portable.js
@@ -1,3 +1,4 @@
+
 // Portable version of `log` that:
 //  * Doesn't expose log to the window.  
 //  * Allows log() to be called above the function declaration.
@@ -8,16 +9,16 @@
   // Your code here...  log() away
 
   function log () { 
-
     if (window.console) {
 
+      // Only run on the first time through - reset this function to the appropriate console.log helper
       if (Function.prototype.bind) {
           log = Function.prototype.bind.call(console.log, console);
       }
       else {
           log = function() { 
             Function.prototype.apply.call(console.log, console, arguments);
-          }
+          };
       }
 
       log.apply(this, arguments);

diff --git a/Test.js b/Test.js
@@ -1,3 +1,4 @@
+
 function Test() {}
 Test.prototype.extraMethod = function() { }
 Test.methodAttachedToFunction = function(withParam) { }

diff --git a/Description.md b/Description.md
@@ -1,5 +1,14 @@
-View a live demo: http://jsfiddle.net/bgrins/MZWtG/
+## Javascript `log` Function
 
-The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js
+Every time I start a new project, I want to pull in a `log` function that allows the same functionality as the `console.log`, including the full functionality of the [Console API](http://getfirebug.com/wiki/index.php/Console_API#console.log.28object.5B.2C_object.2C_....5D.29).
 
-Some of the test log statements are taken from here: http://getfirebug.com/wiki/index.php/Console_API#console.log.28object.5B.2C_object.2C_....5D.29
+There are a lot of ways to do this, but many are lacking.  A common problem with wrapper functions is that the line number that shows up next to the log is the line number of the log function itself, not where `log` was invoked.  There are also times where the arguments get logged in a way that isn't quite the same as the native function.
+
+This is an attempt to once and for all document the function that I pull in to new projects.
+
+There are two different options
+
+* *The full version*: Inspired by the [plugin in HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js), this will set all the `console` methods to an empty function if they don't exist and then create the handy log function.  *Put this snippet at the top of the rest of your scripts*.  It will need to be evaluated first thing to work.
+* *The portable version*: Use this *if you want to use it inside a plugin* or don't want to muck with the global namespace.  Just drop it at the bottom of your plugin and log away.  It can be called before the function declaration, and will not add anything to the window namespace or modify the console objects.
+
+View a live demo here: http://jsfiddle.net/bgrins/MZWtG/
diff --git a/_README.md → Description.md b/_README.md → Description.md
diff --git a/Log-portable → Log-portable.js b/Log-portable → Log-portable.js
@@ -1,4 +1,3 @@
-
 // Portable version of `log` that:
 //  * Doesn't expose log to the window.  
 //  * Allows log() to be called above the function declaration.

diff --git a/Log.js → Log-full.js b/Log.js → Log-full.js
diff --git a/Log-portable b/Log-portable
@@ -0,0 +1,28 @@
+
+// Portable version of `log` that:
+//  * Doesn't expose log to the window.  
+//  * Allows log() to be called above the function declaration.
+// Because of this, you can just throw it in the bottom of a plugin and it won't mess with global scope or clutter your code
+
+(function() {
+
+  // Your code here...  log() away
+
+  function log () { 
+
+    if (window.console) {
+
+      if (Function.prototype.bind) {
+          log = Function.prototype.bind.call(console.log, console);
+      }
+      else {
+          log = function() { 
+            Function.prototype.apply.call(console.log, console, arguments);
+          }
+      }
+
+      log.apply(this, arguments);
+    }
+  }
+
+})();
diff --git a/_README.md b/_README.md
@@ -1,4 +1,3 @@
-
 View a live demo: http://jsfiddle.net/bgrins/MZWtG/
 
 The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js

diff --git a/README.md → _README.md b/README.md → _README.md
@@ -1,4 +1,5 @@
 
+View a live demo: http://jsfiddle.net/bgrins/MZWtG/
 
 The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js
 

diff --git a/README.md b/README.md
@@ -0,0 +1,5 @@
+
+
+The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js
+
+Some of the test log statements are taken from here: http://getfirebug.com/wiki/index.php/Console_API#console.log.28object.5B.2C_object.2C_....5D.29
diff --git a/Test.js b/Test.js
@@ -1,13 +1,21 @@
 function Test() {}
 Test.prototype.extraMethod = function() { }
+Test.methodAttachedToFunction = function(withParam) { }
 
 var expressions = [
   ["A single string"],
   [123],
   [["An", "Array", "Of", "Strings"]],
+  ["The %s jumped over %d tall buildings", "person", 100],
+  ["The", "person", "jumped over ", 100, " tall buildings"],
+  ["The object %o is inspectable!", { person: { jumpedOver: [100, "tall buildings"]}}],
+  ['%cThis is red text on a green background', 'color:red; background-color:green'],
   [{ an: "obj", withNested: { objects: { inside: "of", it: true }}}],
-  [Test],
-  [new Test()]
+  [Test, Test.methodAttachedToFunction],
+  [new Test()],
+  [document],
+  [document.body],
+  [document.body.childNodes]
 ];
 
 

diff --git a/Log.js b/Log.js
@@ -25,7 +25,7 @@
     }
     else {
         window.log = function() { 
-            (typeof console.log === 'object' ? log.apply.call(console.log, console, arguments) : console.log.apply(console, arguments));
+            Function.prototype.apply.call(console.log, console, arguments);
         }
     }
 })();
diff --git a/Test.js b/Test.js
@@ -1,4 +1,3 @@
-
 function Test() {}
 Test.prototype.extraMethod = function() { }
 

diff --git a/Log.js b/Log.js
@@ -1,4 +1,3 @@
-
 // Prevent errors on console methods when no console present and expose a global 'log' function.
 (function () {
     var method;

diff --git a/Test.js b/Test.js
@@ -0,0 +1,35 @@
+
+function Test() {}
+Test.prototype.extraMethod = function() { }
+
+var expressions = [
+  ["A single string"],
+  [123],
+  [["An", "Array", "Of", "Strings"]],
+  [{ an: "obj", withNested: { objects: { inside: "of", it: true }}}],
+  [Test],
+  [new Test()]
+];
+
+
+function logAllWithWrapper() {
+  for (var i = 0; i < expressions.length; i++) {
+    log.apply(log, expressions[i]);
+  }
+}
+
+function logAllWithNative() {
+  for (var i = 0; i < expressions.length; i++) {
+    Function.prototype.apply.call(console.log, console, expressions[i]);
+  }
+}
+
+log("\n-----------");
+log("Logging all expressions with wrapper log function");
+log("-----------\n");
+logAllWithWrapper();
+
+log("\n-----------");
+log("Logging all expressions with native console.log function");
+log("-----------\n");
+logAllWithNative();
diff --git a/Log.js b/Log.js
@@ -0,0 +1,32 @@
+
+// Prevent errors on console methods when no console present and expose a global 'log' function.
+(function () {
+    var method;
+    var noop = function () { };
+    var methods = [
+        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
+        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
+        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
+        'timeStamp', 'trace', 'warn'
+    ];
+    var length = methods.length;
+    var console = (window.console = window.console || {});
+
+    while (length--) {
+        method = methods[length];
+
+        // Only stub undefined methods.
+        if (!console[method]) {
+            console[method] = noop;
+        }
+    }
+
+    if (Function.prototype.bind) {
+        window.log = Function.prototype.bind.call(console.log, console);
+    }
+    else {
+        window.log = function() { 
+            (typeof console.log === 'object' ? log.apply.call(console.log, console, arguments) : console.log.apply(console, arguments));
+        }
+    }
+})();
Original file line number	Diff line number	Diff line change
		@@ -1,4 +1,3 @@

		View a live demo: http://jsfiddle.net/bgrins/MZWtG/

		The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js
Original file line number	Diff line number	Diff line change
		@@ -1,4 +1,5 @@

		View a live demo: http://jsfiddle.net/bgrins/MZWtG/

		The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,5 @@


		The overriding console code is taken from: https://github.com/h5bp/html5-boilerplate/blob/master/js/plugins.js

		Some of the test log statements are taken from here: http://getfirebug.com/wiki/index.php/Console_API#console.log.28object.5B.2C_object.2C_....5D.29
Original file line number	Diff line number	Diff line change
		@@ -1,4 +1,3 @@

		function Test() {}
		Test.prototype.extraMethod = function() { }