From 54160f600f0dba9fce8a48f6dd50e536881643ec Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Mon, 22 Jan 2024 16:39:09 +0800 Subject: [PATCH 1/6] * Update single playlst view for user playlist to have pagination --- src/renderer/views/Playlist/Playlist.js | 30 ++++++++++++++++++++++++- 1 file changed, 29 insertions(+), 1 deletion(-) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 826f034494ec3..72e2118df6a3c 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -58,6 +58,7 @@ export default defineComponent({ isLoadingMore: false, getPlaylistInfoDebounce: function() {}, playlistInEditMode: false, + userPlaylistVisibleVideoLimit: 100, promptOpen: false, } @@ -102,6 +103,10 @@ export default defineComponent({ }, moreVideoDataAvailable() { + if (this.selectedUserPlaylist) { + return this.selectedUserPlaylist.videos.length > this.userPlaylistVisibleVideoLimit + } + return this.continuationData !== null }, @@ -146,8 +151,22 @@ export default defineComponent({ // Re-fetch from local store when current user playlist videos updated this.getPlaylistInfoDebounce() }, + userPlaylistVisibleVideoLimit (val) { + sessionStorage.setItem('Playlist/userPlaylistVisibleVideoLimit', val) + + if (this.selectedUserPlaylistVideos.length < this.userPlaylistVisibleVideoLimit) { + this.playlistItems = this.selectedUserPlaylistVideos + } else { + this.playlistItems = this.selectedUserPlaylistVideos.slice(0, this.userPlaylistVisibleVideoLimit) + } + }, }, mounted: function () { + const limit = sessionStorage.getItem('Playlist/userPlaylistVisibleVideoLimit') + if (limit !== null) { + this.userPlaylistVisibleVideoLimit = limit + } + this.getPlaylistInfoDebounce = debounce(this.getPlaylistInfo, 100) this.getPlaylistInfoDebounce() }, @@ -285,7 +304,11 @@ export default defineComponent({ this.channelId = '' this.infoSource = 'user' - this.playlistItems = playlist.videos + if (playlist.videos.length < this.userPlaylistVisibleVideoLimit) { + this.playlistItems = playlist.videos + } else { + this.playlistItems = playlist.videos.slice(0, this.userPlaylistVisibleVideoLimit) + } this.isLoading = false }, @@ -294,6 +317,11 @@ export default defineComponent({ }, getNextPage: function () { + if (this.selectedUserPlaylist) { + this.userPlaylistVisibleVideoLimit += 100 + return + } + switch (this.infoSource) { case 'local': this.getNextPageLocal() From f7d8f0084b23badf40d83b2ccdebe8931895cd17 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Tue, 23 Jan 2024 09:05:02 +0800 Subject: [PATCH 2/6] * Make remembered limit per playlist --- src/renderer/views/Playlist/Playlist.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 72e2118df6a3c..a4617db2578a8 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -152,7 +152,7 @@ export default defineComponent({ this.getPlaylistInfoDebounce() }, userPlaylistVisibleVideoLimit (val) { - sessionStorage.setItem('Playlist/userPlaylistVisibleVideoLimit', val) + sessionStorage.setItem(`Playlist/userPlaylistVisibleVideoLimit/${this.playlistId}`, val) if (this.selectedUserPlaylistVideos.length < this.userPlaylistVisibleVideoLimit) { this.playlistItems = this.selectedUserPlaylistVideos @@ -162,7 +162,7 @@ export default defineComponent({ }, }, mounted: function () { - const limit = sessionStorage.getItem('Playlist/userPlaylistVisibleVideoLimit') + const limit = sessionStorage.getItem(`Playlist/userPlaylistVisibleVideoLimit/${this.playlistId}`) if (limit !== null) { this.userPlaylistVisibleVideoLimit = limit } From ef89b48882cc5af12e1f1e48334e89cfa7ad03e1 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Tue, 23 Jan 2024 10:10:36 +0800 Subject: [PATCH 3/6] ! Fix video position update when not all videos loaded --- src/renderer/views/Playlist/Playlist.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index a4617db2578a8..3957f8d58a1f4 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -360,7 +360,7 @@ export default defineComponent({ }, moveVideoUp: function (videoId, playlistItemId) { - const playlistItems = [].concat(this.playlistItems) + const playlistItems = [].concat(this.selectedUserPlaylistVideos) const videoIndex = playlistItems.findIndex((video) => { return video.videoId === videoId && video.playlistItemId === playlistItemId }) @@ -392,7 +392,7 @@ export default defineComponent({ }, moveVideoDown: function (videoId, playlistItemId) { - const playlistItems = [].concat(this.playlistItems) + const playlistItems = [].concat(this.selectedUserPlaylistVideos) const videoIndex = playlistItems.findIndex((video) => { return video.videoId === videoId && video.playlistItemId === playlistItemId }) From 88ccbcff916b59c1884883250d519334bd859a56 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Tue, 23 Jan 2024 10:20:52 +0800 Subject: [PATCH 4/6] ! Fix copying user playlist when not all videos loaded --- src/renderer/components/playlist-info/playlist-info.js | 2 +- src/renderer/views/Playlist/Playlist.js | 7 +++++++ src/renderer/views/Playlist/Playlist.vue | 2 +- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/renderer/components/playlist-info/playlist-info.js b/src/renderer/components/playlist-info/playlist-info.js index f5c43941322d5..7deaf2d387100 100644 --- a/src/renderer/components/playlist-info/playlist-info.js +++ b/src/renderer/components/playlist-info/playlist-info.js @@ -226,7 +226,7 @@ export default defineComponent({ }, methods: { toggleCopyVideosPrompt: function (force = false) { - if (this.moreVideoDataAvailable && !force) { + if (this.moreVideoDataAvailable && !this.isUserPlaylist && !force) { showToast(this.$t('User Playlists.SinglePlaylistView.Toast["Some videos in the playlist are not loaded yet. Click here to copy anyway."]'), 5000, () => { this.toggleCopyVideosPrompt(true) }) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 3957f8d58a1f4..481b2d560d982 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -109,6 +109,13 @@ export default defineComponent({ return this.continuationData !== null }, + playlistInfoVideos() { + if (this.selectedUserPlaylist) { + return this.selectedUserPlaylist.videos + } + + return this.playlistItems + }, isUserPlaylistRequested: function () { return this.$route.query.playlistType === 'user' diff --git a/src/renderer/views/Playlist/Playlist.vue b/src/renderer/views/Playlist/Playlist.vue index ef3efef0ce00e..24bc98bc2bd90 100644 --- a/src/renderer/views/Playlist/Playlist.vue +++ b/src/renderer/views/Playlist/Playlist.vue @@ -18,7 +18,7 @@ :last-updated="lastUpdated" :description="playlistDescription" :video-count="videoCount" - :videos="playlistItems" + :videos="playlistInfoVideos" :view-count="viewCount" :info-source="infoSource" :more-video-data-available="moreVideoDataAvailable" From f1d700d98008e7d887c8c4aa4d3f3d5f3d11f3d3 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Tue, 23 Jan 2024 10:50:23 +0800 Subject: [PATCH 5/6] ! Fix moving video position animation playing twice --- src/renderer/views/Playlist/Playlist.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 481b2d560d982..98b22099e187d 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -391,7 +391,6 @@ export default defineComponent({ } try { this.updatePlaylist(playlist) - this.playlistItems = playlistItems } catch (e) { showToast(this.$t('User Playlists.SinglePlaylistView.Toast["There was an issue with updating this playlist."]')) console.error(e) @@ -423,7 +422,6 @@ export default defineComponent({ } try { this.updatePlaylist(playlist) - this.playlistItems = playlistItems } catch (e) { showToast(this.$t('User Playlists.SinglePlaylistView.Toast["There was an issue with updating this playlist."]')) console.error(e) From 88a4c1fcc4b9520ce016d291b3e552f6bf925383 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Tue, 23 Jan 2024 14:35:45 +0800 Subject: [PATCH 6/6] * Don't remember pagination limit, which reintroduce performance issue --- src/renderer/views/Playlist/Playlist.js | 7 ------- 1 file changed, 7 deletions(-) diff --git a/src/renderer/views/Playlist/Playlist.js b/src/renderer/views/Playlist/Playlist.js index 98b22099e187d..582a50d226814 100644 --- a/src/renderer/views/Playlist/Playlist.js +++ b/src/renderer/views/Playlist/Playlist.js @@ -159,8 +159,6 @@ export default defineComponent({ this.getPlaylistInfoDebounce() }, userPlaylistVisibleVideoLimit (val) { - sessionStorage.setItem(`Playlist/userPlaylistVisibleVideoLimit/${this.playlistId}`, val) - if (this.selectedUserPlaylistVideos.length < this.userPlaylistVisibleVideoLimit) { this.playlistItems = this.selectedUserPlaylistVideos } else { @@ -169,11 +167,6 @@ export default defineComponent({ }, }, mounted: function () { - const limit = sessionStorage.getItem(`Playlist/userPlaylistVisibleVideoLimit/${this.playlistId}`) - if (limit !== null) { - this.userPlaylistVisibleVideoLimit = limit - } - this.getPlaylistInfoDebounce = debounce(this.getPlaylistInfo, 100) this.getPlaylistInfoDebounce() },