Jetpack to the future with recording Audio API

<p>The Jetpack project is still a young 'un from Mozilla Labs (disclaimer: I work for labs!) but they are moving swiftly indeed, and each new release has a wicked cool new API that let's you do something you couldn't easily do before.

With the Jetpack 0.4 release we see two cool APIs:

Audio Recording API

We have a shiny new <audio> tag which is great for playing audio and all, but how about adding the ability for users to easily create audio?

The new Audio Recording API lets you do just that:

PLAIN TEXT

JAVASCRIPT:

jetpack.future.import('audio');
jetpack.audio.recordToFile();
var path = jetpack.audio.stopRecording();

Play the local file back with jetpack.audio.playFile() or upload it and just use the audio tag itself.

A great showcase of this is the voice memo jetpack "which lets you annotate any webpage you are looking at with your voice." Live streaming is even coming soon. Here comes video conferencing the Open Web way?

Page Mods API

Jetpack is a great way to do Greasemonkey-like work. To make it even easier, you need a way to define when the jetpack kicks in etc, and this is exactly what the Page Mods API gives you.

Check out the blacklist example:

PLAIN TEXT

JAVASCRIPT:

jetpack.future.import("pageMods");
var callback = function(document){
// check the current time if it is between 9 and 5
// 'blacklist' the sites in options.matches
var currentTime;
var currentHour;
currentTime = new Date();
currentHour = currentTime.getHours();
if (currentHour> 8 && currentHour <17){
document.title = "This site is blacklisted. Get some work done!";
$(document).find("body").css({border:"3px solid #000000"});
$(document).find("body").children().hide();
$(document).find("body").prepend($('<h1>Sorry this site is blacklisted until 17:00. sadface.'));
}
};
var options = {};
options.matches = ["http://*.reddit.com/*",
"http://*.cnn.com/*",
"http://*.bbc.co.uk/*",
"http://*.dpreview.com/*",
"http://dpreview.com/*",
"http://*.bloglines.com/*",
"http://bloglines.com/*"];
jetpack.pageMods.add(callback, options);

Nice work guys.

5 Comments »

Comments feed TrackBack URI

Very cool!
Comment by stoimen — July 22, 2009: Does this require firefogg, or is that built into Firefox 3.5 and/or JetPack?
Comment by CaptainN — July 22, 2009: @CaptainN you have to download and install a 3rd party plugin, something like grease monkey but better. Personally i think its not very useful if its not native to the browsers.
Comment by cfipilot — July 30, 2009: I agree
very cool
Comment by RawChocolate — July 30, 2009

Ajax Questions and Answers

Caching and dynamic views
My client does not want to change his cache settings on IE and I'm trying to figure out a way to dynamically update a view each time it is visited. I...

JQuery Function Not Defined?

Hi there,

I'm trying to set a php session variable from a radio button. The idea is that a jquery function is called which...

IE 8 Crashing Problem
Hello Everyone, Here\'s the situation: two iSeries boxes - Dev and Prod both V5R4M0 We\'re using AJAX to dynamically load content using a tabbed...