Generator for uBlock uMatrix implemented

pages/options/options.css

@@ -143,6 +143,10 @@ body {
     padding: 5px 9px;
 }
 
+#button-copy-rule-set {
+    display: none;
+}
+
 /**
 * Links
 */
@@ -198,6 +202,10 @@ body {
     margin-right: 14px;
 }
 
+#generated-rules {
+    display: none;
+}
+
 /**
  * Right to Left
  */

pages/options/options.html

@@ -19,6 +19,8 @@
 
         <script src="../../core/constants.js"></script>
         <script src="../../modules/internal/helpers.js"></script>
+        <script defer src="../../core/resources.js"></script>
+        <script defer src="../../core/mappings.js"></script>
 
         <script src="options.js"></script>
 
@@ -124,7 +126,20 @@
             <div class="title-option" data-i18n-content="whitelistedDomainsTitle"></div>
             <input class="input-text" data-option="whitelistedDomains" type="text">
             <div class="description-option" data-i18n-content="whitelistedDomainsDescription"></div>
+        </section>
 
+        <section class="option">
+            <div class="title-option" data-i18n-content="generateRuleSetTitle"></div>
+            <div>
+                <input id="generate-ublock-rules" name="rule-sets" data-option="uBlock" type="radio" value="uBlock">
+                <label for="generate-ublock-rules">uBlock</label>
+            </div>
+            <div>
+                <input id="generate-umatrix-rules" name="rule-sets" data-option="uMatrix" type="radio" value="uMatrix">
+                <label for="generate-umatrix-rules">uMatrix</label>
+            </div>
+            <textarea rows="12" cols="15" id="generated-rules" readonly></textarea>
+            <input id="button-copy-rule-set" type="button" value="Copy">
         </section>
 
         <section class="notice notice-default hidden" id="notice-locale">

pages/options/options.js

@@ -84,6 +84,11 @@ options._registerOptionChangedEventListeners = function (elements) {
     elements.disablePrefetch.addEventListener('change', options._onOptionChanged);
     elements.stripMetadata.addEventListener('change', options._onOptionChanged);
     elements.whitelistedDomains.addEventListener('keyup', options._onOptionChanged);
+    let type = elements.ruleSets;
+    for(let i = 0; i < type.length; i++) {
+        type[i].addEventListener('change', options._openRuleSet);
+    }
+    elements.copyRuleSet.addEventListener('click', options._copyRuleSet);
 };
 
 options._registerMiscellaneousEventListeners = function () {
@@ -124,7 +129,9 @@ options._getOptionElements = function () {
         [Setting.BLOCK_MISSING]: options._getOptionElement(Setting.BLOCK_MISSING),
         [Setting.DISABLE_PREFETCH]: options._getOptionElement(Setting.DISABLE_PREFETCH),
         [Setting.STRIP_METADATA]: options._getOptionElement(Setting.STRIP_METADATA),
-        [Setting.WHITELISTED_DOMAINS]: options._getOptionElement(Setting.WHITELISTED_DOMAINS)
+        [Setting.WHITELISTED_DOMAINS]: options._getOptionElement(Setting.WHITELISTED_DOMAINS),
+        ['ruleSets']: document.getElementsByName("rule-sets"),
+        ['copyRuleSet']: document.getElementById("button-copy-rule-set")
     };
 
     return optionElements;
@@ -225,6 +232,42 @@ options._onOptionChanged = function ({target}) {
     });
 };
 
+options._openRuleSet = function({target}) {
+
+    let urls = mappings;
+    let optionKey = target.getAttribute('data-option');
+    let optionType = target.getAttribute('value');
+
+    let textArea = document.getElementById("generated-rules");
+    let btnCopy = document.getElementById("button-copy-rule-set");
+
+    let content = "";
+    let ruleSyntax = "";
+
+    if (optionKey === "uMatrix") {
+        ruleSyntax = " script allow";
+    } else if (optionKey === "uBlock") {
+        ruleSyntax = " * noop";
+    }
+
+    textArea.style.display = "block";
+    btnCopy.style.display = "block";
+
+    for (var domain in urls) {
+        content += "* " + domain + ruleSyntax + '\n';
+    }
+    textArea.value = content.replace(/\n+$/, "");
+}
+
+options._copyRuleSet = function() {
+    let textArea = document.getElementById("generated-rules");
+    navigator.clipboard.writeText(textArea.value).then(function() {
+        textArea.select();
+    }, function() {
+        alert("Rule set cannot be copied!");
+    });
+}
+
 /**
  * Initializations
  */