We've been experimenting with XUL now for a few days and have managed to create simple overlays like menus, menu items, toolbar items, sidebars, status bar icons and buttons, simple windows and dialogs. Of course, all that the clickable items on these do is trigger simple alerts, but most of them work. There are still a few things we 're yet to figure out, but I believe that shouldn't take too long.The DOM Inspector add-on has proved invaluable in helping us understand and manipulate the browser chrome DOM, especially because it allows one to find any item in the Document Tree by simply clicking on it. This helped quickly retrieve the id's of the components in whose surroundings we wished to introduce new elements.
As of now, the XUL part seems doable, but we could definitely do with some help on Javascript. What I shall do, in the next few blogs, is describe in steps, how we plan to design each of the add-ons, with a fair amount of detail. That should put things in place.
Monday, May 31, 2010
Wednesday, May 26, 2010
Bags Packed, Ready To Go.....
It's been about three weeks now, since we decided, well, to actually start doing something, and we've spent most of this time learning the elements of Web Development: HTML, CSS, DOM, Javascript, a bit of Ajax, XML, and finally, what's relevant to what we're doing, XUL. I felt it worth mentioning that w3schools.com has awesome interactive tutorials on some of the above-mentioned topics. Webdevelopersnotes.com was also pretty useful.
For XUL and for extension-development , Mozilla's XUL School Tutorial served as a good introduction, but I felt this tutorial has been written assuming the reader knows, well, quite a bit, as in it isn't something like "Firefox Extension-Development for Dummies", but surely one can manage pretty well after spending some time with it. Then I found this wonderful book, 'Hacking Firefox'. The version I found is a bit old, but it's got everything we actually need, and its really well-organized too. It guides you through the process of developing an extension through a simple example. Thanks to it, we're now comfortable working with XUL, and are also familiar with the file-organization and directory-structure we should be working with. By the way, we're using Komodo Edit to write our code, as was suggested on this XUL School Tutorial page. Its free, open-source and apart from general features like syntax-coloring, automatic-indentation, code-hinting(really useful!) etc. it also has a project template for developing Firefox Extensions, complete with files required to build the final .xpi file.Well, that automates a lot of stuff, but i guess we're going to do it manually anyway, at least the first time.
So, to put it in a nutshell, we're all wired up, fired up and ready to start coding. Hope we make good progress this week.
For XUL and for extension-development , Mozilla's XUL School Tutorial served as a good introduction, but I felt this tutorial has been written assuming the reader knows, well, quite a bit, as in it isn't something like "Firefox Extension-Development for Dummies", but surely one can manage pretty well after spending some time with it. Then I found this wonderful book, 'Hacking Firefox'. The version I found is a bit old, but it's got everything we actually need, and its really well-organized too. It guides you through the process of developing an extension through a simple example. Thanks to it, we're now comfortable working with XUL, and are also familiar with the file-organization and directory-structure we should be working with. By the way, we're using Komodo Edit to write our code, as was suggested on this XUL School Tutorial page. Its free, open-source and apart from general features like syntax-coloring, automatic-indentation, code-hinting(really useful!) etc. it also has a project template for developing Firefox Extensions, complete with files required to build the final .xpi file.Well, that automates a lot of stuff, but i guess we're going to do it manually anyway, at least the first time.
So, to put it in a nutshell, we're all wired up, fired up and ready to start coding. Hope we make good progress this week.
Monday, May 24, 2010
Hi! This blog's being written to record the progress of the project my friend Ravi and I have taken up under WNCC-IITB for the summer. We are working on the following extensions for Mozilla Firefox 3.0 and above :
1. ViewTab : A no-nonsense extension that shows a preview of the contents of a tab when the mouse pointer is moved over the corresponding tab-head.
2. Multi-Tab Search : Allows the user to search for a string in all or some of the currently open tabs.
3.Source Viewer-Modifier : Installs a button on the toolbar which, when clicked, divides the content window into two parts, one showing the page and the other showing the page source. The user can modify the code, and preview the page with the modified code.
2. Multi-Tab Search : Allows the user to search for a string in all or some of the currently open tabs.
3.Source Viewer-Modifier : Installs a button on the toolbar which, when clicked, divides the content window into two parts, one showing the page and the other showing the page source. The user can modify the code, and preview the page with the modified code.
Subscribe to:
Posts (Atom)