Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement playlists on TV #234

Merged
merged 3 commits into from
Jul 15, 2023
Merged

Implement playlists on TV #234

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5671ae2
implement playlists on tv
Outlet7493 Jul 12, 2023
87bd3ca
make 'updated' property nullable
Outlet7493 Jul 13, 2023
7203694
add playlists to search results
Outlet7493 Jul 14, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 7 additions & 3 deletions lib/controllers/videoListController.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,13 @@ class VideoListController extends GetxController {
Map<String, Image> imageCache = {};
ScrollController scrollController = ScrollController();
VideoListErrors error = VideoListErrors.none;
final bool shouldRefetch;

VideoListController(this.videoList);
VideoListController({required this.videoList, this.shouldRefetch = false}) {
if (shouldRefetch && videoList.hasRefresh()) {
Outlet7493 marked this conversation as resolved.
Show resolved Hide resolved
refreshVideos();
}
}

@override
void onClose() {
Expand All @@ -54,15 +59,14 @@ class VideoListController extends GetxController {

onScrollEvent() {
if (scrollController.hasClients) {

if (scrollController.position.maxScrollExtent * 0.9 < scrollController.offset) {
EasyDebounce.debounce('loading-more-videos', const Duration(milliseconds: 250), getMoreVideos);
}
}
}

getMoreVideos() async {
if (!loading) {
if (!loading && videoList.getHasMore()) {
loadVideo(() async {
List<VideoInList> videos = await videoList.getMoreItems();
List<VideoInList> currentVideos = this.videos;
Expand Down
4 changes: 3 additions & 1 deletion lib/extensions.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
extension Iterables<E> on Iterable<E> {
Map<K, List<E>> groupBy<K>(K Function(E) keyFunction) => fold(<K, List<E>>{}, (Map<K, List<E>> map, E element) => map..putIfAbsent(keyFunction(element), () => <E>[]).add(element));
}
Iterable<E> sortBy(Comparable Function(E e) key) => toList()..sort((a, b) => key(a).compareTo(key(b)));
Iterable<E> sortByReversed(Comparable Function(E e) key) => sortBy((e) => key(e)).toList().reversed;
}
21 changes: 21 additions & 0 deletions lib/models/paginatedList.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -202,3 +202,24 @@ class SearchPaginatedList<T> extends PaginatedList<T> {
return [];
}
}

// Force refresh to fetch all videos as search endpoint only returns 2 videos for each playlist
class PlaylistSearchPaginatedList<T> extends SearchPaginatedList<T> {
PlaylistSearchPaginatedList({required super.query, required super.items, required super.type, required super.getFromResults, required super.sortBy});

@override
bool getHasMore() {
return false;
}

@override
bool hasRefresh() {
return true;
}

@override
Future<List<T>> refresh() async {
return (await service.getPublicPlaylists(super.query)).videos as List<T>;
}

}
3 changes: 2 additions & 1 deletion lib/models/playlist.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,8 @@ class Playlist {
String? description;
int videoCount;
int? viewCount;
bool? isListed ;
bool? isListed;
int? updated;
List<VideoInList> videos = [];

@JsonKey(includeToJson: false, includeFromJson: false)
Expand Down
2 changes: 2 additions & 0 deletions lib/models/playlist.g.dart
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 4 additions & 2 deletions lib/service.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
import 'dart:convert';

import 'package:fbroadcast/fbroadcast.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter_web_auth/flutter_web_auth.dart';
import 'package:http/http.dart';
import 'package:http/http.dart' as http;
import 'package:invidious/database.dart';
import 'package:invidious/extensions.dart';
import 'package:invidious/globals.dart';
import 'package:invidious/models/db/searchHistoryItem.dart';
import 'package:invidious/models/db/videoFilter.dart';
Expand Down Expand Up @@ -61,7 +63,7 @@ class Service {
final log = Logger('Service');

String urlFormatForLog(Uri? uri) {
return '${uri?.replace(host: 'xxxxxxxxxx')}';
return kDebugMode ? uri.toString() : '${uri?.replace(host: 'xxxxxxxxxx')}';
}

handleResponse(Response response) {
Expand Down Expand Up @@ -402,7 +404,7 @@ class Service {
for (var pl in list) {
VideoFilter.filterVideos(pl.videos);
}
return list;
return list.sortByReversed((e) => e.updated ?? 0).toList();
} catch (e) {
return [];
}
Expand Down
1 change: 0 additions & 1 deletion lib/views/playlistList.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@ class PlaylistList extends StatelessWidget {
enablePullUp: false,
onRefresh: _.refreshPlaylists,
child: ListView.separated(

controller: _.scrollController,
itemBuilder: (context, index) => PlaylistItem(playlist: _.playlists[index], canDeleteVideos: canDeleteVideos),
separatorBuilder: (context, index) => const Divider(),
Expand Down
156 changes: 121 additions & 35 deletions lib/views/playlists/playlist.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,29 @@
import 'dart:async';

import 'package:after_layout/after_layout.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:get/get.dart';
import 'package:invidious/controllers/playlistItemController.dart';
import 'package:invidious/globals.dart';
import 'package:invidious/main.dart';
import 'package:invidious/models/imageObject.dart';
import 'package:invidious/models/paginatedList.dart';
import 'package:invidious/models/playlist.dart';
import 'package:invidious/models/videoInList.dart';
import 'package:invidious/myRouteObserver.dart';
import 'package:invidious/utils.dart';
import 'package:invidious/views/components/videoThumbnail.dart';
import 'package:invidious/views/playlistView.dart';
import 'package:invidious/views/tv/tvVideoGridView.dart';

import '../../models/searchSortBy.dart';
import '../../models/searchType.dart';

class PlaylistItem extends StatelessWidget {
final Playlist playlist;
final bool canDeleteVideos;
final bool isTv;
final bool cameFromSearch;

const PlaylistItem({super.key, required this.playlist, required this.canDeleteVideos});
const PlaylistItem({super.key, required this.playlist, required this.canDeleteVideos, this.isTv = false, this.cameFromSearch = false});

openPlayList(BuildContext context) {
navigatorKey.currentState?.push(MaterialPageRoute(
Expand All @@ -29,6 +34,31 @@ class PlaylistItem extends StatelessWidget {
)));
}

openTvPlaylist(BuildContext context) {
if (cameFromSearch) {
Navigator.of(context).push(MaterialPageRoute(
builder: (builder) => TvGridView(
paginatedVideoList: PlaylistSearchPaginatedList<VideoInList>(
query: playlist.playlistId,
items: [],
type: SearchType.playlist,
getFromResults: (_) => [],
sortBy: SearchSortBy.relevance
),
title: playlist.title,
shouldRefetch: true,
),
));
} else {
Navigator.of(context).push(MaterialPageRoute(
builder: (builder) => TvGridView(
paginatedVideoList: FixedItemList<VideoInList>(playlist.videos),
title: playlist.title,
),
));
}
}

@override
Widget build(BuildContext context) {
ColorScheme colors = Theme.of(context).colorScheme;
Expand All @@ -48,16 +78,16 @@ class PlaylistItem extends StatelessWidget {
top: (10 * i).toDouble(),
left: (15 * i).toDouble(),
child: SizedBox(
width: 100,
width: isTv ? (cameFromSearch ? 120 : 200) : 100,
child: AspectRatio(
aspectRatio: 16 / 9,
child: Opacity(
opacity: 1 - (0.3 * i),
child: videosToUse.length > i
? VideoThumbnailView(
cacheKey: 'v-worst/${videosToUse[i].videoId}',
cacheKey: 'v-${isTv ? 'best' : 'worst'}/${videosToUse[i].videoId}',
videoId: videosToUse[i].videoId,
thumbnailUrl: ImageObject.getWorstThumbnail(videosToUse[i].videoThumbnails)?.url ?? '',
thumbnailUrl: (isTv ? ImageObject.getBestThumbnail(videosToUse[i].videoThumbnails)?.url : ImageObject.getWorstThumbnail(videosToUse[i].videoThumbnails)?.url) ?? '',
)
: Container(
decoration: BoxDecoration(color: colors.secondaryContainer, borderRadius: BorderRadius.circular(10)),
Expand All @@ -69,36 +99,92 @@ class PlaylistItem extends StatelessWidget {
}

thumbs = thumbs.reversed.toList();
return InkWell(
onTap: () => openPlayList(context),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: 200,
height: 90,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Stack(
children: thumbs,

if (isTv) {
return Focus(
onKeyEvent: (node, event) => onTvSelect(event, context, (_) => openTvPlaylist(context)),
autofocus: false,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Builder(
builder: (ctx) {
final bool hasFocus = Focus.of(ctx).hasFocus;

return GestureDetector(
child: AnimatedScale(
curve: Curves.easeInOutQuad,
duration: animationDuration ~/2,
scale: hasFocus ? 1 : 0.9,
child: AnimatedContainer(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
color: hasFocus ? colors.primaryContainer : colors.background,
),
)),
Expanded(
child: Text(
playlist.title,
style: TextStyle(color: colors.primary),
)),
Text(locals.nVideos(playlist.videoCount)),
],
duration: animationDuration,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: cameFromSearch ? 200 : 400,
height: cameFromSearch ? 120 : 160,
child: Padding(
padding: const EdgeInsets.only(left: 20.0, right: 8.0, top: 8.0, bottom: 8.0),
child: Stack(
children: thumbs,
),
)),
Expanded(
child: Text(
playlist.title,
style: TextStyle(
color: colors.primary,
fontSize: 20.0
),
)),
Padding(
padding: cameFromSearch ? EdgeInsets.zero : const EdgeInsets.only(bottom: 8.0),
child: Text(locals.nVideos(playlist.videoCount))
),
],
),
)),
);
}
)
),
);
} else {
return InkWell(
onTap: () => openPlayList(context),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: 200,
height: 90,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Stack(
children: thumbs,
),
)),
Expanded(
child: Text(
playlist.title,
style: TextStyle(color: colors.primary),
)),
Text(locals.nVideos(playlist.videoCount)),
],
),
),
),
],
),
);
],
),
);
}
},
);
}
Expand Down
32 changes: 32 additions & 0 deletions lib/views/tv/tvHome.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import 'package:invidious/views/subscriptions.dart';
import 'package:invidious/views/trending.dart';
import 'package:invidious/views/tv/tvButton.dart';
import 'package:invidious/views/tv/tvOverScan.dart';
import 'package:invidious/views/tv/tvPlaylistGridView.dart';
import 'package:invidious/views/tv/tvSearch.dart';
import 'package:invidious/views/tv/tvSettings.dart';
import 'package:invidious/views/tv/tvVideoGridView.dart';
Expand Down Expand Up @@ -53,6 +54,14 @@ class TvHome extends StatelessWidget {
Navigator.of(context).push(MaterialPageRoute(builder: (builder) => const TvSearch()));
}

openPlaylists(BuildContext context) {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => TvPlaylistGridView(
playlistList: SingleEndpointList(service.getUserPlaylists),
),
));
}

@override
Widget build(BuildContext context) {
ColorScheme colors = Theme.of(context).colorScheme;
Expand Down Expand Up @@ -137,6 +146,29 @@ class TvHome extends StatelessWidget {
),
),
),
Visibility(
visible: isLoggedIn,
child: Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: TvButton(
onFocusChanged: _.menuItemFocusChanged,
onPressed: openPlaylists,
unfocusedColor: colors.secondaryContainer.withOpacity(0.0),
child: Padding(
padding: const EdgeInsets.all(8),
child: Row(
children: [
const Padding(
padding: EdgeInsets.only(right: 8.0),
child: Icon(Icons.playlist_play),
),
_.expandMenu ? Text(locals.playlists) : const SizedBox.shrink()
],
),
),
),
),
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: TvButton(
Expand Down
Loading