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

WIP: switch to API

Browse Source
This commit is contained in:
eight 2018-10-05 18:47:52 +08:00
parent f1639cc33e
commit 34497ebe16
17 changed files with 300 additions and 217 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
background/background.js
View File

@ -4,7 +4,7 @@ global handleCssTransitionBug detectSloppyRegexps
global openEditor
global styleViaAPI
global loadScript
global usercss styleManager
global usercss styleManager db
*/
'use strict';
@ -14,11 +14,13 @@ window.API_METHODS = Object.assign(window.API_METHODS || {}, {
getSectionsByUrl: styleManager.getSectionsByUrl,
getSectionsById: styleManager.getSectionsById,
getStylesInfo: styleManager.getStylesInfo,
toggleStyle: styleManager.toggleStyle,
deleteStyle: styleManager.deleteStyle,
// saveStyle,
// deleteStyle,
getStyleFromDB: id =>
dbExec('get', id).then(event => event.target.result),
db.exec('get', id).then(event => event.target.result),
download(msg) {
delete msg.method;

236
background/style-manager.js
View File

@ -1,4 +1,6 @@
/* global createCache db calcStyleDigest normalizeStyleSections db promisify */
/* eslint no-eq-null: 0, eqeqeq: [2, "smart"] */
/* global createCache db calcStyleDigest normalizeStyleSections db promisify
getStyleWithNoCode */
'use strict';
const styleManager = (() => {
@ -14,29 +16,87 @@ const styleManager = (() => {
// FIXME: do we have to prepare `styles` map for all methods?
return ensurePrepared({
styles,
cachedStyleForUrl,
// styles,
// cachedStyleForUrl,
getStylesInfo,
getSectionsByUrl,
installStyle,
deleteStyle,
setStyleExclusions,
editSave,
toggleStyle
toggleStyle,
getAllStyles, // used by import-export
getStylesInfoForUrl, // used by popup
countStyles,
// TODO: get all styles API?
// TODO: get style by ID?
});
function toggleStyle(id, enabled) {
const style = styles.get(id);
style.enabled = enabled;
return saveStyle(style)
.then(() => broadcastMessage('styleUpdated', {id, enabled}));
function countStyles(filter) {
if (!filter) {
return styles.size;
}
// TODO
}
function getStylesInfo() {
// FIXME: remove code?
return [...styles.values()];
function getAllStyles() {
return [...styles.values()].map(s => s.data);
}
function toggleStyle(id, enabled) {
const style = styles.get(id);
const newData = Object.assign({}, style.data, {enabled});
return saveStyle(newData)
.then(newData => {
style.data = newData;
return emitChanges({
method: 'styleUpdated',
codeIsUpdated: false,
style: {id, enabled}
}, style.appliesTo);
})
.then(() => id);
}
function emitChanges(message, appliesTo) {
const pending = runtimeSendMessage(message);
if (appliesTo && [...appliesTo].every(isExtensionUrl)) {
return pending;
}
// FIXME: does `discared` work in old browsers?
// TODO: send to activated tabs first?
const pendingTabs = tabQuery({discared: false})
.then(tabs => tabs
.filter(t =>
URLS.supported(t.url) &&
!isExtensionUrl(t.url) &&
(!appliesTo || appliesTo.has(t.url))
)
.map(t => tabSendMessage(t.id, message))
);
return Promise.all([pending, pendingTabs]);
}
function isExtensionUrl(url) {
return /^\w+?-extension:\/\//.test(url);
}
function getStylesInfo(filter) {
if (filter && filter.id) {
return [getStyleWithNoCode(styles.get(filter.id).data)];
}
return [...styles.values()]
.filter(s => !filter || filterMatchStyle(filter, s.data))
.map(s => getStyleWithNoCode(s.data));
}
function filterMatchStyle(filter, style) {
for (const key of Object.keys(filter)) {
if (filter[key] !== style[key]) {
return false;
}
}
return true;
}
function editSave() {}
@ -52,13 +112,20 @@ const styleManager = (() => {
}
function deleteStyle(id) {
const style = styles.get(id);
return db.exec('delete', id)
.then(() => {
// FIXME: do we really need to clear the entire cache?
cachedStyleForUrl.clear();
notifyAllTabs({method: 'styleDeleted', id});
return id;
});
for (const url of style.appliesTo) {
const cache = cachedStyleForUrl.get(url);
delete cache[id];
}
styles.delete(id);
return emitChanges({
method: 'styleDeleted',
data: {id}
});
})
.then(() => id);
}
function installStyle(style) {
@ -90,6 +157,7 @@ const styleManager = (() => {
.then(oldStyle => {
// FIXME: update installDate?
style = Object.assign(oldStyle, style);
// FIXME: why we always run `normalizeStyleSections` at each `saveStyle`?
style.sections = normalizeStyleSections(style);
return db.exec('put', style);
})
@ -124,39 +192,49 @@ const styleManager = (() => {
}
}
function getSectionsByUrl(url) {
// if (!URLS.supported(url) || prefs.get('disableAll')) {
// return [];
// }
function getStylesInfoForUrl(url) {
}
function getSectionsByUrl(url, filterId) {
let result = cachedStyleForUrl.get(url);
if (!result) {
result = [];
for (const style of styles.values()) {
if (!urlMatchStyle(url, style)) {
result = {};
for (const {appliesTo, data} of styles.values()) {
if (!urlMatchStyle(url, data)) {
continue;
}
const item = {
id: style.id,
code: ''
};
for (const section of style.sections) {
let code = '';
// result[id] = '';
for (const section of data.sections) {
if (urlMatchSection(url, section)) {
item.code += section.code;
code += section.code;
}
}
if (item.code) {
result.push(item);
if (code) {
result[data.id] = code;
appliesTo.add(url);
}
}
cachedStyleForUrl.set(url, result);
}
if (filterId) {
return {[filterId]: result[filterId]};
}
return result;
}
function prepare() {
return db.exec('getAll').then(event => {
const styleList = event.target.result || [];
const styleList = event.target.result;
if (!styleList) {
return;
}
for (const style of styleList) {
styles.set(style.id, style);
styles.set(style.id, {
appliesTo: new Set(),
data: style
});
if (!style.name) {
style.name = 'ID: ' + style.id;
}
@ -233,18 +311,18 @@ const styleManager = (() => {
return url.split('#')[0];
}
function cleanData(method, data) {
if (
(method === 'styleUpdated' || method === 'styleAdded') &&
(data.sections || data.sourceCode)
) {
// function cleanData(method, data) {
// if (
// (method === 'styleUpdated' || method === 'styleAdded') &&
// (data.sections || data.sourceCode)
// ) {
// apply/popup/manage use only meta for these two methods,
// editor may need the full code but can fetch it directly,
// so we send just the meta to avoid spamming lots of tabs with huge styles
return getStyleWithNoCode(data);
}
return output;
}
// return getStyleWithNoCode(data);
// }
// return data;
// }
function isExtensionStyle(id) {
// TODO
@ -253,8 +331,8 @@ const styleManager = (() => {
return false;
}
function broadcastMessage(method, data) {
const pendingPrivilage = runtimeSendMessage({method, cleanData(method, data)});
// function emitChanges(method, data) {
// const pendingPrivilage = runtimeSendMessage({method, cleanData(method, data)});
// const affectsAll = !msg.affects || msg.affects.all;
// const affectsOwnOriginOnly =
// !affectsAll && (msg.affects.editor || msg.affects.manager);
@ -268,45 +346,47 @@ const styleManager = (() => {
// sendMessage(msg, ignoreChromeError);
// }
// notify tabs
if (affectsTabs || affectsIcon) {
const notifyTab = tab => {
if (!styleUpdated
&& (affectsTabs || URLS.optionsUI.includes(tab.url))
// if (affectsTabs || affectsIcon) {
// const notifyTab = tab => {
// if (!styleUpdated
// && (affectsTabs || URLS.optionsUI.includes(tab.url))
// own pages are already notified via sendMessage
&& !(affectsSelf && tab.url.startsWith(URLS.ownOrigin))
// && !(affectsSelf && tab.url.startsWith(URLS.ownOrigin))
// skip lazy-loaded aka unloaded tabs that seem to start loading on message in FF
&& (!FIREFOX || tab.width)) {
msg.tabId = tab.id;
sendMessage(msg, ignoreChromeError);
}
if (affectsIcon) {
// && (!FIREFOX || tab.width)) {
// msg.tabId = tab.id;
// sendMessage(msg, ignoreChromeError);
// }
// if (affectsIcon) {
// eslint-disable-next-line no-use-before-define
// debounce(API.updateIcon, 0, {tab});
}
};
// }
// };
// list all tabs including chrome-extension:// which can be ours
Promise.all([
queryTabs(isExtensionStyle(data.id) ? {url: URLS.ownOrigin + '*'} : {}),
getActiveTab(),
]).then(([tabs, activeTab]) => {
const activeTabId = activeTab && activeTab.id;
for (const tab of tabs) {
invokeOrPostpone(tab.id === activeTabId, notifyTab, tab);
}
});
}
// Promise.all([
// queryTabs(isExtensionStyle(data.id) ? {url: URLS.ownOrigin + '*'} : {}),
// getActiveTab(),
// ]).then(([tabs, activeTab]) => {
// const activeTabId = activeTab && activeTab.id;
// for (const tab of tabs) {
// invokeOrPostpone(tab.id === activeTabId, notifyTab, tab);
// }
// });
// }
// notify self: the message no longer is sent to the origin in new Chrome
if (typeof onRuntimeMessage !== 'undefined') {
onRuntimeMessage(originalMessage);
}
// if (typeof onRuntimeMessage !== 'undefined') {
// onRuntimeMessage(originalMessage);
// }
// notify apply.js on own pages
if (typeof applyOnMessage !== 'undefined') {
applyOnMessage(originalMessage);
}
// if (typeof applyOnMessage !== 'undefined') {
// applyOnMessage(originalMessage);
// }
// propagate saved style state/code efficiently
if (styleUpdated) {
msg.refreshOwnTabs = false;
API.refreshAllTabs(msg);
}
}
// if (styleUpdated) {
// msg.refreshOwnTabs = false;
// API.refreshAllTabs(msg);
// }
// }
})();
function notifyAllTabs() {}

6
content/api.js
View File

@ -2,8 +2,10 @@
'use strict';
const API = (() => {
const preparing = promisify(chrome.runtime.getBackgroundPage.bind(chrome.runtime))()
.catch(() => null);
const preparing = chrome.runtime.getBackgroundPage ?
promisify(chrome.runtime.getBackgroundPage.bind(chrome.runtime))()
.catch(() => null) :
Promise.resolve(null);
const runtimeSendMessage = promisify(chrome.runtime.sendMessage.bind(chrome.runtime));
return new Proxy(() => {}, {
get: (target, name) =>

34
content/apply.js
View File

@ -45,6 +45,14 @@
API.styleViaAPI({action: 'styleApply'});
return;
}
// FIXME: options?
// FIXME: getStylesFallback?
API.getSectionsByUrl(getMatchUrl())
.then(buildSections)
.then(callback);
}
function getMatchUrl() {
var matchUrl = location.href;
if (!matchUrl.match(/^(http|file|chrome|ftp)/)) {
// dynamic about: and javascript: iframes don't have an URL yet
@ -55,15 +63,11 @@
}
} catch (e) {}
}
// const request = Object.assign({
// method: 'getStylesForFrame',
// asHash: true,
// matchUrl,
// }, options);
// FIXME: options?
// FIXME: getStylesFallback?
API.getSectionsByUrl(matchUrl)
.then(callback);
return matchUrl;
}
function buildSections(result) {
return Object.entries(result).map(([id, code]) => ({id: +id, code}));
}
/**
@ -122,7 +126,9 @@
}
if (request.style.enabled) {
removeStyle({id: request.style.id, retire: true});
API.getSectionsById(request.style.id).then(applyStyles);
API.getSectionsByUrl(getMatchUrl(), request.style.id)
.then(buildSections)
.then(applyStyles);
} else {
removeStyle(request.style);
}
@ -130,7 +136,9 @@
case 'styleAdded':
if (request.style.enabled) {
API.getSectionsById(request.style.id).then(applyStyles);
API.getSectionsByUrl(getMatchUrl(), request.style.id)
.then(buildSections)
.then(applyStyles);
}
break;
@ -195,7 +203,9 @@
addStyleElement(inCache);
disabledElements.delete(id);
} else {
API.getSectionsById(id).then(applyStyles);
API.getSectionsByUrl(getMatchUrl(), id)
.then(buildSections)
.then(applyStyles);
}
} else {
if (inDoc) {

10
content/install-hook-openusercss.js
View File

@ -33,11 +33,10 @@
&& event.data.type === 'ouc-is-installed'
&& allowedOrigins.includes(event.origin)
) {
chrome.runtime.sendMessage({
method: 'findUsercss',
API.findUsercss({
name: event.data.name,
namespace: event.data.namespace
}, style => {
}).then(style => {
const data = {event};
const callbackObject = {
installed: Boolean(style),
@ -129,12 +128,11 @@
&& event.data.type === 'ouc-install-usercss'
&& allowedOrigins.includes(event.origin)
) {
chrome.runtime.sendMessage({
method: 'saveUsercss',
API.saveUsercss({
reason: 'install',
name: event.data.title,
sourceCode: event.data.code,
}, style => {
}).then(style => {
sendInstallCallback({
enabled: style.enabled,
key: event.data.key

4
content/install-hook-usercss.js
View File

@ -16,8 +16,8 @@
let sourceCode, port, timer;
chrome.runtime.onConnect.addListener(onConnected);
chrome.runtime.sendMessage({method: 'installUsercss', url}, r =>
r && r.__ERROR__ && alert(r.__ERROR__));
API.installUsercss({url})
.catch(err => alert(err));
function onConnected(newPort) {
port = newPort;

72
content/install-hook-userstyles.js
View File

@ -30,10 +30,9 @@
gotBody = true;
// TODO: remove the following statement when USO pagination title is fixed
document.title = document.title.replace(/^(\d+)&\w+=/, '#$1: ');
chrome.runtime.sendMessage({
method: 'getStyles',
API.getStylesInfo({
md5Url: getMeta('stylish-md5-url') || location.href
}, checkUpdatability);
}).then(checkUpdatability);
}
if (document.getElementById('install_button')) {
onDOMready().then(() => {
@ -148,10 +147,9 @@
function onUpdate() {
return new Promise((resolve, reject) => {
chrome.runtime.sendMessage({
method: 'getStyles',
md5Url: getMeta('stylish-md5-url') || location.href,
}, ([style]) => {
API.getStylesInfo({
md5Url: getMeta('stylish-md5-url') || location.href
}).then(([style]) => {
saveStyleCode('styleUpdate', style.name, {id: style.id})
.then(resolve, reject);
});
@ -160,36 +158,27 @@
function saveStyleCode(message, name, addProps) {
return new Promise((resolve, reject) => {
const isNew = message === 'styleInstall';
const needsConfirmation = isNew || !saveStyleCode.confirmed;
if (needsConfirmation && !confirm(chrome.i18n.getMessage(message, [name]))) {
reject();
const isNew = message === 'styleInstall';
const needsConfirmation = isNew || !saveStyleCode.confirmed;
if (needsConfirmation && !confirm(chrome.i18n.getMessage(message, [name]))) {
return Promise.reject();
}
saveStyleCode.confirmed = true;
enableUpdateButton(false);
return getStyleJson().then(json => {
if (!json) {
prompt(chrome.i18n.getMessage('styleInstallFailed', ''),
'https://github.com/openstyles/stylus/issues/195');
return;
}
saveStyleCode.confirmed = true;
enableUpdateButton(false);
getStyleJson().then(json => {
if (!json) {
prompt(chrome.i18n.getMessage('styleInstallFailed', ''),
'https://github.com/openstyles/stylus/issues/195');
return;
}
chrome.runtime.sendMessage(
Object.assign(json, addProps, {
method: 'saveStyle',
reason: isNew ? 'install' : 'update',
}),
style => {
if (!isNew && style.updateUrl.includes('?')) {
enableUpdateButton(true);
} else {
sendEvent({type: 'styleInstalledChrome'});
}
return API.installStyle(Object.assign(json, addProps))
.then(style => {
if (!isNew && style.updateUrl.includes('?')) {
enableUpdateButton(true);
} else {
sendEvent({type: 'styleInstalledChrome'});
}
);
resolve();
});
});
});
function enableUpdateButton(state) {
@ -220,13 +209,12 @@
if (url.startsWith('#')) {
resolve(document.getElementById(url.slice(1)).textContent);
} else {
chrome.runtime.sendMessage(Object.assign({
API.download(Object.assign({
url,
method: 'download',
timeout: 60e3,
// USO can't handle POST requests for style json
body: null,
}, options), result => {
}, options)).then(result => {
const error = result && result.__ERROR__;
if (error) {
alert('Error' + (error ? '\n' + error : ''));
@ -249,12 +237,12 @@
if (codeElement && !codeElement.textContent.trim()) {
return style;
}
return getResource(getMeta('stylish-update-url')).then(code => new Promise(resolve => {
chrome.runtime.sendMessage({method: 'parseCss', code}, ({sections}) => {
style.sections = sections;
resolve(style);
return getResource(getMeta('stylish-update-url'))
.then(code => API.parseCss({code}))
.then(result => {
style.sections = result.sections;
return style;
});
}));
})
.catch(() => null);
}

2
edit.html
View File

@ -18,6 +18,7 @@
}
</style>
<script src="js/promisify.js"></script>
<script src="js/dom.js"></script>
<script src="js/messaging.js"></script>
<script src="js/prefs.js"></script>
@ -25,6 +26,7 @@
<script src="js/script-loader.js"></script>
<script src="js/storage-util.js"></script>
<script src="js/exclusions.js"></script>
<script src="content/api.js"></script>
<script src="content/apply.js"></script>
<script src="edit/util.js"></script>
<script src="edit/regexp-tester.js"></script>

5
edit/edit.js
View File

@ -165,7 +165,7 @@ function onRuntimeMessage(request) {
// code-less style from notifyAllTabs
const {sections, id} = request.style;
((sections && sections[0] || {}).code === null
? API.getStyles({id})
? API.getStyleFromDB(id)
: Promise.resolve([request.style])
).then(([style]) => {
if (isUsercss(style)) {
@ -372,11 +372,10 @@ function save() {
return;
}
API.saveStyle({
API.editSave({
id: styleId,
name: $('#name').value.trim(),
enabled: $('#enabled').checked,
reason: 'editSave',
sections: getSectionsHashes(),
exclusions: exclusions.get()
})

11
js/messaging.js
View File

@ -264,7 +264,6 @@ function openURL({
index,
active,
currentWindow = true,
message,
}) {
url = url.includes('://') ? url : chrome.runtime.getURL(url);
// [some] chromium forks don't handle their fake branded protocols
@ -280,15 +279,7 @@ function openURL({
url.replace(/%2F.*/, '*').replace(/#.*/, '') :
url.replace(/#.*/, '');
const task = queryTabs({url: urlQuery, currentWindow}).then(maybeSwitch);
if (!message) {
return task;
} else {
return task.then(onTabReady).then(tab => {
message.tabId = tab.id;
return sendMessage(message).then(() => tab);
});
}
return queryTabs({url: urlQuery, currentWindow}).then(maybeSwitch);
function maybeSwitch(tabs = []) {
const urlWithSlash = url + '/';

14
manage/import-export.js
View File

@ -58,7 +58,7 @@ function importFromFile({fileTypeFilter, file} = {}) {
function importFromString(jsonString, oldStyles) {
if (!oldStyles) {
return API.getStyles().then(styles => importFromString(jsonString, styles));
return API.getStylesInfo().then(styles => importFromString(jsonString, styles));
}
const json = tryJSONparse(jsonString) || [];
if (typeof json.slice !== 'function') {
@ -93,8 +93,9 @@ function importFromString(jsonString, oldStyles) {
const info = analyze(item);
if (info) {
// using saveStyle directly since json was parsed in background page context
return API.saveStyle(Object.assign(item, SAVE_OPTIONS))
.then(style => account({style, info, resolve}));
// FIXME: rewrite importStyle
// return API.saveStyle(Object.assign(item, SAVE_OPTIONS))
// .then(style => account({style, info, resolve}));
}
}
renderQueue.forEach(style => handleUpdate(style, {reason: 'import'}));
@ -224,12 +225,13 @@ function importFromString(jsonString, oldStyles) {
let tasks = Promise.resolve();
let tasksUI = Promise.resolve();
for (const id of newIds) {
tasks = tasks.then(() => API.deleteStyle({id, notify: false}));
tasks = tasks.then(() => API.deleteStyle(id));
tasksUI = tasksUI.then(() => handleDelete(id));
const oldStyle = oldStylesById.get(id);
if (oldStyle) {
Object.assign(oldStyle, SAVE_OPTIONS);
tasks = tasks.then(() => API.saveStyle(oldStyle));
// FIXME: import undo
// tasks = tasks.then(() => API.saveStyle(oldStyle));
tasksUI = tasksUI.then(() => handleUpdate(oldStyle, {reason: 'import'}));
}
}
@ -274,7 +276,7 @@ function importFromString(jsonString, oldStyles) {
$('#file-all-styles').onclick = () => {
API.getStyles().then(styles => {
API.getAllStyles().then(styles => {
// https://crbug.com/714373
document.documentElement.appendChild(
$create('iframe', {

8
manage/manage.js
View File

@ -431,7 +431,7 @@ Object.assign(handleEvent, {
})
.then(({button}) => {
if (button === 0) {
API.deleteStyle({id});
API.deleteStyle(id);
}
});
},
@ -646,7 +646,7 @@ function switchUI({styleOnly} = {}) {
const missingFavicons = newUI.enabled && newUI.favicons && !$('.applies-to img');
if (changed.enabled || (missingFavicons && !createStyleElement.parts)) {
installed.textContent = '';
API.getStyles().then(showStyles);
API.getStylesInfo().then(showStyles);
return;
}
if (changed.targets) {
@ -670,7 +670,9 @@ function onVisibilityChange() {
// assuming other changes aren't important enough to justify making a complicated DOM sync
case 'visible':
if (sessionStorage.justEditedStyleId) {
API.getStyles({id: sessionStorage.justEditedStyleId}).then(([style]) => {
API.getStylesInfo({
id: sessionStorage.justEditedStyleId
}).then(([style]) => {
handleUpdate(style, {method: 'styleUpdated'});
});
delete sessionStorage.justEditedStyleId;

6
manifest.json
View File

@ -67,13 +67,13 @@
"matches": ["http://userstyles.org/*", "https://userstyles.org/*"],
"run_at": "document_start",
"all_frames": true,
"js": ["content/install-hook-userstyles.js"]
"js": ["js/promisify.js", "content/api.js", "content/install-hook-userstyles.js"]
},
{
"matches": ["https://openusercss.org/*", "https://openusercss.com/*"],
"run_at": "document_start",
"all_frames": false,
"js": ["content/install-hook-openusercss.js"]
"js": ["js/promisify.js", "content/api.js", "content/install-hook-openusercss.js"]
},
{
"matches": [
@ -97,7 +97,7 @@
],
"run_at": "document_idle",
"all_frames": false,
"js": ["content/install-hook-usercss.js"]
"js": ["js/promisify.js", "content/api.js", "content/install-hook-usercss.js"]
}
],
"browser_action": {

2
popup.html
View File

@ -155,6 +155,8 @@
<script src="js/messaging.js"></script>
<script src="js/localization.js"></script>
<script src="js/prefs.js"></script>
<script src="js/promisify.js"></script>
<script src="content/api.js"></script>
<script src="content/apply.js"></script>
<link rel="stylesheet" href="popup/popup.css">

16
popup/hotkeys.js
View File

@ -101,15 +101,13 @@ var hotkeys = (() => {
entry = typeof entry === 'string' ? $('#' + entry) : entry;
if (!match && $('.checker', entry).checked !== enable || entry.classList.contains(match)) {
results.push(entry.id);
task = task.then(() => API.saveStyle({
id: entry.styleId,
enabled: enable,
notify: false,
})).then(() => {
entry.classList.toggle('enabled', enable);
entry.classList.toggle('disabled', !enable);
$('.checker', entry).checked = enable;
});
task = task
.then(() => API.toggleStyle(entry.styleId, enable))
.then(() => {
entry.classList.toggle('enabled', enable);
entry.classList.toggle('disabled', !enable);
$('.checker', entry).checked = enable;
});
}
}
if (results.length) task.then(API.refreshAllTabs);

81
popup/popup.js
View File

@ -1,6 +1,6 @@
/*
global configDialog hotkeys
global popupExclusions
global popupExclusions promisify onTabReady
*/
'use strict';
@ -20,10 +20,7 @@ getActiveTab().then(tab =>
: getTabRealURL(tab)
).then(url => Promise.all([
(tabURL = URLS.supported(url) ? url : '') &&
API.getStyles({
matchUrl: tabURL,
omitCode: !BG,
}),
API.getStylesInfoForUrl(tabURL),
onDOMready().then(initPopup),
])).then(([styles]) => {
showStyles(styles);
@ -115,7 +112,8 @@ function initPopup() {
}
getActiveTab().then(function ping(tab, retryCountdown = 10) {
sendMessage({tabId: tab.id, method: 'ping', frameId: 0}, pong => {
const sendMessage = promisify(chrome.tabs.sendMessage.bind(chrome.tabs));
sendMessage(tab.id, {method: 'ping'}, {frameId: 0}).then(pong => {
if (pong) {
return;
}
@ -233,18 +231,19 @@ function showStyles(styles) {
installed.appendChild(container);
setTimeout(detectSloppyRegexps, 100, styles);
API.getStyles({
matchUrl: tabURL,
strictRegexp: false,
omitCode: true,
}).then(unscreenedStyles => {
for (const style of unscreenedStyles) {
if (!styles.find(({id}) => id === style.id)) {
createStyleElement({style, check: true});
}
}
window.dispatchEvent(new Event('showStyles:done'));
});
// FIXME: detect sloppy regexp?
// API.getStyles({
// matchUrl: tabURL,
// strictRegexp: false,
// omitCode: true,
// }).then(unscreenedStyles => {
// for (const style of unscreenedStyles) {
// if (!styles.find(({id}) => id === style.id)) {
// createStyleElement({style, check: true});
// }
// }
window.dispatchEvent(new Event('showStyles:done'));
// });
}
@ -347,10 +346,10 @@ Object.assign(handleEvent, {
toggle(event) {
// when fired on checkbox, prevent the parent label from seeing the event, see #501
event.stopPropagation();
API.saveStyle({
id: handleEvent.getClickedStyleId(event),
enabled: this.matches('.enable') || this.checked,
});
API.toggleStyle(
handleEvent.getClickedStyleId(event),
this.matches('.enable') || this.checked
);
},
delete(event) {
@ -377,14 +376,14 @@ Object.assign(handleEvent, {
className: 'lights-on',
onComplete: () => (box.dataset.display = false),
});
if (ok) API.deleteStyle({id});
if (ok) API.deleteStyle(id);
}
},
configure(event) {
const {styleId, styleIsUsercss} = handleEvent.getClickedStyleElement(event);
if (styleIsUsercss) {
API.getStyles({id: styleId}).then(([style]) => {
API.getStylesInfo({id: styleId}).then(([style]) => {
hotkeys.setState(false);
configDialog(style).then(() => {
hotkeys.setState(true);
@ -452,12 +451,19 @@ Object.assign(handleEvent, {
openURLandHide(event) {
event.preventDefault();
const message = tryJSONparse(this.dataset.sendMessage);
getActiveTab()
.then(activeTab => API.openURL({
url: this.href || this.dataset.href,
index: activeTab.index + 1,
message: tryJSONparse(this.dataset.sendMessage),
index: activeTab.index + 1
}))
.then(tab => {
if (message) {
const sendMessage = promisify(chrome.tabs.sendMessage.bind(chrome.tabs.sendMessage));
return onTabReady(tab)
.then(() => sendMessage(tab.id, message));
}
})
.then(window.close);
},
@ -495,17 +501,18 @@ function handleUpdate(style) {
}
if (!tabURL) return;
// Add an entry when a new style for the current url is installed
API.getStyles({
matchUrl: tabURL,
stopOnFirst: true,
omitCode: true,
}).then(([style]) => {
if (style) {
document.body.classList.remove('blocked');
$$.remove('.blocked-info, #no-styles');
createStyleElement({style, check: true});
}
});
// FIXME: what does this do?
// API.getStyles({
// matchUrl: tabURL,
// stopOnFirst: true,
// omitCode: true,
// }).then(([style]) => {
// if (style) {
// document.body.classList.remove('blocked');
// $$.remove('.blocked-info, #no-styles');
// createStyleElement({style, check: true});
// }
// });
}

4
popup/search-results.js
View File

@ -287,7 +287,7 @@ window.addEventListener('showStyles:done', function _() {
return;
}
const md5Url = UPDATE_URL.replace('%', result.id);
API.getStyles({md5Url}).then(([installedStyle]) => {
API.countStyles({md5Url}).then(installedStyle => {
if (installedStyle) {
totalResults = Math.max(0, totalResults - 1);
} else {
@ -529,7 +529,7 @@ window.addEventListener('showStyles:done', function _() {
event.stopPropagation();
const entry = this.closest('.search-result');
saveScrollPosition(entry);
API.deleteStyle({id: entry._result.installedStyleId})
API.deleteStyle(entry._result.installedStyleId)
.then(restoreScrollPosition);
}