The Future is Simple

(Click here to go straight to the webapp creation details)
(Click here to grab the template webapp file)

Web-based applications are all the rage currently (if you haven't heard, you're either under a rock or better at avoiding hype than I). Creating a functional application that makes use of HTML for a UI makes a lot of sense, and can greatly speed up development.

An idea based upon this that has intrigued me recently is the idea of SSB (site-specific browsers), and specifically Mozilla's Prism application/framework. A site-specific browser has also been called a distraction-free browser. The idea is to take the presentation aspects of a web browser, but remove all other associated web-browser nuances/distractions (i.e. toolbars, navigation controls, etc.). Basically you end up with the equivalent of a single, desktop application that still uses a web browser underneath.

I finally found the answer for how I would try this out while trying to solve a separate problem. My son (currently 7 years old) has been using email off and on for about 3 years now. I started him out with Gmail, but initially had him use a POP3 client. However, after moving the rest of the family to solely use the web interface I wanted to remove the installed client. This left me with 2 options:

1. Teach him how to open a link to Gmail, logout the current user, and type his username and password.
2. Find a way to give him his own access to the web browser interface that didn't interfere with anyone else in the family.

The first option was not a possibility. This was both too much work, and potentially too disruptive to other Gmail users in the household. So, I had to determine the best option for #2. After briefly considering having him use IE (since none of us use it), I regained my senses and realized that Prism could be the perfect solution for him.

5 minutes of learning how to create a Prism configuration file, followed by about a minute with "view page source" to figure out how to directly log him into Gmail, and I was ready to go. Now, couple that with a slick Gmail icon from one of my favorite free icon sites, zip it all up into a "webapp" file, and I was done. I ran it once to install into Prism, and then used the "Install Shortcut" option in the bottom, right-hand corner of Prism to install it to the desktop for him. It turned out very slick overall. I might yet make use of some of the scripting and styling features of Prism to automatically resize the window to a given size (currently it remembers between sessions just fine though), and remove some of the unnecessary UI elements from Gmail for him. For now though, this solves the problem very nicely.

One final tip. I wanted to host the template webapp file for all of this someplace permanent so that I could link to it. It turns out that Google Groups fit the bill very nicely for me, up to a 100 MB limit. Unfortunately, Firefox doesn't handle .webapp (or maybe it is the zip file format) very well so I can't directly link to the file. You'll have to right-click and save it.


Now, for the implementation details.

1. Create a file named webapp.ini, mine looks like this
   

   [Parameters]
   id=gmail@localhost
   uri=https://www.google.com/accounts/ServiceLoginAuth?
       service=mail&Email=YOUR_GMAIL_LOGIN&
       Passwd=YOUR_GMAIL_PASSSWORD&continue=
       https://mail.google.com/mail?ui=html&zy=l
   status=no
   location=no
   sidebar=no
   navigation=no
   icon=gmail

2. Find an icon file (in this case it would need to be named gmail.ico, but you could modify the "icon=" line if named something different. The "icon=" line can be removed entirely to use the default Prism icon.
   
   
3. Zip up the .ico and .ini files with your zip program of choice (I use 7zip). Once you have created the archive, change it from a .zip extension to a .webapp extension to have it automatically load with prism upon double-click.
   
   
4. Double-click the webapp to load it in Prism.
   
   
5. <optional>Verify that everything is working correctly, and then drop-down the gear icon in the lower-right and select where to create a shortcut.

Finally, here is a template webapp file you can customize to do this yourself. All that needs to be changed is to open the webapp file up in your zip program (again, 7zip for me), and edit the webapp.ini file. The only things that will need to be changed are the YOUR_GMAIL_LOGIN and YOUR_GMAIL_PASSWORD values (to your Gmail email prefix and password respectively).

One last note. I needed this to work on a Windows PC, so the instructions are very much tailored for that. There shouldn't be any reason this won't work on Linux or Mac though.