open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Expose iframes via HTML[stylus-iframe]

Browse Source 
* convert actions to buttons
This commit is contained in:
tophf 2017-04-29 02:36:10 +03:00
parent fbc3ac0070
commit 6d65d2a2b6
6 changed files with 92 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
_locales/en/messages.json
View File

@ -655,7 +655,7 @@
"message": "Background color when disabled" "message": "Background color when disabled"
}, },
"optionsPopupWidth": { "optionsPopupWidth": {
"message": "Width (in pixels)" "message": "Popup width (in pixels)"
}, },
"optionsUpdateInterval": { "optionsUpdateInterval": {
"message": "Automatically check for and install all available userstyle updates (in hrs)" "message": "Automatically check for and install all available userstyle updates (in hrs)"
@ -675,6 +675,15 @@
"optionsCustomizeUpdate": { "optionsCustomizeUpdate": {
"message": "Updates" "message": "Updates"
}, },
"optionsAdvanced": {
"message": "Advanced"
},
"optionsAdvancedExposeIframes": {
"message": "Expose iframes via HTML[stylus-iframe]"
},
"optionsAdvancedExposeIframesNote": {
"message": "Enables writing iframe-specific CSS like 'html[stylus-iframe] h1 { display:none }'"
},
"optionsActions": { "optionsActions": {
"message": "Actions" "message": "Actions"
}, },
@ -682,10 +691,10 @@
"message": "Reset the options to default values" "message": "Reset the options to default values"
}, },
"optionsResetButton": { "optionsResetButton": {
"message": "Reset" "message": "Reset options"
}, },
"optionsOpenManager": { "optionsOpenManager": {
"message": "Open styles manager" "message": "Manage styles"
}, },
"optionsOpenManagerNote": { "optionsOpenManagerNote": {
"message": "Define a keyboard shortcut" "message": "Define a keyboard shortcut"
@ -697,6 +706,6 @@
"message": "Open" "message": "Open"
}, },
"optionsCheck": { "optionsCheck": {
"message": "Check" "message": "Update styles"
} }
} }

24
apply.js
View File

