Difference between revisions of "Code snippets"

From GreaseSpot Wiki
Jump to navigationJump to search
m
m (Redirected page to Category:Coding Tips)
 
Line 1: Line 1:
__TOC__
#REDIRECT [[:Category:Coding Tips]]
 
'''Note:''' Contents in the process of being migrated to separate pages within [[:Category:Coding Tips]].
 
 
== Make script accessible to Firebug ==
[[Useful_Tools_for_Script_Writers#FireBug|Firebug]]'s console is very useful but can't access functions in a script this can make debugging them tiresome. The following code will run the entire script in the page so you can mess about with it from Firebug.
 
function a() {return a.caller.toString().replace(/([\s\S]*?return;){2}([\s\S]*)}/,'$2')}
document.body.appendChild(document.createElement('script')).innerHTML=a();
return;
 
== Embed a function in the current page ==
 
function embedFunction(s) {
document.body.appendChild(document.createElement('script')).innerHTML=s.toString().replace(/([\s\S]*?return;){2}([\s\S]*)}/,'$2');
}
 
Example:
function helloWorld() { alert("hello world"); }
...
embedFunction(helloWorld);
varBody = document.getElementsByTagName("body")[0];
varBody.innerHTML = varBody.innerHTML+ '<a title="Click me" href="javascript:helloWorld();">Click for hello world</a>';
 
== Dump the properties of an object ==
 
This function will allow you to easily dump the properties of an object and their values to the firebug console, or anywhere else you like. I know it is long, but it also does nice formatting on the output, helping it to be readable
 
  /* dumpObj courtesy of Scott Van Vliet
  *
  *  http://weblogs.asp.net/skillet/archive/2006/03/23/440940.aspx
  * 
  *  usage:
  *  params: all are optional except obj
  *   
  *  obj        -> OBJECT    your object to dump
  *  name      -> STRING    the name of your object if you want it printed
  *  maxDepth  -> NUMBER    the maximum nested objects that will be dumped. Defaults to 0, because
  *                          it grows exponentially, so most of the time, it will be better and
  *                          easier to read if you just call dump on the child object manually.
  *  format    -> BOOLEAN  whether to format the output (default=1). Turn this of if you have to
  *                          HTML content from it, to keep the indent low.
  *  indent    ↓
  *  tabsize    ↓
  *  depth      ↓
  *  tabs      -> these are for internal communication when recursing.., if you plan on touching
  *                them, you shouldn't need documentation...lol
  * 
  *  The formatting works well only if viewed in a monospaced font. This means good in the firebug
  *  console, and probably bad in alert boxes, unless you set your chrome to use a monospace font...
  * 
  *  modifications by Naja Melan ( najamelan<AT>gmail )
  * 
  **/
 
  function dump( obj, name, maxDepth, format, indent, tabsize, depth, tabs )
  {
    if( typeof obj      == "undefined" ) return "dumpObj: No object was passed in!\n";
    if( typeof maxDepth == "undefined" ) maxDepth = 0;
    if( typeof name    == "undefined" ) name    = "<root object>";
    if( typeof format  == "undefined" ) format  = 1;
    if( typeof indent  == "undefined" ) indent  = "";
    if( typeof tabSize  == "undefined" ) tabSize  = 8;
    if( typeof depth    == "undefined" ) depth    = 0;
    if( typeof tabs    == "undefined" ) tabs    = "";
     
    if( typeof obj != "object" ) return obj;
 
    var child = null,
        output = [];
       
    output.push( indent + name + "\n" );
 
    if( format )
    {
      indent += "  ";
     
      var maxLength = 0;
      for( var item in obj )
        if( item.toString().length > maxLength ) maxLength = item.toString().length;
    }
   
    for( var item in obj )
    {
      try
      {
      child = obj[item];
      }
 
      catch (e)
      {
      child = "<Unable to Evaluate>";
      }
     
      if( format )
      {
        var numSp  = maxLength - item.toString().length + 1,
            tabs    = "";
 
        while( --numSp > 0 ) tabs += " ";
      }
     
      if( typeof child == "object" )
      {
        if( depth >= maxDepth )
          output.push(  indent + item + tabs + ": <object, max depth reached>\n" );
 
        else
        {
          try
          {
            var temp = dump( child, item, maxDepth, format, indent, tabsize, depth + 1, tabs );
          }
          catch( e )
          {
            output.push( indent + item + tabs + ": <object could not be iterated, Error name: '" +
                        e.name + "'. Error message: '" + e.message + "'>\n" );
            temp = null;
          }
       
          if( temp == indent + item + "\n" )
            output.push( indent + item + tabs + ": <object, only has built-in properties>\n" );
         
          else if( temp )
          {
            output.push( " \n" );
            output.push( temp );
            output.push( "\n------------------------------------------------------------------------<end of " +
                        item + ">---------------------------------------------- \n \n" );
          }
        }
        continue;
      }
 
      else
      {
        if( format )
        {
          var intro  = indent + item,
              length  = intro.length + numSp + 1,
              indent2 = "  ";
             
          while( --length > 0 ) indent2 += " ";
        }
       
        else
        {
          var intro  = indent + item,
              tabs    = indent2 = "";
        }
 
        output.push( intro + tabs + ": " +
          ( ( !format )? child : child.toString().replace( /({)\n  ( \[native code\])\n(})/,
            "$1$2 $3"  ).replace( /(\r\n|[\r\n]+|&lt;br ?\/?>)/gm, "$1" + indent2 + tabs ) ) + "\n" );
      }
    }
    return output.join( "" );
  }
 
== Force Links to Open in Another Window ==
 
Useful when you have altered the page in a custom way (i.e. via user input) and need to preserve the customized page without repainting form fields or customized nodes. This assumes only anchor links, not button or JavaScript induced links:
<pre> var anchorTags=document.links;
for (var i=anchorTags.length - 1; i >= 0;--i)
        anchorTags[i].target="_blank";
</pre>
 
== nextSibling function that skips whitespace ==
 
<pre>function nextSibling(startSib){
    var nextSib;
    if (!(nextSib=startSib.nextSibling))
        return false;
    while (nextSib.nodeType!=1)
        if (!(nextSib=nextSib.nextSibling))
            return false;
    return nextSib;
}</pre>
 
=== Example Usage ===
<pre>if (nextSib=nexSibling(element))
    alert(nextSib.textContent);</pre>
 
[[Category:Code snippets]]

Latest revision as of 14:09, 4 February 2010