I love developing with TextMate. I discovered it my Sr. year of college when I saw it in a now infamous video. Since then I’ve used it for all my coding projects and frankly other ide’s give me the jibblies. So today I’ll be showing how I’ve set up my environment with the Sproutcore TextMate bundle.

Getting the bundle

First you’ll need to clone the bundle from github into your /Users/*your-user-name*/Library/Application Support/TextMate/Bundles/ directory.

 git clone git://github.com/sproutit/sproutcore-tmbundle.git

Then you’ll need to rename the bundle so TextMate will pick it up.

  mv ./sproutcore-tmbundle ./sproutcore.tmbundle

Now in TextMate go to Bundles > Bundle Editor > Reload Bundles. Done.
There are a few nice built-in snippets but the best part is the built-in interface to jslint.

JSLint aka Validate Syntax

JSLint can be accessed through the validate syntax command, and there you go a nicely formatted JSLint results. If you want to tweak the specific settings check out /Users/*your-user-name*/Library/Application Support/TextMate/Bundles/sproutcore.tmbundle/Support/bin/prefs.js.
Here’s how I’ve tweaked mine.

  var JSLINT_PREFS = {
    adsafe: false,
    bitwise: true,
    browser: true,
    cap: false,
    debug: false,
    eqeqeq: true,
    evil: false,
    forin: false,
    fragment: false,
    laxbreak: false,
    nomen: true,
    on: false,
    passfail: false,
    plusplus: true,
    regexp: true,
    rhino: false,
    safe: false,
    sidebar: false,
    sub: false,
    undef: true,
    white: false,
    widget: false,
    indent: 2,
    predef: ['SC', 'require', 'sc_super', 'YES', 'NO','T_ARRAY', 'T_OBJECT', '$type', 'Ajax','static_url','Element','Event','YAHOO','Template']
  };

The most convenient thing you can do here is add any known global variables (like your project namespace) so JSLint doesn’t complain about every legitimate instance. If you want to know what each of the properties does check out the JSLint docs over on the official page.

Custom Snippets

Of course you can always extend the bundle, and this is a little custom snippet I wrote to make it easier to write state transition actions.

  ${1:function_name}: function() {
    var handled = NO;
 
    switch(this.state.${2:a}){
        case ${4:1}:
          $0
          handled = YES;
          break;
    }
    if(!handled) console.log('${1} Action not handled in state %@[%@]'.fmt('${2}',this.state.${2}));
  }${3:,}

Links

This hardly scratches the surface of what’s possible in TextMate and if your interested here are some links to get you started:
Project Plus adds some updates to the project drawer, not sure yet if I like this one.
ack in project a faster global find.
GetBundles A bundle manager(like apt-get). Install this one with:

    svn co http://svn.textmate.org/trunk/Review/Bundles/GetBundles.tmbundle/

jQuery bundle