The big news today (November 9th) is the announcement that adobe will be halting development for flash on mobile devices and the rumor that Microsoft may end development of Silverlight in the near future. Many people have hailed it as a major victory for the web, largely to the wide adoption of HTML5 by browser vendors. Robert O’Callahan, speaking for himself and not for Mozilla of course, suggested that this could spell the end for NPAPI. I find myself feeling pretty conflicted about this. While I finally think it’s about time we move certain functions out of flash and into the browser, I am concerned about the impact of this and the possibility of NPAPI removal.

Down with the system, long live the system!

One of the great joys of Firefox is that if you don’t like something, you can change it (for the most part). This was mainly done through extensions. Don’t like the default developer tools? Get something better! Concerned about privacy? You’re in luck! You did not need someone’s blessing or permission, you could just write it. Sometimes an extension is not ideal. I don’t believe you can override C++ components in Firefox, and you might have limitations to the functionality you can override depending on the browser.

For many browsers, you could write a NPAPI plugin. The benefit of this is that Flash was able to do so many things that has really only been possible in the last 3 years or so. Canvas, video, audio, offline storage was never possible without Flash when I started college. And yet it has so much influence because we knew what was possible and what was important.

We are slowly replacing Flash sure. Even the webcam might one day exist on the desktop. But you can’t have a API and a spec for everything. You just cannot satisfy everyone’s requirements. You can advocate, but the eventual decision will lie in the hands of browser vendors. Having the web compete with itself is not ideal, and we see that when you have to encode a video twice for everyone to play it.

Which is why I having a plugin service is important, and removing it is a step back. It’s not pleasant or perfect, but if it makes a web competitive outside of browser vendors, I think it’s worth it.

I have been working the past few weeks on Ruby on Rails web development framework. My experience with Ruby is minimal, so there was a large amount of learning and re-learning that was required. Working on it full-time for the past week or two, I reflected on some of the pros and cons of the language and framework:

• Ruby blocks are *fantastic*. If you ever had to work with generating XML, I highly suggest Nokogiri to generate and parse XML documents. XPATH? Yes please! (Ok, XML sucks but when you have to use it, this library makes it painless)
• Rails has a ton of shortcuts that make development easier. They have a ton of HTML helpers to auto-generate HTML. The framework takes some getting used, but it works quite well.
• Rails expects you to develop a certain way. IMO, this a very negative attribute until you get used to it. Your controllers names MUST be plural (cashiers, merchants, etc). Your models MUST be singular (cashier, merchant, etc). Breaking the rules leads to frustration and headache.
• Rails expects you to build a certain way. In my application, I did not need to use a database (everything is done using a REST service). But Rails makes this difficult to do.
• The Rails installation procedure is easy, but a bit too easy I managed to screw up a few times (shame on me) and just did gem install rails. That will install the latest Ruby on Rails on your machine. The problem is when I had to move my code to the server. Between development, rails went up a few versions (from 3.0.x to 3.1.x) and a lot of stuff broke. I wish at the time I knew I can install a specific version. Which leads me to…
• Rails is difficult to update. Well, so are most frameworks. I think we need to get better at this developers…

It is difficult to say whether I enjoy Rails or Django. I am definitely more comfortable with Django, but it is great getting to know both. I am still a newbie at Rails, so hopefully things get easier as I do more work on this.

This is something that’s been floating in my head. Not sure how much this is worth advancing, or whether it is deeply flawed. Or whether it was considered at some point but not indexed by Google good enough.

Many sites do mix HTTP and HTTPS content. Sites that do this are no-longer considered secure (Larry goes away, the lock has a warning symbol over it) for good reason, the insecure content cannot be trusted. It may have been tampered with. If the content was a javascript file for instance, it could be very bad news.

But if we know that data from a secure source can’t be tampered with, could it vouch for content that isn’t secure? Let’s take an example of a fictitious webpage :


