Issue 2374 - Implemented Tweaks section in options page

options.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 584 matching lines @@
           },
           function()
           {
             E("custom-filters").classList.remove("mode-edit");
           });
           break;
         case "switch-tab":
           document.body.setAttribute("data-tab",
             element.getAttribute("data-tab"));
           break;
+        case "toggle-pref":
+          ext.backgroundPage.sendMessage(
+          {
+            type: "prefs.toggle",
+            key: findParentData(element, "pref", false)
+          });
+          break;
         case "update-all-subscriptions":
           ext.backgroundPage.sendMessage(
           {
             type: "subscriptions.update"
           });
           break;
         case "open-context-menu":
           var listItem = findParentData(element, "access", true);
           if (listItem != context)
             listItem.classList.add("show-context-menu");
@@ skipping 68 matching lines @@
     var placeholderValue  = getMessage("options_dialog_language_find");
     E("find-language").setAttribute("placeholder", placeholderValue);
     E("find-language").addEventListener("keyup", onFindLanguageKeyUp, false);
     E("whitelisting-textbox").addEventListener("keypress", function(e)
     {
       if (getKey(e) == "Enter")
         addWhitelistedDomain();
     }, false);
 
     // Advanced tab
+    var tweaks = document.querySelectorAll("#tweaks li[data-pref]");
+    tweaks = Array.prototype.map.call(tweaks, function(checkbox)
+    {
+      return checkbox.getAttribute("data-pref");
+    });
+    tweaks.forEach(function(key)
+    {
+      getPref(key, function(value)
+      {
+        onPrefMessage(key, value);
+      });
+    });
+    ext.backgroundPage.sendMessage(
+    {
+      type: "app.get",
+      what: "features"
+    },
+    function(features)
+    {
+      hidePref("show_devtools_panel", !features.devToolsPanel);
+      hidePref("safari_contentblocker", !features.safariContentBlocker);
+    });
+
     var filterTextbox = document.querySelector("#custom-filters-add input");
     placeholderValue = getMessage("options_customFilters_textbox_placeholder");
     filterTextbox.setAttribute("placeholder", placeholderValue);
     function addCustomFilters()
     {
       var filterText = filterTextbox.value;
       sendMessageHandleErrors(
       {
         type: "filters.add",
         text: filterText
@@ skipping 136 matching lines @@
   {
     var customFilterItems = collections.customFilters.items;
     var filterTexts = [];
     for (var i = 0; i < customFilterItems.length; i++)
       filterTexts.push(customFilterItems[i].text);
     E("custom-filters-raw").value = filterTexts.join("\n");
   }
 
   function getAcceptableAdsURL(callback)
   {
-    ext.backgroundPage.sendMessage(
-    {
-      type: "prefs.get",
-      key: "subscriptions_exceptionsurl"
-    },
-    function(value)
+    getPref("subscriptions_exceptionsurl", function(value)
     {
       getAcceptableAdsURL = function(callback)
       {
         callback(value);
-      }
+      };
       getAcceptableAdsURL(callback);
     });
   }
 
   function addEnableSubscription(url, title, homepage)
   {
     var messageType = null;
     var knownSubscription = subscriptionsMap[url];
     if (knownSubscription && knownSubscription.disabled == true)
       messageType = "subscriptions.toggle"
@@ skipping 79 matching lines @@
           updateShareLink();
           collections.filterLists.removeItem(knownSubscription);
         });
         break;
       case "title":
         // TODO: NYI
         break;
     }
   }
 
+  function hidePref(key, value)
+  {
+    var element = document.querySelector("[data-pref='" + key + "']");
+    if (element)
+      element.setAttribute("aria-hidden", value);
+  }
+
+  function getPref(key, callback)
+  {
+    var checkPref = getPref.checks[key] || getPref.checkNone;
+    checkPref(function(isActive)
+    {
+      if (!isActive)
+      {
+        hidePref(key, !isActive);
+        return;
+      }
+
+      ext.backgroundPage.sendMessage(
+      {
+        type: "prefs.get",
+        key: key
+      }, callback);
+    });
+  }
+
+  getPref.checkNone = function(callback)
+  {
+    callback(true);
+  };
+
+  getPref.checks =
+  {
+    notifications_ignoredcategories: function(callback)
+    {
+      getPref("notifications_showui", callback);
+    }
+  };
+
+  function onPrefMessage(key, value)
+  {
+    var checkbox = document.querySelector("[data-pref='" + key + "'] button[role='checkbox']");
+    if (checkbox)
+    {
+      if (key == "notifications_ignoredcategories")
+        value = (value.indexOf("*") == -1);
+      checkbox.setAttribute("aria-checked", value);
+    }
+    else if (key == "notifications_showui")
+      hidePref("notifications_ignoredcategories", !value);
+  }
+
   function onShareLinkClick(e)
   {
     e.preventDefault();
 
     getDocLink("share-general", function(link)
     {
       openSharePopup(link);
     });
   }
 
@@ skipping 38 matching lines @@
           var subscription = message.args[0];
           var dialog = E("dialog-content-predefined");
           dialog.querySelector("h3").textContent = subscription.title || "";
           dialog.querySelector(".url").textContent = subscription.url;
           openDialog("predefined");
         }
         break;
       case "filters.listen":
         onFilterMessage(message.action, message.args[0]);
         break;
+      case "prefs.listen":
+        onPrefMessage(message.action, message.args[0]);
+        break;
       case "subscriptions.listen":
         onSubscriptionMessage(message.action, message.args[0]);
         break;
     }
   });
 
   ext.backgroundPage.sendMessage(
   {
     type: "app.listen",
     filter: ["addSubscription", "error"]
   });
   ext.backgroundPage.sendMessage(
   {
     type: "filters.listen",
     filter: ["added", "loaded", "removed"]
   });
   ext.backgroundPage.sendMessage(
   {
+    type: "prefs.listen",
+    filter: ["notifications_ignoredcategories", "notifications_showui",
+        "safari_contentblocker", "show_devtools_panel",

[saroyanm, 2016/03/16 10:59:18]

detail: please use two spaces for indentation, same applies to the similar new
line indentation below.

[Thomas Greiner, 2016/03/16 11:14:36]

Is this a personal preference? Note that those are two indentation levels ("Use
2 spaces per indentation level.") to indicate that this line is a continuation
of the previous one.

[saroyanm, 2016/03/16 12:27:34]

No I just wasn't considering the Indentation level, just ignore my comment.

+        "shouldShowBlockElementMenu"]
+  });
+  ext.backgroundPage.sendMessage(
+  {
     type: "subscriptions.listen",
-    filter: ["added", "disabled", "homepage", "lastDownload", "removed", "title"]
+    filter: ["added", "disabled", "homepage", "lastDownload", "removed",
+        "title"]
   });
 
   window.addEventListener("DOMContentLoaded", onDOMLoaded, false);
 })();