Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: new-options.js

Issue 29502647: Issue 5482 - Sidebar and about ABP dialog (Closed)
Patch Set: Styleguide changes Created Aug. 27, 2017, 3:55 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * This file is part of Adblock Plus <https://adblockplus.org/>, 2 * This file is part of Adblock Plus <https://adblockplus.org/>,
3 * Copyright (C) 2006-present eyeo GmbH 3 * Copyright (C) 2006-present eyeo GmbH
4 * 4 *
5 * Adblock Plus is free software: you can redistribute it and/or modify 5 * Adblock Plus is free software: you can redistribute it and/or modify
6 * it under the terms of the GNU General Public License version 3 as 6 * it under the terms of the GNU General Public License version 3 as
7 * published by the Free Software Foundation. 7 * published by the Free Software Foundation.
8 * 8 *
9 * Adblock Plus is distributed in the hope that it will be useful, 9 * Adblock Plus is distributed in the hope that it will be useful,
10 * but WITHOUT ANY WARRANTY; without even the implied warranty of 10 * but WITHOUT ANY WARRANTY; without even the implied warranty of
(...skipping 513 matching lines...) Expand 10 before | Expand all | Expand 10 after
524 { 524 {
525 ext.backgroundPage.sendMessage(message, (errors) => 525 ext.backgroundPage.sendMessage(message, (errors) =>
526 { 526 {
527 if (errors.length > 0) 527 if (errors.length > 0)
528 alert(errors.join("\n")); 528 alert(errors.join("\n"));
529 else if (onSuccess) 529 else if (onSuccess)
530 onSuccess(); 530 onSuccess();
531 }); 531 });
532 } 532 }
533 533
534 function openDocLink(id)
535 {
536 getDocLink(id, (link) =>
537 {
538 location.href = link;
539 });
540 }
541
542 function switchTab(id) 534 function switchTab(id)
543 { 535 {
544 location.hash = id; 536 location.hash = id;
545 } 537 }
546 538
547 function execAction(action, element) 539 function execAction(action, element)
548 { 540 {
549 switch (action) 541 switch (action)
550 { 542 {
551 case "add-domain-exception": 543 case "add-domain-exception":
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after
603 let listItem = findParentData(element, "access", true); 595 let listItem = findParentData(element, "access", true);
604 if (listItem && !listItem.classList.contains("show-context-menu")) 596 if (listItem && !listItem.classList.contains("show-context-menu"))
605 listItem.classList.add("show-context-menu"); 597 listItem.classList.add("show-context-menu");
606 break; 598 break;
607 } 599 }
608 case "open-dialog": { 600 case "open-dialog": {
609 let dialog = findParentData(element, "dialog", false); 601 let dialog = findParentData(element, "dialog", false);
610 openDialog(dialog); 602 openDialog(dialog);
611 break; 603 break;
612 } 604 }
613 case "open-doclink": {
614 let doclink = findParentData(element, "doclink", false);
615 openDocLink(doclink);
616 break;
617 }
618 case "remove-filter": 605 case "remove-filter":
619 ext.backgroundPage.sendMessage({ 606 ext.backgroundPage.sendMessage({
620 type: "filters.remove", 607 type: "filters.remove",
621 text: findParentData(element, "access", false) 608 text: findParentData(element, "access", false)
622 }); 609 });
623 break; 610 break;
624 case "remove-subscription": 611 case "remove-subscription":
625 ext.backgroundPage.sendMessage({ 612 ext.backgroundPage.sendMessage({
626 type: "subscriptions.remove", 613 type: "subscriptions.remove",
627 url: findParentData(element, "access", false) 614 url: findParentData(element, "access", false)
(...skipping 16 matching lines...) Expand all
644 type: value == "privacy" ? "subscriptions.add" : 631 type: value == "privacy" ? "subscriptions.add" :
645 "subscriptions.remove", 632 "subscriptions.remove",
646 url: acceptableAdsPrivacyUrl 633 url: acceptableAdsPrivacyUrl
647 }); 634 });
648 ext.backgroundPage.sendMessage({ 635 ext.backgroundPage.sendMessage({
649 type: value == "ads" ? "subscriptions.add" : "subscriptions.remove", 636 type: value == "ads" ? "subscriptions.add" : "subscriptions.remove",
650 url: acceptableAdsUrl 637 url: acceptableAdsUrl
651 }); 638 });
652 break; 639 break;
653 case "switch-tab": 640 case "switch-tab":
654 let tabId = findParentData(element, "tab", false); 641 switchTab(element.getAttribute("href").substr(1));
655 switchTab(tabId);
656 break; 642 break;
657 case "toggle-disable-subscription": 643 case "toggle-disable-subscription":
658 ext.backgroundPage.sendMessage({ 644 ext.backgroundPage.sendMessage({
659 type: "subscriptions.toggle", 645 type: "subscriptions.toggle",
660 keepInstalled: true, 646 keepInstalled: true,
661 url: findParentData(element, "access", false) 647 url: findParentData(element, "access", false)
662 }); 648 });
663 break; 649 break;
664 case "toggle-pref": 650 case "toggle-pref":
665 ext.backgroundPage.sendMessage({ 651 ext.backgroundPage.sendMessage({
(...skipping 92 matching lines...) Expand 10 before | Expand all | Expand 10 after
758 let container = findParentData(element, "action", true); 744 let container = findParentData(element, "action", true);
759 if (!container || !container.hasAttribute("data-keys")) 745 if (!container || !container.hasAttribute("data-keys"))
760 return; 746 return;
761 747
762 let keys = container.getAttribute("data-keys").split(" "); 748 let keys = container.getAttribute("data-keys").split(" ");
763 if (keys.indexOf(key) < 0) 749 if (keys.indexOf(key) < 0)
764 return; 750 return;
765 751
766 if (element.getAttribute("role") == "tab") 752 if (element.getAttribute("role") == "tab")
767 { 753 {
754 let parent = element.parentElement;
768 if (key == "ArrowLeft" || key == "ArrowUp") 755 if (key == "ArrowLeft" || key == "ArrowUp")
769 element = element.previousElementSibling || container.lastElementChild; 756 parent = parent.previousElementSibling || container.lastElementChild;
770 else if (key == "ArrowRight" || key == "ArrowDown") 757 else if (key == "ArrowRight" || key == "ArrowDown")
771 element = element.nextElementSibling || container.firstElementChild; 758 parent = parent.nextElementSibling || container.firstElementChild;
759 element = parent.firstElementChild;
772 } 760 }
773 761
774 let actions = container.getAttribute("data-action").split(","); 762 let actions = container.getAttribute("data-action").split(",");
775 for (let action of actions) 763 for (let action of actions)
776 { 764 {
777 execAction(action, element); 765 execAction(action, element);
778 } 766 }
779 } 767 }
780 768
781 function selectTabItem(tabId, container, focus) 769 function selectTabItem(tabId, container, focus)
782 { 770 {
783 // Show tab content 771 // Show tab content
784 document.body.setAttribute("data-tab", tabId); 772 document.body.setAttribute("data-tab", tabId);
785 773
786 // Select tab 774 // Select tab
787 let tabList = container.querySelector("[role='tablist']"); 775 let tabList = container.querySelector("[role='tablist']");
788 if (!tabList) 776 if (!tabList)
789 return null; 777 return null;
790 778
791 let previousTab = tabList.querySelector("[aria-selected]"); 779 let previousTab = tabList.querySelector("[aria-selected]");
792 previousTab.removeAttribute("aria-selected"); 780 previousTab.removeAttribute("aria-selected");
793 previousTab.setAttribute("tabindex", -1); 781 previousTab.setAttribute("tabindex", -1);
794 782
795 let tab = tabList.querySelector("li[data-tab='" + tabId + "']"); 783 let tab = tabList.querySelector("a[href='#" + tabId + "']");
796 tab.setAttribute("aria-selected", true); 784 tab.setAttribute("aria-selected", true);
797 tab.setAttribute("tabindex", 0); 785 tab.setAttribute("tabindex", 0);
798 786
799 let tabContentId = tab.getAttribute("aria-controls"); 787 let tabContentId = tab.getAttribute("aria-controls");
800 let tabContent = document.getElementById(tabContentId); 788 let tabContent = document.getElementById(tabContentId);
801 789
802 if (tab && focus) 790 if (tab && focus)
803 tab.focus(); 791 tab.focus();
804 792
805 return tabContent; 793 return tabContent;
(...skipping 21 matching lines...) Expand all
827 { 815 {
828 populateLists(); 816 populateLists();
829 817
830 // Initialize navigation sidebar 818 // Initialize navigation sidebar
831 ext.backgroundPage.sendMessage({ 819 ext.backgroundPage.sendMessage({
832 type: "app.get", 820 type: "app.get",
833 what: "addonVersion" 821 what: "addonVersion"
834 }, 822 },
835 (addonVersion) => 823 (addonVersion) =>
836 { 824 {
837 E("abp-version").textContent = addonVersion; 825 E("abp-version").textContent = getMessage("options_dialog_about_version",
838 }); 826 [addonVersion]);
839 getDocLink("releases", (link) =>
840 {
841 E("link-version").setAttribute("href", link);
842 }); 827 });
843 828
844 updateShareLink();
845 updateTooltips(); 829 updateTooltips();
846 830
847 // Initialize interactive UI elements 831 // Initialize interactive UI elements
848 document.body.addEventListener("click", onClick, false); 832 document.body.addEventListener("click", onClick, false);
849 document.body.addEventListener("keyup", onKeyUp, false); 833 document.body.addEventListener("keyup", onKeyUp, false);
850 let exampleValue = getMessage("options_whitelist_placeholder_example", 834 let exampleValue = getMessage("options_whitelist_placeholder_example",
851 ["www.example.com"]); 835 ["www.example.com"]);
852 E("whitelisting-textbox").setAttribute("placeholder", exampleValue); 836 E("whitelisting-textbox").setAttribute("placeholder", exampleValue);
853 E("whitelisting-textbox").addEventListener("keyup", (e) => 837 E("whitelisting-textbox").addEventListener("keyup", (e) =>
854 { 838 {
855 E("whitelisting-add-button").disabled = !e.target.value; 839 E("whitelisting-add-button").disabled = !e.target.value;
856 }, false); 840 }, false);
857 841
842
843 getDocLink("contribute", (link) =>
844 {
845 E("contribute").href = link;
846 });
858 getDocLink("acceptable_ads_criteria", (link) => 847 getDocLink("acceptable_ads_criteria", (link) =>
859 { 848 {
860 setLinks("enable-aa-description", link); 849 setLinks("enable-aa-description", link);
861 }); 850 });
862 851
863 // Advanced tab 852 // Advanced tab
864 let customize = document.querySelectorAll("#customize li[data-pref]"); 853 let customize = document.querySelectorAll("#customize li[data-pref]");
865 customize = Array.prototype.map.call(customize, (checkbox) => 854 customize = Array.prototype.map.call(customize, (checkbox) =>
866 { 855 {
867 return checkbox.getAttribute("data-pref"); 856 return checkbox.getAttribute("data-pref");
(...skipping 264 matching lines...) Expand 10 before | Expand all | Expand 10 after
1132 ext.backgroundPage.sendMessage(message); 1121 ext.backgroundPage.sendMessage(message);
1133 } 1122 }
1134 1123
1135 function onFilterMessage(action, filter) 1124 function onFilterMessage(action, filter)
1136 { 1125 {
1137 switch (action) 1126 switch (action)
1138 { 1127 {
1139 case "added": 1128 case "added":
1140 filter[timestampUI] = Date.now(); 1129 filter[timestampUI] = Date.now();
1141 updateFilter(filter); 1130 updateFilter(filter);
1142 updateShareLink();
1143 break; 1131 break;
1144 case "loaded": 1132 case "loaded":
1145 populateLists(); 1133 populateLists();
1146 break; 1134 break;
1147 case "removed": 1135 case "removed":
1148 let knownFilter = filtersMap[filter.text]; 1136 let knownFilter = filtersMap[filter.text];
1149 if (whitelistedDomainRegexp.test(knownFilter.text)) 1137 if (whitelistedDomainRegexp.test(knownFilter.text))
1150 collections.whitelist.removeItem(knownFilter); 1138 collections.whitelist.removeItem(knownFilter);
1151 else 1139 else
1152 removeCustomFilter(filter.text); 1140 removeCustomFilter(filter.text);
1153 1141
1154 delete filtersMap[filter.text]; 1142 delete filtersMap[filter.text];
1155 updateShareLink();
1156 break; 1143 break;
1157 } 1144 }
1158 } 1145 }
1159 1146
1160 function onSubscriptionMessage(action, subscription) 1147 function onSubscriptionMessage(action, subscription)
1161 { 1148 {
1162 if (subscription.url in subscriptionsMap) 1149 if (subscription.url in subscriptionsMap)
1163 { 1150 {
1164 let knownSubscription = subscriptionsMap[subscription.url]; 1151 let knownSubscription = subscriptionsMap[subscription.url];
1165 for (let property in subscription) 1152 for (let property in subscription)
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after
1209 } 1196 }
1210 else 1197 else
1211 { 1198 {
1212 collections.custom.removeItem(subscription); 1199 collections.custom.removeItem(subscription);
1213 } 1200 }
1214 } 1201 }
1215 collections.filterLists.removeItem(subscription); 1202 collections.filterLists.removeItem(subscription);
1216 break; 1203 break;
1217 } 1204 }
1218 1205
1219 updateShareLink();
1220 } 1206 }
1221 1207
1222 function hidePref(key, value) 1208 function hidePref(key, value)
1223 { 1209 {
1224 let element = document.querySelector("[data-pref='" + key + "']"); 1210 let element = document.querySelector("[data-pref='" + key + "']");
1225 if (element) 1211 if (element)
1226 element.setAttribute("aria-hidden", value); 1212 element.setAttribute("aria-hidden", value);
1227 } 1213 }
1228 1214
1229 function getPref(key, callback) 1215 function getPref(key, callback)
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after
1270 break; 1256 break;
1271 } 1257 }
1272 1258
1273 let checkbox = document.querySelector( 1259 let checkbox = document.querySelector(
1274 "[data-pref='" + key + "'] button[role='checkbox']" 1260 "[data-pref='" + key + "'] button[role='checkbox']"
1275 ); 1261 );
1276 if (checkbox) 1262 if (checkbox)
1277 checkbox.setAttribute("aria-checked", value); 1263 checkbox.setAttribute("aria-checked", value);
1278 } 1264 }
1279 1265
1280 function updateShareLink()
1281 {
1282 let shareResources = [
1283 "https://facebook.com/plugins/like.php?",
1284 "https://platform.twitter.com/widgets/",
1285 "https://apis.google.com/se/0/_/+1/fastbutton?"
1286 ];
1287 let isAnyBlocked = false;
1288 let checksRemaining = shareResources.length;
1289
1290 function onResult(isBlocked)
1291 {
1292 isAnyBlocked |= isBlocked;
1293 if (!--checksRemaining)
1294 {
1295 // Hide the share tab if a script on the share page would be blocked
1296 E("tab-share").hidden = isAnyBlocked;
1297 }
1298 }
1299
1300 for (let sharedResource of shareResources)
1301 checkShareResource(sharedResource, onResult);
1302 }
1303
1304 function updateTooltips() 1266 function updateTooltips()
1305 { 1267 {
1306 let anchors = document.querySelectorAll(":not(.tooltip) > [data-tooltip]"); 1268 let anchors = document.querySelectorAll(":not(.tooltip) > [data-tooltip]");
1307 for (let anchor of anchors) 1269 for (let anchor of anchors)
1308 { 1270 {
1309 let id = anchor.getAttribute("data-tooltip"); 1271 let id = anchor.getAttribute("data-tooltip");
1310 1272
1311 let wrapper = document.createElement("div"); 1273 let wrapper = document.createElement("div");
1312 wrapper.className = "tooltip"; 1274 wrapper.className = "tooltip";
1313 anchor.parentNode.replaceChild(wrapper, anchor); 1275 anchor.parentNode.replaceChild(wrapper, anchor);
(...skipping 56 matching lines...) Expand 10 before | Expand all | Expand 10 after
1370 }); 1332 });
1371 ext.backgroundPage.sendMessage({ 1333 ext.backgroundPage.sendMessage({
1372 type: "subscriptions.listen", 1334 type: "subscriptions.listen",
1373 filter: ["added", "disabled", "homepage", "lastDownload", "removed", 1335 filter: ["added", "disabled", "homepage", "lastDownload", "removed",
1374 "title", "downloadStatus", "downloading"] 1336 "title", "downloadStatus", "downloading"]
1375 }); 1337 });
1376 1338
1377 window.addEventListener("DOMContentLoaded", onDOMLoaded, false); 1339 window.addEventListener("DOMContentLoaded", onDOMLoaded, false);
1378 window.addEventListener("hashchange", onHashChange, false); 1340 window.addEventListener("hashchange", onHashChange, false);
1379 } 1341 }
OLDNEW
« new-options.html ('K') | « new-options.html ('k') | skin/abp-logo.svg » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld