New example, showing insertCSS and removeCSS

This commit is contained in:
Will Bamberg
2016-08-17 11:21:30 -07:00
parent 5c9c3ccb4f
commit c4b5b841f1
6 changed files with 87 additions and 0 deletions

37
apply-css/background.js Normal file
View File

@@ -0,0 +1,37 @@
const CSS = "body { border: 20px solid red; }";
const TITLE_APPLY = "Apply CSS";
const TITLE_REMOVE = "Remove CSS";
function toggleCSS(tab) {
function gotTitle(title) {
if (title === TITLE_APPLY) {
chrome.pageAction.setIcon({tabId: tab.id, path: "icons/on.svg"});
chrome.pageAction.setTitle({tabId: tab.id, title: TITLE_REMOVE});
chrome.tabs.insertCSS({code: CSS});
} else {
chrome.pageAction.setIcon({tabId: tab.id, path: "icons/off.svg"});
chrome.pageAction.setTitle({tabId: tab.id, title: TITLE_APPLY});
chrome.tabs.removeCSS({code: CSS});
}
}
chrome.pageAction.getTitle({tabId: tab.id}, gotTitle)
}
function initializePageAction(tabId) {
chrome.pageAction.setIcon({tabId, path: "icons/off.svg"});
chrome.pageAction.setTitle({tabId, title: TITLE_APPLY});
chrome.pageAction.show(tabId);
}
chrome.tabs.query({}, (tabs)=> {
for (tab of tabs) {
initializePageAction(tab.id);
}
});
chrome.tabs.onUpdated.addListener(initializePageAction);
chrome.pageAction.onClicked.addListener(toggleCSS);