diff --git a/materialious/android/app/build.gradle b/materialious/android/app/build.gradle index ee7ad688..c80bf262 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 100 - versionName "1.7.18" + versionCode 101 + versionName "1.7.19" 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/materialious.metainfo.xml b/materialious/electron/materialious.metainfo.xml index 401b7ee5..84790dc8 100644 --- a/materialious/electron/materialious.metainfo.xml +++ b/materialious/electron/materialious.metainfo.xml @@ -61,7 +61,11 @@ - + + + https://github.com/Materialious/Materialious/releases/tag/1.7.19 + + https://github.com/Materialious/Materialious/releases/tag/1.7.18 diff --git a/materialious/electron/package-lock.json b/materialious/electron/package-lock.json index a13de3d1..371835f2 100644 --- a/materialious/electron/package-lock.json +++ b/materialious/electron/package-lock.json @@ -1,12 +1,12 @@ { "name": "Materialious", - "version": "1.7.18", + "version": "1.7.19", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "Materialious", - "version": "1.7.18", + "version": "1.7.19", "license": "MIT", "dependencies": { "@capacitor-community/electron": "^5.0.0", diff --git a/materialious/electron/package.json b/materialious/electron/package.json index 2de4195a..d7030157 100644 --- a/materialious/electron/package.json +++ b/materialious/electron/package.json @@ -1,6 +1,6 @@ { "name": "Materialious", - "version": "1.7.18", + "version": "1.7.19", "description": "Modern material design for Invidious.", "author": { "name": "Ward Pearce", diff --git a/materialious/package-lock.json b/materialious/package-lock.json index e92c66f6..6b4efda7 100644 --- a/materialious/package-lock.json +++ b/materialious/package-lock.json @@ -1,12 +1,12 @@ { "name": "materialious", - "version": "1.7.16", + "version": "1.7.19", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "materialious", - "version": "1.7.16", + "version": "1.7.19", "hasInstallScript": true, "dependencies": { "@capacitor-community/electron": "^5.0.1", @@ -18,7 +18,6 @@ "@capacitor/core": "^6.1.2", "@capacitor/screen-orientation": "^6.0.2", "@capacitor/status-bar": "^6.0.1", - "@capgo/inappbrowser": "^6.6.8", "@hugotomazi/capacitor-navigation-bar": "^4.0.1", "beercss": "^3.8.0", "bgutils-js": "^3.2.0", @@ -31,7 +30,6 @@ "iso-639-1": "^3.1.5", "material-dynamic-colors": "^1.1.1", "media-captions": "^1.0.4", - "media-icons": "^0.10.0", "mousetrap": "^1.6.5", "peerjs": "^1.5.4", "shaka-player": "^4.13.0", @@ -1983,15 +1981,6 @@ "@capacitor/core": "^6.0.0" } }, - "node_modules/@capgo/inappbrowser": { - "version": "6.14.0", - "resolved": "https://registry.npmjs.org/@capgo/inappbrowser/-/inappbrowser-6.14.0.tgz", - "integrity": "sha512-bcbdR0VMcvvzLroj7gFo/he3vpnAntFXdTF3rfnj3a2Xd2KWVdFQgxm8GfY5dbwyyxUv38m+pNnyWxfVNXHqiA==", - "license": "MIT", - "peerDependencies": { - "@capacitor/core": "^6.2.0" - } - }, "node_modules/@cspotcode/source-map-support": { "version": "0.8.1", "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", @@ -8819,14 +8808,6 @@ "node": ">=16" } }, - "node_modules/media-icons": { - "version": "0.10.0", - "resolved": "https://registry.npmjs.org/media-icons/-/media-icons-0.10.0.tgz", - "integrity": "sha512-M9loX7KUWsID3T8pRSN6/+MNKPEm9dNteqJk7yfo9ZaAIEYzEd07jWTVRlRmgVMKoAh1kY7funD6Qe1prrTJMQ==", - "engines": { - "node": ">=16" - } - }, "node_modules/memoizee": { "version": "0.4.17", "resolved": "https://registry.npmjs.org/memoizee/-/memoizee-0.4.17.tgz", diff --git a/materialious/package.json b/materialious/package.json index 40018caa..a6073be6 100644 --- a/materialious/package.json +++ b/materialious/package.json @@ -1,6 +1,6 @@ { "name": "materialious", - "version": "1.7.18", + "version": "1.7.19", "private": true, "scripts": { "dev": "vite dev", @@ -50,7 +50,6 @@ "@capacitor/core": "^6.1.2", "@capacitor/screen-orientation": "^6.0.2", "@capacitor/status-bar": "^6.0.1", - "@capgo/inappbrowser": "^6.6.8", "@hugotomazi/capacitor-navigation-bar": "^4.0.1", "beercss": "^3.8.0", "bgutils-js": "^3.2.0", @@ -63,7 +62,6 @@ "iso-639-1": "^3.1.5", "material-dynamic-colors": "^1.1.1", "media-captions": "^1.0.4", - "media-icons": "^0.10.0", "mousetrap": "^1.6.5", "peerjs": "^1.5.4", "shaka-player": "^4.13.0", @@ -74,4 +72,4 @@ "terser": "^5.34.1", "youtubei.js": "^13.3.0" } -} \ No newline at end of file +} diff --git a/materialious/src/lib/components/Player.svelte b/materialious/src/lib/components/Player.svelte index 59a65271..d50d1848 100644 --- a/materialious/src/lib/components/Player.svelte +++ b/materialious/src/lib/components/Player.svelte @@ -10,6 +10,7 @@ import { type Page } from '@sveltejs/kit'; import { GoogleVideo, Protos } from 'googlevideo'; import ISO6391 from 'iso-639-1'; + import Mousetrap from 'mousetrap'; import 'shaka-player/dist/controls.css'; import shaka from 'shaka-player/dist/shaka-player.ui'; import { SponsorBlock, type Category, type Segment } from 'sponsorblock-api'; @@ -156,7 +157,7 @@ 'playback_rate', 'loop', 'language', - 'save_video_frame', + Capacitor.getPlatform() === 'android' ? '' : 'save_video_frame', 'statistics' ], enableTooltips: true @@ -494,6 +495,61 @@ if (backToOverflowButton) { backToOverflowButton.innerHTML = 'arrow_back_ios_new'; } + + Mousetrap.bind('space', () => { + if (playerElement.paused) { + playerElement.play(); + } else { + playerElement.pause(); + } + return false; + }); + + Mousetrap.bind('right', () => { + playerElement.currentTime = playerElement.currentTime + 10; + return false; + }); + + Mousetrap.bind('left', () => { + playerElement.currentTime = playerElement.currentTime - 10; + return false; + }); + + Mousetrap.bind('c', () => { + const isVisible = player.isTextTrackVisible(); + if (isVisible) { + player.setTextTrackVisibility(false); + } else { + const defaultLanguage = get(playerDefaultLanguage); + const langCode = ISO6391.getCode(defaultLanguage); + + const tracks = player.getTextTracks(); + const subtitleTrack = tracks.find((track) => track.language === langCode); + + if (subtitleTrack) { + player.selectTextTrack(subtitleTrack); + player.setTextTrackVisibility(true); + } + } + return false; + }); + + Mousetrap.bind('f', () => { + if (document.fullscreenElement) { + document.exitFullscreen(); + } else { + playerElement.requestFullscreen(); + } + return false; + }); + + Mousetrap.bind('shift+left', () => { + playerElement.playbackRate = playerElement.playbackRate - 0.25; + }); + + Mousetrap.bind('shift+right', () => { + playerElement.playbackRate = playerElement.playbackRate + 0.25; + }); }); async function loadPlayerPos() { diff --git a/materialious/src/lib/css/shaka-player-theme.css b/materialious/src/lib/css/shaka-player-theme.css index a2194644..e54e5113 100644 --- a/materialious/src/lib/css/shaka-player-theme.css +++ b/materialious/src/lib/css/shaka-player-theme.css @@ -140,10 +140,8 @@ .youtube-theme .shaka-overflow-menu, .youtube-theme .shaka-settings-menu { - border-radius: 2px; + border-radius: 0.25em; background: var(--surface-dim); - text-shadow: 0 0 2px rgb(0 0 0%); - -webkit-transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1); transition: opacity 0.1s cubic-bezier(0, 0, 0.2, 1); right: 10px; bottom: 50px; @@ -156,12 +154,14 @@ } .youtube-theme .shaka-settings-menu button { - font-size: 12px; + font-size: 1em; + border: none; + margin: 0; } .youtube-theme .shaka-settings-menu button span { margin-left: 33px; - font-size: 13px; + font-size: 1em; } .youtube-theme .shaka-settings-menu button[aria-selected="true"] { @@ -181,7 +181,7 @@ -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; - font-size: 18px; + font-size: 1em; padding-left: 5px; } @@ -219,7 +219,7 @@ -ms-flex-negative: initial; flex-shrink: initial; padding-left: 15px; - font-size: 13px; + font-size: 1em; font-weight: 500; display: -webkit-box; display: -ms-flexbox; @@ -232,7 +232,7 @@ .youtube-theme .shaka-overflow-menu span+span { color: var(--primary-text); font-weight: 400 !important; - font-size: 12px !important; + font-size: 1em !important; padding-right: 8px; padding-left: 0 !important; } @@ -249,13 +249,13 @@ .youtube-theme .shaka-back-to-overflow-button { padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.2); - font-size: 12px; + font-size: 1em; color: var(--primary-text); height: 40px; } .youtube-theme .shaka-back-to-overflow-button .material-icons-round { - font-size: 15px; + font-size: 1em; padding-right: 10px; } @@ -290,12 +290,20 @@ } .youtube-theme .shaka-overflow-menu-button { - font-size: 18px; + font-size: 1em; margin-right: 5px; } .youtube-theme .shaka-fullscreen-button:hover { - font-size: 25px; + font-size: 1em; -webkit-transition: font-size 0.1s cubic-bezier(0, 0, 0.2, 1); transition: font-size 0.1s cubic-bezier(0, 0, 0.2, 1); +} + +@media screen and (max-width: 650px) { + .youtube-theme .shaka-overflow-menu, + .youtube-theme .shaka-settings-menu { + top: 10px; + position: absolute; + } } \ No newline at end of file diff --git a/materialious/src/routes/(app)/watch/[slug]/+page.svelte b/materialious/src/routes/(app)/watch/[slug]/+page.svelte index cfcb6941..15de46ca 100644 --- a/materialious/src/routes/(app)/watch/[slug]/+page.svelte +++ b/materialious/src/routes/(app)/watch/[slug]/+page.svelte @@ -74,6 +74,15 @@ let playerCurrentTime: number = $state(0); + $effect(() => { + if ($interfaceAutoExpandComments && comments) { + const commentSectionElement = document.getElementById('comment-section'); + if (commentSectionElement) { + commentSectionElement.click(); + } + } + }); + playlistSettingsStore.subscribe((playlistSetting) => { if (!data.playlistId) return; if (data.playlistId in playlistSetting) { @@ -214,6 +223,13 @@ }); onMount(async () => { + if ($interfaceAutoExpandDesc) { + const descriptionElement = document.getElementById('description'); + if (descriptionElement) { + descriptionElement.click(); + } + } + if ($syncPartyConnectionsStore) { $syncPartyConnectionsStore.forEach((conn) => { playerSyncEvents(conn); @@ -562,8 +578,8 @@
-
- +
+