Restartless Firefox Add-ons, Part 3: Icons

Well this is only part three, we are still just getting started after all =] so since I have very little time today I thought that I would write about how to include a icon for your restartless extension, since it's not exactly obvious. Although this method is documented here.

Basically all you need to do is include a icon.png in the root of your xpi (the same place as your bootstrap.js and install.rdf) and Firefox will automatically find it. You can also include a icon64.png in the root of your xpi and this will be used in the add-on manager's add-on detail view, so it's a good idea to include both if you have them because it'll be a better UX.

If you want to use the icon in other places use the method that I described in part 2 in order to find the file: url of the image and use that.

Restartless Restart Add-on for Firefox

I've always wished that Firefox had a "Restart" menu item, and because of that I've used the Quick Restart Firefox add-on quite a bit in the past. At some point last year while the Jetpack prototype was still being developed I even wrote a jetpack to add the menu item in less than 50 lines for a contest that Mozilla had. I used that for a while, but these days I live on the FIrefox nightly (aka Minefield) and both of those old options aren't available to me any longer. So I decided to write a restartless add-on to add a "File" -> "Restart" menu item to Firefox.

I'm calling this add-on "Restartless Restart" and it works on FIrefox 4+, it's 1KB at the moment, and it does not require a restart to be enabled, disabled, installed, or uninstalled. You can find it on addons.mozilla.org here. If you want to contribute, then you can find the project on GitHub, where all of my projects can be found.

The part that I love most is that it's still less than 50 lines =]

User Script Revives GitHub's Old Download Tab

About three weeks ago GitHub removed a bunch of links to a repository's 'downloads' section replacing them with one big downloads button, which is only available to you on some pages, and instead of taking you directly to the 'downloads' page/section you now get a AJAXy popup that only displays some of the available downloads to you and provides a link to the 'downloads' section.

In my expert opinion this button sucks. It's hard to remember which pages it's available on, except for the source page so I always go there to find it, then I have to wait for a popup that I don't want to see inorder to get the link that I'm after.. another option is to correct the url in the location bar, which is the route I was taking before I finally decided to write a user script to bring the old tab back.

Sceenshots

This is what the old 'Downloads' tab looked like:

GitHub's old 'Downloads' tab

This is what their new button looks like:

GitHub's new 'Downloads' button

User Script

Find this user script at userscripts.org here.

I understand that they had too many links to the 'downloads' section before, but the only one I ever used was the 'downloads' tab, and it's the only one that I find myself wanting now that the old links have all been replaced with the big awful button. So I decided to write a user script to bring back the 'downloads' tab and remove the new button, here it is:

Gist 644434 embed above

Status Update: Week 42

Well I started this week working on Scriptish, but I felt that I needed a break after working on it nearly every day for the past few weeks, so I spent about half the week working on a few other things.

Mozilla Lab's Prospector add-ons, which they announced two weeks ago, caught my attention and I started doing a little hacking on one of them; after spending some time using 2 of the currently 4 prospector add-ons I can tell you that I really like them, because they each focus on solving a single, particular, searching UX/usability issue in the context of the browser, and they're restartless!

Done

