Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-16 08:27:03 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added UI to support picking out sponsors and submitting

Browse Source
This commit is contained in:
Ajay Ramachandran
2019-07-08 23:43:06 -04:00
parent f81365414c
commit 2f32ead924
6 changed files with 162 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
ContentScript.js
View File

@@ -8,6 +8,11 @@ chrome.runtime.onMessage.addListener( // Detect URL Changes
if (request.message === 'ytvideoid') { // Message from background script if (request.message === 'ytvideoid') { // Message from background script
SponsorsLookup(request.id); SponsorsLookup(request.id);
} }
//message from popup script
if (request.message === 'sponsorStart') {
sponsorMessageStarted();
}
}); });
function SponsorsLookup(id) { function SponsorsLookup(id) {
@@ -38,3 +43,15 @@ function youtube_parser(url) { // Returns with video id else returns false
var match = url.match(regExp); var match = url.match(regExp);
return (match && match[7].length == 11) ? match[7] : false; return (match && match[7].length == 11) ? match[7] : false;
} }
function sponsorMessageStarted() {
let v = document.querySelector('video');
console.log(v.currentTime)
//send back current time
chrome.runtime.sendMessage({
message: "time",
time: v.currentTime
});
}

17
background.js
View File

@@ -1,15 +1,20 @@
chrome.tabs.onUpdated.addListener( // On tab update chrome.tabs.onUpdated.addListener( // On tab update
function(tabId, changeInfo, tab) { function(tabId, changeInfo, tab) {
if (changeInfo.url && id = youtube_parser(changeInfo.url)) { // If URL changed and is youtube video message ContentScript the video id if (changeInfo != undefined && changeInfo.url != undefined) {
chrome.tabs.sendMessage( tabId, { console.log(changeInfo)
message: 'ytvideoid', let id = youtube_parser(changeInfo.url);
id: id if (changeInfo.url && id) { // If URL changed and is youtube video message contentScript the video id
}) chrome.tabs.sendMessage( tabId, {
message: 'ytvideoid',
id: id
})
}
} }
} }
); );
function youtube_parser(url) { // Return video id or false function youtube_parser(url) { // Return video id or false
var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/; var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
var match = url.match(regExp); var match = url.match(regExp);
return (match && match[7].length == 11) ? match[7] : false; return (match && match[7].length == 11) ? match[7] : false;
} }

11
manifest.json
View File

@@ -1,20 +1,25 @@
{ {
"name": "YTSponsorSkip", "name": "YTSponsorSkip",
"version": "1.0", "version": "1.0",
"description": "Skip youtube video sponsors", "description": "Skip youtube video sponsors.",
"content_scripts": [ "content_scripts": [
{ {
"matches": [ "matches": [
"https://*.youtube.com/*" "https://*.youtube.com/*"
], ],
"js": [ "js": [
"ContentScript.js" "contentScript.js"
] ]
} }
], ],
"permissions": [ "permissions": [
"tabs" "tabs",
"storage"
], ],
"browser_action": {
"default_title": "SponsorBlock",
"default_popup": "popup.html"
},
"background": { "background": {
"scripts":["background.js"] "scripts":["background.js"]
}, },

7
popup.css Normal file
View File

@@ -0,0 +1,7 @@
* {
font-family: 'Arial';
}
body {
width: 300px;
}

27
popup.html Normal file
View File

@@ -0,0 +1,27 @@
<html>
<head>
<title>Set Page Color Popup</title>
<link rel="stylesheet" type="text/css" href="popup.css"/>
</head>
<div id="app">
<div class="main">
<center>
<h1>SponsorBlock</h1>
<div>
<button id="sponsorStart">Sponsorship Starts</button>
</div>
<h3>Latest Sponsor Message Times Chosen</h3>
<b>
<div id="sponsorMessageTimes">
</div>
</b>
<button id="clearTimes">Clear Times</button>
</center>
</div>
</div>
<script src="popup.js"></script>
</html>

92
popup.js Normal file
View File

@@ -0,0 +1,92 @@
document.getElementById("sponsorStart").addEventListener("click", sendSponsorStartMessage);
document.getElementById("clearTimes").addEventListener("click", clearTimes);
//if true, the button now selects the end time
var startTimeChosen = false;
//the start and end time pairs (2d)
var videoTimes = [];
//load video times
chrome.storage.local.get(['videoTimes'], function(result) {
if (result.videoTimes != undefined) {
videoTimes = result.videoTimes;
if (videoTimes[videoTimes.length - 1].length < 2) {
startTimeChosen = true;
}
displayVideoTimes();
}
});
function sendSponsorStartMessage() {
//the content script will get the message if a YouTube page is open
chrome.tabs.query({
active: true,
currentWindow: true
}, tabs => {
// ...and send a request for the DOM info...
chrome.tabs.sendMessage(
tabs[0].id,
{from: 'popup', subject: 'DOMInfo', message: 'sponsorStart'}
);
});
}
chrome.runtime.onMessage.addListener(function (request, sender, callback) {
if (request.message == "time") {
let timeMessage = request.time.toFixed(2) + "s";
let videoTimesIndex = videoTimes.length - (startTimeChosen ? 1 : 0);
if (videoTimes[videoTimesIndex] == undefined) {
videoTimes[videoTimesIndex] = [];
}
videoTimes[videoTimesIndex][startTimeChosen ? 1 : 0] = request.time;
chrome.storage.local.set({"videoTimes": videoTimes});
//update startTimeChosen variable
if (!startTimeChosen) {
startTimeChosen = true;
document.getElementById("sponsorStart").innerHTML = "Sponsorship Ends";
} else {
startTimeChosen = false;
document.getElementById("sponsorStart").innerHTML = "Sponsorship Start";
}
//display video times on screen
displayVideoTimes();
}
});
//display the video times from the array
function displayVideoTimes() {
//make sure the div is empty first
document.getElementById("sponsorMessageTimes").innerHTML = "";
for (let i = 0; i < videoTimes.length; i++) {
console.log(videoTimes)
for (let s = 0; s < videoTimes[i].length; s++) {
let timeMessage = videoTimes[i][s] + "s";
//if this is an end time
if (s == 1) {
timeMessage = " to " + timeMessage;
} else if (i > 0) {
//add commas if necessary
timeMessage = ", " + timeMessage;
}
document.getElementById("sponsorMessageTimes").innerHTML += timeMessage;
}
}
}
function clearTimes() {
videoTimes = [];
chrome.storage.local.set({"videoTimes": videoTimes});
displayVideoTimes();
}