Replacing code examples
I worked with Bhuvana Pappu to update this code example for this article: https://review.learn.microsoft.com/en-us/microsoft-edge/extensions-chromium/getting-started/part2-content-scripts?branch=pr-en-us-2266&tabs=v3
This commit is contained in:
Родитель
3ebe7d374c
Коммит
477c3570e0
|
@ -1,18 +1,18 @@
|
|||
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
|
||||
$("head").prepend(
|
||||
`<style>
|
||||
.slide-image {
|
||||
height: auto;
|
||||
width: 100vw;
|
||||
}
|
||||
</style> `
|
||||
);
|
||||
$("body").prepend(
|
||||
`<img src="${request.url}" id="${request.imageDivId}"
|
||||
class="slide-image" /> `
|
||||
`<img src="${request.url}" id="${request.imageDivId}"
|
||||
class="slide-image" /> `
|
||||
);
|
||||
$("head").prepend(
|
||||
`<style>
|
||||
.slide-image {
|
||||
height: auto;
|
||||
width: 100vw;
|
||||
}
|
||||
</style>`
|
||||
);
|
||||
$(`#${request.imageDivId}`).click(function() {
|
||||
$(`#${request.imageDivId}`).remove(`#${request.imageDivId}`);
|
||||
$(`#${request.imageDivId}`).remove(`#${request.imageDivId}`);
|
||||
});
|
||||
sendResponse({ fromcontent: "This message is from content.js" });
|
||||
});
|
||||
|
|
|
@ -1,26 +1,29 @@
|
|||
{
|
||||
"name": "NASA Picture of the day viewer",
|
||||
"name": "NASA picture of the day viewer",
|
||||
"version": "0.0.0.1",
|
||||
"manifest_version": 2,
|
||||
"description": "A chromium extension to show NASA's Picture of the Day.",
|
||||
"manifest_version": 3,
|
||||
"description": "An extension to display the NASA picture of the day.",
|
||||
"icons": {
|
||||
"16": "icons/nasapod16x16.png",
|
||||
"32": "icons/nasapod32x32.png",
|
||||
"48": "icons/nasapod48x48.png",
|
||||
"128": "icons/nasapod128x128.png"
|
||||
"16": "icons/nasapod16x16.png",
|
||||
"32": "icons/nasapod32x32.png",
|
||||
"48": "icons/nasapod48x48.png",
|
||||
"128": "icons/nasapod128x128.png"
|
||||
},
|
||||
"browser_action": {
|
||||
"default_popup": "popup/popup.html"
|
||||
"action": {
|
||||
"default_popup": "popup/popup.html"
|
||||
},
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": [
|
||||
"<all_urls>"
|
||||
],
|
||||
"js": ["lib/jquery.min.js","content-scripts/content.js"]
|
||||
}
|
||||
{
|
||||
"matches": [
|
||||
"<all_urls>"
|
||||
],
|
||||
"js": ["lib/jquery.min.js","content-scripts/content.js"]
|
||||
}
|
||||
],
|
||||
"web_accessible_resources": [
|
||||
"images/*.jpeg"
|
||||
{
|
||||
"resources": ["images/*.jpeg"],
|
||||
"matches": ["<all_urls>"]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
@ -1,25 +1,24 @@
|
|||
const sendMessageId = document.getElementById("sendmessageid");
|
||||
if (sendMessageId) {
|
||||
sendMessageId.onclick = function() {
|
||||
chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
|
||||
chrome.tabs.sendMessage(
|
||||
tabs[0].id,
|
||||
{
|
||||
url: chrome.extension.getURL("images/stars.jpeg"),
|
||||
imageDivId: `${guidGenerator()}`,
|
||||
tabId: tabs[0].id
|
||||
},
|
||||
function(response) {
|
||||
console.log("message with url sent");
|
||||
window.close();
|
||||
}
|
||||
);
|
||||
function guidGenerator() {
|
||||
const S4 = function () {
|
||||
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
|
||||
};
|
||||
return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
sendMessageId.onclick = function() {
|
||||
chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
|
||||
chrome.tabs.sendMessage(
|
||||
tabs[0].id,
|
||||
{
|
||||
url: chrome.runtime.getURL("images/stars.jpeg"),
|
||||
imageDivId: `${guidGenerator()}`,
|
||||
tabId: tabs[0].id
|
||||
},
|
||||
function(response) {
|
||||
window.close();
|
||||
}
|
||||
);
|
||||
function guidGenerator() {
|
||||
const S4 = function () {
|
||||
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
|
||||
};
|
||||
return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
Загрузка…
Ссылка в новой задаче