Tuesday, April 14, 2009

» FlashBlock WannaBe +

I've been using Midori as my primary browser for a number of months (I have a daily cron job that updates and builds WebKit and Midori). It's a fast little browser using WebKit for it's rendering engine and SFX for it's JS engine, so it's standards compliant and really, really fast. And it implements some handy, commonly used features (e.g., error console, user scripts / styles, element inspector).

One feature I've been missing from FireFox is the FlashBlock extension. For those of you who have never used FlashBlock, it essentially replaces flash elements in the page with a placeholder element, which, when clicked, displays the original flash content. It has some other bells and whistles (such as a custom context menu which allows you to directly copy the location of the flash file, or block flash elements on a per-object or per-domain basis, a toolbar button to enable or disable the extension, &c). However, it's the core behavior that I've been missing.

To remedy this situation I looked for user scripts to the emulate the FlashBlock behavior. To my chagrin, I only found scripts which partially emulate the behavior (with most of them doing so inefficiently). So, in a fit of "Not Created Here," and seeking functionality not yet available, I hacked up my own FlashBlock user script; thus was born FlashBlock WannaBe.

Here is version 0.1.0 of FlashBlock WannaBe, relased under the MIT license.

FlashBlock.user.js.txt (remove the .txt extension)
FlashBlock.css

Labels: ,

21 Comments:

Blogger Peter said...

nice!
April 30, 2009 at 4:27 AM

 
Anonymous tan social news pirate said...

nice one mate!
May 27, 2009 at 9:18 AM

 
Blogger antistress said...

great thanks
June 2, 2009 at 6:32 PM

 
Anonymous Anonymous said...

hi nice work. how should this be installed in midori? as an userscript or as an userstyle? thanks in advance.
June 11, 2009 at 5:03 PM

 
Blogger MonkeeSage said...

Copy the CSS to ~/.local/share/midori/styles and copy the JS to ~/.local/share/midori/scripts. (Create the directories if needed.) They should be automatically detected and loaded by Midori after that.
June 12, 2009 at 6:34 AM

 
Blogger jbr said...

Similar instructions for Epiphany (2.27.90) would be much appreciated. I named the .js file ~/.gnome2/epiphany/user.js and the css ~/.gnome2/epiphany/user-stylesheet.css and the annoying flash ads are gone, but I don't get anything I can click on to activate those flash animations I do want to see.
September 7, 2009 at 4:34 PM

 
Blogger MonkeeSage said...

@jbr:

First, you need to make sure epiphany-extensions is installed (or whatever your distro calls the package--or install it from source if you build Epiphany from source).

Then you need to copy FlashBlock.user.js to ~/.gnome2/epiphany/extensions/data/greasemonkey/

After that, restart Epiphany, and it should "just work". :)
September 17, 2009 at 2:48 AM

 
Blogger MonkeeSage said...

Ps. Just to be clear--when you copy the CSS file to ~/.gnome2/epiphany/user-stylesheet.css, it is taking effect, but the js file is not being read from ~/.gnome2/epiphany/user.js, so the end result is that you get no flash (per the CSS rules), but you also don't get the replacement element to play the flash when you click it (which is provided by the user js file). Hope that makes sense.
September 17, 2009 at 2:52 AM

 
Anonymous Anonymous said...

This is a great way to block Flash. The only problem is that on sites like Vimeo, or Pizza Hut, once you press play it doesn't do anything

It does work on YouTube perfectly though.
November 2, 2009 at 2:54 AM

 
Blogger MonkeeSage said...

It works (for me, at least) on vimeo, just takes a few seconds for the video to load after you click the placeholder. I'd be grateful if you'd post some links to content on vimeo (or others) that don't work at all with the userscript. Thanks!
November 5, 2009 at 12:35 AM

 
Blogger MonkeeSage said...

Actually, after a bit of preliminary testing on WebKit-based browsers like Midori and Epiphany, nothing happens when you click the placeholder (for videos on vimeo), until the page is scrolled. After that, the flash content magically appears. I'm guessing this is a bug in the rendering engine (as I certainly can't imagine anything in the userscript being the culprit--it's just calling DOM functions).
November 5, 2009 at 12:43 AM

 
Anonymous Anonymous said...

Doesn't seem to work in private browsing mode.
January 2, 2010 at 5:32 PM

 
Blogger Davie Columbo said...

Just wanted to say, I love FlashBlock WannaBe. Does the job perfectly. Thanks for making midori usable for me.
January 4, 2010 at 12:52 AM

 
Anonymous Guruvardhan said...

Hi MonkeeSage,

Nice tip... i always wanted this functionality... but i really dont know how to create "~/.local/share/midori/scripts" this folder or path... can u pls guide...

thanks
guruvardhan at gmail dot com
January 7, 2010 at 6:13 AM

 
Anonymous Guruvardhan said...

sorry did not mention that i use Midori browser... :)
January 7, 2010 at 6:14 AM

 
Blogger juanitobananas said...

Hi MonkeySage
I am also trying to get it working on epiphany with webkit.. As you said, the user stylesheet is applied (after checking the option in the preferences -- that took me a while ;) ), but, the user script doesn't seem to be running with GreaseMonkey. I just did what you said, copied the file into epiphany's greasemonkey directory but nothing's happening (just as you also said a little above)
But, then I saw you did get it working. Did you do anything special??

Thanx man!

Hi Guruvardhan!!

I think I can help there. You just have to use the 'mkdir' command.
Open up a terminal and write this:

mkdir -p ~/.local/share/midori/scripts

I think that should get it working!
:D
January 30, 2010 at 1:20 PM

 
Blogger juanitobananas said...

By the way... I just nearly forgot about this..

Great job with the script MonkeeSage!!
Thank you very much!
January 30, 2010 at 1:22 PM

 
Blogger MonkeeSage said...

@juanitobananas:

I first installed "epiphany-extensions" (or whatever your distro calls the package). I then enabled the GreaseMonkey extension (under Tools->Extensions). After that, I copied FlashBlock.user.js to ~/.gnome2/epiphany/extensions/data/greasemonkey. I restarted Epiphany, then it just worked.

HTH :)
January 31, 2010 at 2:06 AM

 
Blogger juanitobananas said...

@MonkeeSage:

Well, it seems that it was an Epiphany-version issue. I had the latest Epiphany installed (from the Ubuntu karmic repository) 2.29.0. Just switched to the epiphany ppa and got the newest 2.29.5 and it is working!! :D
February 1, 2010 at 5:08 AM

 
OpenID bokunoshumi said...

Thank you very much. It works very well on 0.4.3 in Debian Jessie.
Great work!
January 8, 2014 at 4:53 AM

 
Anonymous Anonymous said...

Hi, I can't get this to work on Ubuntu 12.04. The icon appears where the video would be but when I click on it, nothing happens.

I have installed both the CSS and user.js and they both show up as ticked in the extensions panel.

Any ideas?
January 23, 2014 at 10:57 AM

 

Post a Comment

Links to this post:

Create a Link

<< Home