And Now.......Browser Turns Editor

https://addons.mozilla.org/en-US/firefox/addon/182865/

An add-on a day, that's how it's been going for the last three days. Right now, I'll just post description of the add-on on the Mozilla Add-ons site. It goes like this:

Did you know that you can actually edit pages within Firefox! You can edit the text, apply simple formatting changes and re-size and move images, tables and other objects. All you need to do is turn on the 'Design Mode' of the document in the browser. Unfortunately, there is no way of doing that directly in Firefox. That's where this add-on comes in.

Select Tools->Toggle Design Mode, or just click on the pencil icon on the main toolbar to turn on the Design Mode of the document in the currently selected tab. That's it. Now you can edit the text on the page, and re-size, move, or remove images, tables and other elements on absolutely any web page. Well maybe that isn't too much, without advanced formatting options, but nevertheless it adds functionality to your browser. If you're not familiar with HTML and are looking to make a quick edit to a web page, or to a template you've downloaded, you can now do that without having to take the pain of going through the source or opening the file in another editor (if you have one).

Once you are done editing the the page, click on the menu item, or the toolbar button again, and the Design Mode will be turned off. Then you can save the page as usual by selecting File->Save As. At any moment, if you reload the page, the changes you have made will vanish (though they will still be present in the saved file, if you have saved the page). You can edit many tabs at the same time, and independently i.e. the Design Mode can be toggled on/off independently for each one of them.

I wish to develop this add-on further, like introduce a toolbar, so that it becomes possible to modify every element in page, without having to see the source. Till then, Happy Editing!

Developer Comments

This add-on is nothing more than a simple little tweak, and to many might seem like a silly joke. Well, my idea is to develop it further, and introduce a toolbar for better formatting options. That way people won't have to use other software to modify, or redesign web pages. Do get in touch with me if you are interested in developing this add-on.

Again, I promise I'll post the documentation later. By the way, I discovered a few bugs in View Tab, so I'll have to start fixing them now.

Presenting.........Close Multiple Tabs!

https://addons.mozilla.org/en-US/firefox/addon/182403/

Here goes another..... after, well, a fair bit of struggle around the tricky parts. This add-on was mostly easy, after understanding how dialogs work, but I struggled for some time trying to update the dialog as changes were made in the browser window while the dialog was still open. I had considered restructuring the entire thing, but I realized soon enough that it wasn't such a great idea. Then it happened, almost by mistake. I tried to open the dialog again while it was still open, and magically, the contents of the dialog got updated! I then realized that the trick was to reload the dialog whenever a change was made with the tabs in the main window, and with that I was able to finish the add-on and submit it. I'll discuss the implementation in a later post.

Here's the description I've given on the Mozilla Add-Ons Site:

I'm pretty frequently faced with a situation where I have 20 or more tabs open, and I wish to close all but 3 or 4 of them.It's a pain closing them all one by one, while being careful about not closing the ones I need. So, I built an Add-on to solve this problem.

This add-on allows you to close many tabs with a single click. Select File->Close Multiple Tabs, or just press Ctrl+Q to open a dialog showing the list of tabs that are currently open. You can select the tabs you wish to close from the list, and click OK (or just hit Enter!) to close them. If all the tabs are selected, then you have the option of choosing between a blank page and the browser's homepage.This way you can get rid of all the tabs and start a new session, without having to, perhaps, restart the browser.

Tip: Use Select All and deselect the tabs you need when you wish to get rid of all but a few tabs (like 3 or 4 out of 20), and use Select None and select the tabs you wish to close if they are few in number. This way, you'll find this add-on really handy.

You don't have to worry about cluttering of tabs anymore, because the solution is just one click away.
Happy Surfing!

Developer Comments

