- 
+ 
-
Created By Ajay Ramachandran 
+
+ Created By Ajay Ramachandran
+ (Donate)
+
- Thanks for installing SponsorBlock. By using this extension, you agree to the Privacy Policy and Terms of Use. + __MSG_helpPageThanksForInstalling__ By using this extension, you agree to the Privacy Policy and Terms of Use.
Come contribute, make some suggestions and help out on Discord or on Matrix.
-Please review the options below
+__MSG_helpPageReviewOptions__
- Many features are disabled by default. If you want to skip intros, outros, use Invidious, etc., enable them below. - You can also hide/show UI elements. + __MSG_helpPageFeatureDisclaimer__
-How skipping works
+__MSG_helpPageHowSkippingWorks__
- 
+ 
- Video segments will automatically be skipped if they are found in the database. You can open the popup by clicking the extension icon to get a preview of what they are.
+ __MSG_helpPageHowSkippingWorks1__
- Whenever you skip a segment, you will get notice. If the timing seems wrong vote down by clicking downvote! You can also vote in the popup.
+ __MSG_helpPageHowSkippingWorks2__
Submitting
+__MSG_Submitting__
- Submitting can either be done in the popup by hitting the "Segment Starts Now" button or in the video player with the buttons on the player.
+ __MSG_helpPageSubmitting1__
- Clicking the play button indicated the start of a segment and clicking the stop icon indicates the end. You can prepare multiple sponsors before hitting submit. Clicking the upload button will submit. Clicking the garbage can will delete.
+ __MSG_helpPageSubmitting2__
Editing
+__MSG_Editing__
- 
+ 
- If you messed up, you can edit or delete your segments in the popup or in the info menu (by hitting the info icon).
+ __MSG_helpPageEditing1__
This is too slow
+__MSG_helpPageTooSlow__
- There are hotkeys if you want to use them. Press the semicolon key to indicate the start/end of a sponsor segment and click the apostrophe to submit. - These can be changed in the options. If you don't use QWERTY, you should probably change the keybinding. + __MSG_helpPageTooSlow1__
-Can I get a copy of the Database? What happens if you disappear?
+__MSG_helpPageCopyOfDatabase__
- The database is public and available at https://sponsor.ajay.app/database. The source code is freely available. So, even if something happens to me, your submissions are not lost. + __MSG_helpPageCopyOfDatabase1__ https://sponsor.ajay.app/database. __MSG_helpPageCopyOfDatabase2__
-News and how it is made
+__MSG_helpPageNews__
See https://sponsor.ajay.app/news.
-Where can I get the source code?
+__MSG_helpPageSourceCode__
Client:
@@ -107,7 +112,7 @@ -Credits
+__MSG_Credits__
Thanks to all SponsorBlock contributors, diff --git a/public/help/styles.css b/public/help/styles.css index a7b8b9fd..2e392c2e 100644 --- a/public/help/styles.css +++ b/public/help/styles.css @@ -183,4 +183,8 @@ h1,h2,h3,h4,h5,h6 { svg { text-decoration: none; +} + +#sbDonate { + font-size: 10px; } \ No newline at end of file diff --git a/public/options/options.css b/public/options/options.css index e6dd3a01..708139ab 100644 --- a/public/options/options.css +++ b/public/options/options.css @@ -364,4 +364,8 @@ svg { background: none; border: none; +} + +#sbDonate { + font-size: 10px; } \ No newline at end of file diff --git a/public/options/options.html b/public/options/options.html index 90a2e51f..540b5122 100644 --- a/public/options/options.html +++ b/public/options/options.html @@ -19,7 +19,12 @@
-
+ +
+
+
+
__MSG_createdBy__ Ajay Ramachandran 
+
+ __MSG_createdBy__
+ Ajay Ramachandran
+ (__MSG_Donate__)
+
__MSG_Options__
@@ -451,6 +456,24 @@+ +
+
+
+
+
+ +
+
+
diff --git a/src/background.ts b/src/background.ts
index 70519945..d11abb96 100644
--- a/src/background.ts
+++ b/src/background.ts
@@ -35,7 +35,7 @@ chrome.runtime.onMessage.addListener(function (request, sender, callback) {
chrome.tabs.create({url: chrome.runtime.getURL('options/options.html' + (request.hash ? '#' + request.hash : ''))});
return;
case "openHelp":
- chrome.tabs.create({url: chrome.runtime.getURL('help/index_en.html')});
+ chrome.tabs.create({url: chrome.runtime.getURL('help/index.html')});
return;
case "openPage":
chrome.tabs.create({url: chrome.runtime.getURL(request.url)});
@@ -74,12 +74,14 @@ chrome.runtime.onInstalled.addListener(function () {
// If there is no userID, then it is the first install.
if (!userID){
//open up the install page
- chrome.tabs.create({url: chrome.extension.getURL("/help/index_en.html")});
+ chrome.tabs.create({url: chrome.extension.getURL("/help/index.html")});
//generate a userID
const newUserID = utils.generateUserID();
//save this UUID
Config.config.userID = newUserID;
+
+ Config.config.highlightCategoryUpdate = false;
}
}, 1500);
});
diff --git a/src/components/CategorySkipOptionsComponent.tsx b/src/components/CategorySkipOptionsComponent.tsx
index 1095f5fe..f7baad46 100644
--- a/src/components/CategorySkipOptionsComponent.tsx
+++ b/src/components/CategorySkipOptionsComponent.tsx
@@ -151,8 +151,6 @@ class CategorySkipOptionsComponent extends React.Component
diff --git a/src/config.ts b/src/config.ts
index f6153a5e..f30dde4d 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -38,8 +38,10 @@ interface SBConfig {
refetchWhenNotFound: boolean,
ytInfoPermissionGranted: boolean,
allowExpirements: boolean,
+ showDonationLink: boolean,
autoHideInfoButton: boolean,
autoSkipOnMusicVideos: boolean,
+ highlightCategoryUpdate: boolean
// What categories should be skipped
categorySelections: CategorySelection[],
@@ -181,8 +183,10 @@ const Config: SBObject = {
refetchWhenNotFound: true,
ytInfoPermissionGranted: false,
allowExpirements: true,
+ showDonationLink: true,
autoHideInfoButton: true,
autoSkipOnMusicVideos: false,
+ highlightCategoryUpdate: false, // TODO: Remove this once update is done
categorySelections: [{
name: "sponsor" as Category,
diff --git a/src/content.ts b/src/content.ts
index 804af61d..46a1a1c5 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -15,6 +15,7 @@ import { Message, MessageResponse } from "./messageTypes";
import * as Chat from "./js-components/chat";
import { getCategoryActionType } from "./utils/categoryUtils";
import { SkipButtonControlBar } from "./js-components/skipButtonControlBar";
+import { Tooltip } from "./render/Tooltip";
// Hack to get the CSS loaded on permission-based sites (Invidious)
utils.wait(() => Config.config !== null, 5000, 10).then(addCSS);
@@ -1104,7 +1105,19 @@ function skipToTime({v, skipTime, skippingSegments, openNotice, forceAutoSkip, u
if (!autoSkip
&& skippingSegments.length === 1
&& getCategoryActionType(skippingSegments[0].category) === CategoryActionType.POI) {
- skipButtonControlBar.enable(skippingSegments[0]);
+ skipButtonControlBar.enable(skippingSegments[0], !Config.config.highlightCategoryUpdate ? 15 : 0);
+
+ if (!Config.config.highlightCategoryUpdate) {
+ new Tooltip({
+ text: chrome.i18n.getMessage("highlightNewFeature"),
+ link: "https://blog.ajay.app/highlight-sponsorblock",
+ referenceNode: skipButtonControlBar.getElement().parentElement,
+ prependElement: skipButtonControlBar.getElement(),
+ timeout: 15
+ });
+
+ Config.config.highlightCategoryUpdate = true;
+ }
activeSkipKeybindElement?.setShowKeybindHint(false);
activeSkipKeybindElement = skipButtonControlBar;
diff --git a/src/help.ts b/src/help.ts
new file mode 100644
index 00000000..80ac974a
--- /dev/null
+++ b/src/help.ts
@@ -0,0 +1,17 @@
+import Config from "./config";
+import { showDonationLink } from "./utils/configUtils";
+
+import Utils from "./utils";
+const utils = new Utils();
+
+window.addEventListener('DOMContentLoaded', init);
+
+async function init() {
+ utils.localizeHtmlPage();
+
+ await utils.wait(() => Config.config !== null);
+
+ if (!showDonationLink()) {
+ document.getElementById("sbDonate").style.display = "none";
+ }
+}
\ No newline at end of file
diff --git a/src/js-components/skipButtonControlBar.ts b/src/js-components/skipButtonControlBar.ts
index 9a8af4ec..37a5d409 100644
--- a/src/js-components/skipButtonControlBar.ts
+++ b/src/js-components/skipButtonControlBar.ts
@@ -18,6 +18,7 @@ export class SkipButtonControlBar {
showKeybindHint = true;
timeout: NodeJS.Timeout;
+ duration = 0;
skip: (segment: SponsorTime) => void;
@@ -42,6 +43,10 @@ export class SkipButtonControlBar {
this.container.addEventListener("mouseleave", () => this.startTimer());
}
+ getElement(): HTMLElement {
+ return this.container;
+ }
+
attachToPage(): void {
const leftControlsContainer = document.querySelector(".ytp-left-controls");
this.chapterText = document.querySelector(".ytp-chapter-container");
@@ -51,7 +56,8 @@ export class SkipButtonControlBar {
}
}
- enable(segment: SponsorTime): void {
+ enable(segment: SponsorTime, duration?: number): void {
+ if (duration) this.duration = duration;
this.segment = segment;
this.refreshText();
@@ -78,7 +84,7 @@ export class SkipButtonControlBar {
startTimer(): void {
this.stopTimer();
- this.timeout = setTimeout(() => this.disable(), Config.config.skipNoticeDuration * 1000);
+ this.timeout = setTimeout(() => this.disable(), Math.max(Config.config.skipNoticeDuration, this.duration) * 1000);
}
disable(): void {
diff --git a/src/options.ts b/src/options.ts
index dad0a52d..8c5c3bca 100644
--- a/src/options.ts
+++ b/src/options.ts
@@ -6,6 +6,7 @@ window.SB = Config;
import Utils from "./utils";
import CategoryChooser from "./render/CategoryChooser";
+import { showDonationLink } from "./utils/configUtils";
const utils = new Utils();
window.addEventListener('DOMContentLoaded', init);
@@ -28,6 +29,10 @@ async function init() {
await utils.wait(() => Config.config !== null);
+ if (!showDonationLink()) {
+ document.getElementById("sbDonate").style.visibility = "hidden";
+ }
+
// Set all of the toggle options to the correct option
const optionsContainer = document.getElementById("options");
const optionsElements = optionsContainer.querySelectorAll("*");
diff --git a/src/popup.ts b/src/popup.ts
index 092b7db2..0b0664c0 100644
--- a/src/popup.ts
+++ b/src/popup.ts
@@ -3,6 +3,7 @@ import Config from "./config";
import Utils from "./utils";
import { SponsorTime, SponsorHideType } from "./types";
import { Message, MessageResponse } from "./messageTypes";
+import { showDonationLink } from "./utils/configUtils";
const utils = new Utils();
interface MessageListener {
@@ -12,7 +13,7 @@ interface MessageListener {
class MessageHandler {
messageListener: MessageListener;
- constructor (messageListener?: MessageListener) {
+ constructor(messageListener?: MessageListener) {
this.messageListener = messageListener;
}
@@ -107,14 +108,14 @@ async function runThePopup(messageListener?: MessageListener): Promise {
"sbDonate"
].forEach(id => PageElements[id] = document.getElementById(id));
- // Hide donate button on safari
- if (navigator.vendor === "Apple Computer, Inc.") {
+ // Hide donate button if wanted (Safari, or user choice)
+ if (!showDonationLink()) {
PageElements.sbDonate.style.display = "none";
}
//setup click listeners
PageElements.sponsorStart.addEventListener("click", sendSponsorStartMessage);
- PageElements.whitelistToggle.addEventListener("change", function() {
+ PageElements.whitelistToggle.addEventListener("change", function () {
if (this.checked) {
whitelistChannel();
} else {
@@ -122,7 +123,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}
});
PageElements.whitelistForceCheck.addEventListener("click", openOptions);
- PageElements.toggleSwitch.addEventListener("change", function() {
+ PageElements.toggleSwitch.addEventListener("change", function () {
toggleSkipping(!this.checked);
});
PageElements.submitTimes.addEventListener("click", submitTimes);
@@ -174,7 +175,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
if (userID != undefined) {
//there are probably some views on these submissions then
//get the amount of views from the sponsors submitted
- utils.sendRequestToServer("GET", "/api/getViewsForUser?userID=" + userID, function(response) {
+ utils.sendRequestToServer("GET", "/api/getViewsForUser?userID=" + userID, function (response) {
if (response.status == 200) {
const viewCount = JSON.parse(response.responseText).viewCount;
if (viewCount != 0) {
@@ -191,7 +192,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
});
//get this time in minutes
- utils.sendRequestToServer("GET", "/api/getSavedTimeForUser?userID=" + userID, function(response) {
+ utils.sendRequestToServer("GET", "/api/getSavedTimeForUser?userID=" + userID, function (response) {
if (response.status == 200) {
const minutesSaved = JSON.parse(response.responseText).timeSaved;
if (minutesSaved != 0) {
@@ -237,7 +238,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
getSegmentsFromContentScript(false);
function onTabs(tabs, updating: boolean): void {
- messageHandler.sendMessage(tabs[0].id, {message: 'getVideoID'}, function(result) {
+ messageHandler.sendMessage(tabs[0].id, { message: 'getVideoID' }, function (result) {
if (result !== undefined && result.videoID) {
currentVideoID = result.videoID;
creatingSegment = result.creatingSegment;
@@ -262,7 +263,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'isInfoFound', updating},
+ { message: 'isInfoFound', updating },
infoFound
);
}
@@ -274,8 +275,8 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, (tabs) => onTabs(tabs, updating));
}
- function infoFound(request: {found: boolean, sponsorTimes: SponsorTime[]}) {
- if(chrome.runtime.lastError) {
+ function infoFound(request: { found: boolean, sponsorTimes: SponsorTime[] }) {
+ if (chrome.runtime.lastError) {
//This page doesn't have the injected content script, or at least not yet
displayNoVideo();
return;
@@ -306,8 +307,8 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'isChannelWhitelisted'},
- function(response) {
+ { message: 'isChannelWhitelisted' },
+ function (response) {
if (response.value) {
PageElements.whitelistChannel.style.display = "none";
PageElements.unwhitelistChannel.style.display = "unset";
@@ -315,7 +316,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
document.querySelectorAll('.SBWhitelistIcon')[0].classList.add("rotated");
}
});
- }
+ }
);
}
@@ -327,7 +328,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, (tabs) => {
messageHandler.sendMessage(
tabs[0].id,
- {from: 'popup', message: 'sponsorStart'},
+ { from: 'popup', message: 'sponsorStart' },
async (response) => {
startSponsorCallback(response);
@@ -351,7 +352,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
});
}
- function startSponsorCallback(response: {creatingSegment: boolean}) {
+ function startSponsorCallback(response: { creatingSegment: boolean }) {
creatingSegment = response.creatingSegment;
// Only update the segments after a segment was created
@@ -364,12 +365,12 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}
//display the video times from the array at the top, in a different section
- function displayDownloadedSponsorTimes(request: {found: boolean, sponsorTimes: SponsorTime[]}) {
+ function displayDownloadedSponsorTimes(request: { found: boolean, sponsorTimes: SponsorTime[] }) {
if (request.sponsorTimes != undefined) {
// Sort list by start time
const segmentTimes = request.sponsorTimes
- .sort((a, b) => a.segment[1] - b.segment[1])
- .sort((a, b) => a.segment[0] - b.segment[0]);
+ .sort((a, b) => a.segment[1] - b.segment[1])
+ .sort((a, b) => a.segment[0] - b.segment[0]);
//add them as buttons to the issue reporting container
const container = document.getElementById("issueReporterTimeButtons");
@@ -388,7 +389,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
categoryColorCircle.style.backgroundColor = Config.config.barTypes[segmentTimes[i].category]?.color;
categoryColorCircle.classList.add("dot");
categoryColorCircle.classList.add("sponsorTimesCategoryColorCircle");
-
+
let extraInfo = "";
if (segmentTimes[i].hidden === SponsorHideType.Downvoted) {
//this one is downvoted
@@ -397,7 +398,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
//this one is too short
extraInfo = " (" + chrome.i18n.getMessage("hiddenDueToDuration") + ")";
}
-
+
const textNode = document.createTextNode(utils.shortCategoryName(segmentTimes[i].category) + extraInfo);
const segmentTimeFromToNode = document.createElement("div");
segmentTimeFromToNode.innerText = utils.getFormattedTime(segmentTimes[i].segment[0], true) + " " + chrome.i18n.getMessage("to") + " " + utils.getFormattedTime(segmentTimes[i].segment[1], true);
@@ -446,7 +447,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
voteButtonsContainer.appendChild(uuidButton);
//add click listener to open up vote panel
- sponsorTimeButton.addEventListener("click", function() {
+ sponsorTimeButton.addEventListener("click", function () {
voteButtonsContainer.classList.toggle("voteButtonsContainer--hide");
});
@@ -478,15 +479,15 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'submitTimes'},
+ { message: 'submitTimes' },
);
});
}
}
-
+
function showNoticeAgain() {
Config.config.dontShowNotice = false;
-
+
PageElements.showNoticeAgain.style.display = "none";
}
@@ -499,11 +500,11 @@ async function runThePopup(messageListener?: MessageListener): Promise {
//make the options div visible
function openOptions() {
- chrome.runtime.sendMessage({"message": "openConfig"});
+ chrome.runtime.sendMessage({ "message": "openConfig" });
}
function openHelp() {
- chrome.runtime.sendMessage({"message": "openHelp"});
+ chrome.runtime.sendMessage({ "message": "openHelp" });
}
//make the options username setting option visible
@@ -516,7 +517,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
PageElements.setUsernameContainer.style.display = "none";
PageElements.setUsername.style.display = "flex";
PageElements.setUsername.classList.add("SBExpanded");
-
+
PageElements.setUsernameStatusContainer.style.display = "none";
PageElements.sponsorTimesContributionsContainer.classList.add("hidden");
@@ -555,18 +556,18 @@ async function runThePopup(messageListener?: MessageListener): Promise {
function displayNoVideo() {
document.getElementById("loadingIndicator").innerText = chrome.i18n.getMessage("noVideoID");
}
-
+
function addVoteMessage(message, UUID) {
const voteButtonsContainer = document.getElementById("sponsorTimesVoteButtonsContainer" + UUID);
voteButtonsContainer.style.display = "none";
const voteStatusContainer = document.getElementById("sponsorTimesVoteStatusContainer" + UUID);
voteStatusContainer.style.removeProperty("display");
-
+
const thanksForVotingText = document.getElementById("sponsorTimesThanksForVotingText" + UUID);
thanksForVotingText.innerText = message;
}
-
+
function vote(type, UUID) {
//add loading info
addVoteMessage(chrome.i18n.getMessage("Loading"), UUID);
@@ -597,8 +598,8 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'getChannelID'},
- function(response) {
+ { message: 'getChannelID' },
+ function (response) {
if (!response.channelID) {
alert(chrome.i18n.getMessage("channelDataNotFound") + " https://github.com/ajayyy/SponsorBlock/issues/753");
return;
@@ -630,10 +631,10 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id, {
- message: 'whitelistChange',
- value: true
- });
- }
+ message: 'whitelistChange',
+ value: true
+ });
+ }
);
}
);
@@ -648,38 +649,38 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'getChannelID'},
- function(response) {
+ { message: 'getChannelID' },
+ function (response) {
//get whitelisted channels
- let whitelistedChannels = Config.config.whitelistedChannels;
- if (whitelistedChannels == undefined) {
- whitelistedChannels = [];
- }
+ let whitelistedChannels = Config.config.whitelistedChannels;
+ if (whitelistedChannels == undefined) {
+ whitelistedChannels = [];
+ }
- //remove this channel
- const index = whitelistedChannels.indexOf(response.channelID);
- whitelistedChannels.splice(index, 1);
+ //remove this channel
+ const index = whitelistedChannels.indexOf(response.channelID);
+ whitelistedChannels.splice(index, 1);
- //change button
- PageElements.whitelistChannel.style.display = "unset";
- PageElements.unwhitelistChannel.style.display = "none";
- document.querySelectorAll('.SBWhitelistIcon')[0].classList.remove("rotated");
+ //change button
+ PageElements.whitelistChannel.style.display = "unset";
+ PageElements.unwhitelistChannel.style.display = "none";
+ document.querySelectorAll('.SBWhitelistIcon')[0].classList.remove("rotated");
- //save this
- Config.config.whitelistedChannels = whitelistedChannels;
+ //save this
+ Config.config.whitelistedChannels = whitelistedChannels;
- //send a message to the client
- messageHandler.query({
- active: true,
- currentWindow: true
- }, tabs => {
- messageHandler.sendMessage(
- tabs[0].id, {
- message: 'whitelistChange',
- value: false
- });
- }
- );
+ //send a message to the client
+ messageHandler.query({
+ active: true,
+ currentWindow: true
+ }, tabs => {
+ messageHandler.sendMessage(
+ tabs[0].id, {
+ message: 'whitelistChange',
+ value: false
+ });
+ }
+ );
}
);
});
@@ -694,12 +695,13 @@ async function runThePopup(messageListener?: MessageListener): Promise {
}, tabs => {
messageHandler.sendMessage(
tabs[0].id,
- {message: 'refreshSegments'},
+ { message: 'refreshSegments' },
(response) => {
infoFound(response);
stopAnimation();
}
- )}
+ )
+ }
);
}
@@ -707,7 +709,7 @@ async function runThePopup(messageListener?: MessageListener): Promise {
* Should skipping be disabled (visuals stay)
*/
function toggleSkipping(disabled) {
- Config.config.disableSkipping = disabled;
+ Config.config.disableSkipping = disabled;
let hiddenButton = PageElements.disableSkipping;
let shownButton = PageElements.enableSkipping;
@@ -728,13 +730,13 @@ async function runThePopup(messageListener?: MessageListener): Promise {
* @param {float} seconds
* @returns {string}
*/
- function getFormattedHours(minutes) {
- minutes = Math.round(minutes * 10) / 10
- const hours = Math.floor(minutes / 60);
- return (hours > 0 ? hours + "h " : "") + (minutes % 60).toFixed(1);
- }
-
-//end of function
+ function getFormattedHours(minutes) {
+ minutes = Math.round(minutes * 10) / 10
+ const hours = Math.floor(minutes / 60);
+ return (hours > 0 ? hours + "h " : "") + (minutes % 60).toFixed(1);
+ }
+
+ //end of function
}
if (chrome.tabs != undefined) {
diff --git a/src/render/Tooltip.tsx b/src/render/Tooltip.tsx
new file mode 100644
index 00000000..7bb2e1f3
--- /dev/null
+++ b/src/render/Tooltip.tsx
@@ -0,0 +1,73 @@
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+
+export interface TooltipProps {
+ text: string,
+ link?: string,
+ referenceNode: HTMLElement,
+ prependElement?: HTMLElement, // Element to append before
+ bottomOffset?: string
+ timeout?: number;
+}
+
+export class Tooltip {
+ text: string;
+ container: HTMLDivElement;
+
+ timer: NodeJS.Timeout;
+
+ constructor(props: TooltipProps) {
+ props.bottomOffset ??= "70px";
+ this.text = props.text;
+
+ this.container = document.createElement('div');
+ this.container.id = "sponsorTooltip" + props.text;
+ this.container.style.display = "relative";
+
+ if (props.prependElement) {
+ props.referenceNode.insertBefore(this.container, props.prependElement);
+ } else {
+ props.referenceNode.appendChild(this.container);
+ }
+
+ if (props.timeout) {
+ this.timer = setTimeout(() => this.close(), props.timeout * 1000);
+ }
+
+ ReactDOM.render(
+
+
,
+ this.container
+ )
+ }
+
+ close(): void {
+ ReactDOM.unmountComponentAtNode(this.container);
+ this.container.remove();
+
+ if (this.timer) clearTimeout(this.timer);
+ }
+}
\ No newline at end of file
diff --git a/src/utils.ts b/src/utils.ts
index a40dd5f9..983c1c1b 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -261,7 +261,6 @@ export default class Utils {
const objects = document.getElementsByClassName("sponsorBlockPageBody")[0].children;
for (let j = 0; j < objects.length; j++) {
const obj = objects[j];
-
const localizedMessage = this.getLocalizedMessage(obj.innerHTML.toString());
if (localizedMessage) obj.innerHTML = localizedMessage;
}
diff --git a/src/utils/configUtils.ts b/src/utils/configUtils.ts
new file mode 100644
index 00000000..8aec5208
--- /dev/null
+++ b/src/utils/configUtils.ts
@@ -0,0 +1,5 @@
+import Config from "../config";
+
+export function showDonationLink(): boolean {
+ return navigator.vendor !== "Apple Computer, Inc." && Config.config.showDonationLink;
+}
\ No newline at end of file
diff --git a/webpack/webpack.common.js b/webpack/webpack.common.js
index 1d130af0..ccc1c82c 100644
--- a/webpack/webpack.common.js
+++ b/webpack/webpack.common.js
@@ -10,6 +10,7 @@ module.exports = env => ({
background: path.join(__dirname, srcDir + 'background.ts'),
content: path.join(__dirname, srcDir + 'content.ts'),
options: path.join(__dirname, srcDir + 'options.ts'),
+ help: path.join(__dirname, srcDir + 'help.ts'),
permissions: path.join(__dirname, srcDir + 'permissions.ts')
},
output: {
+ ![]({chrome.extension.getURL("icons/IconSponsorBlocker256px.png")})
+
+
+ {this.text + (props.link ? ". " : "")}
+ {props.link ?
+
+ {chrome.i18n.getMessage("LearnMore")}
+
+ : null}
+
+
+
+
+
+
+ {this.text + (props.link ? ". " : "")}
+ {props.link ?
+
+ {chrome.i18n.getMessage("LearnMore")}
+
+ : null}
+
+