Compare commits

...

5 Commits

Author SHA1 Message Date
aminecmi
3402f57a2d Added the extension link. 2022-07-16 21:27:36 +02:00
aminecmi
c2b9015309 Page action and quicker. 2022-07-16 21:20:30 +02:00
aminecmi
75fed20b17 Handling events differently.
Now, there will be no more "false positives".
The click listener will only be on youtube links.
2022-07-16 15:43:32 +02:00
aminecmi
980d60eb44 Changed icon and updated readme. 2022-07-15 21:09:56 +02:00
aminecmi
3d5fb09880 Id change. 2022-07-15 16:14:07 +02:00
8 changed files with 113 additions and 30 deletions

View File

@ -1,2 +1,7 @@
# youtube-to-invidious # youtube-to-invidious
WebExtention to redirect every youtube link to a invidious instance
[Available here](https://addons.mozilla.org/en-US/firefox/addon/youtube-to-invidious/)
WebExtention to redirect every youtube link to a [Invidious](https://invidious.io/) instance.
The instance url can be configured in the add-on settings.

View File

@ -1,3 +1,5 @@
let urlFromStorage
// Storage init // Storage init
browser.runtime.onInstalled.addListener(function() { browser.runtime.onInstalled.addListener(function() {
browser.storage.sync.set({ browser.storage.sync.set({
@ -5,6 +7,12 @@ browser.runtime.onInstalled.addListener(function() {
}); });
}); });
browser.storage.sync.onChanged.addListener(function(changes) {
if (changes.url && changes.url.newValue) {
urlFromStorage = changes.url.newValue
}
})
// Url format // Url format
function getVideoToken(url) { function getVideoToken(url) {
@ -25,12 +33,11 @@ function cleanToken(token) {
} }
// Links click event handling
browser.runtime.onMessage.addListener(function(message) { function toInvidious(message) {
let url = message.youtubeUrl; let url = message.url;
const name = message.targetName; const name = message.targetName;
browser.storage.sync.get("url").then(function(item) { const subst = urlFromStorage + `/watch?v=`;
const subst = item.url + `/watch?v=`;
let token = getVideoToken(url) let token = getVideoToken(url)
const cleanedToken = cleanToken(token) const cleanedToken = cleanToken(token)
url = url.replace(/.*\/watch\?v=/gm, subst); url = url.replace(/.*\/watch\?v=/gm, subst);
@ -41,9 +48,20 @@ browser.runtime.onMessage.addListener(function(message) {
); );
} else { } else {
browser.tabs.update( browser.tabs.update(
{url: url, loadReplace: true} {url: url, loadReplace: false}
) )
} }
console.log('Youtube to invidious is redirecting you to invidious') console.log('Youtube to invidious is redirecting you to invidious')
}) }
// Links click event handling
browser.runtime.onMessage.addListener(function(message) {
toInvidious(message)
});
// Page action
browser.pageAction.onClicked.addListener(function(page) {
toInvidious({url: page.url, targetName: "_self"});
}); });

BIN
button/19.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
button/38.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
icons/Frame 1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

View File

@ -2,13 +2,22 @@
"manifest_version": 2, "manifest_version": 2,
"name": "Youtube to invidious", "name": "Youtube to invidious",
"version": "0.1", "version": "0.4",
"description": "Change every youtube link to an invidious one", "description": "Change every youtube link to an invidious one",
"icons": { "icons": {
"48": "icons/48.png" "48": "icons/48.png"
}, },
"page_action": {
"show_matches": ["https://*.youtube.com/watch*"],
"browser_style": true,
"default_icon": {
"19": "button/19.png",
"38": "button/38.png"
}
},
"web_accessible_resources": ["icons/48.png"], "web_accessible_resources": ["icons/48.png"],
"content_scripts": [ "content_scripts": [
{ {
@ -27,7 +36,7 @@
"browser_specific_settings": { "browser_specific_settings": {
"gecko": { "gecko": {
"id": "1f63659fb336c2593b0f48375566cf66c5d8e12d@amine-louveau.fr" "id": "11f63659fb336c2593b0f48375566cf66c5d8e12d@amine-louveau.fr"
} }
} }

View File

@ -1,11 +1,62 @@
window.addEventListener("click", (e) => { function findATagsAndAddListener(el) {
let tags = [];
// Google has elements that prevent click on links. May need different handling
// if (window.location.href.indexOf("google.") >= 0) {
// const elements = document.getElementsByClassName("NqpkQc");
// while(elements.length > 0){
// elements[0].parentNode.removeChild(elements[0]);
// }
// }
if (window.location.href.indexOf('youtube.com') >= 0) {
tags = el.querySelectorAll('a[href*="/watch"]');
} else {
tags = el.querySelectorAll('a[href*="youtube.com/"]');
}
for (i = 0; i < tags.length; i++) {
addListenerToATag(tags[i]);
}
}
function addListenerToATag(tag) {
tag.addEventListener('click', function(e) {
e.preventDefault();
e.stopImmediatePropagation();
// Find the a tag
var target = e.target; var target = e.target;
while ((target.tagName != "A" || !target.href) && target.parentNode) { while ((target.tagName != "A" || !target.href) && target.parentNode) {
target = target.parentNode; target = target.parentNode;
} }
if (target.tagName != "A" || target.href.indexOf('youtube') == -1)
return;
e.preventDefault(); let targetName = (target.attributes.target != null ? target.attributes.target.nodeValue : '_self')
browser.runtime.sendMessage({"youtubeUrl": target.href, "targetName": (target.attributes.target != null ? target.attributes.target.nodeValue : '_self')}); if (e.ctrlKey || e.metaKey) {
targetName = "_blank";
}
browser.runtime.sendMessage({"url": target.href, "targetName": targetName});
})
}
// Add the event listeners to the current elements of the body
findATagsAndAddListener(document.body);
// Monitor the DOM for additions and create event listeners on the go
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.addedNodes && mutation.addedNodes.length > 0) {
for (let i = 0; i < mutation.addedNodes.length; i++) {
const newNode = mutation.addedNodes[i];
if (newNode.nodeType === Node.ELEMENT_NODE || newNode.nodeType === Node.DOCUMENT_NODE || newNode.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
findATagsAndAddListener(newNode);
}
}
}
});
});
observer.observe(document.body, {
childList: true,
subtree: true
}); });