I realize that Ctrl+Q is perhaps, too important a shortcut to assign to this add-on, but this has been done only to make the add-on easily accessible, because those who actually find this add-on useful will find themselves using it quite often (at least that's the case with me), and fumbling repeatedly with a Ctrl+Shift+Something combination can be quite annoying.

Presenting.........ViewTab!

https://addons.mozilla.org/en-US/firefox/addon/181920/

Here it is.... finally. Go ahead,click on the link,and download and install the add-on (oh, and don't forget to give it 5 stars! ).After weeks of research (Googling, actually), a modest one and half day of coding, and another half-a-day of debugging, I was finally satisfied with it, so much that I decided to go ahead and submit it on the Mozilla Add-Ons website. I must say they have tough testing standards, so one can't do funny things and get away.

• I had to upload it 5 times, as it threw trivial errors the first four times during the verification process.
  
• I had to decrease the highest supported Firefox version on the add-on(I'd given 4.* :P), as it wasn't matching an already existing one.Essentially, it means you cannot design add-ons for upcoming versions of Firefox, you have to update your add-on after the new version is released.
• The Add-On passed all tests, with a warning that said it didn't appear to be localized. Well, there's absolutely no text involved anywhere, so language isn't something I should worry about.
• I had to select a category for it, before it could be transferred to the Sandbox (whatever that is!).
• I even had to upload a preview screenshot, before the add-on could be made public.
• And right now, its sitting there waiting to be reviewed, behind 41 other add-ons, as the page said when I last checked.

I'm too tired to write about the implementation right now, I'll definitely do that soon. Well,right now, it's party time!

Two New Add-Ons!

We've made a lot of progress in the last two weeks, and we're confident now that we should be able to complete work pretty soon, definitely in a week or two. I've been having fun experimenting with XUL and javascript, so much so that I've been able to create two working add-ons, with minor bugs, which I hope to fix soon. I wish to add these to our to the list of add-ons we had initially proposed to design. They are as follows:

• Close Multiple Tabs: This add-on allows the user to close multiple tabs with a single click. It installs a button on the main toolbar, a menu item under the File menu and provides a keyboard shortcut. Each of these allow the user to access a dialog which shows the list of tabs currently open. The user can select one or more tabs, and click OK to close the selected tabs.
• Browser Turns Designer: This add-on allows the user to edit a web page within the browser itself. It installs a button the main toolbar, and a menu item under the tools menu, either of which allow the user to toggle the feature on or off. This add-on is basically a simple tweak that switches on the Design Mode of the HTML document being currently viewed. This can be a useful tool for editing web pages, templates from the web etc. without having to go through the source code, or using other applications. Once the desired changes are made, the file can be saved as usual, as an HTML document.

I'm also working on the Source Viewer-Modifier Add-on. Creating the in-browser viewer was pretty easy, as simple adding a hidden browser element, and a toolbar button to toggle its visibility and set its URL to "view-source:"+URL of the current document. If you're using Firefox, you can go ahead and give this a try right now: Click on the address bar, add the string "view-source:" (without the quotes) before the URL of the page, and hit Enter, or just click here.

Meanwhile, Ravi has been working on Multi-Search Tab, and he has made considerable progress too. ViewTab is still giving us some trouble, we hope to resolve that soon too.

Multi-Tab Search

Since this extension is supposed to be an interactive one, the implementation we currently have in mind is as follows :

• Create a sidebar which will serve as the user interface. The sidebar has a text-box, a search button, and a box for displaying results, grouped by tab-labels (preferably check-boxes, so the user can select the tabs that are to be searched).
  
• As for the search function, it invokes the webBrowserFind object associated with the browser corresponding to each of the tabs selected. We figured this would be much easier and much more feasible than that trying to introduce our own search function. At this point, we don't know much about webBrowserFind, except for the fact that it can be used to search for text in the document.
  
• The results shown in the sidebar are clickable, and take one to the location of the the search result. The results are also highlighted in the document.

We also have in mind a compact interface, which adds a text-box(hidden when not in use) to the status bar, that can be accessed through a keyboard shortcut, or through a menu item, and cycles through the results as the Enter Key is pressed. We'd love to incorporate both features in the same extension, if its feasible, which I'm sure it should be. Let's see how it turns out...