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

Delta Between Two Patch Sets: options.html

Issue 29321417: Issue 2357 - Added "predefined list" dialog to options page (Closed)
Left Patch Set: Replaced dataset with has/get/set/removeAttribute Created July 10, 2015, 2:18 p.m.
Right Patch Set: Post-review: Merged Created July 16, 2015, 11:36 a.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 | « locale/en-US/options.json ('k') | options.js » ('j') | options.js » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
LEFTRIGHT
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 - This file is part of Adblock Plus <https://adblockplus.org/>, 3 - This file is part of Adblock Plus <https://adblockplus.org/>,
4 - Copyright (C) 2006-2015 Eyeo GmbH 4 - Copyright (C) 2006-2015 Eyeo GmbH
5 - 5 -
6 - Adblock Plus is free software: you can redistribute it and/or modify 6 - Adblock Plus is free software: you can redistribute it and/or modify
7 - it under the terms of the GNU General Public License version 3 as 7 - it under the terms of the GNU General Public License version 3 as
8 - published by the Free Software Foundation. 8 - published by the Free Software Foundation.
9 - 9 -
10 - Adblock Plus is distributed in the hope that it will be useful, 10 - Adblock Plus is distributed in the hope that it will be useful,
(...skipping 17 matching lines...) Expand all
28 <script src="options.js"></script> 28 <script src="options.js"></script>
29 </head> 29 </head>
30 <body data-tab="general"> 30 <body data-tab="general">
31 <!-- Navigation sidebar --> 31 <!-- Navigation sidebar -->
32 <div id="nav-sidebar"> 32 <div id="nav-sidebar">
33 <div id="fixed-sidebar" class="fixed"> 33 <div id="fixed-sidebar" class="fixed">
34 <div id="page-title"> 34 <div id="page-title">
35 <p class="i18n_options_page_header_1"></p> 35 <p class="i18n_options_page_header_1"></p>
36 <h1 class="i18n_options_page_header_2"></h1> 36 <h1 class="i18n_options_page_header_2"></h1>
37 </div> 37 </div>
38 <ul id="main-navigation-tabs" class="tabs vertical"> 38 <ul class="tabs vertical">
39 <li id="tab-general" data-show="general" class="active"> 39 <li id="tab-general" data-action="switch-tab" data-tab="general" class ="active">
40 <a class="i18n_options_tab_general"></a> 40 <a class="i18n_options_tab_general"></a>
41 <span class="icon"></span> 41 <span class="icon"></span>
42 </li> 42 </li>
43 <li id="tab-advanced" data-show="advanced"> 43 <li id="tab-advanced" data-action="switch-tab" data-tab="advanced">
44 <a class="i18n_options_tab_advanced"></a> 44 <a class="i18n_options_tab_advanced"></a>
45 <span class="icon"></span> 45 <span class="icon"></span>
46 </li> 46 </li>
47 <li id="tab-help" data-show="help"> 47 <li id="tab-help" data-action="switch-tab" data-tab="help">
48 <a class="i18n_options_tab_help"></a> 48 <a class="i18n_options_tab_help"></a>
49 <span class="icon"></span> 49 <span class="icon"></span>
50 </li> 50 </li>
51 </ul> 51 </ul>
52 <a id="link-version"> 52 <a id="link-version">
53 <span class="i18n_options_version"></span> 53 <span class="i18n_options_version"></span>
54 <span id="abp-version"></span> 54 <span id="abp-version"></span>
55 </a> 55 </a>
56 <ul class="tabs vertical bottom"> 56 <ul class="tabs vertical bottom">
57 <li id="tab-share"> 57 <li id="tab-share">
(...skipping 21 matching lines...) Expand all
79 <span class="i18n_options_language_title"></span> 79 <span class="i18n_options_language_title"></span>
80 <a class="i18n_options_readMore tooltip" target="_blank"></a> 80 <a class="i18n_options_readMore tooltip" target="_blank"></a>
81 </p> 81 </p>
82 <ul id="blocking-languages-table" class="table list"> 82 <ul id="blocking-languages-table" class="table list">
83 <template> 83 <template>
84 <input type="checkbox" class="control" /> 84 <input type="checkbox" class="control" />
85 <span class="display"></span> 85 <span class="display"></span>
86 </template> 86 </template>
87 </ul> 87 </ul>
88 <div class="controls"> 88 <div class="controls">
89 <button data-action="open-language-dialog"> 89 <button data-action="open-dialog" data-dialog="language">
90 <span class="icon icon-add"></span> 90 <span class="icon icon-add"></span>
91 <span class="i18n_options_language_add"></span> 91 <span class="i18n_options_language_add"></span>
92 </button> 92 </button>
93 </div> 93 </div>
94 </div> 94 </div>
95 <div id="further-blocking"> 95 <div id="further-blocking">
96 <p class="option-name"> 96 <p class="option-name">
97 <strong class="i18n_options_furtherBlocking_title"></strong> 97 <strong class="i18n_options_furtherBlocking_title"></strong>
98 <a class="i18n_options_readMore tooltip" target="_blank"></a> 98 <a class="i18n_options_readMore tooltip" target="_blank"></a>
99 </p> 99 </p>
100 <div id="custom-wrapper"> 100 <div id="custom-wrapper">
101 <ul id="recommend-list-table" class="table list"> 101 <ul id="recommend-list-table" class="table list">
102 <template> 102 <template>
103 <input type="checkbox" class=control /> 103 <input type="checkbox" class=control />
104 <span class="display"></span> 104 <span class="display"></span>
105 <span class="popular"></span> 105 <span class="popular"></span>
106 </template> 106 </template>
107 </ul> 107 </ul>
108 <ul id="custom-list-table" class="table list"> 108 <ul id="custom-list-table" class="table list">
109 <template> 109 <template>
110 <input type="checkbox" class="control" /> 110 <input type="checkbox" class="control" />
111 <span class="display"></span> 111 <span class="display"></span>
112 </template> 112 </template>
113 </ul> 113 </ul>
114 </div> 114 </div>
115 <div class="controls"> 115 <div class="controls">
116 <button data-action="open-subscription-dialog"> 116 <button data-action="open-dialog" data-dialog="custom">
117 <span class="icon icon-add"></span> 117 <span class="icon icon-add"></span>
118 <span class="i18n_options_furtherBlocking_add"><span> 118 <span class="i18n_options_furtherBlocking_add"><span>
119 </button> 119 </button>
120 </div> 120 </div>
121 </div> 121 </div>
122 </div> 122 </div>
123 </div> 123 </div>
124 <div> 124 <div>
125 <h1 class="i18n_options_exceptions_title"></h1> 125 <h1 class="i18n_options_exceptions_title"></h1>
126 <div class="flex-container"> 126 <div class="flex-container">
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
171 <div> 171 <div>
172 <h1><span class="i18n_options_tweaks_title"></span><a class="i18n_op tions_readMore tooltip" href="#"></a></h1> 172 <h1><span class="i18n_options_tweaks_title"></span><a class="i18n_op tions_readMore tooltip" href="#"></a></h1>
173 <ul class="table" style="width: auto;"> 173 <ul class="table" style="width: auto;">
174 <li> 174 <li>
175 <input type="checkbox" id="easylist"/><span id="block-element-ex planation" class="i18n_options_tweaks_blockElement"></span></li> 175 <input type="checkbox" id="easylist"/><span id="block-element-ex planation" class="i18n_options_tweaks_blockElement"></span></li>
176 </ul> 176 </ul>
177 </div> 177 </div>
178 <div> 178 <div>
179 <h1><span class="i18n_options_blockingList_title"></span><a class="i 18n_options_readMore tooltip" href="#" target="_blank"></a></h1> 179 <h1><span class="i18n_options_blockingList_title"></span><a class="i 18n_options_readMore tooltip" href="#" target="_blank"></a></h1>
180 <ul id="blocking-list-tabs" class="tabs horizontal"> 180 <ul id="blocking-list-tabs" class="tabs horizontal">
181 <li class="i18n_options_tab_overview active" data-show="blocking-l ist-overview"></li><li class="i18n_options_tab_ownList" data-show="blocking-list -own"></li> 181 <li class="i18n_options_tab_overview active" data-show="blocking-l ist-overview"></li><li class="i18n_options_tab_ownList" data-show="custom-filter s"></li>
182 </ul> 182 </ul>
183 <div id="blocking-list"> 183 <div id="blocking-list">
184 <div id="blocking-list-overview"> 184 <div id="blocking-list-overview">
185 <ul class="table cols" style="width: auto;"> 185 <ul class="table cols" style="width: auto;">
186 <li class="col-name"><span class="i18n_options_tableCol_name"> </span><span class="i18n_options_tableCol_description"></span><span class="i18n_ options_tableCol_date"></span></li> 186 <li class="col-name"><span class="i18n_options_tableCol_name"> </span><span class="i18n_options_tableCol_description"></span><span class="i18n_ options_tableCol_date"></span></li>
187 <li><input type="checkbox" id="easylist"/><span>Easylist</span ><span>Adblocking english sites</span><span>15 March 14 - 10:31</span></li> 187 <li><input type="checkbox" id="easylist"/><span>Easylist</span ><span>Adblocking english sites</span><span>15 March 14 - 10:31</span></li>
188 <li><input type="checkbox" id="easylist+de"/><span>Easylist Ge rmany + Easylist</span><span>Adblocking english + german sites</span><span>15 Ma rch 14 - 10:31</span></li> 188 <li><input type="checkbox" id="easylist+de"/><span>Easylist Ge rmany + Easylist</span><span>Adblocking english + german sites</span><span>15 Ma rch 14 - 10:31</span></li>
189 <li><input type="checkbox" id="annoyance-fb"/><span>Facebook a nnoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li> 189 <li><input type="checkbox" id="annoyance-fb"/><span>Facebook a nnoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 March 14 - 10:31</span></li>
190 <li><input type="checkbox" id="annoyance-youtube"/><span>Faceb ook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 Marc h 14 - 10:31</span></li> 190 <li><input type="checkbox" id="annoyance-youtube"/><span>Faceb ook annoyance blocker</span><span>Blocks Facebook annoyances</span><span>15 Marc h 14 - 10:31</span></li>
191 <li><input type="checkbox" id="own-list"/><span>Own blocking l ist</span><span>Your own blocking list</span><span><a href="#">edit your blockin g list</a></span></li> 191 <li><input type="checkbox" id="own-list"/><span>Own blocking l ist</span><span>Your own blocking list</span><span><a href="#">edit your blockin g list</a></span></li>
192 </ul> 192 </ul>
193 <div class="controls"> 193 <div class="controls">
194 <button> 194 <button>
195 <span class="icon icon-add"></span><span class="i18n_options _blockingList_add"></span> 195 <span class="icon icon-add"></span><span class="i18n_options _blockingList_add"></span>
196 </button> 196 </button>
197 <button> 197 <button>
198 <span class="icon icon-update"></span><span class="i18n_opti ons_blockingList_update"></span> 198 <span class="icon icon-update"></span><span class="i18n_opti ons_blockingList_update"></span>
199 </button> 199 </button>
200 </div> 200 </div>
201 </div> 201 </div>
202 <div id="blocking-list-own"> 202 <div id="custom-filters">
203 <p class="i18n_options_blockingRules"></p> 203 <h2 id="custom-filters-header" class="i18n_options_customFilters _title"></h2>
204 <ul class="table list"> 204 <div id="custom-filters-wrapper">
205 <li><span>zap2it.com##.zc-station-position</span></li> 205 <div id="custom-filters-list-wrapper">
206 <li><span>downturk.net##.zippo</span></li> 206 <ul id="custom-filters-table" class="table list">
207 <li><span>yahoo.com##.y708-promo-middle</span></li> 207 <template>
208 <li><span>reflector.com##.yahooboss</span></li> 208 <span class="display"></span>
209 <li><span>yardbarker.com##.yard_leader</span></li> 209 </template>
210 <li><span>espn.co.uk##.will_hill</span></li> 210 </ul>
211 <li><span>listverse.com##.wiki</span></li> 211 <form id="custom-filters-add" class="controls">
212 <li><span>planet5d.com##.wp-image-1573</span></li> 212 <input type="text"/>
213 <li><span>buzzinn.net##.wpn_finner</span></li> 213 <button class="i18n_options_button_add" type="submit"></bu tton>
214 <li><span>talkers.com##.wpss_slideshow</span></li> 214 </form>
215 </ul>
216 <div class="controls" style="margin: 0px;">
217 <input type="text" placeholder="add your blocking rule here"/>
218 <div class="input-control">
219 <span class="input-separator"></span>
220 <span class="i18n_options_button_add input-button-text"></sp an>
221 <span class="icon icon-enter-blue"></span>
222 </div> 215 </div>
223 </div> 216 <textarea id="custom-filters-raw"></textarea>
224 <div class="controls"> 217 </div>
225 <button> 218 <div id="custom-filters-edit-wrapper" class="controls">
219 <button id="custom-filters-show-edit" data-action="edit-custom -filters">
226 <span class="icon icon-edit"></span> 220 <span class="icon icon-edit"></span>
227 <span class="i18n_options_blockingRules_edit"></span> 221 <span class="i18n_options_customFilter_edit"></span>
228 </button> 222 </button>
223 <div id="custom-filters-raw-controls">
224 <button data-action="cancel-custom-filters">
225 <span class="icon icon-edit"></span>
226 <span class="i18n_options_customFilter_list"></span>
227 </button>
228 <button id="custom-filters-raw-save" data-action="save-custo m-filters">
229 <span class="icon icon-edit"></span>
230 <span class="i18n_options_customFilter_save"></span>
231 </button>
232 </div>
229 </div> 233 </div>
230 </div> 234 </div>
231 </div> 235 </div>
232 </div> 236 </div>
233 </div> 237 </div>
234 238
235 <!-- Help tab content --> 239 <!-- Help tab content -->
236 <div id="content-help"> 240 <div id="content-help">
237 <h1 class="i18n_options_faq_title"></h1> 241 <h1 class="i18n_options_faq_title"></h1>
238 <p class="i18n_options_faq_description"></p> 242 <p class="i18n_options_faq_description"></p>
(...skipping 13 matching lines...) Expand all
252 <a href="#" target="_blank">Google+</a> 256 <a href="#" target="_blank">Google+</a>
253 </p> 257 </p>
254 </div> 258 </div>
255 </div> 259 </div>
256 </div> 260 </div>
257 261
258 <!-- Dialog --> 262 <!-- Dialog -->
259 <div id="dialog"> 263 <div id="dialog">
260 <header> 264 <header>
261 <span id="dialog-title"> 265 <span id="dialog-title">
262 <span id="dialog-title-customlist" class="i18n_options_dialog_customli st_title"></span> 266 <span id="dialog-title-custom" class="i18n_options_dialog_custom_title "></span>
263 <span id="dialog-title-language" class="i18n_options_dialog_language_t itle"></span> 267 <span id="dialog-title-language" class="i18n_options_dialog_language_t itle"></span>
264 <span id="dialog-title-addSubscription" class="i18n_options_dialog_add Subscription_title"></span> 268 <span id="dialog-title-predefined" class="i18n_options_dialog_predefin ed_title"></span>
saroyanm 2015/07/13 16:20:07 I think make sense to have consistent IDs for each
Thomas Greiner 2015/07/13 18:37:14 Done but used different names to have shorter IDs.
265 </span> 269 </span>
266 <button id="dialog-close" class="i18n_options_close" data-action="close- dialog"></button> 270 <button id="dialog-close" class="i18n_options_close" data-action="close- dialog"></button>
267 </header> 271 </header>
268 <div id="dialog-body" class="content"> 272 <div id="dialog-body" class="content">
269 <!-- Add other website language --> 273 <!-- Add language subscription -->
270 <div id="dialog-content-language" class="dialog-content"> 274 <div id="dialog-content-language" class="dialog-content">
271 <div class="dialog-content-block"> 275 <div class="dialog-content-block">
272 <h3 class="i18n_options_dialog_language_added"></h3> 276 <h3 class="i18n_options_dialog_language_added"></h3>
273 <ul id="blocking-languages-dialog-table" class="table list"> 277 <ul id="blocking-languages-dialog-table" class="table list">
274 <template> 278 <template>
275 <span class="display"></span> 279 <span class="display"></span>
276 </template> 280 </template>
277 </ul> 281 </ul>
278 </div> 282 </div>
279 <div id="other-language" class="dialog-content-block"> 283 <div id="other-language" class="dialog-content-block">
280 <h3 class="i18n_options_dialog_language_other"></h3> 284 <h3 class="i18n_options_dialog_language_other"></h3>
281 <div> 285 <div>
282 <input type="search" id="find-language" /> 286 <input type="search" id="find-language" />
283 </div> 287 </div>
284 <ul id="all-lang-table" class="table list"> 288 <ul id="all-lang-table" class="table list">
285 <template> 289 <template>
286 <button class="button-add control"> 290 <button class="button-add control">
287 +<span></span> 291 +<span></span>
288 </button> 292 </button>
289 <span class="display"></span> 293 <span class="display"></span>
290 </template> 294 </template>
291 </ul> 295 </ul>
292 </div> 296 </div>
293 </div> 297 </div>
294 <!-- Add other blocking list --> 298 <!-- Add custom subscription -->
295 <div id="dialog-content-customlist" class="dialog-content"> 299 <div id="dialog-content-custom" class="dialog-content">
296 <div class="dialog-content-block"> 300 <div class="dialog-content-block">
297 <h3 class="i18n_options_dialog_customlist_subscription_title"></h3> 301 <h3 class="i18n_options_dialog_custom_subscription_title"></h3>
298 <div> 302 <div>
299 <input id="blockingList-textbox" type="text" placeholder="www.exam ple.com/blockinglist.txt" /> 303 <input id="blockingList-textbox" type="text" placeholder="www.exam ple.com/blockinglist.txt" />
300 </div> 304 </div>
301 <div class="button-wrapper" data-action="import-subscription"> 305 <div class="button-wrapper" data-action="import-subscription">
302 <span class="icon icon-arrow"></span> 306 <span class="icon icon-arrow"></span>
303 <span class="i18n_options_dialog_customlist_import"></span> 307 <span class="i18n_options_dialog_custom_import"></span>
304 </div> 308 </div>
305 </div> 309 </div>
306 <div class="dialog-content-block"> 310 <div class="dialog-content-block">
307 <h3 class="i18n_options_dialog_edit_own_list"></h3> 311 <h3 class="i18n_options_dialog_edit_own_list"></h3>
308 <div class="button-wrapper" data-action="edit-custom-filters"> 312 <div class="button-wrapper" data-action="close-dialog,switch-tab,edi t-custom-filters" data-tab="advanced">
309 <span class="icon icon-arrow"></span> 313 <span class="icon icon-arrow"></span>
310 <span class="i18n_options_dialog_create_own_list"></span> 314 <span class="i18n_options_dialog_create_own_list"></span>
311 </div> 315 </div>
312 </div> 316 </div>
313 </div> 317 </div>
314 <!-- Add predefined subscription --> 318 <!-- Add predefined subscription -->
315 <div id="dialog-content-addSubscription" class="dialog-content"> 319 <div id="dialog-content-predefined" class="dialog-content">
saroyanm 2015/07/13 16:20:07 As mentioned above, make sense to name our dialogs
Thomas Greiner 2015/07/13 18:37:14 Done.
316 <div class="dialog-content-block"> 320 <div class="dialog-content-block">
317 <h3></h3> 321 <h3></h3>
318 <div class="url"></div> 322 <div class="url"></div>
319 <div class="button-wrapper" data-action="add-subscription"> 323 <div class="button-wrapper" data-action="add-predefined-subscription ">
320 <span class="icon icon-arrow"></span> 324 <span class="icon icon-arrow"></span>
321 <span class="i18n_options_dialog_addSubscription_confirm"></span> 325 <span class="i18n_options_dialog_predefined_confirm"></span>
322 </div> 326 </div>
323 </div> 327 </div>
324 </div> 328 </div>
325 </div> 329 </div>
326 </div> 330 </div>
327 </body> 331 </body>
328 </html> 332 </html>
LEFTRIGHT

Powered by Google App Engine
This is Rietveld