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

Side by Side Diff: new-options.js

Issue 29373665: issue 4264 - centralize action handling (Closed)
Patch Set: Thomas implementation Created Jan. 27, 2017, 11:39 a.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « new-options.html ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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-2016 Eyeo GmbH 3 * Copyright (C) 2006-2016 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 456 matching lines...) Expand 10 before | Expand all | Expand 10 after
467 else 467 else
468 location.href = link; 468 location.href = link;
469 }); 469 });
470 } 470 }
471 471
472 function switchTab(id) 472 function switchTab(id)
473 { 473 {
474 location.hash = id; 474 location.hash = id;
475 } 475 }
476 476
477 function execAction(action, key, element)
478 {
479 switch (action)
480 {
481 case "add-domain-exception":
482 addWhitelistedDomain();
483 break;
484 case "add-language-subscription":
485 addEnableSubscription(findParentData(element, "access", false));
486 break;
487 case "add-predefined-subscription":
488 var dialog = E("dialog-content-predefined");
489 var title = dialog.querySelector("h3").textContent;
490 var url = dialog.querySelector(".url").textContent;
491 addEnableSubscription(url, title);
492 closeDialog();
493 break;
494 case "cancel-custom-filters":
495 E("custom-filters").classList.remove("mode-edit");
496 break;
497 case "cancel-domain-exception":
498 E("whitelisting-textbox").value = "";
499 document.querySelector("#whitelisting .controls").classList.remove("mode -edit");
500 break;
501 case "close-dialog":
502 closeDialog();
503 break;
504 case "edit-custom-filters":
505 E("custom-filters").classList.add("mode-edit");
506 editCustomFilters();
507 break;
508 case "edit-domain-exception":
509 document.querySelector("#whitelisting .controls").classList.add("mode-ed it");
510 E("whitelisting-textbox").focus();
511 break;
512 case "import-subscription":
513 var url = E("blockingList-textbox").value;
514 addEnableSubscription(url);
515 closeDialog();
516 break;
517 case "open-context-menu":
518 var listItem = findParentData(element, "access", true);
519 if (listItem != context)
520 listItem.classList.add("show-context-menu");
521 break;
522 case "open-dialog":
523 var dialog = findParentData(element, "dialog", false);
524 openDialog(dialog);
525 break;
526 case "open-doclink":
527 var doclink = findParentData(element, "doclink", false);
528 openDocLink(doclink);
529 break;
530 case "remove-filter":
531 ext.backgroundPage.sendMessage(
532 {
533 type: "filters.remove",
534 text: findParentData(element, "access", false)
535 });
536 break;
537 case "remove-subscription":
538 ext.backgroundPage.sendMessage(
539 {
540 type: "subscriptions.remove",
541 url: findParentData(element, "access", false)
542 });
543 break;
544 case "save-custom-filters":
545 sendMessageHandleErrors(
546 {
547 type: "filters.importRaw",
548 text: E("custom-filters-raw").value,
549 removeExisting: true
550 },
551 function()
552 {
553 E("custom-filters").classList.remove("mode-edit");
554 });
555 break;
556 case "switch-tab":
557 if (key == "Enter")
558 {
559 var tabId = findParentData(element, "tab", false);
560 switchTab(tabId);
561 }
562 else if (element.hasAttribute("aria-selected"))
563 {
564 if (key == "ArrowLeft" || key == "ArrowUp")
565 {
566 element = element.previousElementSibling
567 || container.lastElementChild;
568 }
569 else if (key == "ArrowRight" || key == "ArrowDown")
570 {
571 element = element.nextElementSibling
572 || container.firstElementChild;
573 }
574
575 var tabId = findParentData(element, "tab", false);
576 switchTab(tabId);
577 }
578 break;
579 case "toggle-disable-subscription":
580 ext.backgroundPage.sendMessage(
581 {
582 type: "subscriptions.toggle",
583 keepInstalled: true,
584 url: findParentData(element, "access", false)
585 });
586 break;
587 case "toggle-pref":
588 ext.backgroundPage.sendMessage(
589 {
590 type: "prefs.toggle",
591 key: findParentData(element, "pref", false)
592 });
593 break;
594 case "toggle-remove-subscription":
595 var subscriptionUrl = findParentData(element, "access", false);
596 if (element.getAttribute("aria-checked") == "true")
597 {
598 ext.backgroundPage.sendMessage({
599 type: "subscriptions.remove",
600 url: subscriptionUrl
601 });
602 }
603 else
604 addEnableSubscription(subscriptionUrl);
605 break;
606 case "update-all-subscriptions":
607 ext.backgroundPage.sendMessage(
608 {
609 type: "subscriptions.update"
610 });
611 break;
612 case "update-subscription":
613 ext.backgroundPage.sendMessage(
614 {
615 type: "subscriptions.update",
616 url: findParentData(element, "access", false)
617 });
618 break;
619 }
620 }
621
477 function onClick(e) 622 function onClick(e)
478 { 623 {
479 var context = document.querySelector(".show-context-menu"); 624 var context = document.querySelector(".show-context-menu");
480 if (context) 625 if (context)
481 context.classList.remove("show-context-menu"); 626 context.classList.remove("show-context-menu");
482 627
483 var element = e.target; 628 var actions = findParentData(e.target, "action", false);
484 while (true) 629 if (!actions)
485 { 630 return;
486 if (!element)
487 return;
488 631
489 if (element.hasAttribute("data-action")) 632 actions = actions.split(",");
490 break;
491
492 element = element.parentElement;
493 }
494
495 var element = findParentData(e.target, "action", true);
496 var actions = element.getAttribute("data-action").split(",");
497 for (var i = 0; i < actions.length; i++) 633 for (var i = 0; i < actions.length; i++)
498 { 634 {
499 switch (actions[i]) 635 execAction(actions[i], "Enter", e.target);
500 {
501 case "add-domain-exception":
502 addWhitelistedDomain();
503 break;
504 case "add-predefined-subscription":
505 var dialog = E("dialog-content-predefined");
506 var title = dialog.querySelector("h3").textContent;
507 var url = dialog.querySelector(".url").textContent;
508 addEnableSubscription(url, title);
509 closeDialog();
510 break;
511 case "cancel-custom-filters":
512 E("custom-filters").classList.remove("mode-edit");
513 break;
514 case "cancel-domain-exception":
515 E("whitelisting-textbox").value = "";
516 document.querySelector("#whitelisting .controls").classList.remove("mo de-edit");
517 break;
518 case "close-dialog":
519 closeDialog();
520 break;
521 case "edit-custom-filters":
522 E("custom-filters").classList.add("mode-edit");
523 editCustomFilters();
524 break;
525 case "edit-domain-exception":
526 document.querySelector("#whitelisting .controls").classList.add("mode- edit");
527 E("whitelisting-textbox").focus();
528 break;
529 case "import-subscription":
530 var url = E("blockingList-textbox").value;
531 addEnableSubscription(url);
532 closeDialog();
533 break;
534 case "open-dialog":
535 var dialog = findParentData(element, "dialog", false);
536 openDialog(dialog);
537 break;
538 case "open-doclink":
539 var doclink = findParentData(element, "doclink", false);
540 openDocLink(doclink);
541 break;
542 case "save-custom-filters":
543 sendMessageHandleErrors(
544 {
545 type: "filters.importRaw",
546 text: E("custom-filters-raw").value,
547 removeExisting: true
548 },
549 function()
550 {
551 E("custom-filters").classList.remove("mode-edit");
552 });
553 break;
554 case "switch-tab":
555 var tabId = findParentData(e.target, "tab", false);
556 switchTab(tabId);
557 break;
558 case "toggle-pref":
559 ext.backgroundPage.sendMessage(
560 {
561 type: "prefs.toggle",
562 key: findParentData(element, "pref", false)
563 });
564 break;
565 case "update-all-subscriptions":
566 ext.backgroundPage.sendMessage(
567 {
568 type: "subscriptions.update"
569 });
570 break;
571 case "open-context-menu":
572 var listItem = findParentData(element, "access", true);
573 if (listItem != context)
574 listItem.classList.add("show-context-menu");
575 break;
576 case "update-subscription":
577 ext.backgroundPage.sendMessage(
578 {
579 type: "subscriptions.update",
580 url: findParentData(element, "access", false)
581 });
582 break;
583 case "remove-subscription":
584 ext.backgroundPage.sendMessage(
585 {
586 type: "subscriptions.remove",
587 url: findParentData(element, "access", false)
588 });
589 break;
590 case "toggle-remove-subscription":
591 var subscriptionUrl = findParentData(element, "access", false);
592 if (element.getAttribute("aria-checked") == "true")
593 {
594 ext.backgroundPage.sendMessage({
595 type: "subscriptions.remove",
596 url: subscriptionUrl
597 });
598 }
599 else
600 addEnableSubscription(subscriptionUrl);
601 break;
602 case "toggle-disable-subscription":
603 ext.backgroundPage.sendMessage(
604 {
605 type: "subscriptions.toggle",
606 keepInstalled: true,
607 url: findParentData(element, "access", false)
608 });
609 break;
610 case "add-language-subscription":
611 addEnableSubscription(findParentData(element, "access", false));
612 break;
613 case "remove-filter":
614 ext.backgroundPage.sendMessage(
615 {
616 type: "filters.remove",
617 text: findParentData(element, "access", false)
618 });
619 break;
620 }
621 } 636 }
622 } 637 }
623 638
624 function getKey(e) 639 function getKey(e)
625 { 640 {
626 // e.keyCode has been deprecated so we attempt to use e.key 641 // e.keyCode has been deprecated so we attempt to use e.key
627 if ("key" in e) 642 if ("key" in e)
628 return e.key; 643 return e.key;
629 return getKey.keys[e.keyCode]; 644 return getKey.keys[e.keyCode];
630 } 645 }
(...skipping 15 matching lines...) Expand all
646 return; 661 return;
647 662
648 var container = findParentData(element, "action", true); 663 var container = findParentData(element, "action", true);
649 if (!container || !container.hasAttribute("data-keys")) 664 if (!container || !container.hasAttribute("data-keys"))
650 return; 665 return;
651 666
652 var keys = container.getAttribute("data-keys").split(" "); 667 var keys = container.getAttribute("data-keys").split(" ");
653 if (keys.indexOf(key) < 0) 668 if (keys.indexOf(key) < 0)
654 return; 669 return;
655 670
656 switch (container.getAttribute("data-action")) 671 var actions = container.getAttribute("data-action").split(",");
672 for (var i = 0; i < actions.length; i++)
657 { 673 {
658 case "add-domain-exception": 674 execAction(actions[i], key, element);
659 addWhitelistedDomain();
660 break;
661 case "open-doclink":
662 var doclink = findParentData(element, "doclink", false);
663 openDocLink(doclink);
664 break;
665 case "switch-tab":
666 if (key == "Enter")
667 {
668 var tabId = findParentData(element, "tab", false);
669 switchTab(tabId);
670 }
671 else if (element.hasAttribute("aria-selected"))
672 {
673 if (key == "ArrowLeft" || key == "ArrowUp")
674 {
675 element = element.previousElementSibling
676 || container.lastElementChild;
677 }
678 else if (key == "ArrowRight" || key == "ArrowDown")
679 {
680 element = element.nextElementSibling
681 || container.firstElementChild;
682 }
683
684 var tabId = findParentData(element, "tab", false);
685 switchTab(tabId);
686 }
687 break;
688 } 675 }
689 } 676 }
690 677
691 function selectTabItem(tabId, container, focus) 678 function selectTabItem(tabId, container, focus)
692 { 679 {
693 // Show tab content 680 // Show tab content
694 document.body.setAttribute("data-tab", tabId); 681 document.body.setAttribute("data-tab", tabId);
695 682
696 // Select tab 683 // Select tab
697 var tabList = container.querySelector("[role='tablist']"); 684 var tabList = container.querySelector("[role='tablist']");
(...skipping 14 matching lines...) Expand all
712 // Select sub tabs 699 // Select sub tabs
713 if (tab.hasAttribute("data-subtab")) 700 if (tab.hasAttribute("data-subtab"))
714 selectTabItem(tab.getAttribute("data-subtab"), tabContent, false); 701 selectTabItem(tab.getAttribute("data-subtab"), tabContent, false);
715 702
716 if (tab && focus) 703 if (tab && focus)
717 tab.focus(); 704 tab.focus();
718 705
719 return tabContent; 706 return tabContent;
720 } 707 }
721 708
709 // TODO: rely on navigation functionality in here instead of data-action
722 function onHashChange() 710 function onHashChange()
723 { 711 {
724 var hash = location.hash.substr(1); 712 var hash = location.hash.substr(1);
725 if (!hash) 713 if (!hash)
726 return; 714 return;
727 715
728 // Select tab and parent tabs 716 // Select tab and parent tabs
729 var tabIds = hash.split("-"); 717 var tabIds = hash.split("-");
730 var tabContent = document.body; 718 var tabContent = document.body;
731 for (var i = 0; i < tabIds.length; i++) 719 for (var i = 0; i < tabIds.length; i++)
732 { 720 {
733 var tabId = tabIds.slice(0, i + 1).join("-"); 721 var tabId = tabIds.slice(0, i + 1).join("-");
734 tabContent = selectTabItem(tabId, tabContent, true); 722 tabContent = selectTabItem(tabId, tabContent, true);
735 if (!tabContent) 723 if (!tabContent)
736 break; 724 break;
737 } 725 }
726
727 // TODO: doesn't work yet because `customFilterItems` is not populated yet a t this point
728 switch (hash)
729 {
730 case "advanced-customFilters":
saroyanm 2017/02/08 12:14:00 I think we shouldn't implement this change, so I r
731 execAction("edit-custom-filters");
732 break;
733 }
738 } 734 }
739 735
740 function onDOMLoaded() 736 function onDOMLoaded()
741 { 737 {
742 populateLists(); 738 populateLists();
743 function onFindLanguageKeyUp() 739 function onFindLanguageKeyUp()
744 { 740 {
745 var searchStyle = E("search-style"); 741 var searchStyle = E("search-style");
746 if (!this.value) 742 if (!this.value)
747 searchStyle.innerHTML = ""; 743 searchStyle.innerHTML = "";
(...skipping 517 matching lines...) Expand 10 before | Expand all | Expand 10 after
1265 ext.backgroundPage.sendMessage( 1261 ext.backgroundPage.sendMessage(
1266 { 1262 {
1267 type: "subscriptions.listen", 1263 type: "subscriptions.listen",
1268 filter: ["added", "disabled", "homepage", "lastDownload", "removed", 1264 filter: ["added", "disabled", "homepage", "lastDownload", "removed",
1269 "title", "downloadStatus", "downloading"] 1265 "title", "downloadStatus", "downloading"]
1270 }); 1266 });
1271 1267
1272 window.addEventListener("DOMContentLoaded", onDOMLoaded, false); 1268 window.addEventListener("DOMContentLoaded", onDOMLoaded, false);
1273 window.addEventListener("hashchange", onHashChange, false); 1269 window.addEventListener("hashchange", onHashChange, false);
1274 })(); 1270 })();
OLDNEW
« no previous file with comments | « new-options.html ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld