mirror of
https://github.com/gorhill/uBlock.git
synced 2026-03-11 09:04:36 +00:00
9339a75952
This feature is hidden behind the "Developer mode" setting in the dashboard. When "Developer mode" is enabled, a tab named "Develop" will become available in the dashboard. This tab is meant to contain tools for technical users. At the moment, the "Develop" pane allows to create custom DNR rules through a (CodeMirror-based) editor. For the sake of convenience, the DNR rule must be entered in YAML-like format. The format is not really full compliant YAML, just YAML-like, and very strict in order to ensure the parser stays simple enough. Lines starting with `#` are comments and will be ignored by the parser. Any line which do not match the parser's expectation will be marked as invalid, and the whole DNR rule containing such invalid lines will be discarded. There must not be empty lines inside a rule definition. Each DNR rule must be separated with a `---` line, which is known as a YAML document separator. String values must not be quoted, otherwise the quotes will be considered part of the value. There is one exception: `''` will be parsed as "an empty string". The editor will attempt to auto-complete known DNR keywords. That feature will improve over time. Though the parser will identify some errors, not all invalid DNR rules are currently identified by the parser, and these will be reported when the rules are registered through the DNR API. Better identifying invalid DNR rules at edit time will improve over time. The editor will report `regexFilter` values which are not supported by the DNR engine on the current platform. The editor reacts to instances of `regexFilter: ...` to report whether a regex value is supported. This means you can test for a regex value by using `# regexFilter: ...` so that you do not have to create an actual DNR rules just for the sake of testing. Custom DNR rules can be exported into a JSON file (a format known by the DNR API as a "static ruleset"). JSON-based ruleset can be imported, the content will be converted to YAML-like syntax. The editor will attempt to convert to YAML pasted content which can be JSON-parsed. It's possible to paste partially or wholly JSON-based rulesets. When disabling "Developer mode", all custom DNR rules will be unregistered from the DNR API. The DNR rules content will be left intact in such case. Existing DNR rules will be registered into the DNR API when re-enabling "Developer mode". Administrators can prevent "Developer mode" from being enabled by adding `develop` token to `disabledFeatures` setting. Related discussion: https://github.com/uBlockOrigin/uBOL-home/discussions/323 The main motivation is to give list maintainers a tool to assist with resolving filter issues. Custom DNR rules can assist in crafting and validating filters meant to work with uBOL. A secondary motivation is to provide technical users the ability to further customize their content blocker. More conveniences will be added over time, this is a first version.
199 lines
12 KiB
HTML
199 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
|
|
<meta name="color-scheme" content="light dark" />
|
|
<title data-i18n="dashboardName"></title>
|
|
<link rel="stylesheet" href="css/default.css">
|
|
<link rel="stylesheet" href="css/common.css">
|
|
<link rel="stylesheet" href="css/fa-icons.css">
|
|
<link rel="stylesheet" href="css/dashboard.css">
|
|
|
|
<link rel="stylesheet" href="css/dashboard-common.css">
|
|
<link rel="stylesheet" href="css/filtering-mode.css">
|
|
<link rel="stylesheet" href="css/settings.css">
|
|
<link rel="stylesheet" href="css/develop.css">
|
|
|
|
<link rel="icon" type="image/png" href="img/icon_64.png"/>
|
|
</head>
|
|
|
|
<body data-pane="settings" class="loading">
|
|
<!-- -------- -->
|
|
<nav id="dashboard-nav">
|
|
<span class="logo"><img data-i18n-title="extName" src="img/ublock.svg" alt="uBO Lite"></span><!--
|
|
--><button class="tabButton" type="button" data-pane="settings" data-i18n="settingsPageName" tabindex="0"></button><!--
|
|
--><button class="tabButton" type="button" data-pane="rulesets" data-i18n="aboutFilterLists" tabindex="0"></button><!--
|
|
--><button class="tabButton" type="button" data-pane="develop" tabindex="0">Develop</button><!--
|
|
--><button class="tabButton" type="button" data-pane="about" data-i18n="aboutPageName" tabindex="0"></button>
|
|
</nav>
|
|
<!-- -------- -->
|
|
<section data-pane="settings">
|
|
<div>
|
|
<h3 data-i18n="behaviorSectionLabel"></h3>
|
|
<p><label id="autoReload" data-i18n="autoReloadLabel"><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span>_</label>
|
|
</p>
|
|
<p><label id="showBlockedCount" data-i18n="showBlockedCountLabel"><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span>_</label>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 data-i18n="defaultFilteringModeSectionLabel"></h3>
|
|
<p data-i18n="defaultFilteringModeDescription"></p>
|
|
<div id="defaultFilteringMode">
|
|
<label class="filteringModeCard">
|
|
<div>
|
|
<span><span class="input radio"><input type="radio" name="filteringMode" value="1"><svg viewBox="0 0 24 24"><path d="M 12 0 A 12 12 0 0 0 0 12 A 12 12 0 0 0 12 24 A 12 12 0 0 0 24 12 A 12 12 0 0 0 12 0 z M 12 2.5 A 9.5 9.5 0 0 1 21.5 12 A 9.5 9.5 0 0 1 12 21.5 A 9.5 9.5 0 0 1 2.5 12 A 9.5 9.5 0 0 1 12 2.5 z"/><circle cx="12" cy="12" r="7"/></svg></span><span data-i18n="filteringMode1Name">_</span></span>
|
|
</div>
|
|
<div>
|
|
<div class="filteringModeSlider" data-level="1">
|
|
<div class="filteringModeButton"><div></div></div>
|
|
<span data-level="0"></span>
|
|
<span data-level="1"></span>
|
|
<span data-level="2"></span>
|
|
<span data-level="3"></span>
|
|
</div>
|
|
</div>
|
|
<div data-i18n="basicFilteringModeDescription"></div>
|
|
</label>
|
|
<label class="filteringModeCard">
|
|
<div>
|
|
<span><span class="input radio"><input type="radio" name="filteringMode" value="2"><svg viewBox="0 0 24 24"><path d="M 12 0 A 12 12 0 0 0 0 12 A 12 12 0 0 0 12 24 A 12 12 0 0 0 24 12 A 12 12 0 0 0 12 0 z M 12 2.5 A 9.5 9.5 0 0 1 21.5 12 A 9.5 9.5 0 0 1 12 21.5 A 9.5 9.5 0 0 1 2.5 12 A 9.5 9.5 0 0 1 12 2.5 z"/><circle cx="12" cy="12" r="7"/></svg></span><span data-i18n="filteringMode2Name">_</span></span>
|
|
</div>
|
|
<div>
|
|
<div class="filteringModeSlider" data-level="2">
|
|
<div class="filteringModeButton"><div></div></div>
|
|
<span data-level="0"></span>
|
|
<span data-level="1"></span>
|
|
<span data-level="2"></span>
|
|
<span data-level="3"></span>
|
|
</div>
|
|
</div>
|
|
<div data-i18n="optimalFilteringModeDescription"></div>
|
|
</label>
|
|
<label class="filteringModeCard">
|
|
<div>
|
|
<span><span class="input radio"><input type="radio" name="filteringMode" value="3"><svg viewBox="0 0 24 24"><path d="M 12 0 A 12 12 0 0 0 0 12 A 12 12 0 0 0 12 24 A 12 12 0 0 0 24 12 A 12 12 0 0 0 12 0 z M 12 2.5 A 9.5 9.5 0 0 1 21.5 12 A 9.5 9.5 0 0 1 12 21.5 A 9.5 9.5 0 0 1 2.5 12 A 9.5 9.5 0 0 1 12 2.5 z"/><circle cx="12" cy="12" r="7"/></svg></span><span data-i18n="filteringMode3Name">_</span></span>
|
|
</div>
|
|
<div>
|
|
<div class="filteringModeSlider" data-level="3">
|
|
<div class="filteringModeButton"><div></div></div>
|
|
<span data-level="0"></span>
|
|
<span data-level="1"></span>
|
|
<span data-level="2"></span>
|
|
<span data-level="3"></span>
|
|
</div>
|
|
</div>
|
|
<div data-i18n="completeFilteringModeDescription"></div>
|
|
</label>
|
|
</div>
|
|
<p><label id="strictBlockMode" data-i18n="enableStrictBlockLabel"><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span>_</label><legend data-i18n="enableStrictBlockLegend"></legend>
|
|
<p id="developerMode"><label data-i18n="developerModeLabel"><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span>_</label><legend data-i18n="developerModeLegend"></legend>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 data-i18n="filteringMode0Name"></h3>
|
|
<p data-i18n="noFilteringModeDescription">_</p>
|
|
<div id="trustedSites"></div>
|
|
</div>
|
|
</section>
|
|
<!-- -------- -->
|
|
<section data-pane="rulesets">
|
|
<div>
|
|
<p id="listsOfBlockedHostsPrompt"></p>
|
|
<p><input id="findInLists" type="search" spellcheck="false" placeholder="findListsPlaceholder" /></p>
|
|
</div>
|
|
<div id="lists"></div>
|
|
</section>
|
|
<!-- -------- -->
|
|
<section data-pane="develop">
|
|
<div>
|
|
<p>
|
|
<button id="dnrRulesApply" class="preferred iconified" type="button" disabled><span class="fa-icon">save</span><span data-i18n="saveButton">_</span><span class="hover"></span></button>
|
|
<button id="dnrRulesRevert" class="iconified" type="button" disabled><span class="fa-icon">undo</span><span data-i18n="revertButton">_</span><span class="hover"></span></button>
|
|
 
|
|
<button id="dnrRulesImport" class="iconified" type="button"><span class="fa-icon">download-alt</span><span data-i18n="importAndAppendButton">_</span><span class="hover"></span></button>
|
|
<button id="dnrRulesExport" class="iconified" type="button"><span class="fa-icon">upload-alt</span><span data-i18n="exportButton">_</span><span class="hover"></span></button><input type="file" accept="json/application">
|
|
</p>
|
|
<p data-i18n="dnrRulesSummary"></p>
|
|
<div id="cm-dnrRules"></div>
|
|
</div>
|
|
</section>
|
|
<!-- -------- -->
|
|
<section data-pane="about">
|
|
<div class="body">
|
|
<div id="aboutNameVer" class="li"></div>
|
|
<div class="liul">
|
|
<div class="li">Copyright (c) Raymond Hill 2014-present</div>
|
|
</div>
|
|
<div class="li"><a href="https://github.com/gorhill/uBlock/wiki/Privacy-policy" data-i18n="aboutPrivacyPolicy"></a></div>
|
|
<div class="li"><a href="https://github.com/uBlockOrigin/uBOL-home/releases" data-i18n="aboutChangelog"></a></div>
|
|
<div class="li"><a href="https://github.com/gorhill/uBlock" data-i18n="aboutCode"></a></div>
|
|
<div class="li"><span data-i18n="aboutContributors"></span></div>
|
|
<div class="liul">
|
|
<div class="li"><a href="https://github.com/gorhill/uBlock/graphs/contributors" data-i18n="aboutSourceCode"></a></div>
|
|
<div class="li"><a href="https://crowdin.com/project/ublock" data-i18n="aboutTranslations"></a></div>
|
|
<div class="li"><a href="https://github.com/uBlockOrigin/uAssets/graphs/contributors" data-i18n="aboutFilterLists"></a></div>
|
|
</div>
|
|
<div class="li"><span data-i18n="aboutDependencies"></span></div>
|
|
<div class="liul">
|
|
<div class="li"><span><a href="https://github.com/chrismsimpson/Metropolis" target="_blank">Metropolis font family</a> by <a href="https://github.com/chrismsimpson">Chris Simpson</a></span></div>
|
|
<div class="li"><span><a href="https://github.com/rsms/inter" target="_blank">Inter font family</a> by <a href="https://github.com/rsms">Rasmus Andersson</a></span></div>
|
|
<div class="li"><span><a href="https://fontawesome.com/" target="_blank">FontAwesome font family</a> by <a href="https://github.com/davegandy">Dave Gandy</a></span></div>
|
|
<div class="li"><span><a href="https://github.com/mathiasbynens/punycode.js" target="_blank">Punycode.js</a> by <a href="https://github.com/mathiasbynens">Mathias Bynens</a></span></div>
|
|
<div class="li"><span><a href="https://flagpedia.net/" target="_blank">Flags of the World</a> by <a href="https://www.davidkrmela.com/">David Krmela</a></span></div>
|
|
<div class="li"><span><a href="https://codemirror.net/" target="_blank">CodeMirror 6</a> by <a href="https://github.com/marijnh">Marijn Haverbeke</a></span></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- -------- -->
|
|
<div id="templates">
|
|
<div class="listEntries"></div>
|
|
<div class="listEntry" data-role="leaf">
|
|
<span class="detailbar">
|
|
<label><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span><span class="listname forinput"></span>
|
|
</label>
|
|
<span class="iconbar"><!--
|
|
--><a class="fa-icon support" href="#" target="_blank">home</a>
|
|
</span>
|
|
</span>
|
|
</div>
|
|
<div class="listEntry expandable" data-role="node">
|
|
<span class="detailbar">
|
|
<label><span class="input checkbox"><input type="checkbox"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span><span class="listname forinput"></span></label>
|
|
<span class="count"></span>
|
|
<span class="fa-icon listExpander">angle-up</span>
|
|
</span>
|
|
</div>
|
|
<div class="listEntry expandable" data-role="rootnode">
|
|
<span class="detailbar">
|
|
<h3 class="listname"></h3>
|
|
<span class="count"></span>
|
|
<span class="fa-icon listExpander">angle-up</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<template class="summary-panel">
|
|
<div class="info-panel summary-panel">
|
|
<div class="info"></div>
|
|
</div>
|
|
</template>
|
|
<template class="feedback-panel">
|
|
<div class="info-panel feedback-panel">
|
|
<div class="info"></div>
|
|
<div class="close"></div>
|
|
</div>
|
|
</template>
|
|
<template class="badmark-tooltip">
|
|
<div class="badmark-tooltip">
|
|
</div>
|
|
</template>
|
|
<script src="lib/codemirror/cm6.bundle.ubol.min.js"></script>
|
|
<script src="js/theme.js" type="module"></script>
|
|
<script src="js/fa-icons.js" type="module"></script>
|
|
<script src="js/i18n.js" type="module"></script>
|
|
<script src="js/dashboard.js" type="module"></script>
|
|
<script src="js/settings.js" type="module"></script>
|
|
<script src="js/develop.js" type="module"></script>
|
|
|
|
</body>
|
|
</html>
|