MDN get started tutorial examples to manifest V3 (#608)

* MDN get started tutorial examples to manifest V3

* Migrate to Scripting API

* Updated to readmes and code comments

* Apply suggestions to readmes from review

Co-authored-by: Simeon Vincent <svincent@gmail.com>

* Convert choose_beast.js to async

* Apply suggestions from review

Co-authored-by: Simeon Vincent <svincent@gmail.com>

* Updated illustrated API list for beastify

* Apply suggestions from review

Co-authored-by: Rob Wu <rob@robwu.nl>

---------

Co-authored-by: Simeon Vincent <svincent@gmail.com>
Co-authored-by: Rob Wu <rob@robwu.nl>
This commit is contained in:
rebloor
2026-01-28 07:15:58 +13:00
committed by GitHub
parent 04e5fa59cf
commit e1253d9ad3
8 changed files with 118 additions and 78 deletions
+12 -9
View File
@@ -1,8 +1,8 @@
(function() {
/**
* Check and set a global guard variable.
* If this content script is injected into the same page again,
* it will do nothing next time.
* Check and set a global guard variable to
* ensure that if this content script is injected into a page again,
* it returns (and does nothing).
*/
if (window.hasRun) {
return;
@@ -10,21 +10,24 @@
window.hasRun = true;
/**
* Given a URL to a beast image, remove all existing beasts, then
* create and style an IMG node pointing to
* that image, then insert the node into the document.
* Given a URL for a beast image, remove all beasts,
* then create and style an IMG node pointing to the image and
* insert the node into the document.
*/
function insertBeast(beastURL) {
removeExistingBeasts();
let beastImage = document.createElement("img");
beastImage.setAttribute("src", beastURL);
beastImage.style.height = "100vh";
beastImage.style.objectFit = "contain";
beastImage.style.position = "fixed";
beastImage.style.height = "100%";
beastImage.style.width = "100%";
beastImage.className = "beastify-image";
document.body.appendChild(beastImage);
}
/**
* Remove every beast from the page.
* Remove all beasts from the page.
*/
function removeExistingBeasts() {
let existingBeasts = document.querySelectorAll(".beastify-image");
@@ -35,7 +38,7 @@
/**
* Listen for messages from the background script.
* Call "beastify()" or "reset()".
* Depending on the message, call "beastify()" or "reset()".
*/
browser.runtime.onMessage.addListener((message) => {
if (message.command === "beastify") {