diff --git a/extension/background.js b/extension/background.js new file mode 100644 index 0000000..e3cfda2 --- /dev/null +++ b/extension/background.js @@ -0,0 +1,10 @@ +browser.menus.create({ + id: "youtube-download", + title: "Download", + contexts: ["all"], + documentUrlPatterns: ["*://*.youtube.com/*"], +}); + +browser.menus.onShown.addListener((info, tab) => { + browser.tabs.sendMessage(tab.id, { action: "check-element", info: info }); +}); diff --git a/extension/content.js b/extension/content.js new file mode 100644 index 0000000..ab56163 --- /dev/null +++ b/extension/content.js @@ -0,0 +1,34 @@ +const URL = `http://localhost:5000/download`; +let lastRightClickCoords = { x: 0, y: 0 }; + +document.addEventListener("contextmenu", (event) => { + lastRightClickCoords = { x: event.clientX, y: event.clientY }; + console.log("Right-click coordinates:", lastRightClickCoords); +}); + +browser.runtime.onMessage.addListener((message, sender, sendResponse) => { + const { x, y } = lastRightClickCoords; + let element = document.elementFromPoint(x, y); + + while (element && element.tagName != "YTD-RICH-ITEM-RENDERER") { + element = element.parentElement; + } + if (!element.tagName == "YTD-RICH-ITEM-RENDERER") { + console.error("No video element found."); + return; + } + + const link = element.querySelector("a#video-title-link").href; + fetch(URL, { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + link: link, + }), + }).then((res) => { + console.log(res); + res.json().then((data) => console.log(data)); + }); +}); diff --git a/extension/manifest.json b/extension/manifest.json new file mode 100644 index 0000000..271e261 --- /dev/null +++ b/extension/manifest.json @@ -0,0 +1,20 @@ +{ + "manifest_version": 2, + "name": "Youtube Downloader", + "version": "1.0", + "permissions": [ + "menus", + "activeTab", + "tabs", + "http://localhost:5000/*" + ], + "background": { + "scripts": ["background.js"] + }, + "content_scripts": [ + { + "matches": ["*://*.youtube.com/*"], + "js": ["content.js"] + } + ] +}