options.html 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>SingleFile options</title>
  6. <link rel="stylesheet" href="options.css">
  7. <meta name="viewport" content="width=device-width,initial-scale=1">
  8. <meta name="color-scheme" content="light dark">
  9. </head>
  10. <body>
  11. <main>
  12. <h3>
  13. <span class="options-title">
  14. <span id="expandAllButton"></span>
  15. <span id="titleLabel"></span>
  16. <a href="options.html#" target="_blank" class="new-window-link"><img
  17. src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg=="></a>
  18. </span>
  19. <span class="profiles">
  20. <select id="profileNamesInput"></select>
  21. <button id="addProfileButton"><img src="../resources/button_new.png"></button>
  22. <button id="deleteProfileButton"><img src="../resources/button_delete.png"></button>
  23. <button id="renameProfileButton"><img src="../resources/button_edit.png"></button>
  24. </span>
  25. </h3>
  26. <details>
  27. <summary id="userInterfaceLabel"></summary>
  28. <div class="option">
  29. <label for="contextMenuEnabledInput" id="addMenuEntryLabel"></label>
  30. <input type="checkbox" id="contextMenuEnabledInput">
  31. </div>
  32. <div class="option">
  33. <label for="shadowEnabledInput" id="shadowEnabledLabel"></label>
  34. <input type="checkbox" id="shadowEnabledInput">
  35. </div>
  36. <div class="option">
  37. <label for="displayInfobarInput" id="displayInfobarLabel"></label>
  38. <input type="checkbox" id="displayInfobarInput">
  39. </div>
  40. <div class="option vertical">
  41. <label for="infobarTemplateInput" id="infobarTemplateLabel"></label>
  42. <input type="text" id="infobarTemplateInput">
  43. </div>
  44. <div class="option">
  45. <label for="confirmInfobarInput" id="confirmInfobarLabel"></label>
  46. <input type="checkbox" id="confirmInfobarInput">
  47. </div>
  48. <div class="option">
  49. <label for="openSavedPageInput" id="openSavedPageLabel"></label>
  50. <input type="checkbox" id="openSavedPageInput">
  51. </div>
  52. <div class="option">
  53. <label for="autoCloseInput" id="autoCloseLabel"></label>
  54. <input type="checkbox" id="autoCloseInput">
  55. </div>
  56. </details>
  57. <details>
  58. <summary id="filenameLabel"></summary>
  59. <div class="option vertical">
  60. <label for="filenameTemplateInput" id="filenameTemplateLabel"></label>
  61. <input type="text" id="filenameTemplateInput">
  62. </div>
  63. <div class="option">
  64. <label for="filenameMaxLengthInput" id="filenameMaxLengthLabel"></label>
  65. <div class="option-input">
  66. <input type="number" id="filenameMaxLengthInput" min="1">
  67. <select id="filenameMaxLengthUnitInput">
  68. <option id="filenameMaxLengthBytesUnitLabel" value="bytes"></option>
  69. <option id="filenameMaxLengthCharsUnitLabel" value="chars"></option>
  70. </select>
  71. </div>
  72. </div>
  73. <div class="option">
  74. <label for="confirmFilenameInput" id="confirmFilenameLabel"></label>
  75. <input type="checkbox" id="confirmFilenameInput">
  76. </div>
  77. <div class="option">
  78. <label for="filenameConflictActionInput" id="filenameConflictActionLabel"></label>
  79. <select id="filenameConflictActionInput">
  80. <option id="filenameConflictActionUniquifyLabel" value="uniquify"></option>
  81. <option id="filenameConflictActionOverwriteLabel" value="overwrite"></option>
  82. <option id="filenameConflictActionPromptLabel" value="prompt"></option>
  83. <option id="filenameConflictActionSkipLabel" value="skip"></option>
  84. </select>
  85. </div>
  86. </details>
  87. <details>
  88. <summary id="htmlContentLabel"></summary>
  89. <div class="option">
  90. <label for="compressHTMLInput" id="compressHTMLLabel"></label>
  91. <input type="checkbox" id="compressHTMLInput">
  92. </div>
  93. <div class="option">
  94. <label for="removeImportsInput" id="removeImportsLabel"></label>
  95. <input type="checkbox" id="removeImportsInput">
  96. </div>
  97. <div class="option">
  98. <label for="removeHiddenElementsInput" id="removeHiddenElementsLabel"></label>
  99. <input type="checkbox" id="removeHiddenElementsInput">
  100. </div>
  101. <div class="option">
  102. <label for="insertMetaCSPInput" id="insertMetaCSPLabel"></label>
  103. <input type="checkbox" id="insertMetaCSPInput">
  104. </div>
  105. <div class="option">
  106. <label for="removeFramesInput" id="removeFramesLabel"></label>
  107. <input type="checkbox" id="removeFramesInput">
  108. </div>
  109. <div class="option">
  110. <label for="saveOriginalURLsInput" id="saveOriginalURLsLabel"></label>
  111. <input type="checkbox" id="saveOriginalURLsInput">
  112. </div>
  113. <div class="option">
  114. <label for="includeInfobarInput" id="includeInfobarLabel"></label>
  115. <input type="checkbox" id="includeInfobarInput">
  116. </div>
  117. <div class="option">
  118. <label for="saveRawPageInput" id="saveRawPageLabel"></label>
  119. <input type="checkbox" id="saveRawPageInput">
  120. </div>
  121. </details>
  122. <details>
  123. <summary id="stylesheetsLabel"></summary>
  124. <div class="option">
  125. <label for="removeUnusedStylesInput" id="removeUnusedStylesLabel"></label>
  126. <input type="checkbox" id="removeUnusedStylesInput">
  127. </div>
  128. <div class="option">
  129. <label for="removeAlternativeMediasInput" id="removeAlternativeMediasLabel"></label>
  130. <input type="checkbox" id="removeAlternativeMediasInput">
  131. </div>
  132. <div class="option">
  133. <label for="compressCSSInput" id="compressCSSLabel"></label>
  134. <input type="checkbox" id="compressCSSInput">
  135. </div>
  136. <div class="option">
  137. <label for="moveStylesInHeadInput" id="moveStylesInHeadLabel"></label>
  138. <input type="checkbox" id="moveStylesInHeadInput">
  139. </div>
  140. </details>
  141. <details>
  142. <summary id="imagesLabel"></summary>
  143. <div class="option">
  144. <label for="groupDuplicateImagesInput" id="groupDuplicateImagesLabel"></label>
  145. <input type="checkbox" id="groupDuplicateImagesInput">
  146. </div>
  147. <div class="option">
  148. <label for="loadDeferredImagesInput" id="loadDeferredImagesLabel"></label>
  149. <input type="checkbox" id="loadDeferredImagesInput">
  150. </div>
  151. <div class="option second-level">
  152. <label for="loadDeferredImagesMaxIdleTimeInput" id="loadDeferredImagesMaxIdleTimeLabel"></label>
  153. <input type="number" class="large-input" id="loadDeferredImagesMaxIdleTimeInput" step="100">
  154. </div>
  155. <div class="option second-level">
  156. <label for="loadDeferredImagesKeepZoomLevelInput" id="loadDeferredImagesKeepZoomLevelLabel"></label>
  157. <input type="checkbox" id="loadDeferredImagesKeepZoomLevelInput">
  158. </div>
  159. <div class="option">
  160. <label for="removeAlternativeImagesInput" id="removeAlternativeImagesLabel"></label>
  161. <input type="checkbox" id="removeAlternativeImagesInput">
  162. </div>
  163. </details>
  164. <details>
  165. <summary id="fontsLabel"></summary>
  166. <div class="option">
  167. <label for="removeUnusedFontsInput" id="removeUnusedFontsLabel"></label>
  168. <input type="checkbox" id="removeUnusedFontsInput">
  169. </div>
  170. <div class="option">
  171. <label for="removeAlternativeFontsInput" id="removeAlternativeFontsLabel"></label>
  172. <input type="checkbox" id="removeAlternativeFontsInput">
  173. </div>
  174. </details>
  175. <details>
  176. <summary id="destinationLabel"></summary>
  177. <div class="option">
  178. <label for="saveToFilesystemInput" id="saveToFilesystemLabel"></label>
  179. <input type="radio" id="saveToFilesystemInput" name="destinationInput">
  180. </div>
  181. <div class="option">
  182. <label for="saveToClipboardInput" id="saveToClipboardLabel"></label>
  183. <input type="radio" id="saveToClipboardInput" name="destinationInput">
  184. </div>
  185. <div class="option">
  186. <label for="saveToGitHubInput" id="saveToGitHubLabel"></label>
  187. <input type="radio" id="saveToGitHubInput" name="destinationInput">
  188. </div>
  189. <div class="option second-level">
  190. <label for="githubTokenInput" id="githubTokenLabel"></label>
  191. <input type="text" id="githubTokenInput" class="medium-input">
  192. </div>
  193. <div class="option second-level">
  194. <label for="githubUserInput" id="githubUserLabel"></label>
  195. <input type="text" id="githubUserInput" class="medium-input">
  196. </div>
  197. <div class="option second-level">
  198. <label for="githubRepositoryInput" id="githubRepositoryLabel"></label>
  199. <input type="text" id="githubRepositoryInput" class="medium-input">
  200. </div>
  201. <div class="option second-level">
  202. <label for="githubBranchInput" id="githubBranchLabel"></label>
  203. <input type="text" id="githubBranchInput" class="medium-input">
  204. </div>
  205. <div class="option">
  206. <label for="saveToGDriveInput" id="saveToGDriveLabel"></label>
  207. <input type="radio" id="saveToGDriveInput" name="destinationInput">
  208. </div>
  209. <div class="option">
  210. <label for="saveWithCompanionInput" id="saveWithCompanionLabel"></label>
  211. <input type="radio" id="saveWithCompanionInput" name="destinationInput">
  212. </div>
  213. </details>
  214. <details>
  215. <summary id="networkLabel"></summary>
  216. <div class="option">
  217. <label id="blockResourcesLabel"></label>
  218. </div>
  219. <div class="option second-level">
  220. <label for="blockImagesInput" id="blockImagesLabel"></label>
  221. <input type="checkbox" id="blockImagesInput">
  222. </div>
  223. <div class="option second-level">
  224. <label for="blockStylesheetsInput" id="blockStylesheetsLabel"></label>
  225. <input type="checkbox" id="blockStylesheetsInput">
  226. </div>
  227. <div class="option second-level">
  228. <label for="blockFontsInput" id="blockFontsLabel"></label>
  229. <input type="checkbox" id="blockFontsInput">
  230. </div>
  231. <div class="option second-level">
  232. <label for="blockScriptsInput" id="blockScriptsLabel"></label>
  233. <input type="checkbox" id="blockScriptsInput">
  234. </div>
  235. <div class="option second-level">
  236. <label for="blockVideosInput" id="blockVideosLabel"></label>
  237. <input type="checkbox" id="blockVideosInput">
  238. </div>
  239. <div class="option second-level">
  240. <label for="blockAudiosInput" id="blockAudiosLabel"></label>
  241. <input type="checkbox" id="blockAudiosInput">
  242. </div>
  243. <div class="option">
  244. <label for="blockMixedContentInput" id="blockMixedContentLabel"></label>
  245. <input type="checkbox" id="blockMixedContentInput">
  246. </div>
  247. <div class="option">
  248. <label id="acceptHeadersLabel"></label>
  249. </div>
  250. <div class="option second-level">
  251. <label for="acceptHeaderDocumentInput" id="acceptHeaderDocumentLabel"></label>
  252. <input type="text" id="acceptHeaderDocumentInput">
  253. </div>
  254. <div class="option second-level">
  255. <label for="acceptHeaderImageInput" id="acceptHeaderImageLabel"></label>
  256. <input type="text" id="acceptHeaderImageInput">
  257. </div>
  258. <div class="option second-level">
  259. <label for="acceptHeaderStylesheetInput" id="acceptHeaderStylesheetLabel"></label>
  260. <input type="text" id="acceptHeaderStylesheetInput">
  261. </div>
  262. <div class="option second-level">
  263. <label for="acceptHeaderFontInput" id="acceptHeaderFontLabel"></label>
  264. <input type="text" id="acceptHeaderFontInput">
  265. </div>
  266. <div class="option second-level">
  267. <label for="acceptHeaderScriptInput" id="acceptHeaderScriptLabel"></label>
  268. <input type="text" id="acceptHeaderScriptInput">
  269. </div>
  270. <div class="option second-level">
  271. <label for="acceptHeaderVideoInput" id="acceptHeaderVideoLabel"></label>
  272. <input type="text" id="acceptHeaderVideoInput">
  273. </div>
  274. <div class="option second-level">
  275. <label for="acceptHeaderAudioInput" id="acceptHeaderAudioLabel"></label>
  276. <input type="text" id="acceptHeaderAudioInput">
  277. </div>
  278. <div class="option">
  279. <label for="maxResourceSizeEnabledInput" id="setMaxResourceSizeLabel"></label>
  280. <input type="checkbox" id="maxResourceSizeEnabledInput">
  281. </div>
  282. <div class="option second-level">
  283. <label for="maxResourceSizeInput" id="maxResourceSizeLabel"></label>
  284. <input type="number" id="maxResourceSizeInput" min="1">
  285. </div>
  286. <div class="option">
  287. <label for="maxResourceDelayEnabledInput" id="setMaxResourceDelayLabel"></label>
  288. <input type="checkbox" id="maxResourceDelayEnabledInput">
  289. </div>
  290. <div class="option second-level">
  291. <label for="maxResourceDelayInput" id="maxResourceDelayLabel"></label>
  292. <input type="number" id="maxResourceDelayInput" min="1">
  293. </div>
  294. <div class="option">
  295. <label for="passReferrerOnErrorInput" id="passReferrerOnErrorLabel"></label>
  296. <input type="checkbox" id="passReferrerOnErrorInput">
  297. </div>
  298. </details>
  299. <details>
  300. <summary id="editorLabel"></summary>
  301. <div class="option">
  302. <label for="defaultEditorModeInput" id="defaultEditorModeLabel"></label>
  303. <select id="defaultEditorModeInput">
  304. <option id="defaultEditorModeNormalLabel" value="normal"></option>
  305. <option id="defaultEditorModeEditLabel" value="edit"></option>
  306. <option id="defaultEditorModeFormatLabel" value="format"></option>
  307. <option id="defaultEditorModeCutLabel" value="cut"></option>
  308. <option id="defaultEditorModeCutExternalLabel" value="cut-external"></option>
  309. </select>
  310. </div>
  311. <div class="option">
  312. <label for="applySystemThemeInput" id="applySystemThemeLabel"></label>
  313. <input type="checkbox" id="applySystemThemeInput">
  314. </div>
  315. <div class="option">
  316. <label for="warnUnsavedPageInput" id="warnUnsavedPageLabel"></label>
  317. <input type="checkbox" id="warnUnsavedPageInput">
  318. </div>
  319. <div class="option">
  320. <label for="openEditorInput" id="openEditorLabel"></label>
  321. <input type="checkbox" id="openEditorInput">
  322. </div>
  323. <div class="option">
  324. <label for="autoOpenEditorInput" id="autoOpenEditorLabel"></label>
  325. <input type="checkbox" id="autoOpenEditorInput">
  326. </div>
  327. </details>
  328. <details>
  329. <summary id="bookmarksLabel"></summary>
  330. <div class="option">
  331. <label for="saveCreatedBookmarksInput" id="saveCreatedBookmarksLabel"></label>
  332. <input type="checkbox" id="saveCreatedBookmarksInput">
  333. </div>
  334. <div class="option second-level">
  335. <label for="replaceBookmarkURLInput" id="replaceBookmarkURLLabel"></label>
  336. <input type="checkbox" id="replaceBookmarkURLInput">
  337. </div>
  338. <div class="option second-level vertical">
  339. <label for="ignoredBookmarkFoldersInput" id="ignoredBookmarkFoldersLabel"></label>
  340. <input type="text" id="ignoredBookmarkFoldersInput">
  341. </div>
  342. <div class="option second-level vertical">
  343. <label for="allowedBookmarkFoldersInput" id="allowedBookmarkFoldersLabel"></label>
  344. <input type="text" id="allowedBookmarkFoldersInput">
  345. </div>
  346. </details>
  347. <details>
  348. <summary id="autoSaveLabel"></summary>
  349. <div class="option">
  350. <label for="autoSaveLoadOrUnloadInput" id="autoSaveLoadOrUnloadLabel"></label>
  351. <input type="checkbox" id="autoSaveLoadOrUnloadInput">
  352. </div>
  353. <div class="option second-level">
  354. <label for="autoSaveLoadInput" id="autoSaveLoadLabel"></label>
  355. <input type="checkbox" id="autoSaveLoadInput">
  356. </div>
  357. <div class="option second-level">
  358. <label for="autoSaveUnloadInput" id="autoSaveUnloadLabel"></label>
  359. <input type="checkbox" id="autoSaveUnloadInput">
  360. </div>
  361. <div class="option">
  362. <label for="autoSaveDiscardInput" id="autoSaveDiscardLabel"></label>
  363. <input type="checkbox" id="autoSaveDiscardInput">
  364. </div>
  365. <div class="option">
  366. <label for="autoSaveRemoveInput" id="autoSaveRemoveLabel"></label>
  367. <input type="checkbox" id="autoSaveRemoveInput">
  368. </div>
  369. <div class="option">
  370. <label for="autoSaveDelayInput" id="autoSaveDelayLabel"></label>
  371. <input type="number" id="autoSaveDelayInput" min="0">
  372. </div>
  373. <div class="option">
  374. <label for="autoSaveRepeatInput" id="autoSaveRepeatLabel"></label>
  375. <input type="checkbox" id="autoSaveRepeatInput">
  376. </div>
  377. <div class="option second-level">
  378. <label for="autoSaveRepeatDelayInput" id="autoSaveRepeatDelayLabel"></label>
  379. <input type="number" id="autoSaveRepeatDelayInput" min="1">
  380. </div>
  381. <div class="option">
  382. <label for="autoSaveExternalSaveInput" id="autoSaveExternalSaveLabel"></label>
  383. <input type="checkbox" id="autoSaveExternalSaveInput">
  384. </div>
  385. </details>
  386. <details>
  387. <summary id="miscLabel"></summary>
  388. <div class="option">
  389. <label for="addProofInput" id="addProofLabel"></label>
  390. <input type="checkbox" id="addProofInput">
  391. </div>
  392. <div class="option second-level vertical" hidden>
  393. <label for="woleetKeyInput" id="woleetKeyLabel"></label>
  394. <input type="text" id="woleetKeyInput">
  395. </div>
  396. <div class="option">
  397. <label for="backgroundSaveInput" id="backgroundSaveLabel"></label>
  398. <input type="checkbox" id="backgroundSaveInput">
  399. </div>
  400. <div class="option">
  401. <label for="displayStatsInput" id="displayStatsLabel"></label>
  402. <input type="checkbox" id="displayStatsInput">
  403. </div>
  404. </details>
  405. <details>
  406. <summary id="autoSettingsLabel"></summary>
  407. <div class="rules-table-container compact">
  408. <div class="thead">
  409. <div class="tr">
  410. <span class="th" id="autoSettingsUrlLabel"></span>
  411. <span class="th" id="autoSettingsProfileLabel"></span>
  412. <span class="th rule-autosave-profile" id="autoSettingsAutoSaveProfileLabel"></span>
  413. <span class="th"><button id="rulesDeleteAllButton"><img
  414. src="../resources/button_delete_all.png"></button></span>
  415. </div>
  416. </div>
  417. <div class="rules-table">
  418. <div class="rules-data">
  419. </div>
  420. <div hidden class="tr rule-view">
  421. <span class="td rule-url"></span>
  422. <span class="td rule-profile"></span>
  423. <span class="td rule-autosave-profile"></span>
  424. <span class="td"><button class="rule-update-button"><img
  425. src="../resources/button_edit.png"></button> <button class="rule-delete-button"><img
  426. src="../resources/button_delete.png"></button></span>
  427. </div>
  428. <form class="tr rule-create">
  429. <span class="td rule-url"><input type="text" id="ruleUrlInput"
  430. placeholder="Type a complete or partial URL (e.g. example.com)"></span>
  431. <span class="td rule-profile"><select id="ruleProfileInput"></select></span>
  432. <span class="td rule-autosave-profile"><select id="ruleAutoSaveProfileInput"></select></span>
  433. <span class="td"><button id="ruleAddButton" disabled type="submit"><img
  434. src="../resources/button_new.png"></button></span>
  435. </form>
  436. <form hidden class="tr rule-edit">
  437. <span class="td rule-url"><input type="text" id="ruleEditUrlInput"></span>
  438. <span class="td rule-profile"><select id="ruleEditProfileInput"></select></span>
  439. <span class="td rule-autosave-profile"><select
  440. id="ruleEditAutoSaveProfileInput"></select></span>
  441. <span class="td"><button id="ruleEditButton" type="submit"><img
  442. src="../resources/button_ok.png"></button></span>
  443. </form>
  444. </div>
  445. </div>
  446. <div class="option">
  447. <label for="showAllProfilesInput" id="showAllProfilesLabel"></label>
  448. <input type="checkbox" id="showAllProfilesInput">
  449. </div>
  450. <div class="option">
  451. <label for="showAutoSaveProfileInput" id="showAutoSaveProfileLabel"></label>
  452. <input type="checkbox" id="showAutoSaveProfileInput">
  453. </div>
  454. </details>
  455. <div class="option bottom">
  456. <a href="help.html" target="SingleFileHelpPage" id="helpLabel"></a>
  457. <div class="buttons">
  458. <div class="sync-input">
  459. <input type="checkbox" id="synchronizeInput">
  460. <label for="synchronizeInput" id="synchronizeLabel"></label>
  461. </div>
  462. <button id="importButton"></button>
  463. <button id="exportButton"></button>
  464. <button id="resetButton"></button>
  465. <input type="file" id="fileInput" hidden>
  466. </div>
  467. </div>
  468. <div id="formResetContainer" class="popup">
  469. <form class="popup-content">
  470. <header>
  471. <span id="resetConfirmLabel"></span>
  472. </header>
  473. <footer>
  474. <button type="submit" id="resetAllButton"></button>
  475. <button id="resetCurrentButton"></button>
  476. <button id="resetCancelButton"></button>
  477. </footer>
  478. </form>
  479. </div>
  480. <div id="formConfirmContainer" class="popup">
  481. <form class="popup-content">
  482. <header>
  483. <span id="confirmLabel"></span>
  484. </header>
  485. <footer>
  486. <button type="submit" id="confirmButton"></button>
  487. <button id="cancelButton"></button>
  488. </footer>
  489. </form>
  490. </div>
  491. <div id="formPromptContainer" class="popup">
  492. <form class="popup-content">
  493. <header>
  494. <span id="promptLabel"></span>
  495. </header>
  496. <main><input id="promptInput" type="text"></main>
  497. <footer>
  498. <button type="submit" id="promptConfirmButton"></button>
  499. <button id="promptCancelButton"></button>
  500. </footer>
  501. </form>
  502. </div>
  503. </main>
  504. <script src="/lib/chrome-browser-polyfill.js"></script>
  505. <script type="module" src="../bg/ui-options.js"></script>
  506. </body>
  507. </html>