diff --git a/webpage-assets/js/content.js b/content.js similarity index 100% rename from webpage-assets/js/content.js rename to content.js diff --git a/manifest.json b/manifest.json index 42f7ec3..de45f31 100644 --- a/manifest.json +++ b/manifest.json @@ -3,28 +3,38 @@ "name": "Dino", "version": "1.0", "description": "A chrome extension to help people with dyslexia and color blindness access web pages with more ease.", - "icons": { + + "icons": { "16": "assets/images/dino_16px.png", "48": "assets/images/dino_48px.png", - "128": "assets/images/dino_128px.png" + "128": "assets/images/dino_128px.png" }, + "action": { - "default_popup": "popup.html" + "default_popup": "popup/index.html" }, - "web_accessible_resources": [ + + "content_scripts": [ { "matches": [""], - "resources": ["assets/*"] + "all_frames": true, + "js": ["content.js"], + "css": ["webpage-assets/css/styles.css"] } ], - "content_scripts": [ + + "web_accessible_resources": [ { - "matches": ["*://*/*"], - "all_frames": true, - "js": ["webpage-assets/js/content.js", "mark.js"], - "css": ["webpage-assets/css/styles.css"] + "matches": [""], + "resources": [ + "mark.js", + "webpage-assets/css/styles.css", + "webpage-assets/fonts/*", + "assets/*" + ] } ], - "permissions": ["tabs", "activeTab"], + + "permissions": ["activeTab", "tabs"], "host_permissions": ["http://*/*", "https://*/*"] } diff --git a/popup/common.js b/popup/common.js index b0375b7..43e4604 100644 --- a/popup/common.js +++ b/popup/common.js @@ -1 +1,48 @@ +const app = document.getElementById("app"); + +async function loadPage(page) { + const res = await fetch(`pages/${page}.html`); + const html = await res.text(); + app.innerHTML = html; + bindPageEvents(page); +} + +function bindPageEvents(page) { + if (page === "visuals") { + document.getElementById("toggleTheme")?.addEventListener("click", () => { + chrome.tabs.query({ active: true, currentWindow: true }, tabs => { + chrome.tabs.sendMessage(tabs[0].id, { action: "toggleTheme" }); + }); + }); + + document.getElementById("highlightText")?.addEventListener("click", () => { + chrome.tabs.sendMessage( + chrome.tabs.query({ active: true, currentWindow: true }), + { action: "highlight" } + ); + }); + } + + if (page === "speech") { + document.getElementById("readPage")?.addEventListener("click", () => { + chrome.tabs.sendMessage( + chrome.tabs.query({ active: true, currentWindow: true }), + { action: "read" } + ); + }); + } + + if (page === "translator") { + window.location.href = "../Translator/index.html"; + } +} + +// Navigation buttons +document.querySelectorAll("nav button").forEach(btn => { + btn.addEventListener("click", () => loadPage(btn.dataset.page)); +}); + +// Load default page +loadPage("home"); + let Preference = {}; diff --git a/popup/index.html b/popup/index.html new file mode 100644 index 0000000..032e73a --- /dev/null +++ b/popup/index.html @@ -0,0 +1,21 @@ + + + + + Dino + + + + + + +
+ + + + diff --git a/popup/pages/home.html b/popup/pages/home.html new file mode 100644 index 0000000..dbbfaa5 --- /dev/null +++ b/popup/pages/home.html @@ -0,0 +1,2 @@ +

Welcome to Dino 🦖

+

Select a tool from above.

diff --git a/popup/pages/speech.html b/popup/pages/speech.html new file mode 100644 index 0000000..77a2bc6 --- /dev/null +++ b/popup/pages/speech.html @@ -0,0 +1,2 @@ +

Speech Tools

+ diff --git a/popup/pages/visuals.html b/popup/pages/visuals.html new file mode 100644 index 0000000..1943d61 --- /dev/null +++ b/popup/pages/visuals.html @@ -0,0 +1,3 @@ +

Visual Tools

+ +