Grafox: An SVG Extension for Firefox

Well, today is my birthday, so I’m giving you all a present. I’m finally releasing my Grafox extension, which extends Firefox’s native SVG functionality. I’ve gotten quite a lot of requests for this, which strikes me as odd, since I haven’t promoted it much at all. I’ll also note that Holger Will also has a Zoom & Pan extension that is quite good.

Grafox adds zoom and pan controls, and support for text-wrapping, editable text, and declarative animation, among other things. And at this stage, it adds them all badly. I’m releasing it now not because it’s stable (in fact, it was more stable a few versions ago), but because it’s unlikely to get stable bit-rotting on my harddrive, and I’ll be more inspired if I have an audience. I’m also releasing it as an open source project, in a sense… anyone can take any piece of it they need, and more importantly, anyone can submit patches or feature requests. I’m hoping that by the time Firefox 3.0 hits the wire, Grafox will be stable and functional.

The permanent home for it will be on my Grafox page. Try it out, and let me know what you think.

Idiri Firefox Extension

Firefox is my browser of choice. I really like Opera, and it has excellent SVG support, but I’m a creature of habit, and I can’t shake using Firefox. One of my favorite things about it is that you can trick it out to fit how you use it. I’ve installed quite a few Extensions (community-made bits of browser functionality) that I use all the time. They have become such a part of my browsing experience that I have even forgotten they aren’t standard, and when I had a hard-drive crash and had to reinstall, I was a bit at a loss why FF didn’t have some of the core functionality I’d come to rely on… until I reinstalled the extensions. I’ve even made one for my last employer, and in my spare time, I’ve been working on an image- and SVG-specific extension for Firefox, which I’ll be releasing shortly.

One of the other things I love about FF is the context-menu option for “View Selection Source”. I use it to figure out how certain bits of a document are marked up (though I also use Firebug for that). In my standards work, I also find myself needing to cite particular sections of large documents, such as technical specifications or documentation. I cite them to point out errors, to show where a bit of functionality is specified, to help out people with questions by pointing them to a reference, to defend my interpretation of a technical issue, and all sorts of other geekademic occasions. Since these documents are usually quite long, it’s necessary to get as close as possible to the relevant section when supplying a link, and fortunately, specifications tend to be very well marked-up, with logical document structure and plenty of ID attributes for ease of linking. View Selection Source is really great for that, because I can select a section header, open up the partial source in a new window, find the id, select it, append it to the original URL preceded by an octothorpe (“#”), and use that as a reference link; of course, sometimes the id isn’t where you expected it to be, and you need to look around for it a bit…

Okay, you see my problem. As relatively easy as View Selection Source makes the task, it’s still a bit… shall we say, labor-intensive. To be honest, it’s not quite as cumbersome as it sounds, and I’m so used to having to kluge around like that when programming that it somehow never occurred to me that it could be easier.

It just got easier. I spent a few hours putting together a Firefox Extension that automates this process. You just right-click on the section you want to link to, and select “Copy section link”. Idiri, my extension, automagically finds the nearest preceding link to where you’ve clicked, and copies it to your clipboard. It also highlights the element that it found an id on, as a visual indicator that it’s done its job and to let you know where you’ll be linking to. Simple.

You can download Idiri (from “id” for identifier, and “iri” for “internationalized resource identifier”, a fancy way to say URL or Web address), and let me know what you think. More details below…

Continue reading “Idiri Firefox Extension”