Posts Tagged ‘firefox’

Making YouTube (very slightly) more child-safe with a Firefox extension

Tuesday, November 16th, 2010

Kids stuff on YouTubeOur six year old daughter, Grace, has lost interest in kids TV recently – she’s discovered the joys of YouTube!

She can happily spend a half-hour sat in front of the TV on Firefox (our TV set-up is a Linux-based media centre, so it’s proper Firefox with a keyboard and mouse) clicking from video to video.

I’m fine with this. It’s good: she’s getting more familiar with how to use a web browser, getting used to starting the browser, typing “youtube” into the address bar, using the search box to search for what she wants, using the ‘Back’ button to go back to the search results if it’s not what she wanted, and so on. This is all good stuff, let alone the fact that there is a lot of content on YouTube that is actually ideal for kids.


Well, she’s six. Not every video on YouTube is suitable for her. I’m not just talking about the stuff for over-18s. I don’t even want her to come across stuff with, for example, more swearing and violence – such as stuff that you might be happy to show a 12 year old.

The real solution to this is what we do now – she’s doing this in the sitting room on the TV, while we’re in the room watching stuff with her. I’m not saying I want to give her a laptop, send her up to her room, and say “here’s YouTube – off you go, have fun!”.

Even so, I wanted something to help out a little.


Beginner’s guide to writing a Firefox extension

Sunday, February 22nd, 2009

Last week, I shared my hack for syncing my browsing between my computer and mobile. It’s built around a Firefox extension, so I thought I’d share my notes on how I got it to work.

screenshotThis post is a complete sample for creating a Firefox extension to add a button to the browser toolbar. When you click on the button, it grabs the URL from the Firefox address bar and does something with it.

I’ve gone through each file you need, explaining what it’s for and giving a sample ready for copy-and-pasting.

In my browser sync hack it sent the URL to my phone, but for this walkthrough I’m going with something simpler: opening the webpage in Internet Explorer. You can replace that bit of script with something more useful 🙂

I’m not an expert at this stuff by any means, and I found a lot of useful code snippets on to get me going. But this seems to work, and as people that I’ve shown my extension to so far seemed surprised at how easy it was, I thought it might be useful to share.

Apart from the Internet Explorer bit itself (which is a little Windows-specific), the rest of this should all work wherever Firefox does.


Syncing browsing between mobile and computer

Tuesday, February 17th, 2009

Imagine the scene.

You are sat at your computer, reading a fascinating article online.

You’re about halfway through reading it when something comes up and you need to leave your desk.

Wouldn’t it be great if you could finish reading the page on your mobile? (Without needing to remember how you found the webpage, or what the URL is?)

With this Firefox extension, you can. 🙂



HackDay – writing a Twitter dictionary

Sunday, April 27th, 2008

As I said on Friday, Friday was IBM Hackday 5. I didn’t really explain what HackDay is, but if you’re not familiar with it, Kelly has posted a good description.

I made all my excuses in my last post, so with them out of the way, here is my hack.

The idea is an old one – but I’ll summarise it again here.

The hack was to extend the website to provide additional context for people’s tweets.

Every twitter user can maintain their own personal dictionary of terms, that describe their personal significance when they use them in tweets. When one of these terms is used in a tweet, it is highlighted in some way, and if the user hovers their mouse over them, the full description is shown in a pop-up.

For example, my twitter dictionary might include entries like:

  • Grace – my three-year old daughter
  • Faith – my baby girl
  • Hursley – IBM Hursley Park, the site where I work
  • SYA – a youth charity that I started and am now on the board of trustees for

an example - screenshot of my hack in action

The idea isn’t to say what something means (why try and replace people’s ability to use Google?) but to say what it means to the tweeter.

Other uses could include to provide ‘disclosure’. For example, when I see posts by James Governor, I often see a few lines at the end such as:

…IBM is a client. RedMonk runs Google Docs. Google and Salesforce are not clients. We don’t currently use Salesforce apps…

But in the twitter world where thoughts fit into 140 characters, there isn’t the space to include this sort of context with every tweet. So James’ twitter glossary might include entries like:

  • IBM – IBM is a client


Capturing page loaded events from a Firefox extension

Sunday, April 6th, 2008

One of my hacks at Over The Air was an attempt to sync browser histories between desktop and mobile. A part of this was a Firefox extension which listens for when I go to a new webpage, gets the URL from the Firefox address bar and sends it to a connected mobile.

As my first attempt at a Firefox extension, I was surprised by how easy this was. I’ve made it, so if anyone wants to learn or build on it, downloading the source may be useful. (Remembering it was thrown together in a bit of a hurry!) But I wanted to highlight a couple of quick points.

Firstly – getting started. Owen pointed me at a brilliant Firefox extension wizard. Fill in the simple form – telling it stuff like whether you want to add an options dialog and preferences, or a context menu item, or a toolbar button, and so on. And it generates you a skeleton Firefox extension ready for you to fill in with code. This probably saved me an hour or two of reading about how to create Firefox extensions!

Secondly – capturing new pages. This was done by adding a listener for DOMContentLoaded events:

var appcontent = window.document.getElementById("appcontent");

And in my content loaded function, I got the URL like this:

var urlbar = document.getElementById('urlbar');

Browser syncing – mobile to desktop

Saturday, April 5th, 2008

Completing the loop for my browser sync hack for Over The Air – this time, syncing back the browser history from your mobile browser when you get back to your desktop computer.

When you connect your mobile to your computer, the URL history of Pocket Internet Explorer is queried and the most recent item is opened on the desktop using your default web browser.

This was a little tricky to implement and needed me to cobble a few bits and pieces together:

  • A C# service running on the desktop that uses RAPIManager to trap and handle device connection events
    On connection, the service uses RAPI to invoke a process on the mobile…
  • The process on the mobile is something that I wrote in C++ to query the PIE cache – using the FindFirstUrlCacheEntry / FindNextUrlCacheEntry API. The URL retrieved is written to a file on the mobile.
  • The C# service on the desktop transfers the file containing the URL from the mobile, and uses Process.Start to launch it in the desktop’s default web browser

It’s a little icky… but it seems to work!

Browser syncing – desktop to mobile

Saturday, April 5th, 2008

Third of the random ideas for Over The Air hacks – a browser sync for Windows Mobile.

The aim was to let you transfer your browser history from desktop to a Windows Mobile PDA, so when you leave your desk, you can pick up where you left off in whatever you were doing online.

I’ve written the hack as a Firefox extension, and it currently has two modes:

  • Always on
    Every web page you view in Firefox gets opened on the mobile browser in the background without you noticing. When you disconnect your mobile from the computer, you not only have the most recent page all ready for you in your mobile browser, but you also have a mirror of the Firefox history – so clicking ‘Back’ on your mobile browser will take you back to the previous page you were viewing with desktop Firefox.
  • Single sync
    Take the current page you are viewing in Firefox, and open it on your mobile browser

The toggle to start/stop the ‘always on’ mode, and the switch to perform a single sync are both provided as toolbar buttons.

Install the Firefox extension here