Namespace Preferences Added to the YUI Bundle

Monday, March 5th, 2007 at 20:36 Monday, March 5th, 2007 at 20:36

The YUI bundle for TextMate has been updated for the 2.2.0 release, with support added for the DataTable, Button, History, Element, and DataSource libraries. The most interesting thing about this update, though, is the support for using your own variables in place of the long YAHOO.util.foo style namespaces. To edit these, go to the Bundle Editor and select Namespace Preferences under the JavaScript YUI bundle. You should see something like this:

  1. {shellVariables = (
  2. {name = 'BUILD';
  3. value = '2.2.0';
  4. },
  5. {name = 'YUI_LANG';
  6. value = 'YAHOO.lang';
  7. },
  8. {name = 'YUI_DOM';
  9. value = 'YAHOO.util.Dom';
  10. },
  11. {name = 'YUI_EVENT';
  12. value = 'YAHOO.util.Event;
  13. },
  14. {name = 'YUI_CONNECT';
  15. value = 'YAHOO.util.Connect';
  16. },
  17. {name = 'YUI_ANIM';
  18. value = 'YAHOO.util.Anim';
  19. },
  20. );
  21. }
{	shellVariables = (
		{	name = 'BUILD';
			value = '2.2.0';
		},
		{	name = 'YUI_LANG';
			value = 'YAHOO.lang';
		},
		{	name = 'YUI_DOM';
			value = 'YAHOO.util.Dom';
		},
		{	name = 'YUI_EVENT';
			value = 'YAHOO.util.Event;
		},
		{	name = 'YUI_CONNECT';
			value = 'YAHOO.util.Connect';
		},
		{	name = 'YUI_ANIM';
			value = 'YAHOO.util.Anim';
		},
	);
}

You can replace any of those with whatever variable you prefer to use. I usually set them to two or three letter abbreviations of the full namespace:

  1. {shellVariables = (
  2. {name = 'BUILD';
  3. value = '2.2.0';
  4. },
  5. {name = 'YUI_LANG';
  6. value = 'YL';
  7. },
  8. {name = 'YUI_DOM';
  9. value = 'YD';
  10. },
  11. {name = 'YUI_EVENT';
  12. value = 'YE';
  13. },
  14. {name = 'YUI_CONNECT';
  15. value = 'YC';
  16. },
  17. {name = 'YUI_ANIM';
  18. value = 'YA';
  19. },
  20. );
  21. }
{	shellVariables = (
		{	name = 'BUILD';
			value = '2.2.0';
		},
		{	name = 'YUI_LANG';
			value = 'YL';
		},
		{	name = 'YUI_DOM';
			value = 'YD';
		},
		{	name = 'YUI_EVENT';
			value = 'YE';
		},
		{	name = 'YUI_CONNECT';
			value = 'YC';
		},
		{	name = 'YUI_ANIM';
			value = 'YA';
		},
	);
}

Now anytime you use one of the snippets (for instance, type gettab), you will see YD.get() instead of YAHOO.util.Dom.get(). Every single library has support for this, so if you want to use a namespace for a library not listed in the preferences, you can simply add it yourself. Code in the form of ${YUI_FOO:...} in any of the snippets means that the variable YUI_FOO can be added to the preference file. You can output all of your new variables by typing nametab. You should see something like this:

  1. var YL = YAHOO.lang;
  2. var YD = YAHOO.util.Dom;
  3. var YE = YAHOO.util.Event;
  4. var YC = YAHOO.util.Connect;
  5. var YA = YAHOO.util.Anim;
var YL = YAHOO.lang;
var YD = YAHOO.util.Dom;
var YE = YAHOO.util.Event;
var YC = YAHOO.util.Connect;
var YA = YAHOO.util.Anim;

Add this to the top of your code and you're all set. As always, you can use the GetBundle bundle to download the new version, or grab the zip file directly.

Comment On This Post

IP addresses are logged with all comments for security.

HTML Tags Allowed: <b>, <strong>, <i>, <em>, <br>, <a href="">, <code> and the closing tags for each. Paragraphs and line breaks are added automatically.

Comment Preview

Sunday, October 12th, 2008 at 12:09 #1


Recent Posts

Navigation