@ -7,6 +7,7 @@ var ID_PREFIX = 'stylus-';
var ROOT = document.documentElement; var ROOT = document.documentElement;
var isOwnPage = location.href.startsWith('chrome-extension:'); var isOwnPage = location.href.startsWith('chrome-extension:');
var disableAll = false; var disableAll = false;
var exposeIframes = false;
var styleElements = new Map(); var styleElements = new Map();
var disabledElements = new Map(); var disabledElements = new Map();
var retiredStyleTimers = new Map(); var retiredStyleTimers = new Map();
@ -94,6 +95,9 @@ function applyOnMessage(request, sender, sendResponse) {
if ('disableAll' in request.prefs) { if ('disableAll' in request.prefs) {
doDisableAll(request.prefs.disableAll); doDisableAll(request.prefs.disableAll);
} }
if ('exposeIframes' in request.prefs) {
doExposeIframes(request.prefs.exposeIframes);
}
break; break;
case 'ping': case 'ping':
@ -103,7 +107,7 @@ function applyOnMessage(request, sender, sendResponse) {
} }
function doDisableAll(disable) { function doDisableAll(disable = disableAll) {
if (!disable === !disableAll) { if (!disable === !disableAll) {
return; return;
} }
@ -117,6 +121,20 @@ function doDisableAll(disable) {
} }
function doExposeIframes(state = exposeIframes) {
if (state === exposeIframes || window == parent) {
return;
}
exposeIframes = state;
const attr = document.documentElement.getAttribute('stylus-iframe');
if (state && attr != '') {
document.documentElement.setAttribute('stylus-iframe', '');
} else if (!state && attr == '') {
document.documentElement.removeAttribute('stylus-iframe');
}
}
function applyStyleState({id, enabled}) { function applyStyleState({id, enabled}) {
const inCache = disabledElements.get(id) || styleElements.get(id); const inCache = disabledElements.get(id) || styleElements.get(id);
const inDoc = document.getElementById(ID_PREFIX + id); const inDoc = document.getElementById(ID_PREFIX + id);
@ -169,6 +187,10 @@ function applyStyles(styles) {
doDisableAll(styles.disableAll); doDisableAll(styles.disableAll);
delete styles.disableAll; delete styles.disableAll;
} }
if ('exposeIframes' in styles) {
doExposeIframes(styles.exposeIframes);
delete styles.exposeIframes;
}
if (document.head if (document.head
&& document.head.firstChild && document.head.firstChild
&& document.head.firstChild.id == 'xml-viewer-style') { && document.head.firstChild.id == 'xml-viewer-style') {

17
options/index.css
View File

@ -37,7 +37,7 @@ body {
.block:last-child { .block:last-child {
border-bottom: none; border-bottom: none;
padding-bottom: 4px; padding-bottom: 0;
} }
h1 { h1 {
@ -104,6 +104,14 @@ input[type="color"] {
height: 2em; height: 2em;
} }
#actions {
justify-content: space-around;
}
#actions button {
width: auto;
}
[data-cmd="check-updates"] button { [data-cmd="check-updates"] button {
position: relative; position: relative;
} }
@ -126,7 +134,6 @@ input[type="color"] {
#updates-installed { #updates-installed {
position: absolute; position: absolute;
font-size: 85%; font-size: 85%;
right: 16px;
margin-top: 1px; margin-top: 1px;
} }
@ -171,6 +178,12 @@ input[type="color"] {
margin-bottom: 1ex; margin-bottom: 1ex;
} }
sup {
vertical-align: baseline;
position: relative;
top: -0.4em;
}
@keyframes fadeinout { @keyframes fadeinout {
0% { opacity: 0 } 0% { opacity: 0 }
10% { opacity: 1 } 10% { opacity: 1 }

46
options/index.html
View File

@ -12,9 +12,17 @@
<body> <body>
<div id="options"> <div id="options">
<div class="block"> <div class="block">
<h1 i18n-text="optionsCustomizeBadge"></h1> <h1 i18n-text="optionsCustomizeBadge"></h1>
<div class="items"> <div class="items">
<label>
<span i18n-text="prefShowBadge"></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="show-badge">
<span class="onoffswitch-label"></span>
</span>
</label>
<label> <label>
<span i18n-text="optionsBadgeNormal"></span> <span i18n-text="optionsBadgeNormal"></span>
<input type="color" id="badgeNormal"> <input type="color" id="badgeNormal">
@ -23,15 +31,9 @@
<span i18n-text="optionsBadgeDisabled"></span> <span i18n-text="optionsBadgeDisabled"></span>
<input type="color" id="badgeDisabled"> <input type="color" id="badgeDisabled">
</label> </label>
<label>
<span i18n-text="prefShowBadge"></span>
<span class="onoffswitch">
<input type="checkbox" class="onoffswitch-checkbox" id="show-badge">
<span class="onoffswitch-label"></span>
</span>
</label>
</div> </div>
</div> </div>
<div class="block"> <div class="block">
<h1 i18n-text="optionsCustomizePopup"></h1> <h1 i18n-text="optionsCustomizePopup"></h1>
<div class="items"> <div class="items">
@ -48,6 +50,7 @@
</label> </label>
</div> </div>
</div> </div>
<div class="block"> <div class="block">
<h1 i18n-text="optionsCustomizeUpdate"></h1> <h1 i18n-text="optionsCustomizeUpdate"></h1>
<div class="items"> <div class="items">
@ -57,21 +60,27 @@
</label> </label>
</div> </div>
</div> </div>
<div class="block"> <div class="block">
<h1 i18n-text="optionsActions"></h1> <h1 i18n-text="optionsAdvanced"></h1>
<div class="items"> <div class="items">
<label> <label>
<span i18n-text="optionsReset"></span> <span i18n-text="optionsAdvancedExposeIframes"> <sup>2</sup></span>
<button data-cmd="reset" i18n-text="optionsResetButton"></button> <span class="onoffswitch">
</label> <input type="checkbox" class="onoffswitch-checkbox" id="exposeIframes">
<label> <span class="onoffswitch-label" for="exposeIframes"></span>
<span i18n-text="optionsOpenManager"><sup class="chromium-only">2</sup></span> </span>
<button data-cmd="open-manage" i18n-text="optionsOpen"></button>
</label>
<label data-cmd="check-updates">
<span i18n-text="optionsCheckUpdate"></span>
<button i18n-text="optionsCheck"><span id="update-progress"></span></button>
</label> </label>
</div>
</div>
<div class="block" id="actions">
<button data-cmd="reset" i18n-text="optionsResetButton" i18n-title="optionsReset"></button>
<button data-cmd="open-manage" i18n-text="optionsOpenManager"><sup class="chromium-only">3</sup></button>
<div data-cmd="check-updates">
<button i18n-text="optionsCheck" i18n-title="optionsCheckUpdate">
<span id="update-progress"></span>
</button>
<div id="updates-installed" i18n-text="updatesCurrentlyInstalled"></div> <div id="updates-installed" i18n-text="updatesCurrentlyInstalled"></div>
</div> </div>
</div> </div>
@ -83,6 +92,7 @@
<p i18n-text="optionsUpdateIntervalNote"></p> <p i18n-text="optionsUpdateIntervalNote"></p>
<p i18n-text="optionsUpdateImportNote"></p> <p i18n-text="optionsUpdateImportNote"></p>
</li> </li>
<li i18n-text="optionsAdvancedExposeIframesNote"></li>
<li class="chromium-only"> <li class="chromium-only">
<a data-cmd="open-keyboard" <a data-cmd="open-keyboard"
i18n-text="optionsOpenManagerNote" i18n-text="optionsOpenManagerNote"

6
prefs.js
View File

@ -8,6 +8,7 @@ var prefs = new function Prefs() {
'windowPosition': {}, // detached window position 'windowPosition': {}, // detached window position
'show-badge': true, // display text on popup menu icon 'show-badge': true, // display text on popup menu icon
'disableAll': false, // boss key 'disableAll': false, // boss key
'exposeIframes': false, // Add 'stylus-iframe' attribute to HTML element in all iframes
'popup.breadcrumbs': true, // display 'New style' links as URL breadcrumbs 'popup.breadcrumbs': true, // display 'New style' links as URL breadcrumbs
'popup.breadcrumbs.usePath': false, // use URL path for 'this URL' 'popup.breadcrumbs.usePath': false, // use URL path for 'this URL'
@ -233,7 +234,10 @@ var prefs = new function Prefs() {
return; return;
function doBroadcast() { function doBroadcast() {
const affects = {all: 'disableAll' in broadcastPrefs}; const affects = {
all: 'disableAll' in broadcastPrefs
|| 'exposeIframes' in broadcastPrefs,
};
if (!affects.all) { if (!affects.all) {
for (const key in broadcastPrefs) { for (const key in broadcastPrefs) {
affects.icon = affects.icon || affectsIcon.includes(key); affects.icon = affects.icon || affectsIcon.includes(key);

13
storage.js
View File

@ -130,7 +130,10 @@ function filterStyles({
&& asHash != true) { && asHash != true) {
return cachedStyles.list; return cachedStyles.list;
} }
const disableAll = asHash && prefs.get('disableAll', false); const blankHash = asHash && {
disableAll: prefs.get('disableAll'),
exposeIframes: prefs.get('exposeIframes'),
};
if (matchUrl && matchUrl.startsWith(URLS.chromeWebStore)) { if (matchUrl && matchUrl.startsWith(URLS.chromeWebStore)) {
// CWS cannot be scripted in chromium, see ChromeExtensionsClient::IsScriptableURL // CWS cannot be scripted in chromium, see ChromeExtensionsClient::IsScriptableURL
@ -145,7 +148,7 @@ function filterStyles({
cached.hits++; cached.hits++;
cached.lastHit = Date.now(); cached.lastHit = Date.now();
return asHash return asHash
? Object.assign({disableAll}, cached.styles) ? Object.assign(blankHash, cached.styles)
: cached.styles; : cached.styles;
} }
@ -156,7 +159,7 @@ function filterStyles({
matchUrl, matchUrl,
asHash, asHash,
strictRegexp, strictRegexp,
disableAll, blankHash,
cacheKey, cacheKey,
}); });
} }
@ -171,7 +174,7 @@ function filterStylesInternal({
matchUrl, matchUrl,
asHash, asHash,
strictRegexp, strictRegexp,
disableAll, blankHash,
cacheKey, cacheKey,
}) { }) {
if (matchUrl && !cachedStyles.urlDomains.has(matchUrl)) { if (matchUrl && !cachedStyles.urlDomains.has(matchUrl)) {
@ -220,7 +223,7 @@ function filterStylesInternal({
} }
return asHash return asHash
? Object.assign({disableAll}, filtered) ? Object.assign(blankHash, filtered)
: filtered; : filtered;
} }