| OLD | NEW |
|---|
| (Empty) |
| 1 <html i18n-values="dir:textdirection;"> | |
| 2 <head> | |
| 3 <title></title> | |
| 4 <style type="text/css"> | |
| 5 body { | |
| 6 line-height: 1.5em; | |
| 7 background: #FFFFFF; | |
| 8 margin: 10px 15px; | |
| 9 font-size: 11pt; | |
| 10 } | |
| 11 html[os='mac'] body { | |
| 12 line-height: 1.5em; | |
| 13 margin: 15px 20px; | |
| 14 background: #FFFFFF; | |
| 15 } | |
| 16 form { | |
| 17 -webkit-user-select: none; | |
| 18 } | |
| 19 .sync-header { | |
| 20 font-size: 1.2em; | |
| 21 font-weight: bold; | |
| 22 margin-bottom: 10px; | |
| 23 } | |
| 24 .sync-select-customization { | |
| 25 margin-top: 10px; | |
| 26 } | |
| 27 #chooseDataTypesRadio { | |
| 28 vertical-align: top; | |
| 29 } | |
| 30 #chooseDataTypes > div { | |
| 31 display: inline-block; | |
| 32 } | |
| 33 #chooseDataTypesBody { | |
| 34 width: 90%; | |
| 35 -webkit-margin-start: 3ex; | |
| 36 } | |
| 37 #chooseDataTypesBody > div { | |
| 38 margin-top: 0px; | |
| 39 -webkit-column-count: 2; | |
| 40 -webkit-column-gap: 10px; | |
| 41 column-count: 2; | |
| 42 column-gap: 10px; | |
| 43 } | |
| 44 .sync-item-show { | |
| 45 display: block; | |
| 46 white-space: nowrap; | |
| 47 } | |
| 48 | |
| 49 .sync-item-show > label { | |
| 50 overflow: hidden; | |
| 51 white-space: nowrap; | |
| 52 text-overflow: ellipsis; | |
| 53 display: inline-block; | |
| 54 width: 92%; | |
| 55 } | |
| 56 | |
| 57 .sync-item-hide { | |
| 58 display: none; | |
| 59 } | |
| 60 .sync-label-inactive { | |
| 61 color: #9B9B9B; | |
| 62 } | |
| 63 .sync-label-active { | |
| 64 color: #000000; | |
| 65 } | |
| 66 .sync-data-types { | |
| 67 margin-left: 5px; | |
| 68 } | |
| 69 .sync-errors { | |
| 70 margin-top: 5px; | |
| 71 } | |
| 72 .sync-error-show { | |
| 73 display: block; | |
| 74 width: 80%; | |
| 75 margin-left: auto; | |
| 76 margin-right: auto; | |
| 77 text-align: center; | |
| 78 padding: 1px 10px; | |
| 79 background-color: #eeb939; | |
| 80 -webkit-border-radius: 4px; | |
| 81 font-weight: bold; | |
| 82 } | |
| 83 .sync-error-hide { | |
| 84 display: none; | |
| 85 } | |
| 86 .sync-footer { | |
| 87 position: fixed; | |
| 88 right: 0px; | |
| 89 bottom: 0px; | |
| 90 margin-right: 10px; | |
| 91 margin-bottom: 10px; | |
| 92 } | |
| 93 html[dir='rtl'] .sync-footer { | |
| 94 text-align: left; | |
| 95 left: 0px; | |
| 96 bottom: 0px; | |
| 97 margin-left: 20px; | |
| 98 } | |
| 99 #throb { | |
| 100 background-image: url("../../../../app/resources/throbber.png"); | |
| 101 width: 16px; | |
| 102 height: 16px; | |
| 103 background-position: 0px; | |
| 104 margin: -3px 10px; | |
| 105 display: inline-block; | |
| 106 } | |
| 107 input[type='button'], | |
| 108 input[type='submit'] { | |
| 109 min-width: 87px; | |
| 110 min-height: 26px; | |
| 111 } | |
| 112 html[os='mac'] input[type='button'], | |
| 113 html[os='mac'] input[type='submit'] { | |
| 114 font-size: 12pt; | |
| 115 } | |
| 116 | |
| 117 </style> | |
| 118 <script src="chrome://resources/js/cr.js"></script> | |
| 119 <script> | |
| 120 | |
| 121 // Called once, when this html/js is loaded. | |
| 122 function initializeChooseDataTypesDialog() { | |
| 123 // Allow platform specific rules | |
| 124 if (cr.isMac) { | |
| 125 document.documentElement.setAttribute('os', 'mac'); | |
| 126 } else if (!cr.isWindows) { | |
| 127 document.documentElement.setAttribute('os', 'linux'); | |
| 128 } | |
| 129 | |
| 130 setInterval(advanceThrobber, 30); | |
| 131 var args = JSON.parse(chrome.dialogArguments); | |
| 132 setChooseDataTypesCheckboxes(args); | |
| 133 } | |
| 134 | |
| 135 function setCheckboxesAndErrors(args) { | |
| 136 setChooseDataTypesCheckboxes(args); | |
| 137 setErrorState(args); | |
| 138 } | |
| 139 | |
| 140 // Can be called multiple times. | |
| 141 function setChooseDataTypesCheckboxes(args) { | |
| 142 setStateThrobbing(false); | |
| 143 | |
| 144 // If this frame is on top, the focus should be on it, so pressing enter | |
| 145 // submits this form. | |
| 146 if (args.iframeToShow == 'choose_data_types') { | |
| 147 document.getElementById("okButton").focus(); | |
| 148 } | |
| 149 | |
| 150 document.getElementById("keepEverythingSyncedRadio").checked = | |
| 151 args.keepEverythingSynced; | |
| 152 document.getElementById("chooseDataTypesRadio").checked = | |
| 153 !args.keepEverythingSynced; | |
| 154 setDataTypeCheckboxesEnabled(!args.keepEverythingSynced); | |
| 155 | |
| 156 document.getElementById("bookmarksCheckbox").checked = args.syncBookmarks; | |
| 157 document.getElementById("preferencesCheckbox").checked = | |
| 158 args.syncPreferences; | |
| 159 document.getElementById("themesCheckbox").checked = args.syncThemes; | |
| 160 | |
| 161 if (args.passwordsRegistered) { | |
| 162 document.getElementById("passwordsCheckbox").checked = args.syncPasswords; | |
| 163 document.getElementById("passwordsItem").className = "sync-item-show"; | |
| 164 } else { | |
| 165 document.getElementById("passwordsItem").className = "sync-item-hide"; | |
| 166 } | |
| 167 if (args.autofillRegistered) { | |
| 168 document.getElementById("autofillCheckbox").checked = args.syncAutofill; | |
| 169 document.getElementById("autofillItem").className = "sync-item-show"; | |
| 170 } else { | |
| 171 document.getElementById("autofillItem").className = "sync-item-hide"; | |
| 172 } | |
| 173 if (args.extensionsRegistered) { | |
| 174 document.getElementById("extensionsCheckbox").checked = | |
| 175 args.syncExtensions; | |
| 176 document.getElementById("extensionsItem").className = "sync-item-show"; | |
| 177 } else { | |
| 178 document.getElementById("extensionsItem").className = "sync-item-hide"; | |
| 179 } | |
| 180 if (args.typedUrlsRegistered) { | |
| 181 document.getElementById("typedUrlsCheckbox").checked = args.syncTypedUrls; | |
| 182 document.getElementById("omniboxItem").className = "sync-item-show"; | |
| 183 } else { | |
| 184 document.getElementById("omniboxItem").className = "sync-item-hide"; | |
| 185 } | |
| 186 if (args.appsRegistered) { | |
| 187 document.getElementById("appsCheckbox").checked = | |
| 188 args.syncApps; | |
| 189 document.getElementById("appsItem").className = "sync-item-show"; | |
| 190 } else { | |
| 191 document.getElementById("appsItem").className = "sync-item-hide"; | |
| 192 } | |
| 193 } | |
| 194 | |
| 195 function setErrorState(args) { | |
| 196 if (!args.was_aborted) | |
| 197 return; | |
| 198 document.getElementById("aborted_text").className = "sync-error-show"; | |
| 199 document.getElementById("okButton").disabled = true; | |
| 200 document.getElementById("keepEverythingSyncedRadio").disabled = true; | |
| 201 document.getElementById("chooseDataTypesRadio").disabled = true; | |
| 202 } | |
| 203 | |
| 204 function setDataTypeCheckboxesEnabled(enabled) { | |
| 205 var checkboxes = document.getElementsByName("dataTypeCheckbox"); | |
| 206 var labels = document.getElementsByName("dataTypeLabel"); | |
| 207 for (var i = 0; i < checkboxes.length; i++) { | |
| 208 checkboxes[i].disabled = !enabled; | |
| 209 if (checkboxes[i].disabled) { | |
| 210 labels[i].className = "sync-label-inactive"; | |
| 211 } else { | |
| 212 labels[i].className = "sync-label-active"; | |
| 213 } | |
| 214 } | |
| 215 } | |
| 216 | |
| 217 function advanceThrobber() { | |
| 218 var throbber = document.getElementById('throb'); | |
| 219 throbber.style.backgroundPositionX = | |
| 220 ((parseInt(getComputedStyle(throbber).backgroundPositionX) - 16) % | |
| 221 576) + 'px'; | |
| 222 } | |
| 223 | |
| 224 function setStateThrobbing(isThrobbing) { | |
| 225 var throbberContainer = document.getElementById('throbber_container'); | |
| 226 throbberContainer.style.visibility = isThrobbing ? "visible" : "hidden"; | |
| 227 | |
| 228 var okButton = document.getElementById('okButton'); | |
| 229 okButton.disabled = isThrobbing || templateData["was_aborted"]; | |
| 230 okButton.value = isThrobbing ? templateData['settingup'] : | |
| 231 templateData['ok']; | |
| 232 } | |
| 233 | |
| 234 // Returns true if at least one data type is enabled and no data types are | |
| 235 // checked. (If all data type checkboxes are disabled, it's because "keep | |
| 236 // everything synced" is checked.) | |
| 237 function noDataTypesChecked() { | |
| 238 var checkboxes = document.getElementsByName("dataTypeCheckbox"); | |
| 239 var atLeastOneChecked = false; | |
| 240 var atLeastOneEnabled = false; | |
| 241 for (var i = 0; i < checkboxes.length; i++) { | |
| 242 if (!checkboxes[i].disabled && checkboxes[i].style.display != 'none') { | |
| 243 atLeastOneEnabled = true; | |
| 244 if (checkboxes[i].checked) { | |
| 245 atLeastOneChecked = true; | |
| 246 } | |
| 247 } | |
| 248 } | |
| 249 return atLeastOneEnabled && !atLeastOneChecked; | |
| 250 } | |
| 251 | |
| 252 function sendChooseDataTypesAndClose() { | |
| 253 // Trying to submit, so hide previous errors. | |
| 254 document.getElementById("aborted_text").className = "sync-error-hide"; | |
| 255 document.getElementById("error_text").className = "sync-error-hide"; | |
| 256 | |
| 257 if (noDataTypesChecked()) { | |
| 258 document.getElementById("error_text").className = "sync-error-show"; | |
| 259 return; | |
| 260 } | |
| 261 | |
| 262 setStateThrobbing(true); | |
| 263 | |
| 264 var f = document.getElementById("chooseDataTypesForm"); | |
| 265 var syncAll = f.keepEverythingSyncedRadio.checked; | |
| 266 // These values need to be kept in sync with where they are read in | |
| 267 // SyncSetupFlow::GetDataTypeChoiceData(). | |
| 268 var result = JSON.stringify({ | |
| 269 "keepEverythingSynced": syncAll, | |
| 270 "syncBookmarks": syncAll || f.bookmarksCheckbox.checked, | |
| 271 "syncPreferences": syncAll || f.preferencesCheckbox.checked, | |
| 272 "syncThemes": syncAll || f.themesCheckbox.checked, | |
| 273 "syncPasswords": syncAll || f.passwordsCheckbox.checked, | |
| 274 "syncAutofill": syncAll || f.autofillCheckbox.checked, | |
| 275 "syncExtensions": syncAll || f.extensionsCheckbox.checked, | |
| 276 "syncTypedUrls": syncAll || f.typedUrlsCheckbox.checked, | |
| 277 "syncApps": syncAll || f.appsCheckbox.checked | |
| 278 }); | |
| 279 chrome.send("ChooseDataTypes", [result]); | |
| 280 } | |
| 281 | |
| 282 </script> | |
| 283 </head> | |
| 284 <body i18n-values=".style.fontFamily:fontfamily" | |
| 285 onload="initializeChooseDataTypesDialog();"> | |
| 286 <form id="chooseDataTypesForm" | |
| 287 onSubmit="sendChooseDataTypesAndClose(); return false;"> | |
| 288 | |
| 289 <div class="sync-header" | |
| 290 i18n-content="choosedatatypesheader"></div> | |
| 291 <div class="sync-choose_data_types_instructions" | |
| 292 i18n-content="choosedatatypesinstructions"></div> | |
| 293 <div class="sync-select-customization"> | |
| 294 <div class="sync-choice_radio"> | |
| 295 <input id="keepEverythingSyncedRadio" type="radio" name="syncChooseDataTypes" | |
| 296 onclick="setDataTypeCheckboxesEnabled(false)"> | |
| 297 <label for="keepEverythingSyncedRadio" i18n-content="keepeverythingsynced"> | |
| 298 </label> | |
| 299 </div> | |
| 300 <div id="chooseDataTypes" class="sync-choice_radio"> | |
| 301 <input id="chooseDataTypesRadio" type="radio" name="syncChooseDataTypes" | |
| 302 onclick="setDataTypeCheckboxesEnabled(true)"> | |
| 303 <label for="chooseDataTypesRadio" i18n-content="choosedatatypes" ></label> | |
| 304 <div id="chooseDataTypesBody"> | |
| 305 <div> | |
| 306 <!-- Apps --> | |
| 307 <div class="sync-item-show" id="appsItem"> | |
| 308 <input id="appsCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 309 <label id="appsCheckboxLabel" name="dataTypeLabel" | |
| 310 for="appsCheckbox" i18n-content="apps" | |
| 311 i18n-values="title:apps"></label> | |
| 312 </div> | |
| 313 <!-- Autofill --> | |
| 314 <div class="sync-item-show" id="autofillItem"> | |
| 315 <input id="autofillCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 316 <label id="autofillCheckboxLabel" name="dataTypeLabel" | |
| 317 for="autofillCheckbox" i18n-content="autofill" | |
| 318 i18n-values="title:autofill"></label> | |
| 319 </div> | |
| 320 <!-- Bookmarks --> | |
| 321 <div class="sync-item-show" id="bookmarksItem"> | |
| 322 <input id="bookmarksCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 323 <label id="bookmarksCheckboxLabel" name="dataTypeLabel" | |
| 324 for="bookmarksCheckbox" i18n-content="bookmarks" | |
| 325 i18n-values="title:bookmarks"></label> | |
| 326 </div> | |
| 327 <!-- Extensions --> | |
| 328 <div class="sync-item-show" id="extensionsItem"> | |
| 329 <input id="extensionsCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 330 <label id="extensionsCheckboxLabel" name="dataTypeLabel" | |
| 331 for="extensionsCheckbox" i18n-content="extensions" | |
| 332 i18n-values="title:extensions"></label> | |
| 333 </div> | |
| 334 <!-- Omnibox --> | |
| 335 <div class="sync-item-show" id="omniboxItem"> | |
| 336 <input id="typedUrlsCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 337 <label id="typedUrlsCheckboxLabel" name="dataTypeLabel" | |
| 338 for="typedUrlsCheckbox" i18n-content="typedurls" | |
| 339 i18n-values="title:typedurls"></label> | |
| 340 </div> | |
| 341 <!-- Passwords --> | |
| 342 <div class="sync-item-show" id="passwordsItem"> | |
| 343 <input id="passwordsCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 344 <label id="passwordsCheckboxLabel" name="dataTypeLabel" | |
| 345 for="passwordsCheckbox" i18n-content="passwords" | |
| 346 i18n-values="title:passwords"></label> | |
| 347 </div> | |
| 348 <!-- Preferences --> | |
| 349 <div class="sync-item-show" id="preferencesItem"> | |
| 350 <input id="preferencesCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 351 <label id="preferencesCheckboxLabel" name="dataTypeLabel" | |
| 352 for="preferencesCheckbox" i18n-content="preferences" | |
| 353 i18n-values="title:preferences"></label> | |
| 354 </div> | |
| 355 <!-- Themes --> | |
| 356 <div class="sync-item-show" id="themesItem"> | |
| 357 <input id="themesCheckbox" name="dataTypeCheckbox" type="checkbox"> | |
| 358 <label id="themesCheckboxLabel" name="dataTypeLabel" for="themesCheckbox" | |
| 359 i18n-content="themes" i18n-values="title:themes"></label> | |
| 360 </div> | |
| 361 </div> | |
| 362 </div> | |
| 363 </div> | |
| 364 <div class="sync-errors"> | |
| 365 <span id="error_text" i18n-content="synczerodatatypeserror" | |
| 366 class="sync-error-hide"></span> | |
| 367 <span id="aborted_text" i18n-content="setupabortederror" | |
| 368 class="sync-error-hide"></span> | |
| 369 </div> | |
| 370 <div class="sync-footer"> | |
| 371 <span id="throbber_container" style="visibility:hidden"> | |
| 372 <span id="throb"></span> | |
| 373 </span> | |
| 374 <input id="okButton" type="submit" i18n-values="value:ok" /> | |
| 375 <input id="cancelButton" type="button" i18n-values="value:cancel" | |
| 376 onclick='chrome.send("DialogClose", [""])' /> | |
| 377 </div> | |
| 378 </div> | |
| 379 </form> | |
| 380 </body> | |
| 381 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 3655004:
Add UI for setting the encryption passphrase.... (Closed)
Base URL: svn://chrome-svn/chrome/trunk/src/