Issue 3532 - Generate animation images at runtime

lib/utils.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-2016 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
@@ skipping 101 matching lines @@
 
   getDocLink: function(linkID)
   {
     var Prefs = require("prefs").Prefs;
     var docLink = Prefs.documentation_link;
     return docLink.replace(/%LINK%/g, linkID).replace(/%LANG%/g, Utils.appLocale);
   },
 
   yield: function()
   {
+  },
+
+  loadImage: function(path, size)

[Sebastian Noack, 2016/01/22 15:59:15]

I think I'd rather keep that function in icon.js but merely make it public and
add documentation.

[kzar, 2016/01/22 16:49:35]

Done.

+  {
+    if (!path)

[Sebastian Noack, 2016/01/22 15:59:15]

Is that actually a scenario we need to handle?

[kzar, 2016/01/22 16:49:35]

Yes, it meant I could simplify the logic to load the images in icon.js quite a
bit by just using Promise.all.

+      return Promise.resolve(null);
+    if (size)
+      path = path.replace("$size", size.toString());
+
+    return new Promise(function(resolve, reject) {
+      let image = new Image();
+      image.src = path;
+      image.addEventListener("load", function() { resolve(image); });

[Sebastian Noack, 2016/01/22 15:59:15]

Since both, the code in icon.js and notificationHelper.js need a canvas how
fulfilling the promise with a canvas object? Note that drawImage() can also take
a canvas element when blending the images in icon.js.

[Sebastian Noack, 2016/01/22 15:59:15]

Since it's a general purpose function now, I'd also handle onerror.

[kzar, 2016/01/22 16:49:35]

Done.

[kzar, 2016/01/22 16:49:35]

Ah cool, didn't know that drawImage could take a canvas and it didn't occur to
me I could just create re-create the context if required. Seems to work fine :)

+    });
   }
 };