2024-08-27 06:35:16 +00:00
|
|
|
import 'dart:async';
|
|
|
|
import 'dart:math';
|
|
|
|
|
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
import 'package:gap/gap.dart';
|
|
|
|
import 'package:get/get.dart';
|
2024-08-28 10:41:32 +00:00
|
|
|
import 'package:go_router/go_router.dart';
|
2024-08-30 04:56:28 +00:00
|
|
|
import 'package:rhythm_box/platform.dart';
|
2024-08-27 06:35:16 +00:00
|
|
|
import 'package:rhythm_box/providers/audio_player.dart';
|
|
|
|
import 'package:rhythm_box/services/audio_services/image.dart';
|
|
|
|
import 'package:rhythm_box/widgets/auto_cache_image.dart';
|
2024-08-30 04:56:28 +00:00
|
|
|
import 'package:rhythm_box/widgets/player/controls.dart';
|
2024-08-30 13:53:40 +00:00
|
|
|
import 'package:rhythm_box/widgets/player/devices.dart';
|
2024-08-27 06:35:16 +00:00
|
|
|
import 'package:rhythm_box/widgets/player/track_details.dart';
|
|
|
|
import 'package:rhythm_box/widgets/tracks/querying_track_info.dart';
|
2024-08-29 16:28:12 +00:00
|
|
|
import 'package:rhythm_box/widgets/volume_slider.dart';
|
2024-08-30 04:56:28 +00:00
|
|
|
import 'package:window_manager/window_manager.dart';
|
2024-08-27 06:35:16 +00:00
|
|
|
|
|
|
|
class BottomPlayer extends StatefulWidget {
|
2024-08-28 10:41:32 +00:00
|
|
|
final bool usePop;
|
2024-08-30 04:56:28 +00:00
|
|
|
final bool isMiniPlayer;
|
|
|
|
final Function? onTap;
|
2024-08-28 10:41:32 +00:00
|
|
|
|
2024-08-30 04:56:28 +00:00
|
|
|
const BottomPlayer({
|
|
|
|
super.key,
|
|
|
|
this.usePop = false,
|
|
|
|
this.isMiniPlayer = false,
|
|
|
|
this.onTap,
|
|
|
|
});
|
2024-08-27 06:35:16 +00:00
|
|
|
|
|
|
|
@override
|
|
|
|
State<BottomPlayer> createState() => _BottomPlayerState();
|
|
|
|
}
|
|
|
|
|
|
|
|
class _BottomPlayerState extends State<BottomPlayer>
|
|
|
|
with SingleTickerProviderStateMixin {
|
|
|
|
late final AnimationController _animationController = AnimationController(
|
|
|
|
duration: const Duration(milliseconds: 500),
|
|
|
|
vsync: this,
|
|
|
|
);
|
|
|
|
late final Animation<double> _animation = CurvedAnimation(
|
|
|
|
parent: _animationController,
|
|
|
|
curve: Curves.easeInOut,
|
|
|
|
);
|
|
|
|
|
|
|
|
late final AudioPlayerProvider _playback = Get.find();
|
|
|
|
late final QueryingTrackInfoProvider _query = Get.find();
|
|
|
|
|
|
|
|
String? get _albumArt =>
|
|
|
|
(_playback.state.value.activeTrack?.album?.images).asUrlString(
|
|
|
|
index:
|
|
|
|
(_playback.state.value.activeTrack?.album?.images?.length ?? 1) - 1,
|
|
|
|
);
|
|
|
|
|
|
|
|
List<StreamSubscription>? _subscriptions;
|
|
|
|
|
|
|
|
bool _isLifted = false;
|
|
|
|
|
|
|
|
@override
|
|
|
|
void initState() {
|
|
|
|
super.initState();
|
|
|
|
_subscriptions = [
|
2024-08-27 12:49:48 +00:00
|
|
|
_playback.state.listen((state) {
|
|
|
|
if (state.playlist.medias.isNotEmpty && !_isLifted) {
|
|
|
|
_animationController.animateTo(1);
|
|
|
|
_isLifted = true;
|
|
|
|
}
|
|
|
|
}),
|
2024-08-27 06:35:16 +00:00
|
|
|
_playback.isPlaying.listen((value) {
|
|
|
|
if (value && !_isLifted) {
|
|
|
|
_animationController.animateTo(1);
|
|
|
|
_isLifted = true;
|
|
|
|
}
|
|
|
|
}),
|
|
|
|
_query.isQueryingTrackInfo.listen((value) {
|
|
|
|
if (value && !_isLifted) {
|
|
|
|
_animationController.animateTo(1);
|
|
|
|
_isLifted = true;
|
|
|
|
}
|
|
|
|
}),
|
|
|
|
];
|
|
|
|
}
|
|
|
|
|
|
|
|
@override
|
|
|
|
void dispose() {
|
|
|
|
if (_subscriptions != null) {
|
|
|
|
for (final subscription in _subscriptions!) {
|
|
|
|
subscription.cancel();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
super.dispose();
|
|
|
|
}
|
|
|
|
|
|
|
|
@override
|
|
|
|
Widget build(BuildContext context) {
|
|
|
|
return SizeTransition(
|
|
|
|
sizeFactor: _animation,
|
|
|
|
axis: Axis.vertical,
|
|
|
|
axisAlignment: -1,
|
|
|
|
child: Obx(
|
2024-08-27 06:48:31 +00:00
|
|
|
() => GestureDetector(
|
2024-08-27 12:49:48 +00:00
|
|
|
behavior: HitTestBehavior.translucent,
|
2024-08-27 06:48:31 +00:00
|
|
|
child: Column(
|
|
|
|
children: [
|
2024-08-28 16:41:40 +00:00
|
|
|
if (_playback.durationCurrent.value != Duration.zero)
|
2024-08-27 06:48:31 +00:00
|
|
|
TweenAnimationBuilder<double>(
|
|
|
|
tween: Tween(
|
|
|
|
begin: 0,
|
2024-08-28 16:41:40 +00:00
|
|
|
end: _playback.durationCurrent.value.inMilliseconds /
|
|
|
|
max(_playback.durationTotal.value.inMilliseconds, 1),
|
2024-08-27 06:48:31 +00:00
|
|
|
),
|
2024-08-28 10:41:32 +00:00
|
|
|
duration: const Duration(milliseconds: 1000),
|
2024-08-27 06:48:31 +00:00
|
|
|
builder: (context, value, _) => LinearProgressIndicator(
|
|
|
|
minHeight: 3,
|
|
|
|
value: value,
|
2024-08-27 06:35:16 +00:00
|
|
|
),
|
|
|
|
),
|
2024-08-27 06:48:31 +00:00
|
|
|
Row(
|
|
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
|
|
children: [
|
|
|
|
Expanded(
|
2024-08-29 16:28:12 +00:00
|
|
|
child: Row(
|
|
|
|
children: [
|
|
|
|
Hero(
|
|
|
|
tag: const Key('current-active-track-album-art'),
|
|
|
|
child: ClipRRect(
|
|
|
|
borderRadius:
|
|
|
|
const BorderRadius.all(Radius.circular(8)),
|
|
|
|
child: _albumArt != null
|
|
|
|
? AutoCacheImage(
|
|
|
|
_albumArt!,
|
|
|
|
width: 64,
|
|
|
|
height: 64,
|
|
|
|
)
|
|
|
|
: Container(
|
|
|
|
color: Theme.of(context)
|
|
|
|
.colorScheme
|
|
|
|
.surfaceContainerHigh,
|
|
|
|
width: 64,
|
|
|
|
height: 64,
|
|
|
|
child: const Center(
|
|
|
|
child: Icon(Icons.image),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
),
|
|
|
|
const Gap(12),
|
|
|
|
Expanded(
|
|
|
|
child: PlayerTrackDetails(
|
|
|
|
track: _playback.state.value.activeTrack,
|
|
|
|
),
|
|
|
|
),
|
|
|
|
],
|
2024-08-27 06:48:31 +00:00
|
|
|
),
|
|
|
|
),
|
|
|
|
const Gap(12),
|
2024-08-29 16:28:12 +00:00
|
|
|
if (MediaQuery.of(context).size.width >= 720)
|
2024-08-30 04:56:28 +00:00
|
|
|
const Expanded(child: PlayerControls())
|
2024-08-29 16:28:12 +00:00
|
|
|
else
|
2024-08-30 04:56:28 +00:00
|
|
|
const PlayerControls(),
|
2024-08-29 16:28:12 +00:00
|
|
|
if (MediaQuery.of(context).size.width >= 720) const Gap(12),
|
|
|
|
if (MediaQuery.of(context).size.width >= 720)
|
2024-08-30 04:56:28 +00:00
|
|
|
Expanded(
|
2024-08-29 16:28:12 +00:00
|
|
|
child: Row(
|
|
|
|
mainAxisAlignment: MainAxisAlignment.end,
|
|
|
|
children: [
|
2024-08-30 13:53:40 +00:00
|
|
|
IconButton(
|
|
|
|
icon: const Icon(Icons.speaker, size: 18),
|
|
|
|
onPressed: () {
|
|
|
|
showModalBottomSheet(
|
|
|
|
useRootNavigator: true,
|
|
|
|
context: context,
|
|
|
|
builder: (context) => const PlayerDevicePopup(),
|
|
|
|
);
|
|
|
|
},
|
|
|
|
),
|
2024-08-30 04:56:28 +00:00
|
|
|
if (!widget.isMiniPlayer && PlatformInfo.isDesktop)
|
|
|
|
IconButton(
|
|
|
|
icon: const Icon(
|
|
|
|
Icons.picture_in_picture,
|
|
|
|
size: 18,
|
|
|
|
),
|
|
|
|
onPressed: () async {
|
|
|
|
if (!PlatformInfo.isDesktop) return;
|
|
|
|
|
|
|
|
final prevSize = await windowManager.getSize();
|
|
|
|
await windowManager.setMinimumSize(
|
|
|
|
const Size(300, 300),
|
|
|
|
);
|
|
|
|
await windowManager.setAlwaysOnTop(true);
|
|
|
|
if (!PlatformInfo.isLinux) {
|
|
|
|
await windowManager.setHasShadow(false);
|
|
|
|
}
|
|
|
|
await windowManager
|
|
|
|
.setAlignment(Alignment.topRight);
|
|
|
|
await windowManager
|
|
|
|
.setSize(const Size(400, 500));
|
|
|
|
await Future.delayed(
|
|
|
|
const Duration(milliseconds: 100),
|
|
|
|
() async {
|
|
|
|
GoRouter.of(context).pushNamed(
|
|
|
|
'playerMini',
|
|
|
|
extra: prevSize,
|
|
|
|
);
|
|
|
|
},
|
|
|
|
);
|
|
|
|
},
|
2024-08-29 16:28:12 +00:00
|
|
|
),
|
2024-08-30 04:56:28 +00:00
|
|
|
const VolumeSlider(
|
|
|
|
mainAxisAlignment: MainAxisAlignment.end,
|
2024-08-29 16:28:12 +00:00
|
|
|
)
|
|
|
|
],
|
2024-08-27 06:48:31 +00:00
|
|
|
),
|
2024-08-29 16:28:12 +00:00
|
|
|
),
|
2024-08-27 06:48:31 +00:00
|
|
|
const Gap(12),
|
|
|
|
],
|
|
|
|
).paddingSymmetric(horizontal: 12, vertical: 8),
|
|
|
|
],
|
|
|
|
),
|
|
|
|
onTap: () {
|
2024-08-30 04:56:28 +00:00
|
|
|
if (widget.onTap != null) {
|
|
|
|
widget.onTap!();
|
|
|
|
return;
|
|
|
|
}
|
2024-08-28 10:41:32 +00:00
|
|
|
if (widget.usePop) {
|
|
|
|
GoRouter.of(context).pop();
|
|
|
|
} else {
|
|
|
|
GoRouter.of(context).pushNamed('player');
|
|
|
|
}
|
2024-08-27 06:48:31 +00:00
|
|
|
},
|
2024-08-27 06:35:16 +00:00
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|