Scriptish

  • Released Scriptish 0.1b5 on the 19th.
  • Replacing the status bar icon with a frequently requested toolbar menu-button (It's a button & a drop-down menu), which is added to the add-on bar when Scriptish is installed for the first-time, or when Scriptish is upgraded from a version less than or equal to Scriptish 0.1b5.
  • Added a ID field to the new script window.

GitHub Flavored Markdown

MDC

I noticed that there wasn't any documentation on em:bootstrap on the page describing install manifests, so I added something basic with a link to more information.

Mozilla Labs: Prospector - Find Suggest

  • Performance tweaks.
  • Bug fix when using the find bar on a blank page, which causes an error to be thrown (issue #1).
  • Sorting words with equal frequency alphabetically (issue #3).
  • Changing the regular expression used to split words (issue #4).
  • Requiring words to be 3 characters or longer (issue #2).
  • Making the suggestion limit a user preference (issue #7).

[More]

Status Update: Week 41

Well I blame bug 604368 for bogging me down a bit this week. I lost some time dealing with crashes and trying to determine the cause at first, until I finally came across #604368. Oh well though, no hard feelings, it is called Minefield, and the changes are meant to improve performance, so I'm not upset at all. I was able to get some progress done on Scriptish still by installing the latest Firefox beta and Seamonkey beta and using those.

Done

Scriptish

  • Seamonkey is now supported (issue #52).
  • Auto generating homepage URLs from download URLs when @homepageURL is not defined for user scripts installed from userscripts.org (issue #76), gist.github.com (issue #77), or github.com (issue #85).
  • Updated GM_notification(msg) api to now be GM_notification(msg, title, img, callback).
  • Added a new default user script icon.
  • Fixed a bug for scripts that attempt to overwrite a global variable, like scrollTo.
  • Fixed a bug where the uninstall state of a user script was forgotten when returning to the user script list view from a user script detail view.
  • Closing GM_worker threads when a window closes now.
  • Fixed a small bug where content pages could have detected Scritpish on the user's browser by checking for the presence of some resource: url files which Scriptish provides. Now afaik Scriptish cannot be detected, and Greasemonkey can be detected.
  • Made a small UX change to the status bar menu, when enabling or disabling a script the menu no longer automatically closes, so that you can easily enable/disable multiple scripts and it's still easy to close the menu by clicking anywhere else.

I also got some progress made on implementing @run-at document-start, it isn't going to be part of 0.1 I think at this point, but so far it looks promising, nothing pushed online yet though.

[More]

Scriptish Beta! A New Greasemonkey

My favorite browser extension for quite a while has been Greasemonkey (GM), I loved how simple it made customizing the web with JavaScript (JS) which allows all users to both filter out the crap that site owners try to provide us (ie: ads, share links, suggested junk) and add new useful features anywhere you that wish. Greasemonkey allowed us to customize the waves as we surfed the web, as well as making a few modifications to the board, and I loved it for that.

Some problems arose with Greasemonkey though, because it was built for Firefox (FF) 1.5, and even the latest GM version (0.8.6) claimed to support 1.5, which meant that Greasemonkey the GM maintainers did not want to introduce new features that would not be available in FF 1.5, and they did not want to take advantage a of newer version, like say FF 3.0's JavaScript Modules (JSM), which would allow GM to use much less memory and improve performance when a user is using multiple windows, and on startup because less JS would need to be loaded at startup.

The good news for GM is that with the next major release, 0.9 (which contributors including myself have been working on for quite some time now) is that the minimum version of Firefox that Greasemonkey will support will be FF 3.0, which means it can now take advantage of the benefits that FF 3.0 offers, finally. The trouble I found while trying to contribute to GM is that the maintainers don't really want to alter the code base, they're actually seem to be fine with doing the minimum necessary and bug fixing for the rest of the future, at least that is how it seemed to me after writing quite a few patches which were rejected, either outright, or by degradation (meaning I would have to basically redo everything, on crappy architecture, because they've sat on their hands for so long). Patches such as using JSM, reg exp @includes, @icon, and a few more.

So the reason that I decided to bypass Greasemonkey and start working on a fork, which I now call Scriptish, is because I was tired of beating my head against a wall, I wanted to have and use the Greasemonkey that I always wanted asap, so I'm making it now. I've always enjoyed working with others, and I hope that I can convince some GM contributors to start working on Scriptish in the future.

Scriptish

Scriptish is a fork of GM, you can think of it as a superset of Greasemonkey, it can do whatever GM does, and more. Some of it's new features are:

  • @author - displayed to users in the addon manager
  • @contributor - displayed to users in the addon manager
  • @homepage or @homepageURL - displayed to users in the addon manager
  • @icon or @iconURL - Include a icon for your user script which is displayed in the addon manager and for notifications from the script.
  • @screenshot - displayed to users in the addon manager.
  • @match - a include pattern introduced by Google Chrome user scripts.
  • @noframes - a simple way to prevent a user script from running in iframes.
  • GM_worker - use a Worker within user scripts.
  • GM_notification - send a Growl style notification to the user.
  • GM_setClipboard - save data to the clipboard from a user script.
If you'd like to do some reading on these features, then checkout the Scriptish wiki, which should explain them all in detail.

Other changes include major reorganization of the internal code, using JSM, in a way that only loads code into memory that will actually be used, by loading the req'd code the first time that it is going to be used. I was also able to remove a bunch of legacy code, because Scriptish will only support Firefox 4.0 or higher for the moment.

Give it a try!

If you'd like to give Scriptish a try, then you can download Scriptish here. If you want to get involved here are some links for you:

I hope you like it, I'll be working on it for the next few months at least, pretty hard I imagine; I'd like to make it restartless, and implement user script updates & communication asap. If you think you'd like to open it up and hack on it, then please do!!

UserScript: Showing Page Titles & URLs in Google Analytics

Often, when you're using Google Analytics, you want to be able to segment by the page's title, but there is no default way to do this with Google Analytics.

Well, a couple of hours ago I started catching up on my reading in Google Reader, and I noticed a blog post from LunaMetrics titled "Showing Page Titles & URLs in Google Analytics", and that post pointed out exactly how to segment by page title.

So, I took a couple of minutes and wrote a userscript to add this dimension to the 'segment by' drop down with a userscript so that you can easily segment by page title, without having to think about how to do this. Here's the code:

This userscript is available on userscripts.org as well, here: Google Analytics Page Title Segmentation

Enjoy!

Easier GitHub Fork Switching

There are many issues I have with my favorite site to host git repositories, GitHub, but today I decided to solve one of them.

The Problem

When you are on a page in one of your project forks on GitHub for say some file in the repository, and you want to switch to see the same page for the project that you forked from, then you have a number of clicks and page loads ahead of you. My feeling is that there should be a single link that allows you to do this, and vice versa.

[More]

The Principle of JavaScript Illumination

Every web developer knows that their site should work when the site's users disables JavaScript, but I constantly find this principal is violated when it is simple thing to obey. When web UI developers violate this principal it shows an extreme laziness and a failure to understand good practices on their part; this can greatly worsen the user experience. So, I'd like to articulate what I'm going to call The Principle of JavaScript Illumination which is an idea I haven't seen articulated yet, but that everyone knows in their gut they should do, and yet I hardly ever see this principal adhered to in practice.

Definition

The Principle of JavaScript Illumination is a simple one, if some user interface element will not work when JavaScript is disabled, then have JavaScript add the element.

Implications

If you have a user interface (UI) element that uses JavaScript, then make sure there is a default functionality that will work when JavaScript is disabled. If the UI element cannot work at all without JavaScript, then you should make JavaScript add the element, this way if JavaScript is disabled then the user will not see UI elements that will not work, causing a bad user experience.

Examples

Facebook Chat

When you log in to Facebook with JavaScript disabled, the chat widget is displayed to you on the bottom right of the screen, but it doesn't do anything, it's completely useless to you and it's just in the way, so why the heck is it displayed to the user?

Kampyle

Kampyle provides some widget code for anyone to put on their site which adds a "Give Feedback" button to the bottom right of the user's screen, which the user can click on to give feedback for the site. The trouble is, when JS is disabled, or when the user uses NoScript to block assets from the kampyle.com domain, then the button doesn't work (see ROIRevolution's site for an example of this), so why the heck is it displayed to the user?

Conclusion

Be a good web citizen, and a smart web developer by obeying The Principle of JavaScript Illumination, because it's the right thing to do and because you're users will thank you for it.

My Solution to the Alt-Tab Problem

While I was reading through my subscriptions the other day I noticed Aza Raskin's recent blog post, "Solving the Alt-Tab Problem", where he describes issues with the current alt-tab implementation which orders the applications by Most Recently Used (MRU), please take a moment to read his very detailed post before continuing with this post.

I thought this was a very interesting problem. I've personally always hated the way that alt-tab works, and hardly ever use it because of this, even though I know it should be helpful, it just is not. So, I thought a bit about this in the back of my mind and I finally came up with a solution that I like, and I haven't seen it mentioned yet so I will explain it here, but first I want to list the issues Aza mentioned with MRU and my main issue with it, then I'll quickly describe some of the other solutions I've heard, and finally I'll give you my solution.

Issues With MRU

  • Switching between 3+ applications is brutal (see Aza's post).
  • Constant seethings of MRU confound a person's strong spatial memory (see Aza's post).
  • Thinking about how to switch tabs rips a person's attention from their real task (see Aza's post).
  • If a user presses alt-tab, then decide they made a mistake and want to return to the application that they were using before pressing alt-tab, then they need press alt-shift-tab, because if they just let go of the alt key, then they will be switched to the last application that they used (my issue).

The first and last issues listed above are the two main reasons why I never use alt-tab today.

Proposed Solutions

Aza's HRMRU

In Aza's post he mentions a possible solution, which he admits he doesn't think is great, which is a habit respecting design which he dubbed HRMRU. HRMRU is basically a prediction algorithm which allows the computer to try to predict the order that you desire (read his post for a full explanation). He mentioned the possibility of using a Markov model, but an HRMRU could be implemented an infinite number of ways.

The way that HRMRU is implemented doesn't really matter imo, throughout my time at UBC studying statistics and computer science (with a focus on machine learning), and the rest of my life, I haven't seen an algorithm that would be suitable to implement HRMRU, indeed I wouldn't trust a human being with all of the time in the world to predict my habits (in this context). Furthermore, if some HRMRU method were implemented, then in order to switch applications in the blink of an eye I would have to predict the predictions made by the HRMRU implementation, and that would a terrible user experience. My last issue with this solution is that it would bog down my machine; I absolutely hate it when applications use cpu cycles when it is not necessary, when that happens I start losing control of myself, and I seriously want to start bitching at the developers, because it's what they deserve (if they didn't give me the option of turning their crappy code off).

Lukas Mathis' Solution

I'm not sure what to call Luka's solution, but he explains it here. Basically his idea is to have the currently open application in the second position, and the last application opened in the first position, and the rest are listed in positions 3 and on. Read his post for full details.

This solution would solve the last issue listed above, but does not solve the other issues.

Others

In the comments of Aza's post I saw a number of other options/~solutions mentioned, some of which I think are worth mentioning here, which I'll do as best as I can. There are other solutions mentioned in the comments of Aza's post though, so don't assume this is a comprehensive summary, because it's quite far from that.

Constant Order

This solution is very simple, the applications are listed in the same order that they were opened.

Truth be told I think this was the best solution mentioned in the long list of comments on Aza's post, it's even better than MRU, it takes care of all issues except for allowing quick application switching, which happens to be very important.

alt-tab-mouse

This is implemented on OSX and the windows alt-tab power toy (maybe winXP too I haven't checked). It's a simple solution, the user presses alt-tab, then uses their mouse to select the desired application.

This is a great solution, there is no doubt about it, but switching from keyboard to mouse all of the time is a terrible user experience, so a fully keyboard based solution is a must have, so this is only really part of a solution. Also, switching between 3+ applications in the blink of an eye is not possible with this solution, so it's just not enough.

Application Grouping (Activity Grouping)

I didn't really bother figuring out how this solution is supposed to work, as I understand it though you'll be able to group applications together, then some how you're able to switch quickly between applications..

Albeit, I don't fully understand this idea, and may not fully appreciate it, but it doesn't sound great to me. Presumably I would have to switch group/activity, then choose an application, and how I would do this isn't clear to me. This does sound like it could be an option, but it sounds like switching between 3+ apps may still be an issue, or at least it's not something that you could do in the blink of an eye.

Number the Listed Applications

This idea is simple, number or letter each open application (with 0-9 and a-z, then nothing). This way a user can alt-tab, then hit the number/letter associated to the desired application.

I like this solution.

My Solution

To start with I think a few of the solutions mentioned above should be implemented, namely the alt-tab-mouse solution, the lettering of the first 26 open applications, and ordering the applications by the order that they were opened.

Obviously, I think that if the user presses alt-tab then lets go of these keys, then I don't think the application should be changed. Also, I think the user needs to be able to customize the order that the applications are ordered (the default ordering would be the order they were opened, and this would be customizable on the fly), so the question is how should the user be able to do this? well I thought of a couple ways, one is to use the mouse to change the order via drag & drop, and the keyboard method I thought up was to incorporate the ctrl key. To change the order of the applications by keyboard only a user would simply move the selection box to the application that they want to move (so alt-tab or alt-shift-tab to the application, while holding the alt key) then they hold the ctrl key along with the alt key which 'picks up' the application, and then the user could press alt-ctrl-tab to move it right, or alt-ctrl-shift-tab to move the application left.

Now when the user presses alt-tab the currently focused application will be selected, and they can quickly alt-tab to switch to the application to the right, or alt-shift-tab to switch to the application to the left, and they can manually alter the order of the applications to something suitable for them at that moment in time.

There should also be a separate key for switching back and forth between the last application used, I don't care what it is, maybe alt-tab-`, it doesn't matter I think. It would also be nice if the last application used was easy to spot in the alt-tab list somehow, so that the user could slow down and ensure that they are going to the right application before switching, so in this case they would press alt-tab, then hold tab see the last application used, and then press ` to select it and then they just let go of the alt key to switch to it.

Finally, I've got another set of hotkeys that I think will help, which are to use the numbers 1-5 or 1-9 such that the user can quickly switch to the application that is some # positions away from the currently application in the alt-tab list by pressing alt-# or alt-shift-# (ie: pressing a number while holding alt) which would select the application some # of positions to the right or left of the current application (ie: pressing tab while holding alt is equivalent to pressing 1), and if the desired application is 100 positions away or whatever, then they just press alt-tab-5 20x, or reorder the list so that they don't have to do that every time. This may sound bad for a large number of applications, but that'll be the case with any solution, even HRMRU.

You'll notice that all of the issues listed above are solved, and the code would be lightening fast, the only issue I see is that unless you've read about these hotkeys you may not find them, but alt-tab will still work, and be useful.

More Entries

© Erik Vold 2007-2012. Contact Erik Vold. Top ^