<script type="text/javascript" src="http://media.cesaroliveira.net/badass-javascript.js"></script>
<img src="http://media.cesaroliveira.net/panda.jpg" alt="look out!" />
Credit card number : <input type="text" ...


Even though the site is served securely, some important information is sent insecurely. I am proposing that the secure content is able to pass along a hash (sha1, not md5) of the content that it expects. If the content in the insecure channel meets the has the same hash value, then we can be reasonably assured that the data has not been tampered with during transport. Let’s see the code again :


<script type="text/javascript" src="http://media.cesaroliveira.net/badass-javascript.js" data-hash="sha1:12b36be3076d357b2d390b2df3f9b65cd55b93e1" ></script>
<img src="http://media.cesaroliveira.net/panda.jpg" alt="look out!" data-hash="sha1:bcf31e777fa69753f8ecf9701fc9b6f1518b51b3" />
Credit card number : <input type="text" ...


Starts with data- because I doubt something like this would be implemented outside of my head. But it seems to solve the problem of tampering with the data. If the hashes don’t match, the website is still broken. If they do match then we should be able to breathe easily.

Of course, in time people will figure out vulnerabilities. Hash collisions is a problem. But this is something that web had to deal with before. Maybe a nice edition would be allowing multiple hash values, like :

<img src=”http://media.cesaroliveira.net/panda.jpg” alt=”look out!” data-hash=”sha1:bcf31e777fa69753f8ecf9701fc9b6f1518b51b3;md5:953c78ac57ca68bfe532eb50120c8aa1″ />

Yeah. I know I said no md5

I was first made aware of the fact that maps.google.com now uses geolocation by sdwilsh, which is new in Firefox 3.5. But when I loaded maps, I was surprised to see that it didn’t work when I visited the site. And I was using something even more recent than Firefox 3.5, Minefield. Surely, it has geolocation, so what is going on?

The reason maps doesn’t support Minefield is because of *drumrolls* … browser sniffing. Developers… no wait… GOOGLE web developers, I thought we moved on?

The actual bit of code is here unminimized and tidied up ;

