Throughout the life of Monday By Noon, I’ve been quite public about my choice of operating system. Originally I was a Windows user, from there I switched to Linux and finally made my way to OS X. I haven’t looked back, and I’m consistently impressed with the quality of applications available, not only for Web design, but general use as well.
Choice of text editor is a very personal thing for any developer. I’ve tried nearly every editor under the sun, just to make sure I wasn’t missing out on anything. Over the past year or so, I’ve wobbled back and forth between TextMate and Coda. TextMate is brutally useful, and Coda is terribly beautiful and functional. Time after time I’d return to TextMate simply because of the elaborate bundles, especially the snippet implementation. Coda’s editor just didn’t cut it when it came down to the timesaving techniques TextMate has spoiled with me.
Then came Coda 1.6. Coda now supports a full range of plugin functionality, along with a stunning plugin creator. I was instantly thrilled, dying to give Coda a fighting chance against TextMate. Since the debut of 1.6, some really great third party plugins have been published, and I’m very excited about the potential of very elaborate plugins down the line.
Writing a Coda plugin
I’ve never been one to get very detailed with plugin development, mostly because any plugin I wanted to write had already been done (and done well). With Coda plugins being brand new, there are plenty of plugins to write; I thought I’d give it a shot.
Writing a Coda plugin is terribly easy. It’s a matter of downloading the plugin creator, choosing from a number of languages, and publishing your plugin. If you’ve never built a plugin before, I’d definitely suggest playing around with Panic’s implementation with Coda, it’s a very satisfying experience.
Comment banner plugin for Coda
The functionality behind the plugin I decided to write by no surprise is rooted in TextMate. I’ve become a huge fan of the comment banner snippet in TextMate. It gave me a ridiculously fast way of inserting comment banners, allowing me to further segment some of my larger CSS documents, and I’ve even started documenting my source documents and JavaScript using comment banners. If you’re not familiar with comment banners, check out a quick screencast I put together:
Unfortunately, in its current state, my plugin is nowhere near as advanced as the TextMate implementation. In TextMate, you can simply trigger the snippet and type your comment as you go. My plugin instead uses an existing line of text and transforms that into a comment banner. Once I take a closer look at the Coda plugin architecture, I’d like to completely duplicate the TextMate implementation.
Another feature that’s currently incomplete is the syntax mode detection. I’ve only had time to implement a few of the document types I find myself editing most often. Once I look into the comment syntax of all the modes supported by Coda, I’ll make additions to make the plugin that much more comprehensive. Of course, if your syntax mode of choice is not supported (there’s a good chance it may not be) you can post a comment below and let me know about it, I’ll make updates as soon as possible.
Additionally, the syntax detection that does take place only looks at the extension of the file in which you’re working. For example, the plugin doesn’t know you’re editing a JavaScript block inside an HTML document.
You can trigger the plugin by typing your intended comment (single line of text) and choosing Plug-ins > Comment Banner, or simply use the key command from TextMate; Control + Shift + B.
If you’re a Coda user, I hope you find this plugin useful. If you’ve got any feedback at all please take a moment and post in the comment thread, and stay tuned for updates!
Download Comment Banner
- Version 0.6.1
- December 17, 2008 – Implemented possible fix for ‘Undefined variable’ error messages
- Version 0.6
- December 12, 2008 – Added Coda comment bookmark syntax (Suggested by Jason)
- Version 0.5.1
- December 5, 2008 – Added support for JSP
- Version 0.5
- December 1, 2008 – Initial release
Comments
I’m a recent Coda convert. This will surely come in handy. Thanks, Jon!
Hi Jonathan,
did u hear about Espresso yet?
It’s a new tool by the creators of CSS Edit.
My choice was TextMate over Coda as its more powerful with the bundle editor. But as you said Coda is soooo beautiful!
Great looking plugin! Will there be support for JSP in the future?
@Jason Robb: I hope it helps!
@Horttcorre: Yes, I’ve been keeping an eye on the Espresso beta. Unfortunately it’s mostly a release to cater to plugin developers (which is an awesome move in my opinion) so I can’t give it a full run-through. I’m very excited to see the full release!
@havarti: Absolutely! I’ve just uploaded 0.5.1 which includes support for JSP. Please let me know if it works for you.
Hi, first thx a lot for this cool plug-in. I have discovered a small issue when I used it in a php file.
Notice: Undefined variable: input in /Users/TeeJay/Library/Application Support/Coda/Plug-ins/Comment Banner.codaplugin/Contents/Resources/874CAFB1-C7AC-41F7-90E1-AC43B180A94D/comment_banner.php on line 6
Any Ideas what that could be, I just executed it.
Regards Tee
aehm maybe I was a bit sleepy but when i read the message again, everything getting clearer. I suppose u use php. If your error level is set to e-all it shows this message
suggestion: just do something like that, to get rid of the the notices
$fp = fopen(“php://stdin”, “r”);
$input = “”;
while ( $line = fgets($fp, 1024) )
$input .= $line;
fclose($fp);
Tee
Hey Jon,
This plugin rocks, to reiterating it’s awesomeness.
I’ve edited your plugin to mark each banner as a bookmark in Coda. Add an exclamation mark after the opening comment tag, and Coda marks it as a bookmark. Very helpful!
Code Navigator looks like this:
http://twurl.nl/ez4l5p
And in code looks like this:
http://twurl.nl/453twa
Rather than republish your code, you can feel free to update yours, or not. So you know. =)
(More on that colorful seestyle/theme soon…)
Best,
Jason R.
… the reason I include the first ==== set is because the bookmark icon in the Code Navigator isn’t as visually emphatic as it should me. The additional ==== in the Code Navigator pane really helps distinguish separate sections of code.
Peace,
Jason R.
This is a nice plugin, but I think I see a bug having to do with line endings.
I have my line endings set to “Unicode (UTF-8)”. If I insert a comment block using your code, I get the little red paragraph icons at the end of each comment line. I’ll see those sometimes when I get a file from somebody on a windows machine, and I’ll bet it has something to do (or everything to do) with the fact that different platforms use different character combinations to indicate end of line. Is there any way your plugin could account for that?
@Jason Robb: I have no idea how that could have slipped my mind! I’ve included support for the bookmark syntax in version 0.6 although not exactly as you did. Thanks very much for the post!
@hairbo: Offhand, I’m not completely sure what would cause that issue as I use the same line endings. I will check things out and post my findings as soon as possible.
hmmm I am the only one who gets this errors
Notice: Undefined variable: input in /Users/TeeJay/Library/Application Support/Coda/Plug-ins/Comment Banner 3.codaplugin/Contents/Resources/874CAFB1-C7AC-41F7-90E1-AC43B180A94D/comment_banner.php on line 9
Notice: Undefined variable: input in /Users/TeeJay/Library/Application Support/Coda/Plug-ins/Comment Banner 3.codaplugin/Contents/Resources/874CAFB1-C7AC-41F7-90E1-AC43B180A94D/comment_banner.php on line 6
Notice: Undefined index: CODA_FILEPATH in /Users/TeeJay/Library/Application Support/Coda/Plug-ins/Comment Banner 3.codaplugin/Contents/Resources/874CAFB1-C7AC-41F7-90E1-AC43B180A94D/comment_banner.php on line 11
but thx for that.
Best regards Tee
@tee: I’ve just released version 0.6.1 which sets defaults for the variables which seem to be giving you issue, would you mind checking out the latest version to see if that works? Thanks!
Yea you fixed 2 of 3 🙂 but there is still one notice
Notice: Undefined index: CODA_FILEPATH in /Users/TeeJay/Library/Application Support/Coda/Plug-ins/Comment Banner.codaplugin/Contents/Resources/874CAFB1-C7AC-41F7-90E1-AC43B180A94D/comment_banner.php on line 14
Regards Thomas
@tee: Are you testing with a file that has not been saved? The plugin checks the file extension since there is currently no way to determine which syntax mode we’re in. There is also no way to determine if the current file has been saved or not.
[…] Comment Banner […]
Like you, I waffle a lot between Textmate and Coda. I keep wanting to like Coda, it’s beautiful and has some nice features, but there are too many things on Textmate I can’t live w/out and haven’t found a plugin for. For instance, in Textmate, if I want to wrap a line in , ,, or anything else, I have that bound to my f keys. If my cursor is anywhere on that line, it’ll wrap that line in the tags. If I select several lines, it will wrap each line in that tag.
The other feature I can’t live w/out is the ability to select several columns of characters by holding the option key (this has a name, but I’m drawing a blank on it).
I noticed your script quit working for me on 10.6.
I traced it to an issue (which I presume is the Apple default) where the $_ENV variable is not registered (as configured in php.ini).
I modified your script to use getenv() rather than $_ENV in order to address the issue without requiring users to know how to modify their php.ini files.
I did some further testing. The default settings (without a php.ini file) register $_ENV, however /etc/php.ini.default excludes it, so users like me that simply duplicate that file and make the changes we know we want may not see that omission.
Regardless, using getenv() will work when $_ENV is or isn’t present and would be a good change to make.
Great script Jonathan. Any chance we can get an html flavor only? I use textmate’s comment banner all the time for html, but it’s always inside a .php file. Appreciate it.
Nice work my man, I appreciate this. It’ll help us to standardize the way we comment. Right now everyone is doing their own thing. Many thanks!
Very nice work… thank you so much!
If I’m not asking too much, would be possible you add support for LESS CSS??