|
This post originated from an RSS feed registered with Ruby Buzz
by Edward Spencer.
|
Original Post: ExtJS Textmate bundle
Feed Title: Ed's Elite blog
Feed URL: http://feeds2.feedburner.com/EdSpencer
Feed Description: Ruby on Rails development, Git issues and ExtJS/JavaScript
|
Latest Ruby Buzz Posts
Latest Ruby Buzz Posts by Edward Spencer
Latest Posts From Ed's Elite blog
|
|
I develop on both OSX and Windows machines, and my editors of choice are Textmate and the excellent Windows clone E. One of the great things about Textmate is its bundle support, which allows you to create reusable code snippets (among other things).
I've got a good collection of these built up so thought I'd make them available on Github. You can install it like this:
Mac OSX:
cd ~/Library/Application Support/TextMate/Bundles
git clone git://github.com/edspencer/extjs-tmbundle.git ExtJS.tmbundle
Windows:
cd C:\Documents and Settings\{YOUR USERNAME}\Application Data\e\Bundles
git clone git://github.com/edspencer/extjs-tmbundle.git ExtJS.tmbundle
If you don't have git installed you can simply download the bundle as a zip file, and extract it into the directory as above. If you do go the git route you can of course cd into that git directory at any point and use git pull to update to the latest bundle version.
I'll give one example of the usefulness of snippets like these; here's the Ext.extend snippet from the bundle:
/**
* @class ${1:ClassName}
* @extends ${2:extendsClass}
* ${5:Description}
*/
${1:ClassName} = function(config) {
var config = config || {};
Ext.applyIf(config, {
$0
});
${1:ClassName}.superclass.constructor.call(this, config);
};
Ext.extend(${1:ClassName}, ${2:extendsClass});
${3:Ext.reg('${4:xtype}', ${1:ClassName});}
To use this you can just type 'extend' into a JS file in TextMate/E and press tab. The snippet takes you through a few editable areas such as the name of your new class, the name of the class you're extending, xtype definition and description, then dumps the cursor inside the Ext.applyIf block. The actual characters typed are these:
extend [tab] MyWindow [tab] Ext.Window [tab] [tab] mywindow [tab] Special window class [tab]
Which produces this:
/**
* @class MyWindow
* @extends Ext.Window
* Special window class
*/
MyWindow = function(config) {
var config = config || {};
Ext.applyIf(config, {
});
MyWindow.superclass.constructor.call(this, config);
};
Ext.extend(MyWindow, Ext.Window);
Ext.reg('mywindow', MyWindow);
Hopefully it's obvious how much time things like this can save when generating repetitive, boilerplate code. The extend snippet is one of the larger ones but even the small ones are very useful (pressing c then tab is much nicer than typing console.log(''); each time).
Any suggestions/contributions are welcome. Thanks go to rdougan for his contributions and organisation also.
There is another ExtJS textmate bundle available at http://hakore.com/extjs.tmbundle/, written by krzak from the Ext forums. I haven't checked it out but it is probably worth a look.
Read: ExtJS Textmate bundle
Previous Topic
