Implemented blocking of YouTube video ads, by rewriting flashvars, for Safari

safari/include.youtube.js

Index: safari/include.youtube.js
===================================================================
new file mode 100644
--- /dev/null
+++ b/safari/include.youtube.js
@@ -0,0 +1,88 @@
+/*
+ * This file is part of Adblock Plus <http://adblockplus.org/>,
+ * Copyright (C) 2006-2013 Eyeo GmbH
+ *
+ * Adblock Plus is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License version 3 as
+ * published by the Free Software Foundation.
+ *
+ * Adblock Plus is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+(function() {
+  function rewriteFlashvars(flashvars)
+  {
+    var pairs = flashvars.split("&");
+    for (var i = 0; i < pairs.length; i++)
+      if (/^((ad|afv|adsense|iv)(_.*)?|(ad3|iv3|st)_module|prerolls|interstitial|infringe|invideo)=/.test(pairs[i]))
+        pairs.splice(i--, 1);
+    return pairs.join("&");
+  }
+
+  function patchPlayer(player) 
+  {
+    var newPlayer = player.cloneNode(true);
+    var flashvarsChanged = false;
+
+    var flashvars = newPlayer.getAttribute("flashvars");
+    if (flashvars)
+    {
+      var newFlashvars = rewriteFlashvars(flashvars);
+      if (flashvars != newFlashvars)
+      {
+        newPlayer.setAttribute("flashvars", newFlashvars);
+        flashvarsChanged = true;
+      }
+    }
+
+    var param = newPlayer.querySelector("param[name=flashvars]");
+    if (param)
+    {
+      var value = param.getAttribute("value");
+      if (value)
+      {
+        var newValue = rewriteFlashvars(value);
+        if (value != newValue)
+        {
+          param.setAttribute("value", newValue);
+          flashvarsChanged = true;
+        }
+      }
+    }
+
+    if (flashvarsChanged)
+      player.parentNode.replaceChild(newPlayer, player);
+  }
+
+  var deferred = [];
+  function patchPlayerDeferred(player)
+  {
+    deferred.push(player);
+  }
+
+  var onBeforeLoadYoutubeVideo = patchPlayerDeferred;
+  function onBeforeLoad(event)
+  {
+    if ((event.target.localName == "object" || event.target.localName == "embed") && /:\/\/[^\/]*\.ytimg\.com\//.test(event.url))
+      onBeforeLoadYoutubeVideo(event.target);
+  }
+
+  ext.backgroundPage.sendMessage({type: "get-domain-enabled-state"}, function(response)
+  {
+    if (response.enabled)
+    {
+      deferred.forEach(patchPlayer);
+      onBeforeLoadYoutubeVideo = patchPlayer;
+    }
+    else
+      document.removeEventListener("beforeload", onBeforeLoad);
+  });

[Wladimir Palant, 2013/12/06 10:58:35]

This code was meant for Chrome where synchronous messages aren't possible -
hence all the complexity with queuing calls until a response is received. This
isn't necessary for Safari, we can do a synchronous call when the first matching
beforeload event is received.

[Sebastian Noack, 2013/12/10 18:51:35]

We only use synchronous messaging under the hood in the abstraction layer, to
make things work in Safari, where Chrome has proper APIs for. However this is
high-level code. And I'm not sure whether I can register another event listener
for synchronous messages in background.js. Even if that would work, it would
slow down synchronous messaging even more, because of all synchronous messages
will be processed by two event listeners then. Of course I could add an API to
the abstraction layer that will allow synchronous messaging in high level code.
But if that is required I think a solution involving asynchronous messaging
would be way simpler.

Also note that synchronous messaging will block, and prevent other code from
running, until the background page sent a response. So I would rather avoid
synchronous messaging where possible.

+
+  document.addEventListener("beforeload", onBeforeLoad, true);

[Wladimir Palant, 2013/12/06 10:58:35]

Adding this listener on non-YouTube websites is too much unnecessary overhead.
This script was originally limited to youtube.com and youtube-nocookie.com
domains, something that apparently isn't possible with Safari. Checking
document.domain in this content script should do.

[Sebastian Noack, 2013/12/06 11:32:33]

I assumed that YouTube videos embedded on other websites can have ads as well?

[Wladimir Palant, 2013/12/06 11:38:10]

There are two ways to embed YouTube video:

1) The old way, with an <embed> tag. There are no flashvars to rewrite here.

2) The new way, with an <iframe> tag. There *might* be flashvars here that we
can rewrite there - but document.domain is YouTube's in that case.

[Sebastian Noack, 2013/12/20 09:23:46]

Done.

+})();