Ok, so I’m trying something a little different here… a video of the results of my work . My efforts here were to create an extension in lieu of modifying the source code in Firefox. Previously in our class, we had to modify tabbing behaviour of Firefox in source code. This time, we had to reverse out our changes to the source code, and make the change via an extension instead. My changes impact best on Firefox 3.5.5 and my extension (which Roger Dicke helped with) can be downloaded here.
You may notice… the video has “Screen Flow Demo” burned across it. Maybe when I’m out of school and get a job, I’ll buy the $100 screencast software and upload a video without the watermark. Until then… you get the watermark.
There were many obstacles with this extension, and on top, the behaviours aren’t completely tweaked for FF3.6 and 3.7. I also had a lot of problems getting the extension to load in the browser at all and much of this took most of the time that I spent on it.
One of the things that I enjoyed learning about Extention Development in Firefox, was how the process works for inserting code… actually, I’m still taking that in, but for this task was how event handlers were used to capture activity in the browser so that one could modify or at least trigger off of that event. That was mainly intriguing because I’m currently working on setting up multi-touch events for the Mac on Thunderbird, and the eventuality there would be to have then extensible so that Extensions could modify the default behaviour that would be in place. So event handling has a particular interest for me.
var evt = document.createEvent("Events");
evt.initEvent("TabOpen", true, false);
t.dispatchEvent(evt);
Above is a snippet of code that creates the action of a tab being opened with whatever the default behaviour has been assigned. So for the extension, this is the primary event that it establishing an event listener for the sake of monitoring.
onLoad: function() {
var container = gBrowser.tabContainer;
container.addEventListener("TabOpen", this.onTabOpen, false);
container.addEventListener("TabSelect", this.onTabSelect, false);
container.addEventListener("TabMove", this.onTabSelect, false);
window.addEventListener("unload", this.onUnload, false);
},
So this was very intriguing for me, also largely due to the fact that I had done some Drupal development over the summer while on a work term co-op and Drupal also uses what they call “hooks” in order to catch new behaviour as a web pages output is created as it pushes through the system. In Mozilla Extension development, “hooks” are also the term that they use.
There were a number of pages that came in handy for me, so just to list them out without further adoo…
- Building an Extension
- How to develop a Firefox extension. Oddly enough, I had problems getting my extension package formed properly, and this gave me the command line to run to ensure it’d work.
- Chrome Manifest Details
- Overlays
- Install Manifests
- A website with an excellent Extension generator that someone developed
Filed under: open source | 2 Comments
Yes, it’s pretty cool too. Screen Flow seemed a little more intuitive for me considering my audio and post recording background… the timeline editor that it gives you after your recording is captured is something that I like. But, I’m new at doing screencasts so who knows what I’ll prefer more in the end.
I’m not going to redo this screencast… the moment was captured last night, but I’ll likely try a few more screencasts before the semester is done.
The screencasting idea came from all of the video blogs that I followed, either as video podcasts through iTunes or video blogs off of people’s sites for when I was on my co-op and had to learn Drupal. The screencasts were an excellent way to convey instructions without having to spend so much time trying to doing as written text. Text never would have worked, but the videos made it unmistakeable.
This is really cool! I love that you thought to show it this way, and really like your idea of doing it to the left vs. the right as I had done. One thing, I’d recommend you check out http://www.ambrosiasw.com/utilities/snapzprox/ which is awesome for this kind of work, and works for free as a trial.