Almost perfect: ActionScript code browsing with jEdit’s Sidekick panel

I was writing a quick answer to a reader concerning how to use jEdit to browse ActionScript code in a tree view, and when I suddenly realized the current solution wasn’t good enough. But after banging around on some source code this evening (and with the help of Ali Rantakari), order I think I’ve managed to make an AS 1, check 2 or 3 code browser that rivals a few I’ve seen on other platforms. Isn’t open source wonderful?

Warning: This article goes into some depth regarding customizing jEdit, Ctags and the Sidekick plugin. If you want to be spared the details, you can always skip to the end and just reap the rewards: A shiny new code browser custom-made for ActionScript!

A little background

JEdit’s optional CTagsSidekick plugin can be used to parse any language supported by the Exuberant Ctags parser. The plugin uses Ctags to parse through the current buffer and present the defined tags it finds in the SideKick tree.

Unfortunately, ActionScript is not one of the 34 languages supported “out of the box” by Ctags, so we have to do a little hacking to get things to work the way we want. Thanks to the work of a few pioneers, however, it’s easy enough to introduce ActionScript parsing to Ctags, and therefore, to jEdit itself.

Much of the credit for this hack goes to Sean Voisen, who did a lot of work three years ago to bring peace between the warring jEdit and ActionScript development. Unfortunately, I was a day late getting to Sean’s site, and he wiped it clean of all things jEdit last month (d’oh!). Fortunately, Richard Leider’s site still contains mention of Sean’s work, and also provides a copy of a language definition file that I used as the basis for my own AS 1, 2 and 3 parser, actionscript.c, which Ali Rantakari immediately made even better. (Update: Ali’s changes have been incorporated into both the source code here and the precompiled binary available below.)

To get everything I wanted out of the Sidekick panel, I had to gather a couple of things from elsewhere on the Web, as well as make a few files of my own:

  1. Start with Shlomy Reinstein’s CtagsSidekick plugin for jEdit. This can be installed through the editor’s Plugin Manager and docked on either side of the main edit window. To provide its power, it relies on the Exuberant CTags command-line tool, so of course we’ll also need…
  2. The latest “Source only distribution” of Exuberant Ctags. (Note: If the idea of compiling C source files makes you queasy, I’ve provided a link to a precompiled version of the modified file in Step 5B below.)
  3. Our edited actionscript.c file (Again, if you plan to use the precompiled version, you can skip this file, too).
  4. Our “easy-on-the-eyes” replacement icons for the CtagsSidekick plugin (This is optional. You may be perfectly happy with the default CtagsSidekick icon set. Personally, it hurts my ears.)

Step 0: Set up jEdit to parse AS files

Once you have installed the CtagsSidekick plugin, you must instruct jEdit to use the new plugin when parsing *.as files. To do so, select Plugins>Plugin Options>Sidekick>Parsers and set the actionscript Mode‘s Parser value to ctags. Press Ok, and jEdit is ready to go. (Unfortunately, CTags is not, but we’re going to fix that). You can close jEdit for now.

As I mentioned above, the instructions presented below detail how to build and modify the CTags command-line tool to your own liking. If you want to skip the technical details, you can always skip to Step 5B, download the precompiled OS X binary, and be done with it. Otherwise, let’s get on with it…

Step 1: Create the files necessary to build ctags

Open a terminal window and change to the directory in which you saved the ctags-*.*.tar.gz file above. For me, this was my Desktop, so I entered:

cd ~/Desktop

Then, unpack the source archive (Note: I was using ctags version 5.7; if yours is different, use the filename you downloaded above):

tar xzf ctags-5.7.tar.gz

