From de6fd0a925139932d7fd5379ee7851b9b2c7115d Mon Sep 17 00:00:00 2001 From: WardPearce Date: Fri, 24 Jan 2025 13:26:58 +1300 Subject: [PATCH 1/8] Fixes to StatusBar and NavigationBar logic --- materialious/android/app/build.gradle | 4 ++-- materialious/electron/package.json | 2 +- materialious/package.json | 2 +- materialious/src/lib/Player.svelte | 7 ++++++- materialious/src/lib/theme.ts | 3 +++ materialious/src/routes/(app)/+layout.svelte | 7 +++++-- update_versions.py | 2 +- 7 files changed, 19 insertions(+), 8 deletions(-) diff --git a/materialious/android/app/build.gradle b/materialious/android/app/build.gradle index c128c36c..55e505f3 100644 --- a/materialious/android/app/build.gradle +++ b/materialious/android/app/build.gradle @@ -7,8 +7,8 @@ android { applicationId "us.materialio.app" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion - versionCode 80 - versionName "1.6.29" + versionCode 81 + versionName "1.6.30" testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner" aaptOptions { // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps. diff --git a/materialious/electron/package.json b/materialious/electron/package.json index 99541ed0..8fee234d 100644 --- a/materialious/electron/package.json +++ b/materialious/electron/package.json @@ -1,6 +1,6 @@ { "name": "Materialious", - "version": "1.6.29", + "version": "1.6.30", "description": "Modern material design for Invidious.", "author": { "name": "Ward Pearce", diff --git a/materialious/package.json b/materialious/package.json index c99fd238..303f0dbe 100644 --- a/materialious/package.json +++ b/materialious/package.json @@ -1,6 +1,6 @@ { "name": "materialious", - "version": "1.6.29", + "version": "1.6.30", "private": true, "scripts": { "dev": "vite dev", diff --git a/materialious/src/lib/Player.svelte b/materialious/src/lib/Player.svelte index 47409705..c94e16bb 100644 --- a/materialious/src/lib/Player.svelte +++ b/materialious/src/lib/Player.svelte @@ -4,7 +4,8 @@ import { page } from '$app/stores'; import { Capacitor } from '@capacitor/core'; import { ScreenOrientation, type ScreenOrientationResult } from '@capacitor/screen-orientation'; - import { StatusBar } from '@capacitor/status-bar'; + import { StatusBar, Style } from '@capacitor/status-bar'; + import { NavigationBar } from '@hugotomazi/capacitor-navigation-bar'; import { AudioPlayer } from '@mediagrid/capacitor-native-audio'; import type { Page } from '@sveltejs/kit'; import { SponsorBlock, type Category, type Segment } from 'sponsorblock-api'; @@ -434,6 +435,10 @@ if (event.detail) { // Ensure bar color is black while in fullscreen await StatusBar.setBackgroundColor({ color: '#000000' }); + await NavigationBar.setColor({ + color: '#000000' + }); + await StatusBar.setStyle({ style: Style.Dark }); } else { await setStatusBarColor(); } diff --git a/materialious/src/lib/theme.ts b/materialious/src/lib/theme.ts index 4cf28eae..e9f4401f 100644 --- a/materialious/src/lib/theme.ts +++ b/materialious/src/lib/theme.ts @@ -2,6 +2,7 @@ import { Capacitor } from '@capacitor/core'; import { StatusBar, Style } from '@capacitor/status-bar'; import { NavigationBar } from '@hugotomazi/capacitor-navigation-bar'; import ui from 'beercss'; +import { tick } from 'svelte'; import { get } from 'svelte/store'; import { darkModeStore, interfaceAmoledTheme } from './store'; @@ -20,6 +21,8 @@ export async function getDynamicTheme(mode?: string): Promise { + interfaceAmoledTheme.subscribe(async () => { setAmoledTheme(); + + await setStatusBarColor(); }); darkModeStore.subscribe(async () => { @@ -176,11 +178,12 @@ const colorPalette = await colorTheme.getColorPalette(); themeHex = convertToHexColorCode(colorPalette.primary); await ui('theme', themeHex); - await setStatusBarColor(); } catch {} } } + await setStatusBarColor(); + setTheme(); setAmoledTheme(); diff --git a/update_versions.py b/update_versions.py index 7da0ec99..83e6e2a9 100644 --- a/update_versions.py +++ b/update_versions.py @@ -5,7 +5,7 @@ import json import os import re -LATEST_VERSION = "1.6.29" +LATEST_VERSION = "1.6.30" WORKING_DIR = os.path.join(os.path.dirname(os.path.realpath(__file__)), "materialious") ROOT_PACKAGE = os.path.join(WORKING_DIR, "package.json") From bc64e651bc32eb76643e2bdec1012d83559d5389 Mon Sep 17 00:00:00 2001 From: WardPearce Date: Fri, 24 Jan 2025 15:10:39 +1300 Subject: [PATCH 2/8] Removed ffmpeg downloading completely --- README.md | 13 +- materialious/package-lock.json | 34 +--- materialious/package.json | 4 +- materialious/src/lib/videoDownload.ts | 178 ------------------ materialious/src/routes/(app)/+layout.svelte | 4 +- .../routes/(app)/watch/[slug]/+page.svelte | 72 ------- .../src/routes/(app)/watch/[slug]/+page.ts | 11 -- materialious/static/ffmpeg/ffmpeg-core.js | 16 -- materialious/static/ffmpeg/ffmpeg-core.wasm | Bin 32609891 -> 0 bytes .../static/ffmpeg/ffmpeg-core.worker.js | 1 - materialious/static/ffmpeg/ffmpeg-worker.js | 146 -------------- 11 files changed, 12 insertions(+), 467 deletions(-) delete mode 100644 materialious/src/lib/videoDownload.ts delete mode 100644 materialious/static/ffmpeg/ffmpeg-core.js delete mode 100644 materialious/static/ffmpeg/ffmpeg-core.wasm delete mode 100644 materialious/static/ffmpeg/ffmpeg-core.worker.js delete mode 100644 materialious/static/ffmpeg/ffmpeg-worker.js diff --git a/README.md b/README.md index 41baea99..8ab474c1 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,6 @@ - Watch sync parties! - Mini player. - Silence skipper (Experimental.) -- ffmpeg integration for downloading videos with audio at any quality ([Configuration required](./docs/DOCKER.md#step-7-optional-enabling-downloads)). - [YouTube.js](https://github.com/LuanRT/YouTube.js) fallback if Invidious fails loading videos for Desktop & Android. - Preview video on hover. - Sponsorblock built-in. @@ -48,11 +47,13 @@ - YT path redirects (So your redirect plugins should still work!) # Support table -| | Dash | HLS | Local video fallback | API-Extended | ffmpeg download merging | Dearrow | RYD | -|---------|------|-----|----------------------|--------------|-------------------------|---------|-----| -| Web | ✅ | ✅ | ❌ | ✅ | ✅ | ✅ | ✅ | -| Desktop | ✅ | ✅ | ✅ | ✅ | ❌ | ✅ | ✅ | -| Android | ✅ | ✅ | ✅ | ✅ | ❌ | ✅ | ✅ | +Here’s the updated table with the "ffmpeg download merging" column completely removed: + +| | Dash | HLS | Local video fallback | API-Extended | Dearrow | RYD | +|---------|------|-----|----------------------|--------------|---------|-----| +| Web | ✅ | ✅ | ❌ | ✅ | ✅ | ✅ | +| Desktop | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | +| Android | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | # Public instances [Public instances are listed here](./docs/INSTANCES.md). diff --git a/materialious/package-lock.json b/materialious/package-lock.json index ba7b7c2d..a025e44a 100644 --- a/materialious/package-lock.json +++ b/materialious/package-lock.json @@ -1,12 +1,12 @@ { "name": "materialious", - "version": "1.6.28", + "version": "1.6.30", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "materialious", - "version": "1.6.28", + "version": "1.6.30", "dependencies": { "@capacitor-community/electron": "^5.0.1", "@capacitor/android": "^6.1.2", @@ -18,7 +18,6 @@ "@capacitor/screen-orientation": "^6.0.2", "@capacitor/status-bar": "^6.0.1", "@capgo/inappbrowser": "^6.6.8", - "@ffmpeg/ffmpeg": "^0.12.10", "@hugotomazi/capacitor-navigation-bar": "^4.0.1", "@mediagrid/capacitor-native-audio": "^1.0.0", "beercss": "^3.8.0", @@ -45,7 +44,6 @@ }, "devDependencies": { "@capacitor/assets": "^3.0.5", - "@ffmpeg/util": "^0.12.1", "@sveltejs/adapter-auto": "^3.2.5", "@sveltejs/adapter-static": "^3.0.5", "@sveltejs/kit": "^2.9.1", @@ -2084,34 +2082,6 @@ "node": ">=14" } }, - "node_modules/@ffmpeg/ffmpeg": { - "version": "0.12.10", - "resolved": "https://registry.npmjs.org/@ffmpeg/ffmpeg/-/ffmpeg-0.12.10.tgz", - "integrity": "sha512-lVtk8PW8e+NUzGZhPTWj2P1J4/NyuCrbDD3O9IGpSeLYtUZKBqZO8CNj1WYGghep/MXoM8e1qVY1GztTkf8YYQ==", - "dependencies": { - "@ffmpeg/types": "^0.12.2" - }, - "engines": { - "node": ">=18.x" - } - }, - "node_modules/@ffmpeg/types": { - "version": "0.12.2", - "resolved": "https://registry.npmjs.org/@ffmpeg/types/-/types-0.12.2.tgz", - "integrity": "sha512-NJtxwPoLb60/z1Klv0ueshguWQ/7mNm106qdHkB4HL49LXszjhjCCiL+ldHJGQ9ai2Igx0s4F24ghigy//ERdA==", - "engines": { - "node": ">=16.x" - } - }, - "node_modules/@ffmpeg/util": { - "version": "0.12.1", - "resolved": "https://registry.npmjs.org/@ffmpeg/util/-/util-0.12.1.tgz", - "integrity": "sha512-10jjfAKWaDyb8+nAkijcsi9wgz/y26LOc1NKJradNMyCIl6usQcBbhkjX5qhALrSBcOy6TOeksunTYa+a03qNQ==", - "dev": true, - "engines": { - "node": ">=18.x" - } - }, "node_modules/@floating-ui/core": { "version": "1.6.7", "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.7.tgz", diff --git a/materialious/package.json b/materialious/package.json index 303f0dbe..2a57b7b4 100644 --- a/materialious/package.json +++ b/materialious/package.json @@ -13,7 +13,6 @@ }, "devDependencies": { "@capacitor/assets": "^3.0.5", - "@ffmpeg/util": "^0.12.1", "@sveltejs/adapter-auto": "^3.2.5", "@sveltejs/adapter-static": "^3.0.5", "@sveltejs/kit": "^2.9.1", @@ -52,7 +51,6 @@ "@capacitor/screen-orientation": "^6.0.2", "@capacitor/status-bar": "^6.0.1", "@capgo/inappbrowser": "^6.6.8", - "@ffmpeg/ffmpeg": "^0.12.10", "@hugotomazi/capacitor-navigation-bar": "^4.0.1", "@mediagrid/capacitor-native-audio": "^1.0.0", "beercss": "^3.8.0", @@ -77,4 +75,4 @@ "vidstack": "^1.12.9", "youtubei.js": "^12.2.0" } -} \ No newline at end of file +} diff --git a/materialious/src/lib/videoDownload.ts b/materialious/src/lib/videoDownload.ts deleted file mode 100644 index 1a8dd1d6..00000000 --- a/materialious/src/lib/videoDownload.ts +++ /dev/null @@ -1,178 +0,0 @@ -interface MediaQuality { - bandwidth: string; - videoUrl: string; - audioUrl: string; - resolution?: string; - frameRate?: string; - audioChannels?: string; - audioBandwidth?: string; -} - -// https://github.com/ffmpegwasm/ffmpeg.wasm/issues/603#issuecomment-1982289892 -// Ripped from https://github.com/ffmpegwasm/ffmpeg.wasm/blob/ae1cdac7db79c5315f9a1b716fcbd9bcfe27c902/packages/util/src/index.ts#L49 -export async function fetchFile( - file: string, - onProgress?: (progress: number) => void -): Promise { - const response = await fetch(file); - - const contentLength = response.headers.get('content-length'); - - // If content-length is missing, download without progress tracking - if (!contentLength) { - const data = await response.arrayBuffer(); - return new Uint8Array(data); - } - - const totalBytes = parseInt(contentLength, 10); - const data = new Uint8Array(totalBytes); - let position = 0; - let downloadBytes = 0; - - const reader = response.body!.getReader(); - while (true) { - const { done, value } = await reader.read(); - if (done) break; - - data.set(value, position); - position += value.length; - downloadBytes += value.byteLength; - - if (onProgress) { - onProgress((downloadBytes / totalBytes) * 100); - } - } - - return data; -} - -export async function toBlobURL( - url: string, - mimeType: string, - onProgress?: (progress: number) => void -): Promise { - return URL.createObjectURL(new Blob([await fetchFile(url, onProgress)], { type: mimeType })); -} - - -// Fetch and parse the DASH manifest -async function fetchDASHManifest(manifestUrl: string) { - const response = await fetch(manifestUrl); - const manifestText = await response.text(); - const parser = new DOMParser(); - const manifest = parser.parseFromString(manifestText, "text/xml"); - return manifest; -} - - -export async function listCombinedQualities(manifestUrl: string): Promise { - const manifest = await fetchDASHManifest(`${manifestUrl}?local=true`); - const qualities: MediaQuality[] = []; - - // Fetch all AdaptationSets (both video and audio) - const adaptationSets = manifest.getElementsByTagName('AdaptationSet'); - - let videoRepresentations: Element[] = []; - let audioRepresentations: Element[] = []; - - // Separate video and audio AdaptationSets based on mimeType - for (let i = 0; i < adaptationSets.length; i++) { - const mimeType = adaptationSets[i].getAttribute('mimeType'); - const representations = adaptationSets[i].getElementsByTagName('Representation'); - - if (mimeType && mimeType === 'video/mp4') { - videoRepresentations = [...videoRepresentations, ...Array.from(representations)]; - } else if (mimeType && mimeType === 'audio/mp4') { - audioRepresentations = [...audioRepresentations, ...Array.from(representations)]; - } - } - - // Combine video and audio representations - videoRepresentations.forEach((videoRep) => { - const videoBandwidth = videoRep.getAttribute('bandwidth'); - const videoUrl = videoRep.getElementsByTagName('BaseURL')[0].textContent as string; - const width = videoRep.getAttribute('width'); - const height = videoRep.getAttribute('height'); - const resolution = width && height ? `${width}x${height}` : undefined; - const frameRate = videoRep.getAttribute('frameRate') || ''; - - // Pair this video representation with each audio representation - audioRepresentations.forEach((audioRep) => { - const audioUrl = audioRep.getElementsByTagName('BaseURL')[0].textContent as string; - const audioChannels = audioRep.getElementsByTagName('AudioChannelConfiguration')[0]?.getAttribute('value') || ''; - const audioBandwidth = audioRep.getAttribute('bandwidth') || ''; - - qualities.push({ - bandwidth: videoBandwidth || '', - videoUrl, - audioUrl, - resolution, - frameRate, - audioChannels, - audioBandwidth - }); - }); - }); - - return qualities; -} - - -export async function mergeMediaFromDASH( - selectedQuality: MediaQuality, - fileName: string, - progressCallbacks?: { - video?: (progress: number) => void, - audio?: (progress: number) => void, - merging?: (progress: number) => void, - loadingFfmpeg?: (completed: boolean) => void; - classWorker?: (progress: number) => void, - core?: (progress: number) => void; - wasm?: (progress: number) => void; - worker?: (progress: number) => void; - } -) { - if (progressCallbacks?.loadingFfmpeg) { - progressCallbacks.loadingFfmpeg(false); - } - - const FFmpeg = await import('@ffmpeg/ffmpeg'); - - const ffmpeg = new FFmpeg.FFmpeg(); - - ffmpeg.on('progress', ({ progress }) => { - if (progressCallbacks?.merging) { - progressCallbacks.merging(progress * 100); - } - }); - - await ffmpeg.load({ - classWorkerURL: await toBlobURL('/ffmpeg/ffmpeg-worker.js', 'text/javascript', progressCallbacks?.classWorker), - coreURL: await toBlobURL('/ffmpeg/ffmpeg-core.js', 'text/javascript', progressCallbacks?.core), - wasmURL: await toBlobURL('/ffmpeg/ffmpeg-core.wasm', 'application/wasm', progressCallbacks?.wasm), - workerURL: await toBlobURL('/ffmpeg/ffmpeg-core.worker.js', 'text/javascript', progressCallbacks?.worker) - }); - - if (progressCallbacks?.loadingFfmpeg) { - progressCallbacks.loadingFfmpeg(true); - } - - const { videoUrl, audioUrl } = selectedQuality; - - ffmpeg.writeFile('input.mp4', await fetchFile(videoUrl, progressCallbacks?.video)); - ffmpeg.writeFile('input.mp3', await fetchFile(audioUrl, progressCallbacks?.audio)); - - await ffmpeg.exec(['-i', 'input.mp4', '-i', 'input.mp3', '-c:v', 'copy', '-c:a', 'aac', 'output.mp4']); - - const data = await ffmpeg.readFile('output.mp4'); - const mergedFile = new Blob([data], { type: 'video/mp4' }); - const url = URL.createObjectURL(mergedFile); - const a = document.createElement('a'); - a.href = url; - a.download = `${fileName} - ${selectedQuality.resolution}.mp4`; - document.body.appendChild(a); - a.click(); - - URL.revokeObjectURL(url); - document.body.removeChild(a); -} diff --git a/materialious/src/routes/(app)/+layout.svelte b/materialious/src/routes/(app)/+layout.svelte index feb9ebfb..0d6123f6 100644 --- a/materialious/src/routes/(app)/+layout.svelte +++ b/materialious/src/routes/(app)/+layout.svelte @@ -321,9 +321,9 @@ {@html $_('invidiousBlockWarning', { values: { android: - 'Android', + 'Android', desktop: - 'Desktop' + 'Desktop' } })}

diff --git a/materialious/src/routes/(app)/watch/[slug]/+page.svelte b/materialious/src/routes/(app)/watch/[slug]/+page.svelte index ca65f296..ba01f852 100644 --- a/materialious/src/routes/(app)/watch/[slug]/+page.svelte +++ b/materialious/src/routes/(app)/watch/[slug]/+page.svelte @@ -41,7 +41,6 @@ } from '$lib/store'; import Thumbnail from '$lib/Thumbnail.svelte'; import Transcript from '$lib/Transcript.svelte'; - import { mergeMediaFromDASH } from '$lib/videoDownload'; import ui from 'beercss'; import type { DataConnection } from 'peerjs'; import { type Segment } from 'sponsorblock-api'; @@ -434,50 +433,6 @@ let downloadStage: string | undefined; let downloadProgress: number = 0; - - function onVideoDownloadProgress(progress: number) { - downloadStage = $_('player.downloadSteps.video'); - downloadProgress = progress; - } - - function onAudioDownloadProgress(progress: number) { - downloadStage = $_('player.downloadSteps.audio'); - downloadProgress = progress; - } - - function onMergingProgress(progress: number) { - downloadStage = $_('player.downloadSteps.merging'); - downloadProgress = progress; - - if (progress >= 100) { - downloadStage = undefined; - } - } - - function onLoadingFFmpeg(completed: boolean) { - downloadProgress = 0; - downloadStage = $_('player.downloadSteps.ffmpeg'); - } - - function onClassWorkerProgress(progress: number) { - downloadStage = $_('player.downloadSteps.classWorker'); - downloadProgress = progress; - } - - function onCoreProgress(progress: number) { - downloadStage = $_('player.downloadSteps.core'); - downloadProgress = progress; - } - - function onWasmProgress(progress: number) { - downloadStage = $_('player.downloadSteps.wasm'); - downloadProgress = progress; - } - - function onWorkerProgress(progress: number) { - downloadStage = $_('player.downloadSteps.worker'); - downloadProgress = progress; - } @@ -621,33 +576,6 @@ - {#await data.streamed.downloadQualitiesDash then downloadQualitiesDash} - {#if downloadQualitiesDash} - - {/if} - {/await} {#if personalPlaylists} - - -
- -
- {#if Capacitor.isNativePlatform()} -
{ - instanceStore.set(ensureNoTrailingSlash(invidiousInstance)); - authStore.set(null); - goto('/', { replaceState: true }); - ui('#dialog-settings'); - }} - > - -
- {/if} - -
- - - - -
- - {#if $darkModeStore} -
- -
- {/if} - -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- - - arrow_drop_down -
- -
- - - arrow_drop_down -
- -
- - - arrow_drop_down -
- - {#if !Capacitor.isNativePlatform()} -
-
{$_('layout.bookmarklet')}
- -
- {/if} -
-
-
-
- - - arrow_drop_down -
- -
- -
- -
- -
- -
- -
- - {#if Capacitor.getPlatform() === 'android'} -
- -
- -
- -
- {/if} - - {#if Capacitor.isNativePlatform()} -
- -
- {/if} - -
- -
- -
- -
- -
- -
- -
- -
- -
- -
- - {#if Capacitor.isNativePlatform()} -
- -
- -
- -
- {/if} -
-
-

- - {$_('layout.dataPreferences.content')} - -

-
-
-
- returnYTDislikesInstanceStore.set(ensureNoTrailingSlash(returnYTInstance))} - > - -
- - -
-
-
- synciousInstanceStore.set(ensureNoTrailingSlash(synciousInstance))} - > - -
- - -
-
-
- sponsorBlockUrlStore.set(ensureNoTrailingSlash(sponsorBlockInstance))} - > - -
- - - - - - - -
- -

{$_('layout.sponsors.Catagories')}

- - {#each sponsorCategories as sponsor} -
- -
- {/each} -
-
-
deArrowInstanceStore.set(ensureNoTrailingSlash(deArrowUrl))} - > - -
- -
deArrowThumbnailInstanceStore.set(deArrowThumbnailUrl)}> - -
- - - - -
-
- - - diff --git a/materialious/src/lib/components/Settings/ApiExtended.svelte b/materialious/src/lib/components/Settings/ApiExtended.svelte new file mode 100644 index 00000000..4165674b --- /dev/null +++ b/materialious/src/lib/components/Settings/ApiExtended.svelte @@ -0,0 +1,37 @@ + + +
+ synciousInstanceStore.set(ensureNoTrailingSlash(synciousInstance))} +> + +
+ + diff --git a/materialious/src/lib/components/Settings/DataPreferences.svelte b/materialious/src/lib/components/Settings/DataPreferences.svelte new file mode 100644 index 00000000..13b6652f --- /dev/null +++ b/materialious/src/lib/components/Settings/DataPreferences.svelte @@ -0,0 +1,16 @@ + + +

+ + {$_('layout.dataPreferences.content')} + +

diff --git a/materialious/src/lib/components/Settings/DeArrow.svelte b/materialious/src/lib/components/Settings/DeArrow.svelte new file mode 100644 index 00000000..62b08d47 --- /dev/null +++ b/materialious/src/lib/components/Settings/DeArrow.svelte @@ -0,0 +1,66 @@ + + +
deArrowInstanceStore.set(ensureNoTrailingSlash(deArrowUrl))}> + +
+ +
deArrowThumbnailInstanceStore.set(deArrowThumbnailUrl)}> + +
+ + + + diff --git a/materialious/src/lib/components/Settings/Interface.svelte b/materialious/src/lib/components/Settings/Interface.svelte new file mode 100644 index 00000000..7e6facbc --- /dev/null +++ b/materialious/src/lib/components/Settings/Interface.svelte @@ -0,0 +1,262 @@ + + +{#if Capacitor.isNativePlatform()} +
{ + instanceStore.set(ensureNoTrailingSlash(invidiousInstance)); + authStore.set(null); + goto('/', { replaceState: true }); + ui('#dialog-settings'); + }} + > + +
+{/if} + +
+ + + + +
+ +{#if $darkModeStore} +
+ +
+{/if} + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + + arrow_drop_down +
+ +
+ + + arrow_drop_down +
+ +
+ + + arrow_drop_down +
+ +{#if !Capacitor.isNativePlatform()} +
+
{$_('layout.bookmarklet')}
+ +
+{/if} diff --git a/materialious/src/lib/components/Settings/Player.svelte b/materialious/src/lib/components/Settings/Player.svelte new file mode 100644 index 00000000..04eff69c --- /dev/null +++ b/materialious/src/lib/components/Settings/Player.svelte @@ -0,0 +1,260 @@ + + +
+
+ + + arrow_drop_down +
+ +
+ +
+ +
+ +
+ +
+ +
+ +{#if Capacitor.getPlatform() === 'android'} +
+ +
+ +
+ +
+{/if} + +{#if Capacitor.isNativePlatform()} +
+ +
+{/if} + +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +{#if Capacitor.isNativePlatform()} +
+ +
+ +
+ +
+{/if} diff --git a/materialious/src/lib/components/Settings/RYD.svelte b/materialious/src/lib/components/Settings/RYD.svelte new file mode 100644 index 00000000..57ddcad5 --- /dev/null +++ b/materialious/src/lib/components/Settings/RYD.svelte @@ -0,0 +1,37 @@ + + +
+ returnYTDislikesInstanceStore.set(ensureNoTrailingSlash(returnYTInstance))} +> + +
+ + diff --git a/materialious/src/lib/components/Settings/Settings.svelte b/materialious/src/lib/components/Settings/Settings.svelte new file mode 100644 index 00000000..5fdda82e --- /dev/null +++ b/materialious/src/lib/components/Settings/Settings.svelte @@ -0,0 +1,205 @@ + + + + + + + + + diff --git a/materialious/src/lib/components/Settings/SponsorBlock.svelte b/materialious/src/lib/components/Settings/SponsorBlock.svelte new file mode 100644 index 00000000..8bc10251 --- /dev/null +++ b/materialious/src/lib/components/Settings/SponsorBlock.svelte @@ -0,0 +1,115 @@ + + +
+ sponsorBlockUrlStore.set(ensureNoTrailingSlash(sponsorBlockInstance))} +> + +
+ + + + + + + +
+ +

{$_('layout.sponsors.Catagories')}

+ +{#each sponsorCategories as sponsor} +
+ +
+{/each} diff --git a/materialious/src/lib/i18n/locales/en.json b/materialious/src/lib/i18n/locales/en.json index fea99828..da4fdca1 100644 --- a/materialious/src/lib/i18n/locales/en.json +++ b/materialious/src/lib/i18n/locales/en.json @@ -107,6 +107,7 @@ "customize": "Customize", "lowBandwidthMode": "Low bandwidth mode", "displayThumbnailAvatars": "Display channel avatars on thumbnail (Slow)", + "searchHistory": "Search history", "theme": { "theme": "Theme", "darkMode": "Dark mode", diff --git a/materialious/src/lib/store.ts b/materialious/src/lib/store.ts index 2acc3c82..0057923f 100644 --- a/materialious/src/lib/store.ts +++ b/materialious/src/lib/store.ts @@ -68,6 +68,7 @@ export const interfaceAmoledTheme = persisted('amoledTheme', false); export const interfaceLowBandwidthMode = persisted('lowBandwidthMode', false); export const interfaceDisplayThumbnailAvatars = persisted('disableThumbnailAvatars', false); export const interfaceDefaultPage = persisted('defaultPage', '/'); +export const interfaceSearchHistoryEnabled = persisted('searchHistoryEnabled', false); export const sponsorBlockStore = persisted('sponsorBlock', true); export const sponsorBlockUrlStore: Writable = persisted( @@ -110,3 +111,5 @@ export const miniPlayerSrcStore: Writable<{ video: VideoPlay; time: number; } | export const silenceSkipperStore: Writable = persisted('silenceSkipper', false); export const poTokenCacheStore: Writable = writable(); + +export const searchHistoryStore: Writable = persisted('searchHistory', []); diff --git a/materialious/src/routes/(app)/+layout.svelte b/materialious/src/routes/(app)/+layout.svelte index 8b3a4893..39ee8dc7 100644 --- a/materialious/src/routes/(app)/+layout.svelte +++ b/materialious/src/routes/(app)/+layout.svelte @@ -10,7 +10,7 @@ import MiniPlayer from '$lib/components/MiniPlayer.svelte'; import PageLoading from '$lib/components/PageLoading.svelte'; import Search from '$lib/components/Search.svelte'; - import Settings from '$lib/components/Settings.svelte'; + import Settings from '$lib/components/Settings/Settings.svelte'; import SyncParty from '$lib/components/SyncParty.svelte'; import Thumbnail from '$lib/components/Thumbnail.svelte'; import { bookmarkletLoadFromUrl, loadSettingsFromEnv } from '$lib/externalSettings'; diff --git a/materialious/static/style.css b/materialious/static/style.css index 9a4c6f65..f6cdbba7 100644 --- a/materialious/static/style.css +++ b/materialious/static/style.css @@ -48,6 +48,10 @@ display: none !important; } +#dialog-settings form { + margin: 1em 0; +} + main.root { padding-left: 7em !important; padding-top: 5em !important; From cb9a1ee7a78b1c614002cea8c18baa37b1c5cee8 Mon Sep 17 00:00:00 2001 From: WardPearce Date: Fri, 24 Jan 2025 17:32:47 +1300 Subject: [PATCH 8/8] Add max search history --- materialious/electron/src/setup.ts | 2 +- materialious/src/lib/components/Search.svelte | 6 +++++- .../lib/components/Settings/Interface.svelte | 21 +++++++++++++++++++ materialious/src/lib/i18n/locales/en.json | 2 +- 4 files changed, 28 insertions(+), 3 deletions(-) diff --git a/materialious/electron/src/setup.ts b/materialious/electron/src/setup.ts index f2a4171a..dbfe60b2 100644 --- a/materialious/electron/src/setup.ts +++ b/materialious/electron/src/setup.ts @@ -106,7 +106,7 @@ export class ElectronCapacitorApp { defaultHeight: 800, }); // Setup preload script path and construct our main window. - const preloadPath = join(app.getAppPath(), 'build', 'src', 'preload); + const preloadPath = join(app.getAppPath(), 'build', 'src', 'preload.js'); this.MainWindow = new BrowserWindow({ icon, show: false, diff --git a/materialious/src/lib/components/Search.svelte b/materialious/src/lib/components/Search.svelte index aaf98ffe..b4c5a110 100644 --- a/materialious/src/lib/components/Search.svelte +++ b/materialious/src/lib/components/Search.svelte @@ -46,7 +46,11 @@ showSearchBox = false; if ($interfaceSearchHistoryEnabled && !$searchHistoryStore.includes(search)) { - searchHistoryStore.set([search, ...$searchHistoryStore]); + let pastHistory = $searchHistoryStore; + if (pastHistory.length > 15) { + pastHistory.pop(); + } + searchHistoryStore.set([search, ...pastHistory]); } } diff --git a/materialious/src/lib/components/Settings/Interface.svelte b/materialious/src/lib/components/Settings/Interface.svelte index 7e6facbc..93b22c3a 100644 --- a/materialious/src/lib/components/Settings/Interface.svelte +++ b/materialious/src/lib/components/Settings/Interface.svelte @@ -24,7 +24,9 @@ interfaceLowBandwidthMode, interfacePreviewVideoOnHoverStore, interfaceRegionStore, + interfaceSearchHistoryEnabled, interfaceSearchSuggestionsStore, + searchHistoryStore, themeColorStore } from '../../store'; @@ -128,6 +130,25 @@ +
+ +
+