Peertube
/
peertubeify-estensione-firefox-chrome
mirror of https://gitlab.com/Cha_deL/peertubeify
1
0
Fork 0
Code Issues Releases Wiki Activity

Add support for Invidious

This commit is contained in:
Booteille 2019-02-17 20:07:50 +01:00
parent 9a4ebae563
commit 8eca34b755
No known key found for this signature in database
GPG Key ID: 7FC1ED300B74CD91
3 changed files with 33 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
extension/manifest.json
View File

@ -20,7 +20,7 @@
"scripts": ["dist/background.js", "dist/vendors.js"] "scripts": ["dist/background.js", "dist/vendors.js"]
}, },
"content_scripts": [{ "content_scripts": [{
"matches": ["*://*.youtube.com/*"], "matches": ["*://*.youtube.com/*", "*://*.invidio.us/*"],
"js": ["dist/youtube.js", "dist/vendors.js"] "js": ["dist/youtube.js", "dist/vendors.js"]
}, { }, {
"matches": ["https://*/videos/watch/*"], "matches": ["https://*/videos/watch/*"],

7
src/background.ts
View File

@ -42,6 +42,7 @@ const redirectYoutube = async (r) => {
const isEmbed = r.url.indexOf('embed') >= 0; const isEmbed = r.url.indexOf('embed') >= 0;
const query = isEmbed ? r.url.substr(r.url.lastIndexOf('/') + 1, 11) : r.url.substr(r.url.indexOf('?v=') + 3, 11); const query = isEmbed ? r.url.substr(r.url.lastIndexOf('/') + 1, 11) : r.url.substr(r.url.indexOf('?v=') + 3, 11);
const title = await getTitle(query); const title = await getTitle(query);
const video = await searchByName(title); const video = await searchByName(title);
const url = await getPeertubeVideoURL(video, prefs, isEmbed); const url = await getPeertubeVideoURL(video, prefs, isEmbed);
@ -50,8 +51,6 @@ const redirectYoutube = async (r) => {
redirectUrl: url redirectUrl: url
}; };
} }
throw new Error('No results.');
}; };
/** /**
@ -81,8 +80,6 @@ const redirectPeertube = async (r) => {
redirectUrl: url redirectUrl: url
}; };
} }
throw new Error('No results.');
}; };
const searchByName = query => new Promise(async (resolve, reject) => { const searchByName = query => new Promise(async (resolve, reject) => {
@ -109,7 +106,7 @@ browser.runtime.onMessage.addListener(function(message) {
browser.webRequest.onBeforeRequest.addListener( browser.webRequest.onBeforeRequest.addListener(
redirectYoutube, redirectYoutube,
{ urls: ['*://*.youtube.com/watch?v=*', '*://*.youtube.com/embed/*'] }, { urls: ['*://*.youtube.com/watch?v=*', '*://*.youtube.com/embed/*', '*://*.invidio.us/watch?v=*', '*://*.invidio.us/embed/*'] },
['blocking'] ['blocking']
); );

49
src/youtube.ts
View File

@ -22,7 +22,7 @@ import { MessageKind, RedirectType } from './types';
import Preferences from './preferences' import Preferences from './preferences'
const thumbnailURL = (host, path) => `https://${host}${path}`; const thumbnailURL = (host, path) => `https://${host}${path}`;
const isYouTube = document.location.hostname === 'www.youtube.com';
const LINK_ID = 'peertube-link'; const LINK_ID = 'peertube-link';
function searchVideo(query) { function searchVideo(query) {
@ -43,7 +43,9 @@ async function peertubeify(query: String) {
const link = videoLink(url, video); const link = videoLink(url, video);
removeVideoLink(); removeVideoLink();
document.querySelector('ytd-app').appendChild(link);
const querySelector = isYouTube ? 'ytd-app' : '.pure-g';
document.querySelector(querySelector).appendChild(link);
}).catch(removeVideoLink); }).catch(removeVideoLink);
break; break;
} }
@ -53,23 +55,31 @@ async function peertubeify(query: String) {
} }
} }
const throttledPeertubeify = _.throttle(1000, peertubeify); if (isYouTube) {
const observer = new MutationObserver(function(mutationsList) { const throttledPeertubeify = _.throttle(1000, peertubeify);
for (const mutation of mutationsList) { const observer = new MutationObserver(function(mutationsList) {
if ((mutation.target as Element).classList.contains('ytp-title-link')) { for (const mutation of mutationsList) {
for (const node of mutation.addedNodes) { if ((mutation.target as Element).classList.contains('ytp-title-link')) {
if (node.nodeType == Node.TEXT_NODE) { for (const node of mutation.addedNodes) {
throttledPeertubeify(node.textContent); if (node.nodeType == Node.TEXT_NODE) {
throttledPeertubeify(node.textContent);
}
} }
} }
} }
} });
});
observer.observe(document.body, { observer.observe(document.body, {
childList: true, childList: true,
subtree: true, subtree: true,
}) })
} else {
peertubeify(document.title.substring(0, document.title.indexOf(' - Invidious')));
}
const backgroundColor = isYouTube ? 'var(--yt-swatch-primary)' : '#fff';
const buttonColor = isYouTube ? 'var(--yt-swatch-text)' : '#000';
const textColor = isYouTube ? 'var(--yt-primary-text-color)' : '#000';
const videoLink = (url, video) => htmlToElement(` const videoLink = (url, video) => htmlToElement(`
<div id="${LINK_ID}" <div id="${LINK_ID}"
@ -80,16 +90,17 @@ const videoLink = (url, video) => htmlToElement(`
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
padding: 1rem; padding: 1rem;
z-index: 10; z-index: 101;
box-shadow: inset 0px 4px 8px -3px rgba(17, 17, 17, .06); box-shadow: inset 0px 4px 8px -3px rgba(17, 17, 17, .06);
background-color: var(--yt-swatch-primary); background-color: ${backgroundColor};
letter-spacing: normal;
"> ">
<button <button
onclick="document.getElementById('${LINK_ID}').remove()" onclick="document.getElementById('${LINK_ID}').remove()"
style=" style="
all: unset; all: unset;
color: var(--yt-swatch-text); color: ${buttonColor};
cursor: pointer; cursor: pointer;
font-size: 24px; font-size: 24px;
position: absolute; position: absolute;
@ -111,7 +122,7 @@ const videoLink = (url, video) => htmlToElement(`
<div style=" <div style="
font-size: 18px; font-size: 18px;
margin-left: 1rem; margin-left: 1rem;
color: var(--yt-primary-text-color); color: ${textColor};
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: space-around;