function isBrowserGeolocationSupported(){
    if (window.navigator &&
        navigator.userAgent.search("Firefox") != -1 &&
        navigator.geolocation)
        return true;
    if (window.navigator &&
        navigator.userAgent.search("Chrome") != -1)
        return Number(String(/Chrome\/[0-9]+/.exec(navigator.userAgent)).substr(7))>=2;
    var gearsFactory=null;

The hell? Ok, so I understand they do a bit of browser sniffing because it looks like Chrome had a old/broken implementation of geolocation. But I wish there was a more graceful way of doing this (maybe something like navigator.geolocation.version < 1). One that didn't break every application that may implement geolocation that isn't named Firefox. Because, those exist too.

A few weeks ago, I wanted to do some C++ Mozilla coding to make sure I wasn’t going soft. But I didn’t really know what to do. I left it for a bit until I found something weird about the HTML5 spec – there was a method of testing whether metadata has been loaded, but no way to expose the metadata (eg. song title, artist, album, etc) to the user such as through page info.

I think this will be useful. As media starts being embedded into the web browser, it would make sense to start exposing this to the user. I know there have been a few instances where I was listening to something on the radio, but there was little hint of what the song was called (I usually tried to remember a few lyrics and did a Google search. Mixed success).

I brought this up in the whatwg irc channel, and apparently this is being considered for the next version of the spec. Which is understandable, because the server can always display the metadata. But often, media may not be central to the website. For example, background music.

I started look at the Audio/Video backend stuff that moz uses. It got confusing real quick (it doesn’t help that the audio code itself is completely empty). Plus I was in a hurry. So I decided to implement it as an extension.

It was a lovely experience. I had a few problems, including finding out that audio/video wasn’t actually being saved to the cache (bug 469446). It was checked-in like 2 days after I found it out. Also, I hate string very much. The string guide helped, but it is still awful. And I made firefox crash a few times because I’m a nsCOMPtr n00b.

Right now, this extension is working only with ogg vorbis files. Which is stupid because <audio /> is rarely used anywhere, and if it is used, only with certain conditions (wikimedia commons uses the audio tag, but not really. Apparently, the video/audio tags start automatically downloading the media even if it isn’t under autoplay. This is a mess if you have dozens of audio tags in one page. bug 464272). It is so rarely used, that I had to create a audio demo page for testing purposes.

Using it is very simple. Right-clicking on a audio tag brings up the context menu. I decided to use the context menu over Page Info because the media tab of the Page info dialog is very much geared towards images, and that code has to be changed in the firefox source (it’s not easy/pretty to overlay).

Which brings up the audio’s metadata

While a lot of metadata is displayed, some isn’t. For example, iTunes has support for cover art as a COVERART header. While you can put that in vorbis, it should be noted that it isn’t widely supported. So I decided to put in only the standard headers for now.

This is dealing with C++ code. Which is much more dangerous than javascript code because NS_ERROR_OMGWTF doesn’t appear in your error console when I try to free an uninitialized pointer. I made basic checks so hopefully nothing bad will happen. But I didn’t do extensive checking in case we have a bad ogg file or something.

Well, to be fair to me, I always save the function’s return value. I just didn’t check whether it passed nor did anything about it. And this won’t just crash at any time. It’ll crash if you try to load the metadata (I’m very nice like that).

The name of the extension is saraswati, named after the hindu God of music and knowledge (really, a Google search helped out a lot here). Please enjoy! (Linux x86, x86-64 and Windows x86 only right now)

What I thought was a bug in the jQuery.browser, turns out to be a bug, but on a function that was deprecated (according to their nightly source) and therefore not likely to be fixed. The bug occurred when calling jQuery.browser.safari in Google Chrome. It would return true instead of false because the user agent had the word webkit in it (yes. That’s the browser sniffing method they use). Some simple methods work better than others.

I need browser detection so I can point users to helpful places when they have javascript disabled. Turns out my site is really broken when js is disabled. And when css is disabled as well, but that’s another problem. I made a quick and dirty jQuery plugin that includes konqueror, Google Chrome, and fixes the bug mentioned above.

Using it is as simple as :
$.browser.konqueror
$.browser.chrome

But don’t take my word for it. Try out the demo and view the source! It’s under the MIT license. It’s not included in the source because it is just too much overhead.

1. for each…in doesn’t work in Opera/IE/Safari. So avoid it when creating web pages and use for loops instead. In fact, you shouldn’t even be using it in arrays. oops. (Javascript is special in this way)
2. While location is defined by most browsers, most let you redefine it in a local scope. Not Opera
3. $(‘<a>’) may look correct in jQuery, but it will not work properly in IE. You must close the element tag. So it is $(‘<a />’)

There was a bunch of GPG tinkering trying to get GPG to generate a ssh-compatible (ie. one you get from id_rsa.pub) key using my private key. While it turned into a epic fail costing me a good chunk of the day. I dived a bit into the security stuff that everyone hates.

While going about my day, I wondering if self-signed certs can be used in a way that wouldn’t get you ostracized from a security conscious community. Johnathon has warned the blogosphere at large why self-signed certs are bad and why Firefox makes you jump through hoops to allow a self-signed cert to get through. But I thought of a good use case for why you may want to use it :

1. Self-signed certs provide little value for your users (fe. blog comments are public anyways)
2. You may not have the means (eg. credit card, unique ip if your with Dreamhost) to buy one
3. You only really need them for some basic stuff that users shouldn’t interact with at all. Like logging in to wordpress.

In which case, you can generate a self-signed cert and configure a web server to serve you it on some uncommon port such as port 43034. The benefit is that its transparent to users. It will not interfere with their browsing. And you get the benefit of encryption and authorization, and knowing for certain that the certificate is yours (you have access to the certificate’s fingerprints).

I tried this on Dreamhost and I failed. Or, rather, Apache doesn’t you set up a <VirtualHost> in a .htaccess file. Dreamhost didn’t have anything in their web panel that would fix this. You can enable SSL for a site, but they force you into port 443 and don’t let you have both HTTP and HTTPS.

Another excellent educational learning opportunity ruined by over-zealous security zealots.

This post is a mashup of a few things I have been tinkering with over the last week that I think is fun to share. So if it seems I have been unfocused or whatever, this is pretty much why.

The first project I started doing for fun was working on canvas. This was different then some canvas stuff I have done in the past, The interesting people at nihilogic did a sepia filter using canvas. I wondered if it was possible to do filter so you can see an image with a red-green colour blindness. After some substandard research, I finally managed to do it. Though the quality is poor because it tends to be inaccurate. YMMV.

I wondered if you can do something like this for an entire webpage. So I moved the Javascript to an extension so I can use canvas’ drawWindow() method and take a picture of the entire website. Though I noticed that doing this on large image was computationally expensive and locking up the UI for an unreasonable amount of time.

I then tried to move all the calculations out of the main thread into a DOM worker thread. It was an interesting experience. I noticed though that while the main thread (and therefore, the UI) did not lock up, it was still sluggish and impractical to use. So I decided not to develop the extension further.

You can see the full demo here.

I then thought about what this would look like on other browsers. I didn’t expect anything requiring DOM worker threads to work on Safari/Opera. And sure enough, it didn’t. But I found out that DOM worker threads was based off of Google gears! So I looked into that and made a separate webpage that uses gears. Unfortunately, I found out that my efforts were largely wasted, as it only increased support to Firefox 2 and Mac Safari (Gears isn’t compatible with Windows Safari or Opera, and IE doesn’t have canvas support).

Either way, I made the Gears version available here.

Going away from canvas, I spent most of another day working on Google Maps API. The problem I was trying to solve was to see if I can highlight a 1 square kilometre radius from a pinpoint. This was difficult, as points on a map had a latitude, longitude co-ordinate, and I had to blindly figure out how much to reposition for a half-kilometre. Finding the distance between two points was also helpful, but hard getting a good formula for.

Of course, I am highlighting all the accomplishments and not mentioning the frustrating obstacles. There were several lessons learn on the way. Including a lot about incompatibility and how much I still don’t know how to do the kind of algorithmic research that you sometimes need. I’m starting to wonder if the BSD course taught me more than just to be a code monkey with a business touch, and made me wonder whether the theoretical/mathematical part will ever stop me doing something because “I just won’t get it”. Though, at the same time, I wasn’t willing to put the time and effort of research into pet projects. So this will probably be a problem for almost everyone, and not just me (honestly, mapping out longitude and latitude to distance is not something you learn anywhere).

This has annoyed me all day. First they renew the “economic agreement” with Mozilla until 2011, and now they’re going to release their own browser. What?

Don’t they have shareholders who have a big stake ($463 right now) to gratify? That’s like Microsoft hiring Linus Torvalds to work on the Linux kernel. How do you get away with something like that? Is Google so rich that it is paying people to compete with it?

Actually, that last one is kind of funny.

This makes so little sense to me that I have to think of outrageous reasons for the announcement :

1. Starting with the least outrageous reason : Google is actually trying to expand competition in the web browser/mobile space. Though, I thought that IE/Opera/Firefox/Safari was a good mix. This isn’t gas stations we’re talking about. Competition for browser market share extends far beyond these four browsers.
2. They legalized mind altering drugs in Mountain View. (Mythical mushrooms in the Escape menu, Hippie crack at Slice)
3. They’re sending Mozilla a second hint that they want Mozilla to drop Gecko
4. Judging by some of the screenshots, this is another way to get more Google traffic. But come on? Your own browser?

Comments, additional conspiracies welcome.