The Flash Blog Pimp My Eclipse - Part 2 Flash Develop And Design

Pimp My Eclipse - Part 2

Posted in Flash by The Flash Blog on the 12-02-2008

Ok so I’ll assume that you took my advice and installed Eclipse 3.4 with the Flex Builder plugin. I’ll only be testing things on Mac and Windows on this latest version of Eclipse. The focus of this post will be on implementing snippets in Eclipse. If you are using FDT then you already have some great templating features at your disposal. If you’re using Flex Builder then you will have to improvise, at least until Flex 4 hits the streets. Let’s now take a look at your options.

WST Snippets Panel
A popular choice for snippets in Eclipse is the Snippets panel from the Web Tools Platform plugin. To get it, go to Help > Software Updates. Click on the Available Software tab and then twirl down the Web Tools (WTP) Update Site section. Check off the Web Tools Platform (WTP) 3.0.3 check box and then click to install. This snippets panel is very powerful as it allows you to define variables in your snippets. When you click to insert a snippet you will be prompted to fill in the variables. The biggest downside of this panel is that you have to click to insert a snippet. There doesn’t appear to be any way to insert a snippet via some trigger text ala TextMate. This is a deal breaker for me.

Eclipse Monkey
Another powerful way to insert snippets is via Eclipse Monkey. This is similar to Grease Monkey as it allows you to use JavaScript to control Eclipse. This enables you to basically do anything you want. There are already some great examples out there for ActionScript development. To install Eclipse Monkey, follow the same procedure as for WST but go to Europa Discovery Site > Other Tools > Eclipse Monkey and install the plugin. To create a snippet you have to essentially create a Javascript file that you can assign to a keyboard shortcut. Since you are scripting, you can do anything you want and it is much more powerful than any other option. The downsides are that it is considerably more work to create a snippet and there is also no panel for viewing your snippets. This option is powerful but is too much work for my liking.

Snip Tree View
This is my favorite option of the bunch. The Snip Tree View panel come as part of the CFEclipse plugin. To install CFEclipse you will need to again go to software update but this time add a new site by clicking Add Site. Enter http://www.cfeclipse.org/update and then twirl down the site. Under Cutting Edge check off the 1.3.2 beta check box and install it. So why do I like this option the best? First off it is the closest to the functionality found in TextMate. You can assign trigger text to a snippet and also define variables. When inserting the text you will prompted to fill in the variables. The panel itself is also very well designed which is important to me.

Now there are couple of important things to note about the above options. Firstly, the keyboard functionality in Eclipse Monkey and Snip Tree View will not work when editing MXML files. If you work in some MXML and then start editing an AS file it will still not work. I have to restart Eclipse to get it to work again. I have no idea why this is. You can still click to insert snippets when in MXML mode though.

Another problem with Snip Tree View is that the CFEclipse toolbar must be visible in order to get the keyboard control to work. This toolbar contains a ton of things and is very unsightly. My solution to this was to write a plugin whose only job is to call the insert snippet command in the CFEclipse plugin. This way you only have to have the nice icon from my plugin visible. As you can tell, an editor’s UI is very important to me. To install this plugin download the ZIP file and extract the contents to your eclipse/plugins folder. When you relaunch Eclipse you should see the new icon in your toolbar. I’ve highlighted it in the screenshot below. If you don’t see it you need to customize your perspective to include the Insert Snippet toolbar. I modified to the keyboard shortcut for this command to Shift-Space which makes it very fast for me to insert a snippet. You can make it whatever you want.