yomichan/ext/permissions.html
toasted-nutbread 0d82c52a76
HTML page script refactoring (#2162)
* Move some common functionality

* Move setupEnvironmentInfo into ExtensionContentController

* Move background/environment.js to extension/environment.js
2022-05-28 21:57:25 -04:00

297 lines
17 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Yomichan Permissions</title>
<link rel="icon" type="image/png" href="/images/icon16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/images/icon19.png" sizes="19x19">
<link rel="icon" type="image/png" href="/images/icon32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/images/icon38.png" sizes="38x38">
<link rel="icon" type="image/png" href="/images/icon48.png" sizes="48x48">
<link rel="icon" type="image/png" href="/images/icon64.png" sizes="64x64">
<link rel="icon" type="image/png" href="/images/icon128.png" sizes="128x128">
<link rel="stylesheet" type="text/css" href="/css/material.css">
<link rel="stylesheet" type="text/css" href="/css/settings.css">
<link rel="stylesheet" type="text/css" href="/css/permissions.css">
</head>
<body>
<!-- Main content -->
<div class="content-outer"><div class="content">
<div class="content-left"></div>
<div class="content-center">
<span tabindex="-1" id="content-scroll-focus"></span>
<h1>Yomichan Permissions</h1>
<h2 id="permissions"></h2>
<div class="settings-group">
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>&lt;all_urls&gt;</code></div>
<div class="settings-item-description">
Yomichan requires access to all URLs in order to run scripts to scan text and show the definitions popup,
request audio for playback and download, and connect with Anki.
</div>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>storage</code> and <code>unlimitedStorage</code></div>
<div class="settings-item-description">
Yomichan uses storage permissions in order to save extension settings and dictionary data.
<code>unlimitedStorage</code> is used to help prevent web browsers from unexpectedly
deleting dictionary data.
</div>
</div>
</div></div>
<div class="settings-item" data-hide-for-manifest-version="3"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>webRequest</code> and <code>webRequestBlocking</code></div>
<div class="settings-item-description">
<p>
Yomichan uses these permissions to ensure certain requests have valid and secure headers.
This sometimes involves removing or changing the <code>Origin</code> request header,
as this can be used to fingerprint browser configuration.
</p>
<p>
Example: <code class="overflow-wrap">Origin: <span class="extension-id-example"></span></code>
</p>
</div>
</div>
</div></div>
<div class="settings-item" data-show-for-manifest-version="3"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>declarativeNetRequest</code></div>
<div class="settings-item-description">
<p>
Yomichan uses this permission to ensure certain requests have valid and secure headers.
This sometimes involves removing or changing the <code>Origin</code> request header,
as this can be used to fingerprint browser configuration.
</p>
<p>
Example: <code>Origin: <span class="extension-id-example"></span></code>
</p>
</div>
</div>
</div></div>
<div class="settings-item" data-show-for-manifest-version="3"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>scripting</code></div>
<div class="settings-item-description">
Yomichan will sometimes need to inject stylesheets into webpages in order to
properly display the search popup.
</div>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>clipboardWrite</code></div>
<div class="settings-item-description">
Yomichan supports simulating the <code>Ctrl+C</code> (copy to clipboard) keyboard shortcut
when a definitions popup is open and focused.
</div>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>clipboardRead</code> <span class="light">(optional)</span></div>
<div class="settings-item-description">
Yomichan supports automatically opening a search window when Japanese text is copied to the clipboard
while the browser is running, depending on how certain settings are configured.
This allows Yomichan to support scanning text from external applications, provided there is a way
to copy text from those applications to the clipboard.
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" class="permissions-toggle" data-required-permissions="clipboardRead"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>nativeMessaging</code> <span class="light" data-show-for-browser="chrome edge">(optional)</span></div>
<div class="settings-item-description">
Yomichan has the ability to communicate with an optional native messaging component in order to support
parsing large blocks of Japanese text using
<a href="https://en.wikipedia.org/wiki/MeCab" target="_blank" rel="noopener noreferrer">MeCab</a>.
The installation of this component is optional and is not included by default.
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" class="permissions-toggle" data-required-permissions="nativeMessaging"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item" data-hide-for-manifest-version="3"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label"><code>webNavigation</code> <span class="light">(optional)</span></div>
<div class="settings-item-description">
Yomichan may require this permission to inject content scripts for certain browsers
if Google Docs accessibility mode is enabled.
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" class="permissions-toggle" data-required-permissions="webNavigation"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Allow in private windows <span class="light">(optional)</span></div>
<div class="settings-item-description">
<p>
When enabled, Yomichan is able to scan text and show definitions in private/incognito web browser windows.
</p>
<p>
This option can be configured from the web browser's <a tabindex="0" class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
</p>
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" id="permission-checkbox-allow-in-private-windows" disabled><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Allow access to file URLs <span class="light">(optional)</span></div>
<div class="settings-item-description">
<p>
When enabled, Yomichan is able to scan text and show definitions on local HTML files located using the <code>file://*</code> scheme.
</p>
<p data-show-for-browser="chrome edge">
This option can be configured from the web browser's <a tabindex="0" class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
</p>
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" id="permission-checkbox-allow-file-url-access" disabled><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Persistent storage</div>
<div class="settings-item-description">
<p>
Web browsers will sometimes clear stored data if the device is running low on storage space,
which can result in the imported dictionaries being deleted unexpectedly.
The persistent storage permission tells the browser that the data should not be deleted in those circumstances.
</p>
<p data-show-for-browser="firefox-mobile">
It may not be possible to enable this permission on Firefox for Android.
</p>
<p data-show-for-browser="chrome edge">
Chromium-based browsers should not need to enable this setting since the Yomichan extension has
the <code>unlimitedStorage</code> permission, which should prevent data deletion.<sup><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=680392#c15" target="_blank" rel="noopener">[1]</a></sup>
</p>
</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" id="storage-persistent-checkbox"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item settings-item-button" data-modal-action="show,origins"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Configure allowed origins&hellip;</div>
</div>
<div class="settings-item-right open-panel-button-container">
<button class="icon-button"><span class="icon-button-inner"><span class="icon" data-icon="material-right-arrow"></span></span></button>
</div>
</div></div>
</div>
<div class="footer-padding"></div>
</div>
<div class="content-right"></div>
</div></div>
<!-- Auxiliary content -->
<div id="popup-menus"></div>
<!-- Keyboard shortcuts templates -->
<div id="origins-modal" class="modal" tabindex="-1" role="dialog" hidden><div class="modal-content">
<div class="modal-header">
<div class="modal-title">Allowed Origins</div>
<div class="modal-header-button-container">
<div class="modal-header-button-group">
<button class="icon-button modal-header-button" data-modal-action="expand"><span class="icon-button-inner"><span class="icon" data-icon="expand"></span></span></button>
<button class="icon-button modal-header-button" data-modal-action="collapse"><span class="icon-button-inner"><span class="icon" data-icon="collapse"></span></span></button>
</div>
</div>
</div>
<div class="modal-body">
<div class="settings-item"><div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Allow access to all URLs</div>
</div>
<div class="settings-item-right">
<label class="toggle"><input type="checkbox" class="permissions-origin-toggle" data-origin="&lt;all_urls&gt;"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
</div>
</div></div>
<div class="settings-item">
<div class="settings-item-inner">
<div class="settings-item-left">
<div class="settings-item-label">Additional origins</div>
</div>
</div>
<div class="settings-item-children">
<div id="permissions-origin-list" class="generic-list">
<div class="permissions-origin-index generic-list-index-prefix"></div>
<input type="text" class="permissions-origin-input horizontal-flex-fill" autocomplete="off" spellcheck="false" id="permissions-origin-new-input">
<button class="low-emphasis permissions-origin-button" id="permissions-origin-add">Add</button>
</div>
<div id="permissions-origin-list-empty" class="margin-above">
No additional origins specified.
</div>
<div id="permissions-origin-list-error" class="margin-above danger-text" hidden></div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="low-emphasis" data-modal-action="hide">Close</button>
</div>
</div></div>
<template id="permissions-origin-template">
<div class="permissions-origin-index generic-list-index-prefix"></div>
<input type="text" class="permissions-origin-input horizontal-flex-fill" autocomplete="off" spellcheck="false" readonly>
<button class="icon-button permissions-origin-menu-button permissions-origin-button" data-menu="permissions-origin-menu" data-menu-position="below left"><span class="icon-button-inner"><span class="icon" data-icon="kebab-menu"></span></span></button>
</template>
<template id="permissions-origin-menu-template"><div class="popup-menu-container" tabindex="-1" role="dialog"><div class="popup-menu"><div class="popup-menu-body">
<button class="popup-menu-item" data-menu-action="remove">Remove</button>
</div></div></div></template>
<!-- Scripts -->
<script src="/js/core.js"></script>
<script src="/js/yomichan.js"></script>
<script src="/js/comm/api.js"></script>
<script src="/js/comm/cross-frame-api.js"></script>
<script src="/js/data/anki-util.js"></script>
<script src="/js/data/permissions-util.js"></script>
<script src="/js/dom/document-focus-controller.js"></script>
<script src="/js/dom/document-util.js"></script>
<script src="/js/dom/html-template-collection.js"></script>
<script src="/js/dom/panel-element.js"></script>
<script src="/js/dom/popup-menu.js"></script>
<script src="/js/dom/selector-observer.js"></script>
<script src="/js/extension/environment.js"></script>
<script src="/js/pages/common/extension-content-controller.js"></script>
<script src="/js/pages/settings/modal.js"></script>
<script src="/js/pages/settings/modal-controller.js"></script>
<script src="/js/pages/settings/permissions-origin-controller.js"></script>
<script src="/js/pages/settings/permissions-toggle-controller.js"></script>
<script src="/js/pages/settings/persistent-storage-controller.js"></script>
<script src="/js/pages/settings/settings-controller.js"></script>
<script src="/js/pages/settings/settings-display-controller.js"></script>
<script src="/js/pages/permissions-main.js"></script>
</body>
</html>