diff --git a/materialious/android/app/build.gradle b/materialious/android/app/build.gradle index 5b7a66e8..108f1f0d 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 60 - versionName "1.6.9" + versionCode 61 + versionName "1.6.10" 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/android/app/capacitor.build.gradle b/materialious/android/app/capacitor.build.gradle index 8a82c063..6f5750f8 100644 --- a/materialious/android/app/capacitor.build.gradle +++ b/materialious/android/app/capacitor.build.gradle @@ -12,6 +12,8 @@ dependencies { implementation project(':capacitor-app') implementation project(':capacitor-browser') implementation project(':capacitor-clipboard') + implementation project(':capacitor-screen-orientation') + implementation project(':capacitor-status-bar') implementation project(':capgo-inappbrowser') implementation project(':mediagrid-capacitor-native-audio') implementation project(':capacitor-nodejs') diff --git a/materialious/android/capacitor.settings.gradle b/materialious/android/capacitor.settings.gradle index ef657a94..5afe2907 100644 --- a/materialious/android/capacitor.settings.gradle +++ b/materialious/android/capacitor.settings.gradle @@ -11,6 +11,12 @@ project(':capacitor-browser').projectDir = new File('../node_modules/@capacitor/ include ':capacitor-clipboard' project(':capacitor-clipboard').projectDir = new File('../node_modules/@capacitor/clipboard/android') +include ':capacitor-screen-orientation' +project(':capacitor-screen-orientation').projectDir = new File('../node_modules/@capacitor/screen-orientation/android') + +include ':capacitor-status-bar' +project(':capacitor-status-bar').projectDir = new File('../node_modules/@capacitor/status-bar/android') + include ':capgo-inappbrowser' project(':capgo-inappbrowser').projectDir = new File('../node_modules/@capgo/inappbrowser/android') diff --git a/materialious/electron/package.json b/materialious/electron/package.json index 14d6e078..25837734 100644 --- a/materialious/electron/package.json +++ b/materialious/electron/package.json @@ -1,6 +1,6 @@ { "name": "Materialious", - "version": "1.6.9", + "version": "1.6.10", "description": "Modern material design for Invidious.", "author": { "name": "Ward Pearce", diff --git a/materialious/package-lock.json b/materialious/package-lock.json index 63ba7c70..f6c19504 100644 --- a/materialious/package-lock.json +++ b/materialious/package-lock.json @@ -1,12 +1,12 @@ { "name": "materialious", - "version": "1.6.9", + "version": "1.6.10", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "materialious", - "version": "1.6.9", + "version": "1.6.10", "dependencies": { "@capacitor-community/electron": "^5.0.1", "@capacitor/android": "6.1.2", @@ -15,6 +15,8 @@ "@capacitor/cli": "6.1.2", "@capacitor/clipboard": "^6.0.1", "@capacitor/core": "^6.1.2", + "@capacitor/screen-orientation": "^6.0.2", + "@capacitor/status-bar": "^6.0.1", "@capgo/inappbrowser": "^6.6.8", "@ffmpeg/ffmpeg": "^0.12.10", "@mediagrid/capacitor-native-audio": "^1.0.0", @@ -2190,6 +2192,24 @@ "tslib": "^2.1.0" } }, + "node_modules/@capacitor/screen-orientation": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/@capacitor/screen-orientation/-/screen-orientation-6.0.2.tgz", + "integrity": "sha512-CF+RFUIUYrvztlX+voHwvONdAbf/F9xuJWfMDnxjiGliu+oPTNLLTWxAFPmoyi3sVJcNoeQ+qwWzUfXa7ag59Q==", + "license": "MIT", + "peerDependencies": { + "@capacitor/core": "^6.0.0" + } + }, + "node_modules/@capacitor/status-bar": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/@capacitor/status-bar/-/status-bar-6.0.1.tgz", + "integrity": "sha512-Usd9hZZQVAqy+jJfL7jRcYI7dcsxN09Na1yttwdl+F1bk3Ztoukk7CGPDm5VgKUSs53ihQBOy1+sczCACxhNiw==", + "license": "MIT", + "peerDependencies": { + "@capacitor/core": "^6.0.0" + } + }, "node_modules/@capgo/inappbrowser": { "version": "6.6.8", "resolved": "https://registry.npmjs.org/@capgo/inappbrowser/-/inappbrowser-6.6.8.tgz", @@ -2794,10 +2814,11 @@ } }, "node_modules/@polka/url": { - "version": "1.0.0-next.25", - "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.25.tgz", - "integrity": "sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==", - "dev": true + "version": "1.0.0-next.28", + "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.28.tgz", + "integrity": "sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==", + "dev": true, + "license": "MIT" }, "node_modules/@prettier/plugin-xml": { "version": "2.2.0", @@ -3141,15 +3162,16 @@ } }, "node_modules/@sveltejs/kit": { - "version": "2.5.27", - "resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.5.27.tgz", - "integrity": "sha512-CcbRTzl+65oWljAASL6UlxM4x3NWwd0fjq5fQOfP243vs50myFQ8lil0fr3Im6HeeQqYUCtnv8HjO8REWVPjTw==", + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.7.1.tgz", + "integrity": "sha512-TBVnkwgYQT3EafGQK6Eyh5FlLEBlRhCmqPTwcdOs+QdnyUc3eCAxRWtXlFxIWtmk6pqv11zdng8qTpThdTogew==", "dev": true, "hasInstallScript": true, + "license": "MIT", "dependencies": { "@types/cookie": "^0.6.0", "cookie": "^0.6.0", - "devalue": "^5.0.0", + "devalue": "^5.1.0", "esm-env": "^1.0.0", "import-meta-resolve": "^4.1.0", "kleur": "^4.1.5", @@ -3157,7 +3179,7 @@ "mrmime": "^2.0.0", "sade": "^1.8.1", "set-cookie-parser": "^2.6.0", - "sirv": "^2.0.4", + "sirv": "^3.0.0", "tiny-glob": "^0.2.9" }, "bin": { @@ -5614,10 +5636,11 @@ } }, "node_modules/devalue": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/devalue/-/devalue-5.0.0.tgz", - "integrity": "sha512-gO+/OMXF7488D+u3ue+G7Y4AA3ZmUnB3eHJXmBTgNHvr4ZNzl36A0ZtG+XCRNYCkYx/bFmw4qtkoFLa+wSrwAA==", - "dev": true + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/devalue/-/devalue-5.1.1.tgz", + "integrity": "sha512-maua5KUiapvEwiEAe+XnlZ3Rh0GD+qI1J/nb9vrJc3muPXvcF/8gXYTWF76+5DAqHyDUtOIImEuo0YKE9mshVw==", + "dev": true, + "license": "MIT" }, "node_modules/dezalgo": { "version": "1.0.4", @@ -8866,6 +8889,7 @@ "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz", "integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==", "dev": true, + "license": "MIT", "engines": { "node": ">=10" } @@ -13569,17 +13593,18 @@ } }, "node_modules/sirv": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz", - "integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/sirv/-/sirv-3.0.0.tgz", + "integrity": "sha512-BPwJGUeDaDCHihkORDchNyyTvWFhcusy1XMmhEVTQTwGeybFbp8YEmB+njbPnth1FibULBSBVwCQni25XlCUDg==", "dev": true, + "license": "MIT", "dependencies": { "@polka/url": "^1.0.0-next.24", "mrmime": "^2.0.0", "totalist": "^3.0.0" }, "engines": { - "node": ">= 10" + "node": ">=18" } }, "node_modules/sisteransi": { @@ -14807,6 +14832,7 @@ "resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.1.tgz", "integrity": "sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==", "dev": true, + "license": "MIT", "engines": { "node": ">=6" } diff --git a/materialious/package.json b/materialious/package.json index 78c19ba6..d48a739f 100644 --- a/materialious/package.json +++ b/materialious/package.json @@ -1,6 +1,6 @@ { "name": "materialious", - "version": "1.6.9", + "version": "1.6.10", "private": true, "scripts": { "dev": "vite dev", @@ -50,6 +50,8 @@ "@capacitor/cli": "6.1.2", "@capacitor/clipboard": "^6.0.1", "@capacitor/core": "^6.1.2", + "@capacitor/screen-orientation": "^6.0.2", + "@capacitor/status-bar": "^6.0.1", "@capgo/inappbrowser": "^6.6.8", "@ffmpeg/ffmpeg": "^0.12.10", "@mediagrid/capacitor-native-audio": "^1.0.0", @@ -74,4 +76,4 @@ "vidstack": "^1.12.9", "youtubei.js": "^10.5.0" } -} \ No newline at end of file +} diff --git a/materialious/src/lib/ContentColumn.svelte b/materialious/src/lib/ContentColumn.svelte new file mode 100644 index 00000000..e4949525 --- /dev/null +++ b/materialious/src/lib/ContentColumn.svelte @@ -0,0 +1,23 @@ + + +
+ +
diff --git a/materialious/src/lib/Player.svelte b/materialious/src/lib/Player.svelte index b098f1d8..48479158 100644 --- a/materialious/src/lib/Player.svelte +++ b/materialious/src/lib/Player.svelte @@ -3,13 +3,15 @@ import { page } from '$app/stores'; import { Capacitor } from '@capacitor/core'; + import { ScreenOrientation } from '@capacitor/screen-orientation'; + import { StatusBar } from '@capacitor/status-bar'; import { AudioPlayer } from '@mediagrid/capacitor-native-audio'; import type { Page } from '@sveltejs/kit'; import { SponsorBlock, type Category, type Segment } from 'sponsorblock-api'; import { onDestroy, onMount } from 'svelte'; import { _ } from 'svelte-i18n'; import { get } from 'svelte/store'; - import type { MediaTimeUpdateEvent, PlayerSrc } from 'vidstack'; + import type { FullscreenChangeEvent, MediaTimeUpdateEvent, PlayerSrc } from 'vidstack'; import type { MediaPlayerElement } from 'vidstack/elements'; import { deleteVideoProgress, getVideoProgress, saveVideoProgress } from './Api'; import type { VideoPlay } from './Api/model'; @@ -26,6 +28,7 @@ miniPlayerSrcStore, playerAlwaysLoopStore, playerAndroidBgPlayer, + playerAndroidLockOrientation, playerAutoPlayStore, playerProxyVideosStore, playerSavePlaybackPositionStore, @@ -195,7 +198,7 @@ kind: 'captions', language: caption.language_code, // Need if captions are generated when youtube.js is being used. - src: caption.url.startsWith('blob:') + src: caption.url.startsWith('http') ? caption.url : `${get(instanceStore)}${caption.url}` }); @@ -344,57 +347,80 @@ await loadPlayerPos(); }); - if ( - Capacitor.getPlatform() === 'android' && - get(playerAndroidBgPlayer) && - data.video.adaptiveFormats.length > 0 - ) { - const highestBitrateAudio = data.video.adaptiveFormats - .filter((format) => format.type.startsWith('audio/')) - .reduce((prev, current) => { - return parseInt(prev.bitrate) > parseInt(current.bitrate) ? prev : current; - }); + if (Capacitor.getPlatform() === 'android' && data.video.adaptiveFormats.length > 0) { + if (get(playerAndroidBgPlayer)) { + const highestBitrateAudio = data.video.adaptiveFormats + .filter((format) => format.type.startsWith('audio/')) + .reduce((prev, current) => { + return parseInt(prev.bitrate) > parseInt(current.bitrate) ? prev : current; + }); - const audioId = { audioId: data.video.videoId }; + const audioId = { audioId: data.video.videoId }; - let isPlayingInBackground = false; + let isPlayingInBackground = false; - await AudioPlayer.create({ - ...audioId, - audioSource: !data.video.fallbackPatch - ? proxyVideoUrl(highestBitrateAudio.url) - : highestBitrateAudio.url, - friendlyTitle: data.video.title, - useForNotification: true, - loop: player.loop, - isBackgroundMusic: false - }); - - AudioPlayer.onAppGainsFocus(audioId, async () => { - if (!isPlayingInBackground) return; - - isPlayingInBackground = false; - - await AudioPlayer.pause(audioId); - - const audioPlayerTime = await AudioPlayer.getCurrentTime(audioId); - - player.currentTime = Math.round(audioPlayerTime.currentTime); - await player.play(); - }); - - AudioPlayer.onAppLosesFocus(audioId, async () => { - if (player.paused) return; - - isPlayingInBackground = true; - await AudioPlayer.play(audioId); - await AudioPlayer.seek({ + await AudioPlayer.create({ ...audioId, - timeInSeconds: Math.round(player.currentTime) + audioSource: !data.video.fallbackPatch + ? proxyVideoUrl(highestBitrateAudio.url) + : highestBitrateAudio.url, + friendlyTitle: data.video.title, + useForNotification: true, + loop: player.loop, + isBackgroundMusic: false }); - }); - await AudioPlayer.initialize(audioId); + AudioPlayer.onAppGainsFocus(audioId, async () => { + if (!isPlayingInBackground) return; + + isPlayingInBackground = false; + + await AudioPlayer.pause(audioId); + + const audioPlayerTime = await AudioPlayer.getCurrentTime(audioId); + + player.currentTime = Math.round(audioPlayerTime.currentTime); + await player.play(); + }); + + AudioPlayer.onAppLosesFocus(audioId, async () => { + if (player.paused) return; + + isPlayingInBackground = true; + await AudioPlayer.play(audioId); + await AudioPlayer.seek({ + ...audioId, + timeInSeconds: Math.round(player.currentTime) + }); + }); + + await AudioPlayer.initialize(audioId); + } + + if (get(playerAndroidLockOrientation)) { + const videoFormats = data.video.adaptiveFormats.filter((format) => + format.type.startsWith('video/') + ); + + const originalOrigination = await ScreenOrientation.orientation(); + player.addEventListener('fullscreen-change', async (event: FullscreenChangeEvent) => { + if (event.detail && videoFormats[0].resolution) { + const widthHeight = videoFormats[0].resolution.split('x'); + + if (widthHeight.length !== 2) return; + + if (Number(widthHeight[0]) > Number(widthHeight[1])) { + await StatusBar.setOverlaysWebView({ overlay: true }); + await ScreenOrientation.lock({ orientation: 'landscape' }); + } else { + await ScreenOrientation.lock({ orientation: 'portrait' }); + } + } else { + await StatusBar.setOverlaysWebView({ overlay: false }); + await ScreenOrientation.lock({ orientation: originalOrigination.type }); + } + }); + } } } else { playerIsLive = true; diff --git a/materialious/src/lib/Settings.svelte b/materialious/src/lib/Settings.svelte index ecb0bc15..3ba0fe64 100644 --- a/materialious/src/lib/Settings.svelte +++ b/materialious/src/lib/Settings.svelte @@ -17,6 +17,7 @@ deArrowThumbnailInstanceStore, deArrowTitlesOnly, instanceStore, + interfaceAmoledTheme, interfaceAutoExpandComments, interfaceAutoExpandDesc, interfaceForceCase, @@ -25,6 +26,7 @@ interfaceSearchSuggestionsStore, playerAlwaysLoopStore, playerAndroidBgPlayer, + playerAndroidLockOrientation, playerAutoPlayStore, playerAutoplayNextByDefaultStore, playerListenByDefaultStore, @@ -46,6 +48,7 @@ synciousStore, themeColorStore } from './store'; + import { setAmoledTheme } from './theme'; let sponsorCategoriesList: string[] = []; sponsorBlockCategoriesStore.subscribe((value) => (sponsorCategoriesList = value)); @@ -82,6 +85,7 @@ const target = color.target; const hex = (target as { value: string }).value; await ui('theme', hex); + setAmoledTheme(); themeColorStore.set(hex); } @@ -190,6 +194,24 @@
+ {#if $darkModeStore} +
+ +
+ {/if} + {#if Capacitor.isNativePlatform()}
{ @@ -386,6 +408,22 @@ + +
+ +
{/if} {#if Capacitor.isNativePlatform()} diff --git a/materialious/src/lib/VideoList.svelte b/materialious/src/lib/VideoList.svelte index 8581fc1a..5a980293 100644 --- a/materialious/src/lib/VideoList.svelte +++ b/materialious/src/lib/VideoList.svelte @@ -1,9 +1,9 @@
@@ -41,7 +27,7 @@
{#each videos as video} {#if !hiddenVideos.includes(video.videoId)} -
+
(hiddenVideos = [...hiddenVideos, video.videoId])} @@ -60,7 +46,7 @@
{/if} -
+ {/if} {/each}
diff --git a/materialious/src/lib/i18n/locales/en.json b/materialious/src/lib/i18n/locales/en.json index a2ad1f6a..8b8f0811 100644 --- a/materialious/src/lib/i18n/locales/en.json +++ b/materialious/src/lib/i18n/locales/en.json @@ -103,6 +103,7 @@ "theme": "Theme", "darkMode": "Dark mode", "lightMode": "Light mode", + "AmoledTheme": "Amoled theme", "color": "Color" }, "searchSuggestions": "Search suggestions", @@ -127,7 +128,8 @@ "dash": "Dash", "silenceSkipper": "Silence skipper (Experimental)", "youtubeJsFallback": "Local video processing fallback", - "youtubeJsAlways": "Always use local video processing" + "youtubeJsAlways": "Always use local video processing", + "lockOrientation": "Orientation locked to aspect ratio" }, "bookmarklet": "Bookmarklet", "instanceUrl": "Instance URL", diff --git a/materialious/src/lib/patches/youtubejs.ts b/materialious/src/lib/patches/youtubejs.ts index 174db96b..eedfb662 100644 --- a/materialious/src/lib/patches/youtubejs.ts +++ b/materialious/src/lib/patches/youtubejs.ts @@ -1,4 +1,4 @@ -import type { Image, Thumbnail, VideoBase, VideoPlay } from '$lib/Api/model'; +import type { AdaptiveFormats, Captions, Image, Thumbnail, VideoBase, VideoPlay } from '$lib/Api/model'; import { numberWithCommas } from '$lib/misc'; import { interfaceRegionStore, poTokenCacheStore } from '$lib/store'; import { Capacitor } from '@capacitor/core'; @@ -85,6 +85,8 @@ export async function patchYoutubeJs(videoId: string): Promise { const video = await youtube.getInfo(videoId); + console.log(video); + if (!video.primary_info || !video.secondary_info) { throw new Error('Unable to pull video info from youtube.js'); } @@ -104,7 +106,8 @@ export async function patchYoutubeJs(videoId: string): Promise { let authorThumbnails: Image[]; if (video.basic_info.channel_id) { - authorThumbnails = (await youtube.getChannel(video.basic_info.channel_id)).metadata.avatar as Image[]; + const channel = await youtube.getChannel(video.basic_info.channel_id); + authorThumbnails = channel.metadata.avatar as Image[]; } else { authorThumbnails = []; } @@ -122,6 +125,31 @@ export async function patchYoutubeJs(videoId: string): Promise { }); }); + let captions: Captions[] = []; + video.captions?.caption_tracks?.forEach(caption => { + captions.push({ + label: caption.name.toString(), + language_code: caption.language_code, + url: caption.base_url + }); + }); + + let adaptiveFormats: AdaptiveFormats[] = []; + video.streaming_data?.adaptive_formats.forEach(format => { + adaptiveFormats.push({ + index: format.index_range?.start.toString() || '', + bitrate: format.bitrate.toString(), + init: format.init_range?.start.toString() || '', + url: format.url || '', + itag: format.itag.toString(), + type: format.mime_type, + clen: '', + lmt: '', + projectionType: 0, + resolution: format.width ? `${format.width}x${format.height}` : undefined + }); + }); + return { type: 'video', title: video.primary_info.title ? video.primary_info.title.toString() : '', @@ -136,11 +164,11 @@ export async function patchYoutubeJs(videoId: string): Promise { genre: video.basic_info.category || '', genreUrl: '', dashUrl: dashUri, - adaptiveFormats: [], + adaptiveFormats: adaptiveFormats, formatStreams: [], recommendedVideos: recommendedVideos, authorThumbnails: authorThumbnails, - captions: [], + captions: captions, authorId: video.basic_info.channel_id || '', authorUrl: `/channel/${video.basic_info.channel_id}`, authorVerified: false, diff --git a/materialious/src/lib/store.ts b/materialious/src/lib/store.ts index 63aa0ca0..be407891 100644 --- a/materialious/src/lib/store.ts +++ b/materialious/src/lib/store.ts @@ -41,6 +41,7 @@ export const playerMiniPlayerStore = persisted('miniPlayer', true); export const playerYouTubeJsFallback = persisted('youTubeJsFallback', true); export const playerYouTubeJsAlways = persisted('youTubeJsAlways', false); export const playerAndroidBgPlayer = persisted('androidBgPlayer', true); +export const playerAndroidLockOrientation = persisted('androidLockOrientation', true); export const returnYtDislikesStore = persisted('returnYtDislikes', false); export const returnYTDislikesInstanceStore: Writable = persisted( @@ -60,6 +61,8 @@ export const interfacePreviewVideoOnHoverStore = persisted('previewVideoOnHover' export const interfaceForceCase: Writable = persisted('forceCase', null); export const interfaceAutoExpandComments: Writable = persisted('autoExpandComments', true); export const interfaceAutoExpandDesc: Writable = persisted('autoExpandDesc', false); +export const interfaceAmoledTheme = persisted('amoledTheme', false); + export const sponsorBlockStore = persisted('sponsorBlock', true); export const sponsorBlockUrlStore: Writable = persisted( diff --git a/materialious/src/lib/theme.ts b/materialious/src/lib/theme.ts index 06dc020f..bc176374 100644 --- a/materialious/src/lib/theme.ts +++ b/materialious/src/lib/theme.ts @@ -1,4 +1,6 @@ import ui from 'beercss'; +import { get } from 'svelte/store'; +import { darkModeStore, interfaceAmoledTheme } from './store'; export async function getDynamicTheme(mode?: string): Promise> { const givenSettings = (await ui('theme')); @@ -12,3 +14,46 @@ export async function getDynamicTheme(mode?: string): Promise { + document.body.style.setProperty(varName, '#000'); + }); + } else { + setTheme(); + } +} + +export function setTheme() { + const isDark = get(darkModeStore); + + if (isDark === null) { + if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { + darkModeStore.set(true); + ui('mode', 'dark'); + } else { + darkModeStore.set(false); + ui('mode', 'light'); + } + } else { + if (isDark) { + ui('mode', 'dark'); + } else { + ui('mode', 'light'); + } + } +} \ No newline at end of file diff --git a/materialious/src/routes/(app)/+layout.svelte b/materialious/src/routes/(app)/+layout.svelte index 9824552e..ba2542e0 100644 --- a/materialious/src/routes/(app)/+layout.svelte +++ b/materialious/src/routes/(app)/+layout.svelte @@ -17,9 +17,11 @@ authStore, darkModeStore, instanceStore, + interfaceAmoledTheme, syncPartyPeerStore, themeColorStore } from '$lib/store'; + import { setAmoledTheme, setTheme } from '$lib/theme'; import { App } from '@capacitor/app'; import { Browser } from '@capacitor/browser'; import { Capacitor } from '@capacitor/core'; @@ -76,12 +78,13 @@ } ]; - darkModeStore.subscribe((isDark) => { - if (isDark) { - ui('mode', 'dark'); - } else { - ui('mode', 'light'); - } + interfaceAmoledTheme.subscribe(() => { + setAmoledTheme(); + }); + + darkModeStore.subscribe(() => { + setTheme(); + setAmoledTheme(); }); App.addListener('appUrlOpen', (data) => { @@ -147,29 +150,14 @@ // So user preferences overwrite instance preferences. bookmarkletLoadFromUrl(); - const isDark = get(darkModeStore); - - if (isDark === null) { - if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { - darkModeStore.set(true); - ui('mode', 'dark'); - } else { - darkModeStore.set(false); - ui('mode', 'light'); - } - } else { - if (isDark) { - ui('mode', 'dark'); - } else { - ui('mode', 'light'); - } - } - const themeHex = get(themeColorStore); if (themeHex) { await ui('theme', themeHex); } + setTheme(); + setAmoledTheme(); + if (isLoggedIn) { loadNotifications().catch(() => authStore.set(null)); } diff --git a/materialious/src/routes/(app)/channel/[slug]/+page.svelte b/materialious/src/routes/(app)/channel/[slug]/+page.svelte index 17cf5471..dcbe2cde 100644 --- a/materialious/src/routes/(app)/channel/[slug]/+page.svelte +++ b/materialious/src/routes/(app)/channel/[slug]/+page.svelte @@ -1,9 +1,10 @@