This document outlines plans to port the Flashblock Firefox extension to the Jetpack platform. It describes what Flashblock and Jetpack are, proposes an algorithm to find and replace Flash objects with placeholders, and suggests improvements like adding an on/off button and using storage to remember blocked objects. The port would make Flashblocking easier to develop and more customizable while still needing features like localization.

1. PORTING FLASHBLOCK
TO JETPACK PLATFORM
DRAFT

2. WHAT’S FLASHBLOCK?
• Flashblock is an
extension for the Firefox
that blocks ALL Flash
content from loading. It then
leaves placeholders on
the webpage that allow you
to click to download and
then view the Flash content.

3. WHAT’S JETPACK?
• Jetpackis an API for allowing
you to write Firefox add-ons
using the web technologies
you already know (e.g.
HTML, CSS and Javascript).
• Almostone-clic install and
without restart

4. WHAT’S THE PLAN?
• The basic algorithm
• Some code
• What could be improved
• Conclusion

5. ALGORITHM
Quite simple :
• Look for all Flash object
• Replace them by a placeholder
•A click on a placeholder put the Flash object back

6. ON/OFF BUTTON ON THE
STATUS BAR
jetpack.statusBar.append({
html: 'Flashblok?<input type="checkbox">',
width: 76,
onReady: function(widget){
$("input", widget).click(function(){
if( this.checked ){
jetpack.tabs.onReady( removeEmbeds );
removeEmbeds(jetpack.tabs.focused.contentDocument);
}
else jetpack.tabs.onReady.unbind( removeEmbeds );
});
}
});

7. FIND FLASH OBJECTS
Better method
Lazzy method
Search for :
function findFlash(doc){ • object[codebase*="swflash.cab"]
return $(doc).find('object, embed'); • object[data*=".swf"]
} • embed[type="application/x-shockwave-flash"]
• etc.

8. REMOVE FLASH
function removeEmbeds(doc){
findFlash(doc).each(function() {
var placeHolder = createPlaceHolder(...);
// Here I put code to remember my removed Flash object
placeHolder.click(function(eventObject){
$(this).replaceWith(myDeletedEmbed);
});
$(this).replaceWith(placeHolder); // So easy with jQuery
});
}

9. PLACEHOLDERS
• Full CSS3
• Make use of text-shadow, -
moz-box-shadow, -moz-
border-radius and -moz-linear-
gradient (coming with Firefox
3.6)

10. NEXT STEPS
• Block Flash objects sooner • Use
simple storage JEP to
remember block status
• Improve memory footprint
• Usethe coming menu JEP
• Better
way to remember and simple storage one to
removed objects provide whitelist
management
• BlockSilverlight,
Authorware, Director, etc.
objects

11. CONCLUSION
• It’s very easy to develop an extension
• Still lacks some features like localisation

12. LINKS
• Jetpack official site: http://labs.mozilla.com/jetpack/
• Jetpack tutorial: https://jetpack.mozillalabs.com/tutorial.html
• JEPs: https://wiki.mozilla.org/Labs/Jetpack/JEPs
• Original
Flashblock extension : https://addons.mozilla.org/
firefox/addon/433
• Andfinally Flashblock for Jetpack : http://tb4.fr/labs/jetpack/
flashblock/