OLD | NEW |
1 <!-- | 1 /* |
2 * Copyright (c) 2009 The Chromium Authors. All rights reserved. Use of this | 2 * Copyright (c) 2012 The Chromium Authors. All rights reserved. Use of this |
3 * source code is governed by a BSD-style license that can be found in the | 3 * source code is governed by a BSD-style license that can be found in the |
4 * LICENSE file. | 4 * LICENSE file. |
5 --> | 5 */ |
6 <html> | |
7 <head> | |
8 <title></title> | |
9 <link rel="stylesheet" href="style.css" type="text/css" /> | |
10 <style> | |
11 body { | |
12 display:-webkit-box; | |
13 -webkit-box-orient:vertical; | |
14 } | |
15 | 6 |
16 body>* { | 7 // Various text messages within the edit dialog. |
17 display:-webkit-box; | 8 var assistText = chrome.i18n.getMessage("rss_subscription_feed_url_assist"); |
18 } | |
19 | 9 |
20 #dialogBackground { | 10 // Specifies the index of the item we are editing or -1 if adding new. |
21 background-color: rgba(0, 0, 0, .2); | 11 var editingIndex = -1; |
22 display: none; | 12 // Whether we are currently editing the default item. |
23 height: 100%; | 13 var editingDefault = false; |
24 left: 0; | |
25 position: fixed; | |
26 top: 0; | |
27 width: 100%; | |
28 z-index: 1; | |
29 -webkit-box-orient: vertical; | |
30 -webkit-user-select:none; | |
31 } | |
32 | |
33 #dialogHBackground { | |
34 height: 100%; | |
35 -webkit-box-orient: horizontal; | |
36 } | |
37 | |
38 #dialog { | |
39 background-color: #5296DE; | |
40 border: 1px solid #3A75BD; | |
41 border-radius: 6px 6px; | |
42 font-size: 12px; | |
43 width: 355px; | |
44 -webkit-box-orient: vertical; | |
45 } | |
46 | |
47 #dialogHeader { | |
48 background-color: rgba(0,0,0,0); | |
49 color: white; | |
50 font-weight: bold; | |
51 margin: 4px; | |
52 width: 100%; | |
53 } | |
54 | |
55 #dialogBody { | |
56 background-color: rgb(240, 240, 240); | |
57 border: 1px solid #3A75BD; | |
58 border-bottom-left-radius: 4px 4px; | |
59 border-bottom-right-radius: 4px 4px; | |
60 margin: 0px 2px 2px 2px; | |
61 padding-bottom: 10px; | |
62 padding-right: 10px; | |
63 padding-top: 10px; | |
64 -webkit-box-orient: vertical; | |
65 width: 340px; | |
66 } | |
67 | |
68 #dialogBackground, #dialogBackground div { | |
69 display: -webkit-box; | |
70 -webkit-box-align: center; | |
71 } | |
72 | |
73 #dialog input[type="button"] { | |
74 font-size: 12px; | |
75 height: 25px; | |
76 width: 100px; | |
77 } | |
78 | |
79 #dialog input[type="text"] { | |
80 font-size: 12px; | |
81 font-family: Arial, Helvetica, sans-serif; | |
82 width: 220px; | |
83 } | |
84 | |
85 .dialogRow { | |
86 margin-left: -24px; | |
87 width: 100%; | |
88 -webkit-box-orient: horizontal; | |
89 -webkit-box-pack: end; | |
90 } | |
91 | |
92 .dialogRow>* { | |
93 margin: 2px | |
94 } | |
95 | |
96 #dialogContentFooter { | |
97 margin-bottom: 6px; | |
98 margin-left: -12px; | |
99 margin-top: 20px; | |
100 padding-right: 10px; | |
101 } | |
102 | |
103 .urlAssist { | |
104 padding-left: 30px; | |
105 } | |
106 | |
107 .status { | |
108 background-color: #FFF18A; | |
109 } | |
110 | |
111 </style> | |
112 <script type="text/javascript" src="common.js"></script> | |
113 <script> | |
114 | |
115 // Various text messages within the edit dialog. | |
116 var assistText = chrome.i18n.getMessage("rss_subscription_feed_url_assist"); | |
117 | |
118 // Specifies the index of the item we are editing or -1 if adding new. | |
119 var editingIndex = -1; | |
120 // Whether we are currently editing the default item. | |
121 var editingDefault = false; | |
122 | 14 |
123 function main() { | 15 function main() { |
124 document.title = | 16 document.title = chrome.i18n.getMessage("rss_subscription_edit_dialog_title"); |
125 chrome.i18n.getMessage("rss_subscription_edit_dialog_title"); | |
126 | 17 |
127 // Make sure the dialog is not visible. | 18 // Make sure the dialog is not visible. |
128 document.getElementById('dialogBackground').style.display = "none"; | 19 document.getElementById('dialogBackground').style.display = "none"; |
129 | 20 |
130 // Make sure the buttons are disabled to begin with. | 21 // Make sure the buttons are disabled to begin with. |
131 document.getElementById('editReader').disabled = true; | 22 document.getElementById('editReader').disabled = true; |
132 document.getElementById('removeReader').disabled = true; | 23 document.getElementById('removeReader').disabled = true; |
133 document.getElementById('setDefault').disabled = true; | 24 document.getElementById('setDefault').disabled = true; |
134 | 25 |
135 if (!storageEnabled) { | 26 if (!storageEnabled) { |
(...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
181 function setDefault() { | 72 function setDefault() { |
182 var readerListbox = document.getElementById('readerListbox'); | 73 var readerListbox = document.getElementById('readerListbox'); |
183 var selection = readerListbox.options[readerListbox.selectedIndex]; | 74 var selection = readerListbox.options[readerListbox.selectedIndex]; |
184 window.localStorage.defaultReader = selection.value; | 75 window.localStorage.defaultReader = selection.value; |
185 | 76 |
186 // Reinititalize the page. | 77 // Reinititalize the page. |
187 main(); | 78 main(); |
188 } | 79 } |
189 | 80 |
190 function resetList() { | 81 function resetList() { |
191 if (!confirm(chrome.i18n.getMessage( | 82 if (!confirm(chrome.i18n.getMessage("rss_subscription_reset_list_confirm"))) { |
192 "rss_subscription_reset_list_confirm"))) { | |
193 return; | 83 return; |
194 } | 84 } |
195 | 85 |
196 delete window.localStorage.readerList; | 86 delete window.localStorage.readerList; |
197 delete window.localStorage.defaultReader; | 87 delete window.localStorage.defaultReader; |
198 delete window.localStorage.showPreviewPage; | 88 delete window.localStorage.showPreviewPage; |
199 | 89 |
200 // Reinititalize the page. | 90 // Reinititalize the page. |
201 main(); | 91 main(); |
202 } | 92 } |
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
249 window.localStorage.readerList = JSON.stringify(feedReaderList); | 139 window.localStorage.readerList = JSON.stringify(feedReaderList); |
250 | 140 |
251 if (wasDefault) | 141 if (wasDefault) |
252 window.localStorage.defaultReader = feedReaderList[0].url; | 142 window.localStorage.defaultReader = feedReaderList[0].url; |
253 } | 143 } |
254 | 144 |
255 main(); | 145 main(); |
256 } | 146 } |
257 | 147 |
258 /** | 148 /** |
259 * Shows the Edit Feed Reader dialog. | 149 * Shows the Edit Feed Reader dialog. |
260 */ | 150 */ |
261 function showDialog() { | 151 function showDialog() { |
262 document.getElementById('urlAssist').innerText = assistText; | 152 document.getElementById('urlAssist').innerText = assistText; |
263 document.getElementById('save').disabled = true; | 153 document.getElementById('save').disabled = true; |
264 | 154 |
265 // Show the dialog box. | 155 // Show the dialog box. |
266 document.getElementById('dialogBackground').style.display = "-webkit-box"; | 156 document.getElementById('dialogBackground').style.display = "-webkit-box"; |
267 } | 157 } |
268 | 158 |
269 /** | 159 /** |
270 * Hides the Edit Feed Reader dialog. | 160 * Hides the Edit Feed Reader dialog. |
271 */ | 161 */ |
272 function hideDialog() { | 162 function hideDialog() { |
273 document.getElementById('dialogBackground').style.display = "none"; | 163 document.getElementById('dialogBackground').style.display = "none"; |
274 } | 164 } |
275 | 165 |
276 /** | 166 /** |
277 * Validates the input in the form (making sure something is entered in both | 167 * Validates the input in the form (making sure something is entered in both |
278 * fields and that %s is not missing from the url field. | 168 * fields and that %s is not missing from the url field. |
279 */ | 169 */ |
280 function validateInput() { | 170 function validateInput() { |
281 document.getElementById('statusMsg').innerText = ""; | 171 document.getElementById('statusMsg').innerText = ""; |
282 | 172 |
283 var description = document.getElementById('descriptionText'); | 173 var description = document.getElementById('descriptionText'); |
284 var url = document.getElementById('urlText'); | 174 var url = document.getElementById('urlText'); |
285 | 175 |
286 var valid = description.value.length > 0 && | 176 var valid = (description.value.length > 0 && |
287 url.value.length > 0 && | 177 url.value.length > 0 && |
288 url.value.indexOf("%s") > -1; | 178 url.value.indexOf("%s") > -1); |
289 | 179 |
290 document.getElementById('save').disabled = !valid; | 180 document.getElementById('save').disabled = !valid; |
291 } | 181 } |
292 | 182 |
293 /** | 183 /** |
294 * Handler for saving the values. | 184 * Handler for saving the values. |
295 */ | 185 */ |
296 function save() { | 186 function save() { |
297 // Get the old list. | 187 // Get the old list. |
298 var feedReaderList = JSON.parse(window.localStorage.readerList); | 188 var feedReaderList = JSON.parse(window.localStorage.readerList); |
299 | 189 |
300 var url = document.getElementById('urlText').value; | 190 var url = document.getElementById('urlText').value; |
301 var description = document.getElementById('descriptionText').value; | 191 var description = document.getElementById('descriptionText').value; |
302 | 192 |
303 if (editingIndex == -1) { | 193 if (editingIndex == -1) { |
304 // Construct a new list. | 194 // Construct a new list. |
305 var newFeedList = []; | 195 var newFeedList = []; |
(...skipping 15 matching lines...) Expand all Loading... |
321 // Retain item default status, in case the url changed while editing item. | 211 // Retain item default status, in case the url changed while editing item. |
322 if (editingDefault) | 212 if (editingDefault) |
323 window.localStorage.defaultReader = url; | 213 window.localStorage.defaultReader = url; |
324 | 214 |
325 hideDialog(); | 215 hideDialog(); |
326 | 216 |
327 // Reload the values from scratch. | 217 // Reload the values from scratch. |
328 main(); | 218 main(); |
329 } | 219 } |
330 | 220 |
331 function init() { | 221 function listen(id, eventType, method) { |
| 222 document.getElementById(id).addEventListener(eventType, method); |
| 223 } |
| 224 |
| 225 document.addEventListener('DOMContentLoaded', function () { |
| 226 // Localize. |
332 i18nReplace('rss_subscription_options'); | 227 i18nReplace('rss_subscription_options'); |
333 i18nReplaceImpl('addReader', 'rss_subscription_add_reader'); | 228 i18nReplaceImpl('addReader', 'rss_subscription_add_reader'); |
334 i18nReplaceImpl('editReader', 'rss_subscription_edit_reader'); | 229 i18nReplaceImpl('editReader', 'rss_subscription_edit_reader'); |
335 i18nReplaceImpl('removeReader', 'rss_subscription_remove_reader'); | 230 i18nReplaceImpl('removeReader', 'rss_subscription_remove_reader'); |
336 i18nReplaceImpl('setDefault', 'rss_subscription_make_default_reader'); | 231 i18nReplaceImpl('setDefault', 'rss_subscription_make_default_reader'); |
337 i18nReplaceImpl('resetList', 'rss_subscription_reset_list'); | 232 i18nReplaceImpl('resetList', 'rss_subscription_reset_list'); |
338 i18nReplace('rss_subscription_always_use_default'); | 233 i18nReplace('rss_subscription_always_use_default'); |
339 i18nReplaceImpl('dialogHeader', 'rss_subscription_edit_dialog_title'); | 234 i18nReplaceImpl('dialogHeader', 'rss_subscription_edit_dialog_title'); |
340 i18nReplace('rss_subscription_feed_description'); | 235 i18nReplace('rss_subscription_feed_description'); |
341 i18nReplace('rss_subscription_feed_url'); | 236 i18nReplace('rss_subscription_feed_url'); |
342 i18nReplaceImpl('save', 'rss_subscription_save_button', 'value'); | 237 i18nReplaceImpl('save', 'rss_subscription_save_button', 'value'); |
343 i18nReplaceImpl('rss_subscription_close_button', | 238 i18nReplaceImpl('rss_subscription_close_button', |
344 'rss_subscription_close_button', 'value'); | 239 'rss_subscription_close_button', 'value'); |
| 240 // Init event listeners. |
| 241 listen('readerListbox', 'change', onSelectionChanged); |
| 242 listen('addReader', 'click', function () { editReader(-1); }); |
| 243 listen('editReader', 'click', function () { editReader(0); }); |
| 244 listen('removeReader', 'click', removeReader); |
| 245 listen('setDefault', 'click', setDefault); |
| 246 listen('resetList', 'click', resetList); |
| 247 listen('alwaysUseDefault', 'change', toggleFeedPreview); |
| 248 listen('descriptionText', 'keyup', validateInput); |
| 249 listen('urlText', 'keyup', validateInput); |
| 250 listen('save', 'click', save); |
| 251 listen('rss_subscription_close_button', 'click', hideDialog); |
| 252 |
| 253 // Reload the values from scratch. |
345 main(); | 254 main(); |
346 } | 255 }); |
347 </script> | |
348 </head> | |
349 <body onload="init()"> | |
350 <table border="0"> | |
351 <tr> | |
352 <td valign="top" width="16"> | |
353 <img src="feed-icon-16x16.png" /> | |
354 </td> | |
355 <td valign="middle"> | |
356 <strong id="rss_subscription_options"></strong> | |
357 </td> | |
358 <td colspan="2"> | |
359 </td> | |
360 </tr> | |
361 <tr> | |
362 <td colspan="2"> | |
363 <select id="readerListbox" size="8" style="width:300;" | |
364 onchange="onSelectionChanged()"></select> | |
365 </td> | |
366 <td valign="top"> | |
367 <button style="width:100%;" id="addReader" onclick="editReader(-1)" | |
368 ></button><br /> | |
369 <button style="width:100%;" id="editReader" onclick="editReader(0)" | |
370 ></button><br /> | |
371 <button style="width:100%;" id="removeReader" onclick="removeReader()" | |
372 ></button><br /> | |
373 <button style="width:100%;" id="setDefault" onclick="setDefault()" | |
374 ></button><br /> | |
375 <button style="width:100%;" id="resetList" onclick="resetList()" | |
376 ></button><br /> | |
377 </td> | |
378 <td style="width: 200px;"> | |
379 </td> | |
380 </tr> | |
381 <tr> | |
382 <td colspan="4"> | |
383 <input type="checkbox" id="alwaysUseDefault" | |
384 value="alwaysUseDefault" onchange="toggleFeedPreview()" | |
385 ><span id="rss_subscription_always_use_default"></span> | |
386 </td> | |
387 </tr> | |
388 </table> | |
389 | |
390 <div id="dialogBackground"> | |
391 <div id="dialogHBackground"> | |
392 <div id="dialog"> | |
393 | |
394 <div id="dialogHeader"></div> | |
395 | |
396 <div id="dialogBody"> | |
397 | |
398 <div class="dialogRow"> | |
399 <div class="status" id="statusMsg"></div> | |
400 </div> | |
401 | |
402 <div class="dialogRow"> | |
403 <div id="rss_subscription_feed_description"></div> | |
404 <div> | |
405 <input type="text" id="descriptionText" onkeyup="validateInput()"> | |
406 </div> | |
407 </div> | |
408 | |
409 <div class="dialogRow"> | |
410 <div id="rss_subscription_feed_url"></div> | |
411 <div> | |
412 <input type="text" id="urlText" onkeyup="validateInput()"> | |
413 </div> | |
414 </div> | |
415 | |
416 <div class="dialogRow"> | |
417 <div id="urlAssist" class="urlAssist"></div> | |
418 </div> | |
419 | |
420 <div class="dialogRow" id="dialogContentFooter"> | |
421 <div> | |
422 <input type="button" id="save" | |
423 onclick="save()"> | |
424 </div> | |
425 <div> | |
426 <input type="button" | |
427 id="rss_subscription_close_button" | |
428 onclick="hideDialog()"> | |
429 </div> | |
430 </div> | |
431 | |
432 </div> <!-- /dialogBody --> | |
433 | |
434 </div> | |
435 </div> | |
436 </div> | |
437 | |
438 </body> | |
439 </html> | |
OLD | NEW |