blade/materialious
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added sponsorskipping

Browse Source
This commit is contained in:
WardPearce
2024-03-09 23:57:10 +13:00
parent d2d996cb3d
commit 6d1ac04be0
7 changed files with 189 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
materialious/package-lock.json
Generated
+99
View File
@@ -13,6 +13,7 @@
"eventsource": "^2.0.2",
"human-number": "^2.0.4",
"plyr": "^3.7.8",
"sponsorblock-api": "^0.2.4",
"svelte-persisted-store": "^0.9.1"
},
"devDependencies": {
@@ -1353,6 +1354,21 @@
"node": ">=8"
}
},
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
},
"node_modules/axios": {
"version": "1.6.7",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.6.7.tgz",
"integrity": "sha512-/hDJGff6/c7u0hDkvkGxR/oy6CbCs8ziCsC7SqmhjfozqiJGc8Z11wrv9z9lYfY4K8l+H9TpjcMDX0xOZmx+RA==",
"dependencies": {
"follow-redirects": "^1.15.4",
"form-data": "^4.0.0",
"proxy-from-env": "^1.1.0"
}
},
"node_modules/axobject-query": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.0.0.tgz",
@@ -1506,6 +1522,17 @@
"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
"dev": true
},
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"dependencies": {
"delayed-stream": "~1.0.0"
},
"engines": {
"node": ">= 0.8"
}
},
"node_modules/concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -1611,6 +1638,14 @@
"node": ">=0.10.0"
}
},
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/dequal": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
@@ -2090,6 +2125,38 @@
"integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
"dev": true
},
"node_modules/follow-redirects": {
"version": "1.15.5",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.5.tgz",
"integrity": "sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==",
"funding": [
{
"type": "individual",
"url": "https://github.com/sponsors/RubenVerborgh"
}
],
"engines": {
"node": ">=4.0"
},
"peerDependenciesMeta": {
"debug": {
"optional": true
}
}
},
"node_modules/form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/fs.realpath": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -2536,6 +2603,25 @@
"node": ">=8.6"
}
},
"node_modules/mime-db": {
"version": "1.52.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"engines": {
"node": ">= 0.6"
}
},
"node_modules/mime-types": {
"version": "2.1.35",
"resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"dependencies": {
"mime-db": "1.52.0"
},
"engines": {
"node": ">= 0.6"
}
},
"node_modules/min-indent": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
@@ -2925,6 +3011,11 @@
"svelte": "^3.2.0 || ^4.0.0-next.0 || ^5.0.0-next.0"
}
},
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/punycode": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
@@ -3195,6 +3286,14 @@
"node": ">=0.10.0"
}
},
"node_modules/sponsorblock-api": {
"version": "0.2.4",
"resolved": "https://registry.npmjs.org/sponsorblock-api/-/sponsorblock-api-0.2.4.tgz",
"integrity": "sha512-f0pQ86rOdCoOaJZnflL1VvtjOUEiGtYCkE+BwQIJBTNbQw6ToU/1jksIhBlj3VJ4pt0D74vaPrTuw1vzQnuQzg==",
"dependencies": {
"axios": "^1.4.0"
}
},
"node_modules/strip-ansi": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
materialious/package.json
+1
View File
@@ -38,6 +38,7 @@
"eventsource": "^2.0.2",
"human-number": "^2.0.4",
"plyr": "^3.7.8",
"sponsorblock-api": "^0.2.4",
"svelte-persisted-store": "^0.9.1"
}
}
materialious/src/lib/Api/index.ts
+1 -1
View File
@@ -52,4 +52,4 @@ export async function getSearch(search: string, options: {
path.search = new URLSearchParams({ ...options, q: search }).toString();
const resp = await fetch(path);
return await resp.json();
}
}
materialious/src/lib/Api/model.ts
+1 -1
View File
@@ -154,4 +154,4 @@ export interface Channel {
export interface SearchSuggestion {
query: string;
suggestions: string[];
}
}
materialious/src/lib/Player.svelte
+39 -1
View File
@@ -1,6 +1,7 @@
<script lang="ts">
import Plyr, { type PlyrEvent } from 'plyr';
import 'plyr/dist/plyr.css';
import { SponsorBlock, type Category } from 'sponsorblock-api';
import { onDestroy, onMount } from 'svelte';
import { get } from 'svelte/store';
@@ -8,17 +9,46 @@
invidiousInstance,
playerAlwaysLoop,
playerAutoPlay,
playerSavePlaybackPosition
playerSavePlaybackPosition,
sponsorBlockCategories
} from '../store';
import type { VideoPlay } from './Api/model';
export let data: { video: VideoPlay };
let categoryBeingSkipped = 'sponsorblock-alert';
let player: Plyr | undefined;
let sponsorBlock: SponsorBlock | undefined;
onMount(async () => {
const playerPos = localStorage.getItem(data.video.videoId);
player = new Plyr('#player');
const currentCategories = get(sponsorBlockCategories);
if (currentCategories.length > 0) {
sponsorBlock = new SponsorBlock('');
const segments = await sponsorBlock.getSegments(
data.video.videoId,
get(sponsorBlockCategories) as Category[]
);
player.on('timeupdate', (event: PlyrEvent) => {
segments.forEach((segment) => {
if (
event.detail.plyr.currentTime >= segment.startTime &&
event.detail.plyr.currentTime <= segment.endTime
) {
categoryBeingSkipped = segment.category;
event.detail.plyr.currentTime = segment.endTime + 1;
ui('#sponsorblock-alert');
}
});
});
}
player.on('loadeddata', (event: PlyrEvent) => {
if (get(playerSavePlaybackPosition) && playerPos) {
event.detail.plyr.currentTime = Number(playerPos);
@@ -58,8 +88,16 @@
}
player = undefined;
sponsorBlock = undefined;
document.getElementsByClassName('plyr')[0]?.remove();
});
</script>
<div class="snackbar" id="sponsorblock-alert">
<span
>Skipping <span class="bold" style="text-transform: capitalize;">{categoryBeingSkipped}</span
></span
>
</div>
<video width="100%" id="player" playsinline controls> </video>
materialious/src/routes/+layout.svelte
+45
View File
@@ -17,6 +17,7 @@
playerListenByDefault,
playerProxyVideos,
playerSavePlaybackPosition,
sponsorBlockCategories,
themeColor
} from '../store';
@@ -40,6 +41,9 @@
let searchSuggestions = false;
interfaceSearchSuggestions.subscribe((value) => (searchSuggestions = value));
let sponsorCategoriesList: string[] = [];
sponsorBlockCategories.subscribe((value) => (sponsorCategoriesList = value));
let search = '';
let suggestionsForSearch: string[] = [];
@@ -91,6 +95,25 @@
}
];
const sponsorCategories = [
{ name: 'Sponsor', category: 'sponsor' },
{ name: 'Unpaid/Self Promotion', category: 'selfpromo' },
{ name: 'Interaction Reminder (Subscribe)', category: 'interaction' },
{ name: 'Intermission/Intro Animation', category: 'intro' },
{ name: 'Endcards/Credits', category: 'outro' },
{ name: 'Preview/Recap/Hook', category: 'preview' },
{ name: 'Filler Tangent/Jokes', category: 'filler' }
];
function toggleSponsor(category: string) {
if (sponsorCategoriesList.includes(category)) {
sponsorBlockCategories.set(sponsorCategoriesList.filter((value) => value !== category));
} else {
sponsorCategoriesList.push(category);
sponsorBlockCategories.set(sponsorCategoriesList);
}
}
async function setColor(color: any) {
const target = color.target;
const hex = (target as { value: string }).value;
@@ -370,6 +393,28 @@
</nav>
</div>
</div>
<div class="settings">
<h6>Sponsorblock</h6>
{#each sponsorCategories as sponsor}
<div class="field middle-align no-margin">
<nav class="no-padding">
<div class="max">
<p>{sponsor.name}</p>
</div>
<label class="switch">
<input
type="checkbox"
checked={sponsorCategoriesList.includes(sponsor.category)}
on:click={() => toggleSponsor(sponsor.category)}
/>
<span></span>
</label>
</nav>
</div>
{/each}
</div>
</dialog>
<dialog class="right" id="dialog-notifications">
materialious/src/store.ts
+3 -1
View File
@@ -17,4 +17,6 @@ export const playerDash = persisted("dash", true);
export const interfaceSearchSuggestions = persisted("searchSuggestions", true);
export const auth: Writable<null | { username: string, token: string; }> = persisted("authToken", null);
export const auth: Writable<null | { username: string, token: string; }> = persisted("authToken", null);
export const sponsorBlockCategories: Writable<string[]> = persisted("sponsorBlockCategories", []);