First-run page (revisited)

chrome/content/ui/firstRun.js

 /*
  * 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/>.
  */
 
 "use strict";
 
 (function()
 {
   var shade;
   var scrollTimer;
 
-  // Determine platform
-  var userAgent = "";
-  if (navigator.userAgent.indexOf("Gecko/") > -1)
-    userAgent = "firefox";
-  else if (navigator.userAgent.indexOf("Chrome/") > -1)
-    userAgent = "chrome";
-
-  if (userAgent !== "")
-    document.documentElement.className = userAgent;
-
   // Load subscriptions for features
   var featureSubscriptions = [
     {
       feature: "malware",
+      homepage: "http://malwaredomains.com/",
       title: "Malware Domains",
       url: "https://easylist-downloads.adblockplus.org/malwaredomains_full.txt"

[Wladimir Palant, 2013/05/27 14:10:37]

Please add the homepage field as well - I noticed that you are using it below
(and it's actually necessary).

[Thomas Greiner, 2013/05/27 16:39:16]

Done.

     },
     {
       feature: "social",
+      homepage: "https://www.fanboy.co.nz/",
       title: "Fanboy's Social Blocking List",
       url: "https://easylist-downloads.adblockplus.org/fanboy-social.txt"
     },
     {
       feature: "tracking",
+      homepage: "https://easylist.adblockplus.org/",
       title: "EasyPrivacy",
       url: "https://easylist-downloads.adblockplus.org/easyprivacy.txt"
     }
   ];
 
-  // Determine scripts to load
-  var scripts = [];
-  if (userAgent == "chrome")
-  {
-    var backgroundPage = chrome.extension.getBackgroundPage();
-    var require = backgroundPage.require;
-  }
-  else if (userAgent == "firefox")
-  {
-    scripts.push("utils.js");
-  }
-  scripts.push("i18n.js");
-
-  function loadScripts()
-  {
-    var scriptName = scripts.shift();
-    var script = document.createElement("script");
-    script.type = (userAgent == "firefox") ? "application/x-javascript;version=1.7" : "text/javascript";
-    script.addEventListener("load", (scripts.length == 0) ? onScriptsLoaded : loadScripts, false);
-    script.src = scriptName;
-    document.head.appendChild(script);
-  }
-
-  function onScriptsLoaded()
-  {
-    if (userAgent == "chrome")
-    {
-      window.Synchronizer = require("synchronizer").Synchronizer;
-      window.Utils = require("utils").Utils;
-      window.Prefs = require("prefs").Prefs;
-      window.FilterStorage = require("filterStorage").FilterStorage;
-
-      var subscriptionClasses = require("subscriptionClasses");
-      window.Subscription = subscriptionClasses.Subscription;
-      window.DownloadableSubscription = subscriptionClasses.DownloadableSubscription;
-      window.Filter = require("filterClasses").Filter;
-    }
-
+  function onDOMLoaded()
+  {
     // Show warning if data corruption was detected
     if (typeof backgroundPage != "undefined" && backgroundPage.seenDataCorruption)
     {
-      document.getElementById("dataCorruptionWarning").removeAttribute("hidden");

[Wladimir Palant, 2013/05/27 14:10:37]

utils.js in Firefox defines a E("dataCorruptionWarning") shortcut - feel free to
define it in Chrome as well and use it here.

[Thomas Greiner, 2013/05/27 16:39:16]

Done.

-      setLinks("dataCorruptionWarning", getDocLink("knownIssuesChrome_filterstorage"));
-    }
-
-    // Set up URLs
-    var versionId;
-    var platformId;
-    if (userAgent == "firefox")
-    {
-      versionId = Utils.addonVersion.match(/^[0-9\.]+/)[0].replace(/\./g, "");
-      platformId = "firefox";
-    }
-    else if (userAgent == "chrome")
-    {
-      versionId = chrome.app.getDetails().version.split(".").slice(0, 2).join("");
-      platformId = "google-chrome";
-    }
-    setLinks("title-changelog", "https://adblockplus.org/releases/adblock-plus-" + versionId + "-for-" + platformId + "-released");
-    setLinks("acceptableAdsExplanation", getDocLink("acceptable_ads_criteria"), openFilters);
-
-    shade = document.getElementById("shade");
+      E("dataCorruptionWarning").removeAttribute("hidden");
+      setLinks("dataCorruptionWarning", Utils.getDocLink("knownIssuesChrome_filterstorage"));
+    }
+
+    // Set up URL
+    setLinks("acceptableAdsExplanation", Utils.getDocLink("acceptable_ads_criteria"), openFilters);
+
+    shade = E("shade");
     shade.addEventListener("mouseover", scrollPage, false);
     shade.addEventListener("mouseout", stopScroll, false);
 
     // Set up typo feature
     if (require("typoBootstrap"))
     {
-      var toggleTypo = document.getElementById("toggle-typo");
+      var featureTypo = E("feature-typo");
+      featureTypo.removeAttribute("hidden");
+      
       updateToggleButton("typo", Prefs.correctTypos);
-      Prefs.addListener(function(name)
+
+      var listener = function(name)
       {
         if (name == "correctTypos")
           updateToggleButton("typo", Prefs.correctTypos);
-      });

[Wladimir Palant, 2013/05/27 14:10:37]

This listener needs to be removed on unload.

[Thomas Greiner, 2013/05/27 16:39:16]

Done.

-      toggleTypo.addEventListener("click", function(event)
-      {
-        setTypoCorrectionEnabled(!Prefs.correctTypos);

[Wladimir Palant, 2013/05/27 14:10:37]

How about Prefs.correctTypos = !Prefs.correctTypos? The function seems to be
pointless :)

[Thomas Greiner, 2013/05/27 16:39:16]

True! :)

Done.

+      }
+      Prefs.addListener(listener);
+      window.addEventListener("unload", function(event)
+      {
+        Prefs.removeListener(listener);
       }, false);
+
+      E("toggle-typo").addEventListener("click", toggleTypoCorrectionEnabled, false);
     }
 
     // Set up feature buttons linked to subscriptions
     featureSubscriptions.forEach(setToggleSubscriptionButton);
+    var filterListener = function(action)
+    {
+      if (/^subscription\.(added|removed|disabled)$/.test(action))
+      {
+        for (var i = 0; i < featureSubscriptions.length; i++)
+        {
+          var featureSubscription = featureSubscriptions[i];
+          updateToggleButton(featureSubscription.feature, isSubscriptionEnabled(featureSubscription));
+        }
+      }
+    }
+    FilterNotifier.addListener(filterListener);
+    window.addEventListener("unload", function(event)
+    {
+      FilterNotifier.removeListener(filterListener);
+    }, false);
 
     window.addEventListener("resize", onWindowResize, false);
     document.addEventListener("scroll", onScroll, false);
 
     onWindowResize();
 
     initSocialLinks(null);
   }
 
   function onScroll()
   {
     var currentHeight = document.documentElement.scrollTop + document.body.scrollTop + document.documentElement.clientHeight;
     shade.style.opacity = (document.documentElement.scrollHeight == currentHeight) ? "0.0" : "0.5";
   }
 
   function onWindowResize()
   {
     onScroll();
   }
 
-  function setTypoCorrectionEnabled(enable)
-  {
-    Prefs.correctTypos = enable;
+  function toggleTypoCorrectionEnabled()
+  {
+    Prefs.correctTypos = !Prefs.correctTypos;
   }
 
   function isSubscriptionEnabled(featureSubscription)
   {
     return featureSubscription.url in FilterStorage.knownSubscriptions
       && !Subscription.fromURL(featureSubscription.url).disabled;
   }
 
   function setToggleSubscriptionButton(featureSubscription)
   {
     var feature = featureSubscription.feature;
 
-    var element = document.getElementById("toggle-" + feature);
+    var element = E("toggle-" + feature);
     updateToggleButton(feature, isSubscriptionEnabled(featureSubscription));
     element.addEventListener("click", function(event)
     {
       var subscription = Subscription.fromURL(featureSubscription.url);
       if (isSubscriptionEnabled(featureSubscription))
         FilterStorage.removeSubscription(subscription);
       else
       {
         subscription.disabled = false;
         subscription.title = featureSubscription.title;
@@ skipping 17 matching lines @@
   }
 
   function stopScroll()
   {
     clearTimeout(scrollTimer);
     scrollTimer = null;
   }
 
   function openSharePopup(url)
   {
-    var iframe = document.getElementById("share-popup");
-    var glassPane = document.getElementById("glass-pane");
+    var iframe = E("share-popup");
+    var glassPane = E("glass-pane");
     var popupMessageReceived = false;
 
     var popupMessageListener = function(event)
     {
       var originFilter = Filter.fromText("||adblockplus.org^");
       if (!originFilter.matches(event.origin, "OTHER", null, null))
         return;
 
       var width = event.data.width;
       var height = event.data.height;
@@ skipping 32 matching lines @@
 
     iframe.src = url;
     glassPane.className = "visible";
   }
 
   function initSocialLinks(variant)
   {
     var networks = ["twitter", "facebook", "gplus"];
     networks.forEach(function(network)
     {
-      var link = document.getElementById("share-" + network);
+      var link = E("share-" + network);
       link.addEventListener("click", function(e)
       {
         e.preventDefault();
-        openSharePopup(getDocLink("share-" + network) + "&variant=" + variant);
+        openSharePopup(Utils.getDocLink("share-" + network) + "&variant=" + variant);
       }, false);
     });
   }
 
   function setLinks(id)
   {
-    var element = document.getElementById(id);
+    var element = E(id);
     if (!element)
       return;
 
     var links = element.getElementsByTagName("a");
     for (var i = 0; i < links.length; i++)
     {
       if (typeof arguments[i + 1] == "string")
       {
         links[i].href = arguments[i + 1];
         links[i].setAttribute("target", "_blank");
       }
       else if (typeof arguments[i + 1] == "function")
       {
         links[i].href = "javascript:void(0);";
         links[i].addEventListener("click", arguments[i + 1], false);
       }
     }
-  }
-
-  function getDocLink(page, anchor)
-  {
-    return Prefs.documentation_link
-                .replace(/%LINK%/g, page)
-                .replace(/%LANG%/g, Utils.appLocale) + (anchor ? "#" + anchor : "");
   }

[Wladimir Palant, 2013/05/27 14:10:37]

Comment not addressed (in addition to utils.js & Co.):

The anchor parameter is unnecessary. This is duplicating some code from ui.js in
Firefox. Please add Utils.getDocLink() to utils.js and make UI.loadDocLink() use
it. In Chrome you can add it to lib/utils.js as well.

[Thomas Greiner, 2013/05/27 16:39:16]

Done.

 
   function openFilters()
   {
     if (typeof UI != "undefined")
       UI.openFiltersDialog();
     else
     {
       backgroundPage.openOptions();
     }
   }
 
   function updateToggleButton(feature, isEnabled)
   {
-    var button = document.getElementById("toggle-" + feature);
+    var button = E("toggle-" + feature);
     button.className = isEnabled ? "disable" : "enable";
     button.textContent = i18n.getMessage(isEnabled ? "firstRun_action_disable" : "firstRun_action_enable");
   }
 
-  document.addEventListener("DOMContentLoaded", loadScripts, false);
+  document.addEventListener("DOMContentLoaded", onDOMLoaded, false);
 })();