diff --git a/background.js b/background.js index 55729fff..96e5a309 100644 --- a/background.js +++ b/background.js @@ -57,6 +57,19 @@ chrome.runtime.onMessage.addListener(function (request, sender, callback) { } }); +//add help page on install +chrome.runtime.onInstalled.addListener(function (object) { + chrome.storage.sync.get(["shownInstallPage"], function(result) { + let shownInstallPage = result.shownInstallPage; + if (shownInstallPage == undefined || !shownInstallPage) { + //open up the install page + chrome.tabs.create({url: chrome.extension.getURL("/help/index.html")}); + + //save that this happened + chrome.storage.sync.set({shownInstallPage: true}); + } + }); +}); //gets the sponsor times from memory function getSponsorTimes(videoID, callback) { diff --git a/firefox_manifest.json b/firefox_manifest.json index 3948c08a..e503a8e8 100644 --- a/firefox_manifest.json +++ b/firefox_manifest.json @@ -31,7 +31,9 @@ "icons/downvote.png", "icons/PlayerInfoIconSponsorBlocker256px.png", "icons/PlayerDeleteIconSponsorBlocker256px.png", - "popup.html" + "popup.html", + "help/index.html", + "help/style.css" ], "permissions": [ "tabs", diff --git a/help/index.html b/help/index.html new file mode 100644 index 00000000..28a2be0b --- /dev/null +++ b/help/index.html @@ -0,0 +1,122 @@ + + SponsorBlock + + + + + + +
+ + SponsorBlock +
+ +
+ +

Created By Ajay Ramachandran

+ +

+ Thanks for installing SponsorBlock. Here are some quick tips for getting started. Please join the Discord if you have any questions or suggestions. +

+ +

+ + + + + Come contribute, make some suggestions and help out in the Discord: https://discord.gg/QnmVMpU +

+ +

How skipping works

+ +

+ + + + + Videos 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. + +
+
+ Whenever you skip a video, you will get a notice allowing you to vote on that submission. If it worked, upvote it! You can also vote in the popup. +

+ +
+ +

Submitting

+ +

+ + + + + Submitting can either be done in the popup by hitting the "Sponsorship Starts Now" button or in the video player with the buttons on the player. + +
+
+ + Clicking the play button indicated the start of a sponsorship section 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. +

+ +

Editing

+ +

+ + + + + If you messed up, you can edit or delete your sponsor times in the popup or in the info menu (by hitting the info icon). + +

+ +

This is too slow

+ +

+ There are hotkeys if you want to use them. You must be focused on the YouTube player to use them. Press the semicolon key to indicate the start/end of a sponsor segment and click the appostrophe to submit. +

+ +

I hate these buttons, they are so ugly

+ +

+ All player buttons can be hidden in the options. +

+ +

Can I get a copy of the Database? What happens if you disappear?

+ +

+ The database is public and available at https://sponsor.ajay.app/database.db. The source code is freely available. So, even if something happens to me, your submissions are not lost. +

+ +

News and how it is made

+ +

+ See https://sponsor.ajay.app/news. +

+ +

I want more features!

+ +

+ Ask on Discord or make an Issue on GitHub. I am happy to hear suggestions or improvements you want. You may also contribute code or graphics if you would like. +

+ +

Where can I get the source code

+ +

Client:

+ + + +

Server:

+ + + +

Credit

+ +

The awesome Invidious API is used to grab the time the video was published.

+ +

Some icons made by Gregor Cresnar from www.flaticon.com and are licensed by CC 3.0 BY

+ +

Some icons made by Freepik from www.flaticon.com is licensed by CC 3.0 BY

+ +
+ + \ No newline at end of file diff --git a/help/styles.css b/help/styles.css new file mode 100644 index 00000000..338f1810 --- /dev/null +++ b/help/styles.css @@ -0,0 +1,176 @@ +:not(.hljs-keyword):not(.hljs-comment):not(.hljs-number):not(.hljs-string):not(pre):not(code) { + background-color: #333333; +} + +.projectPreview { + position: relative; +} + +.projectPreviewImage { + position: absolute; + left: -90; + width: 80; + top: 50%; + transform: translateY(-50%); +} + +.projectPreviewImageLarge { + position: absolute; + left: -210; + width: 200; + top: 50%; + transform: translateY(-20%); +} + +.projectPreviewImageLargeRight { + position: absolute; + right: -210; + width: 200; + top: 50%; + transform: translateY(-50%); +} + +.createdBy { + font-size: 14px; + text-align: center; + padding-top: 0px; + padding-bottom: 0px; +} + +#title { + background-color: #636363; + + text-align: center; + vertical-align: middle; + + font-family: sans-serif; + font-size: 50; + color: #212121; + + /* height: 100; */ + + padding: 20; + + text-decoration: none; + + transition: font-size 1s; +} + +#title:hover { + font-size: 60; + + transition: font-size 1s; +} + +.subtitle { + font-family: sans-serif; + font-size: 40; + color: #dad8d8; + + padding-top: 10; + + transition: font-size 0.4s; +} + +.subtitle:hover { + font-size: 45; + + transition: font-size 0.4s; +} + +.profilepic { + background-color: #636363 !important; + vertical-align: middle; +} + +a { + text-decoration: underline; + color: inherit; +} + +.link { + padding: 20; + + height: 80px; + + transition: height 0.2s; +} + +.link:hover { + height: 95px; + + transition: height 0.2s; +} + +#contact,.smalllink { + font-family: sans-serif; + font-size: 25; + color: #e8e8e8; + + text-align: center; + + padding: 10; +} + +#contact { + text-decoration: none; +} + +p,li { + font-family: sans-serif; + font-size: 20; + color: #c4c4c4; + + padding: 10; +} + +p,li,code,a { + max-width: 60%; + text-align: left; + overflow-wrap: break-word; +} + +@media screen and (orientation:portrait) { + p,li,code,a { + max-width: 100%; + } + + .projectPreviewImage { + position: unset; + width: 130; + display: block; + margin: auto; + transform: none; + } +} + +.previewImage { + max-height: 200px; +} + +img { + max-width: 100%; + + text-align: center; +} + +#recentPostTitle { + font-family: sans-serif; + font-size: 30; + color: #dad8d8; +} + +#recentPostDate { + font-family: sans-serif; + font-size: 15; + color: #dad8d8; +} + +h1,h2,h3,h4,h5,h6 { + font-family: sans-serif; + color: #dad8d8; +} + +svg { + text-decoration: none; +} \ No newline at end of file diff --git a/manifest.json b/manifest.json index 8c43cd9d..60a434a7 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "SponsorBlock for YouTube - Skip Sponsorships", "short_name": "SponsorBlock", - "version": "1.0.22", + "version": "1.0.23", "description": "Skip over sponsorship on YouTube videos. Report sponsors on videos you watch to save the time of others.", "content_scripts": [ { @@ -31,7 +31,9 @@ "icons/downvote.png", "icons/PlayerInfoIconSponsorBlocker256px.png", "icons/PlayerDeleteIconSponsorBlocker256px.png", - "popup.html" + "popup.html", + "help/index.html", + "help/style.css" ], "permissions": [ "tabs",