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

Delta Between Two Patch Sets: new-options.js

Issue 29338983: issue 3741 - Add "remove" option to list items in new options page (Closed)
Left Patch Set: Removed aria-labelledby Created June 22, 2016, 1:32 p.m.
Right Patch Set: Removed label's "for" attribute, added "aria-lable" to addItem Created June 24, 2016, 4:35 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
Left: Side by side diff | Download
Right: Side by side diff | Download
« no previous file with change/comment | « new-options.html ('k') | skin/new-options.css » ('j') | no next file with change/comment »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
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
11 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 11 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12 * GNU General Public License for more details. 12 * GNU General Public License for more details.
13 * 13 *
14 * You should have received a copy of the GNU General Public License 14 * You should have received a copy of the GNU General Public License
15 * along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>. 15 * along with Adblock Plus. If not, see <http://www.gnu.org/licenses/>.
16 */ 16 */
17 17
18 "use strict"; 18 "use strict";
19 19
20 (function() 20 (function()
21 { 21 {
22 var subscriptionsMap = Object.create(null); 22 var subscriptionsMap = Object.create(null);
23 var filtersMap = Object.create(null); 23 var filtersMap = Object.create(null);
24 var collections = Object.create(null); 24 var collections = Object.create(null);
25 var acceptableAdsUrl = null; 25 var acceptableAdsUrl = null;
26 var maxItemId = 0;
27 var getMessage = ext.i18n.getMessage; 26 var getMessage = ext.i18n.getMessage;
28 var filterErrors = 27 var filterErrors =
29 { 28 {
30 "synchronize_invalid_url": "options_filterList_lastDownload_invalidURL", 29 "synchronize_invalid_url": "options_filterList_lastDownload_invalidURL",
31 "synchronize_connection_error": "options_filterList_lastDownload_connectionE rror", 30 "synchronize_connection_error": "options_filterList_lastDownload_connectionE rror",
32 "synchronize_invalid_data": "options_filterList_lastDownload_invalidData", 31 "synchronize_invalid_data": "options_filterList_lastDownload_invalidData",
33 "synchronize_checksum_mismatch": "options_filterList_lastDownload_checksumMi smatch" 32 "synchronize_checksum_mismatch": "options_filterList_lastDownload_checksumMi smatch"
34 }; 33 };
35 34
36 function Collection(details) 35 function Collection(details)
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after
94 }.bind(this)); 93 }.bind(this));
95 94
96 for (var j = 0; j < this.details.length; j++) 95 for (var j = 0; j < this.details.length; j++)
97 { 96 {
98 var table = E(this.details[j].id); 97 var table = E(this.details[j].id);
99 var template = table.querySelector("template"); 98 var template = table.querySelector("template");
100 for (var i = 0; i < arguments.length; i++) 99 for (var i = 0; i < arguments.length; i++)
101 { 100 {
102 var item = arguments[i]; 101 var item = arguments[i];
103 var listItem = document.createElement("li"); 102 var listItem = document.createElement("li");
104 var itemId = "item-" + (++maxItemId);
105 listItem.appendChild(document.importNode(template.content, true)); 103 listItem.appendChild(document.importNode(template.content, true));
104 listItem.setAttribute("aria-label", this._getItemTitle(item, j));
106 listItem.setAttribute("data-access", item.url || item.text); 105 listItem.setAttribute("data-access", item.url || item.text);
107 listItem.setAttribute("id", itemId);
108 listItem.setAttribute("role", "section"); 106 listItem.setAttribute("role", "section");
109 107
110 var label = listItem.querySelector(".display"); 108 var label = listItem.querySelector(".display");
111 label.setAttribute("for", itemId);
112 if (item.recommended && label.hasAttribute("data-tooltip")) 109 if (item.recommended && label.hasAttribute("data-tooltip"))
113 { 110 {
114 var tooltipId = label.getAttribute("data-tooltip"); 111 var tooltipId = label.getAttribute("data-tooltip");
115 tooltipId = tooltipId.replace("%value%", item.recommended); 112 tooltipId = tooltipId.replace("%value%", item.recommended);
116 label.setAttribute("data-tooltip", tooltipId); 113 label.setAttribute("data-tooltip", tooltipId);
117 } 114 }
118 115
119 var controls = listItem.querySelectorAll(".control"); 116 var controls = listItem.querySelectorAll(".control");
120 for (var k = 0; k < controls.length; k++) 117 for (var k = 0; k < controls.length; k++)
121 { 118 {
122 var titleValue = getMessage(controls[k].getAttribute("title"));
Thomas Greiner 2016/06/22 15:49:46 Detail: Please keep this in the if-statement as it
saroyanm 2016/06/23 15:04:23 Done.
123 if (controls[k].hasAttribute("title")) 119 if (controls[k].hasAttribute("title"))
120 {
121 var titleValue = getMessage(controls[k].getAttribute("title"));
124 controls[k].setAttribute("title", titleValue) 122 controls[k].setAttribute("title", titleValue)
123 }
125 } 124 }
126 125
127 this._setEmpty(table, null); 126 this._setEmpty(table, null);
128 if (table.hasChildNodes()) 127 if (table.hasChildNodes())
129 { 128 {
130 table.insertBefore(listItem, 129 table.insertBefore(listItem,
131 table.childNodes[this.items.indexOf(item)]); 130 table.childNodes[this.items.indexOf(item)]);
132 } 131 }
133 else 132 else
134 table.appendChild(listItem); 133 table.appendChild(listItem);
(...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after
182 var access = (item.url || item.text).replace(/'/g, "\\'"); 181 var access = (item.url || item.text).replace(/'/g, "\\'");
183 for (var i = 0; i < this.details.length; i++) 182 for (var i = 0; i < this.details.length; i++)
184 { 183 {
185 var table = E(this.details[i].id); 184 var table = E(this.details[i].id);
186 var element = table.querySelector("[data-access='" + access + "']"); 185 var element = table.querySelector("[data-access='" + access + "']");
187 if (!element) 186 if (!element)
188 continue; 187 continue;
189 188
190 var title = this._getItemTitle(item, i); 189 var title = this._getItemTitle(item, i);
191 element.querySelector(".display").textContent = title; 190 element.querySelector(".display").textContent = title;
192 element.setAttribute("aria-label", title); 191 element.setAttribute("aria-label", title);
Thomas Greiner 2016/06/22 15:49:46 Detail: Was this change intentional? If so, why is
saroyanm 2016/06/23 15:04:23 Yes this is how we are marking the label of the se
Thomas Greiner 2016/06/24 15:22:10 But why is it necessary since you already use `<la
saroyanm 2016/06/24 15:54:51 When I only use <label for="..."> and focusing the
193 if (this.details[i].searchable) 192 if (this.details[i].searchable)
194 element.setAttribute("data-search", title.toLowerCase()); 193 element.setAttribute("data-search", title.toLowerCase());
195 var control = element.querySelector(".control[role='checkbox']"); 194 var control = element.querySelector(".control[role='checkbox']");
196 if (control) 195 if (control)
197 { 196 {
198 control.setAttribute("aria-checked", item.disabled == false); 197 control.setAttribute("aria-checked", item.disabled == false);
199 if (item.url == acceptableAdsUrl && this == collections.filterLists) 198 if (item.url == acceptableAdsUrl && this == collections.filterLists)
200 control.setAttribute("disabled", true); 199 control.setAttribute("disabled", true);
201 } 200 }
202 201
(...skipping 969 matching lines...) Expand 10 before | Expand all | Expand 10 after
1172 }); 1171 });
1173 ext.backgroundPage.sendMessage( 1172 ext.backgroundPage.sendMessage(
1174 { 1173 {
1175 type: "subscriptions.listen", 1174 type: "subscriptions.listen",
1176 filter: ["added", "disabled", "homepage", "lastDownload", "removed", 1175 filter: ["added", "disabled", "homepage", "lastDownload", "removed",
1177 "title", "downloadStatus", "downloading"] 1176 "title", "downloadStatus", "downloading"]
1178 }); 1177 });
1179 1178
1180 window.addEventListener("DOMContentLoaded", onDOMLoaded, false); 1179 window.addEventListener("DOMContentLoaded", onDOMLoaded, false);
1181 })(); 1180 })();
LEFTRIGHT

Powered by Google App Engine
This is Rietveld