trying to figure out a way to display this data

2024-12-13 11:00:51 -07:00
parent 7235326826
commit 635b3a3df7
10 changed files with 116 additions and 5 deletions
--- a/browser/popup/inject.js
+++ b/browser/popup/inject.js
@@ -0,0 +1,13 @@
+
+let anchor = document.getElementById('anchor');
+if (anchor) {
+    window.fetch(anchor.innerText)
+    .then(res => res.text())
+    .then((body) => {
+        document.body.textContent = "";
+        document.body.innerHTML = body;
+    })
+
+
+}
+
--- a/browser/popup/popup.html
+++ b/browser/popup/popup.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+  </head>
+
+<body>
+    <button id="newtab">Open canvas</button>
+    <button id="replacer">Load page</button>
+    <p id="output"></p>
+    <script src="popup.js"></script>
+</body>
+<style>
+  html {
+    background: darkolivegreen;
+    color: azure;
+  }
+  body {
+    height: 200px;
+    width: 200px;
+  }
+</style>
+</html>
--- a/browser/popup/popup.js
+++ b/browser/popup/popup.js
@@ -0,0 +1,21 @@
+const output = document.getElementById('output');
+let page_url = "http://127.0.0.1:4433/s3/style.css";
+
+document.getElementById("newtab").addEventListener('click', async function(e) {
+    browser.tabs.create({ url: "/main/main.html" }).then((t) => {
+        if (t.id) {
+            output.innerText += t.id
+        }
+    })
+})
+
+document.getElementById("replacer").addEventListener('click', async function(e) {
+    browser.tabs.executeScript({ code: injection })
+    browser.tabs.executeScript({ file: "inject.js" });
+})
+
+
+const injection = `
+let head = document.getElementById('anchor');
+head.innerText = "${page_url}";
+`