This will create a folder named ctags-5.7 on your desktop (or in whichever folder you happen to be working). Now you must move the downloaded actionscript.c file into this folder. You can do this by dragging it in the finder or, since you’re already using the terminal, by entering the following (assuming you saved the actionscript.c file to the same folder in which you save the ctags archive:

mv actionscript.c ctags-5.7

Note: I like a lot of information (function arguments, variable datatypes and return types, for instance) in my code tree, so the actionscript.c file (and the resulting binary) has been tuned to my tastes. If you’re feeling ambitious (or just hate what I’ve done), feel free to edit the regular expressions to your own tastes and recompile at will.

And now, let’s change to the source directory for our next step:

cd ctags-5.7

Step 2: Add ActionScript support to the cTags source:

Now we need to edit two files, source.mak and parsers.h to ensure that ctags knows what it needs to properly parse ActionScript code (Bonus tip: From a terminal window, you can launch files in jEdit by typing open -a jedit filename).

In source.mak, we need to add a line that says “actionscript.c \” under SOURCES and “actionscript.$(OBJEXT) \” under OBJECTS.

In parsers.h, we need to add the following line under #define PARSER_LIST:
ActionScriptParser, \.

Step 3: Build the ctags binary from source

In the terminal window, make sure you are still in the ctags source directory (and that the actionscript.c you downloaded earlier is there, too) and type:

./configure

If everything works out, you should see a series of “checking for…” lines and eventually, you’ll return to a command prompt (and no error messages). If you see error messages, check your work above and try, try again. Otherwise, go ahead and “make” the ctags application:

make

And if that works, install your shiny new ctags tool (you will need your administrative password for this one):

sudo make install

Step 5: Verify ctags has ActionScript support now

Still at the command prompt, type the following and ensure that you you see “ActionScript” in the list of languages that appears:
ctags --list-languages

If you see “ActionScript” somewhere in the list, you’re good to go! If not, chances are you have anotherversion of ctags somewhere in your command path that may be taking precedence over the new one. If this is the case, and you can’t figure it out, drop me a line. Maybe we can muck through it together.

Step 5b: Cheat and download our prebuilt binary

Ok, if all those steps confound you, or if you just don’t want to bother rolling your own command-line tools (and if you’re using OS X), you can skip all the make/compile stuff and just download our precompiled ctags binary package, unzip the file, and place the included ctags file somewhere in your path (e.g., /usr/local/bin). You may need to make the file executable as well (from the terminal, chmod 755 /path/to/ctags).

Step 6: Parse some ActionScript

Launch jEdit, and open an ActionScript file. If the Sidekick dock is not already open, use the Plugins Options menu to open it. You should see a list of all the methods, variables, classes, etc. in the current buffer (If not, hmmph… check your work above.) It will look something like this:

code browser

Step 7: Make it prettier (optional)

I say something like this, because you may notice that the icons look different from those shown above. That’s because I made my own, which you can download from here, unzip, and install by running the enclosed install.sh shell file in a terminal window (be sure you’re in the same directory as the install file. You may need to chmod 755 install.sh before you can run it). Note: The file contains a README.txt file that offers alternate installation instructions, too.

Note: On windows, you can unzip the file, change to the resulting directory within a command line window, and type jar uf /path/to/jars/CtagsSideKick.jar -C . icons, replacing the path with the correct value for your system.

This command simply replaces the default icons within the plugin’s jar file with some of my own devising.

And now the shortcut:

I know it sounds like a lot of work, but it’s actually not, now that most of the work has been done. This is the beauty of open-source software – one person can muck around and make changes, improvements, etc. – and anyone else can benefit.

In fact, all the steps and procedures defined above can now be boiled down to two or three items (if any of ’em confuse you, you can always peek up at the explanations above):

  1. Download and unpack ctags with actionscript support and place the ctags file in your executable path. (More detail in comment No. 7 below!)
  2. Install the CtagsSidekick plugin through jEdit’s Plugin Manager and change the Sidekick plugins’ settings to use Ctags to parse ActionScript.
  3. Install the optional icon sets. Instructions are included within the zip file.

And that’s it! Go and code your masterpiece!

facebooktwittergoogle_plusredditpinterestlinkedinmail

45 thoughts on “Almost perfect: ActionScript code browsing with jEdit’s Sidekick panel”

  1. Excellent work my man, it seems to work perfectly! One minor thing though: I have version 4.3pre8 of jEdit on my Mac and the CtagsSideKick.jar was in a different path than ~/.jedit/jars/. — for me it was in /Applications/jEdit.app/Contents/Resources/Java/jars/.

  2. Hi Jay, there’s nothing amateur about it — this is admittedly ground most of us never see. While you could replace the existing command (you’d need to use sudo to gain the authority to do so), it’s probably better to add the new ctags to another directory higher in your path. I chose /usr/local/bin, but you should make sure that’s in your path first. In the terminal, type: echo $PATH. Wherever you put it, make sure you place it in a folder that comes before /usr/bin in your path.

    If you want to create a custom folder for such tools (say, ~/tools), you can type the following line — and add it to your hidden ~/.profile script so it automatically loads next time you log in!):

    export PATH=~/tools:/usr/local/bin:$PATH

    Hope that helps!

  3. thank you that helps. I placed mine in the usr/local/bin. Is there anything in JEdit that I might be missing? in the plugin options should the ctags Path be set to usr/local/bin? Just checking because the sidekick isn’t parsing like your example.

  4. Hi Jay,if you haven’t added /usr/local/bin to your path, you will need to set the path in the ctagssidekick plugin as well: /usr/local/bin/ctags. Any luck?

  5. Ali! Once again, excellent work. I was already working on similar changes, but your changes are better than what I’d come up with so far. (Admittedly, I may have rushed this out a bit — I was just pretty excited to see it working in AS2 and didn’t really give it a good thrashing in AS3). I’ve edited the article above to add your work, too (Hope this is ok?) Thanks!

  6. I have been using xcode and haven’t been totally satisfied. I can imagine the reliance. I like how it is implemented in JEdit. The thing I liked about it was the project folder. i am glad to see Jedit have this feature as well.

  7. That is faaar beyond the line of duty!!! Thanks a million.

    I just couldnt get it to work until i went to .jedit and opend the property file. in the line:
    options.CtagsSideKick.ctags_path=
    There was some chars befor the actuall path. Deleted that, typed the path, saved and hey presto!

    Thank you!!!! code browsing as it should be!

  8. Hey Mike, no problem at all. I hope my changes won’t mess things up for AS2, since I only tested them with the Flex project I’m currently working on. Proper code completion would definitely be nice 🙂

  9. Seems to work great, Ali. I’m working extensively on an AS2 project lately, so I’ve been paying more attention to version 2 so far.

    And just so others know, the only obvious difference between Ali’s binary version and the one presented here is in the way we’ve each chosen to present variables: Mine lists the variable datatype first, so the variables are grouped together by type, and Ali’s lists the variable name first, so all variables are listed alphabetically.

    It’s solely a matter of preference.

  10. Hmmm, glad to see you got it working, Ben! I have to admit my reasons for doing this series aren’t entirely altruistic: I figure the more people we get using a single tool for their ActionScript work, the more progress we’ll see in making improvements and updates to that tool. And since jEdit is cross-platform, it’s really the best choice out there for non-Windows ActionScript development.

    While I loved FlashDevelop for Windows, I have to admit I’m missing it a little less with each new improvement we make here. (And better yet — I used jEdit for all the C, bash, Java and other coding needed here, too. One tool to rule them all!)

  11. No worries, I also like the idea of working with the same editor as I’m constantly swtiching between linux and windows : and your jEdit articles sure helped 🙂

  12. I’m having some problems setting this up, the sidekick viewer remains empty.. I’ve followed your instructions to the t and installed the precompiled version to /usr/local/bin. the file is chmod 755, i’ve added /usr/local/bin to my $PATH (had no ~./profile before so created one in vi), I’ve tested this by echo $PATH and /usr/local/bin is before /usr/bin (where normal ctags resides). To confirm i’m getting to the right ctags I’ve even used ctags –list-languages and got the list of languages with actionscript right at the top!
    In jedit I’ve installed the two plugins CtagsSideKick v1.2 and SideKick v0.7.4 and set them up accordingly, CtagsSideKick Path is pointing to: /usr/local/bin/ctags

    Any ideas? 🙂

    Thanks a lot for introducing me to jedit and keep up the good work on making it great for actionscript!

  13. Hmmm… Just a couple things I can think to check: Is Sidekick configured to use “ctags” to parse ActionScript (Step 0 above)? Somehow I tend to forget this part myself. And although I don’t think it should matter so long as the full path is indicated within the Sidekick settings, make sure you’ve created “~/.profile” rather than “~./profile” (The period is the first character in the filename).

    Any of this help?

  14. I’ve just double checked both and they are both set correctly. ~/.profile is set as when I test with echo $PATH after a reboot I see the /usr/local/bin directory in my path so I know that it’ added. Step 0 is also set, the default parser is ctags.
    I’ve tried removing SideKick and CtagsSideKick and then edited the property file with vi to remove all traces, reboot and reinstall but no joy.
    Is there some other sort of conflict as I have XCode installed? Or is it my ~./profile setup wrong as at the moment the only content I’ve added to it is:
    export PATH=/usr/local/bin:$PATH

    I’m pulling my hair out with this!

  15. Ugh… It sure sounds like everything’s set up correctly, Anton. I also have Xcode installed, so I don’t think that’s the issue. With the CtagsSideKick Path pointing to /usr/local/bin/ctags, .profile shouldn’t even be a factor, even if it were wrong (which it doesn’t seem to be).

    One thing to check — What happens if you load the “actionscript.c” file above into jEdit (C code also uses the Ctag sidekick)? Or if you were to load another language file type (Java, Javascript, PHP, etc?)

    Anybody else have any suggestions — or similar experiences? sure would be nice to figure out what’s going wrong.

  16. Hi Anton,

    Out of curiosity, did you ever manage get the code browser working? I think I may have figured out a possible solution (or at least, a REASON for the issue, and a possible workaround):

    Once you have an ActionScript file loaded, and the Sidekick docked, click the Utilities>Buffer Options menu and ensure that the buffer’s “line endings” are set to “Unix” and the file encoding is set to UTF-8. Click OK, and then either save the file, or press the “Parse” button above the sidekick panel.

    Please let me know if this results in a visible code tree for you! If so, I’ll see what I can do to compensate for the Macintosh line endings in the compiled ctags tool. If not… well, I’ll get back to the drawing board. Thanks!

  17. Can I just say a huge thank you to you VeryVito! The line endings and file encoding fixed the ctags/sidekick error, now everything works exactly as it should. Finally making the switch to jEdit instead of the Flash 8 IDE! I was beginning to fear I might have to use my windows partition to do all my coding in FlashDevelop which would have been a crying shame especially with Leopard due!

    Now if I could just find some way to get AS2/3 code hinting like the Flash IDE!

    Thanks very much for your help, and keep up the good tutorials!

  18. Great stuff. I’ve been looking for a tool like this for a long time. Thanks for putting in the effort.

  19. Hi
    Downloaded the compiled file (My G4 doesn’t have a C compiler). Spent a looong time on this trying to get it to work – but nothing! When I’ve a .as file open the sidekick panel flashes ‘parsing’ then is blank. Also the case for ‘actionscript.c’ and .js and PHP files. I’ve carefully gone over every step. Also checked jedit properties file and the path seems to be OK. Did notice this value is undeclared:

    mode.actionscript.options.CtagsSideKick.mode.ctags_options=

    But haven’t any real idea what to do next!

    Thanks in advance

  20. Very glad to see coded support on ctags. Been waiting for this a long time. Can’t thank you enough for your hard work.

    A question. Is there any way to implement namespace trees? When i turn on multi-level sorting, the tree still comes out flat. Maybe I could pitch in and help out once the current project goes out.

    Great stuff! Thanks again!

  21. Hi

    Installed Apple X-Tools, went through steps 1-5 (very easy). Worked straight away! Thanks.

  22. Okay… set up as requested… for some reason I get the error message ‘cannot execute binary file’ from the terminal when I try to do a list – not sure what I’m doing wrong? Done the chmod and everything…

  23. Hi Jess. Are you using the prebuilt binary? Or did you compile your own? Any errors reported during the compile, if so?

  24. The prebuilt binary. I tried to compile my own, but apparently my work Mac doesn’t have the proper C compiler for it…

  25. Works now! ..hadn’t heard back on anything so I went out and nabbed myself xtools, and that got it to compile on my computer. Have the paths set, and works like a charm. 🙂

  26. These guides have been amazing. Thank you a million times. Really. 🙂

    I am having a small, and probably silly problem, which I hope someone here can help with. After running the command:

    “ctags –list-languages”

    I am presented with the following error:

    “ctags: illegal option — -”

    Has anyone else encountered this?

  27. I found the solution to my problem. Apparently I didn’t have a recent Exuberant Tags. After installing such, and then following VeryVito’s instructions in comment #20 above, it all seems to work.

    Now to replace those ugly icons. ;P

    Thanks a lot guys. Your work is very much appreciated.

  28. i have downloaded the short cut version along with the sidekick, i put the ctag file in the same directory as jEdit, made it exicutible, and set the settings to actionscript. Then when i open the plugin it always says “not parsed” i can not get it to parse, i have tryed everything i can think of any ideas

  29. … to continue with my last post i have found some more info on the problem, it will parse fine with other codes (not in ctags) but when i try to parse with ctags i get an error, “java.lang.NullPointerException
    at ctags.sidekick.Parser.runctags(Parser.java:224)
    at ctags.sidekick.Parser.parse(Parser.java:84)
    at sidekick.SideKick$ParseRequest.run(Unknown Source)
    at org.gjt.sp.util.WorkThread.doRequest(WorkThread.java:213)
    at org.gjt.sp.util.WorkThread.doRequests(WorkThread.java:180)
    at org.gjt.sp.util.WorkThread.run(WorkThread.java:154)”

    and it still says “not parsed”, i have changed all the settings as they should be so i have no idea what could be going on.

  30. @Agnt Yellow, sorry for the delay in responding. Just to check, though, what is the path you currently have set under Plugins>Plugin Options>CtagsSidekick>General>ctags Path? Unless ctags is in your user-level, executable path, you will need to make sure this is set to something other than simply “ctags” or, worse yet, blank. Also, check comments 3 through 5 and 21 above; any chance they might help with the issue? Thanks!

  31. Download and unpack ctags with actionscript support and place the ctags file in your executable path. (More detail in comment No. 7 below!)

    I did not find the details in comment #7.

    lee

  32. hi lee,
    are you takling about the windows executable, i’m sorry i’ve been moving that file along, but i’d be glad to upload it somewhere

  33. In my case the parser works I just can’t see any icons in the sidekick.. Anyone had this problem?

    The option to show icons is on. The parser lists classes, functions and variables just doesn’t show any (not even the ugly ones) icons at all..

  34. All done, great tutorial, just one question, do you know how to get JEdit console to work with the mxml compiler, I have it on my path but for some reason I can’t call it from JEdit’s console but I can on regular console.

Leave a Reply

Your email address will not be published. Required fields are marked *