dustin/melo-app
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Navidrome-Integration, Widgets (Recent + Tag-Statistik)

Browse Source
This commit is contained in:
Hermes (Server)
2026-07-23 22:23:28 +02:00
parent 94a4063070
commit c7828b851c
16 changed files with 1434 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/screens/home_screen.dart
+272 -148
View File
@@ -1,17 +1,18 @@
import 'package:flutter/material.dart';
import 'dart:async';
import '../database/db_helper.dart';
import '../services/player_service.dart';
import '../services/musik_scanner.dart';
import '../services/favoriten_service.dart';
import '../services/download_service.dart';
import '../viewmodels/melo_home_viewmodel.dart';
import '../models/song.dart';
import '../models/playlist.dart';
import '../utils/farb_theme.dart';
import '../widgets/mini_player.dart';
import '../widgets/melo_header.dart';
import '../widgets/statistik_card.dart';
import '../widgets/tag_leiste.dart';
import '../widgets/song_tile.dart';
import '../widgets/recent_widget.dart';
import '../widgets/tag_stats_widget.dart';
import '../widgets/navidrome_browser.dart';
import '../widgets/playlist_sheet.dart';
class MeloHome extends StatefulWidget {
const MeloHome({super.key});
@@ -21,104 +22,91 @@ class MeloHome extends StatefulWidget {
}
class _MeloHomeState extends State<MeloHome> {
final PlayerService _player = PlayerService();
final DbHelper _db = DbHelper();
final FavoritenService _favoriten = FavoritenService();
final MusikScanner _scanner = MusikScanner();
final DownloadService _downloader = DownloadService();
List<Song> _songs = [];
String _aktiverTag = 'Alle';
bool _ladt = true;
Set<int> _favoritenIds = {};
final List<Map<String, String>> _beispielTags = [
{'name': 'Alle', 'icon': ''},
{'name': '❤️ Für uns', 'icon': '❤️'},
{'name': 'Nightcore', 'icon': '⚡'},
{'name': 'Traurig', 'icon': '😢'},
{'name': 'Party', 'icon': '🎉'},
{'name': 'Mitsingen', 'icon': '🎤'},
{'name': '2000er', 'icon': '📀'},
];
final MeloHomeViewModel _vm = MeloHomeViewModel();
int _aktiverTab = 0;
@override
void initState() {
super.initState();
_ladeSongs();
_vm.ladeSongs();
}
List<Song> get _gefilterteSongs {
if (_aktiverTag == 'Alle') return _songs;
return _songs.where((s) =>
s.titel.contains(_aktiverTag) ||
s.kuenstler.contains(_aktiverTag)
).toList();
}
Future<void> _ladeSongs() async {
setState(() => _ladt = true);
var songs = await _db.alleSongs();
if (songs.isEmpty) {
final beispiele = [
Song(titel: 'Leichtes Gepäck', kuenstler: 'Silbermond', album: 'Schritte',
dauerSekunden: 232, dateiPfad: '', groesseBytes: 5242880, istHeruntergeladen: true),
Song(titel: 'Auf uns', kuenstler: 'Andreas Bourani', album: 'Hey',
dauerSekunden: 241, dateiPfad: '', groesseBytes: 4819200, istHeruntergeladen: true),
Song(titel: '80 Millionen', kuenstler: 'Max Giesinger', album: 'Der Junge',
dauerSekunden: 225, dateiPfad: '', groesseBytes: 5107200, istHeruntergeladen: true),
Song(titel: 'Tage wie diese', kuenstler: 'Die Toten Hosen', album: 'Ballast',
dauerSekunden: 252, dateiPfad: '', groesseBytes: 4300800, istHeruntergeladen: true),
Song(titel: 'Atlantis', kuenstler: 'Frida Gold', album: 'Liebe',
dauerSekunden: 228, dateiPfad: '', groesseBytes: 3987200, istHeruntergeladen: true),
];
await _db.songsEinfuegen(beispiele);
songs = await _db.alleSongs();
}
final favoritenSet = await _favoriten.favoritenIds();
if (mounted) {
setState(() {
_songs = songs;
_favoritenIds = favoritenSet;
_ladt = false;
});
}
@override
void dispose() {
_vm.dispose();
super.dispose();
}
Future<void> _zeigeSuche() async {
final controller = TextEditingController();
String modus = 'Alle';
final ergebnis = await showDialog<String>(
context: context,
builder: (ctx) => AlertDialog(
backgroundColor: MeloTheme.dunkel1,
title: const Text('🔍 Song suchen', style: TextStyle(color: Colors.white, fontSize: 18)),
content: TextField(
controller: controller,
autofocus: true,
style: const TextStyle(color: Colors.white),
decoration: const InputDecoration(
hintText: 'Titel oder Künstler...',
hintStyle: TextStyle(color: Colors.grey),
border: OutlineInputBorder(),
builder: (ctx) => StatefulBuilder(
builder: (ctx, setDialogState) => AlertDialog(
backgroundColor: MeloTheme.dunkel1,
title: const Text('🔍 Song suchen', style: TextStyle(color: Colors.white, fontSize: 18)),
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: controller,
autofocus: true,
style: const TextStyle(color: Colors.white),
decoration: const InputDecoration(
hintText: 'Titel, Künstler oder Tag...',
hintStyle: TextStyle(color: Colors.grey),
border: OutlineInputBorder(),
),
),
const SizedBox(height: 12),
Row(
children: [
_suchChip('Alle', modus == 'Alle', () => setDialogState(() => modus = 'Alle')),
const SizedBox(width: 6),
_suchChip('Titel', modus == 'Titel', () => setDialogState(() => modus = 'Titel')),
const SizedBox(width: 6),
_suchChip('Künstler', modus == 'Künstler', () => setDialogState(() => modus = 'Künstler')),
const SizedBox(width: 6),
_suchChip('Tag', modus == 'Tag', () => setDialogState(() => modus = 'Tag')),
],
),
],
),
actions: [
TextButton(onPressed: () => Navigator.pop(ctx), child: const Text('Abbrechen')),
TextButton(
onPressed: () => Navigator.pop(ctx, '${controller.text}|$modus'),
child: const Text('Suchen', style: TextStyle(color: MeloTheme.rot)),
),
],
),
actions: [
TextButton(onPressed: () => Navigator.pop(ctx), child: const Text('Abbrechen')),
TextButton(
onPressed: () => Navigator.pop(ctx, controller.text),
child: const Text('Suchen', style: TextStyle(color: MeloTheme.rot)),
),
],
),
);
if (ergebnis == null || ergebnis.isEmpty) return;
final gefiltert = _songs.where((s) =>
s.titel.toLowerCase().contains(ergebnis.toLowerCase()) ||
s.kuenstler.toLowerCase().contains(ergebnis.toLowerCase())
).toList();
final teile = ergebnis.split('|');
final suchtext = teile[0].toLowerCase();
final suchModus = teile.length > 1 ? teile[1] : 'Alle';
if (suchtext.isEmpty) return;
final gefiltert = _vm.songs.where((s) {
if (suchModus == 'Titel') return s.titel.toLowerCase().contains(suchtext);
if (suchModus == 'Künstler') return s.kuenstler.toLowerCase().contains(suchtext);
if (suchModus == 'Tag') {
return _vm.tags.any((t) =>
t['name'] != 'Alle' &&
t['name']!.toLowerCase().contains(suchtext) &&
'${s.titel} ${s.kuenstler}'.toLowerCase().contains(t['name']!.toLowerCase()));
}
// Alle
if (s.titel.toLowerCase().contains(suchtext)) return true;
if (s.kuenstler.toLowerCase().contains(suchtext)) return true;
return _vm.tags.any((t) =>
t['name'] != 'Alle' &&
t['name']!.toLowerCase().contains(suchtext) &&
'${s.titel} ${s.kuenstler}'.toLowerCase().contains(t['name']!.toLowerCase()));
}).toList();
if (!mounted) return;
showDialog(
context: context,
@@ -143,7 +131,7 @@ class _MeloHomeState extends State<MeloHome> {
),
title: Text(gefiltert[i].titel, style: const TextStyle(color: Colors.white)),
subtitle: Text(gefiltert[i].kuenstler, style: const TextStyle(color: Colors.grey)),
onTap: () { Navigator.pop(ctx); _spieleSong(gefiltert[i]); },
onTap: () { Navigator.pop(ctx); _vm.spieleSong(gefiltert[i]); },
),
),
),
@@ -153,7 +141,7 @@ class _MeloHomeState extends State<MeloHome> {
}
Future<void> _scanMusik() async {
final erlaubt = await _scanner.frageSpeicherZugriff();
final erlaubt = await _vm.scanner.frageSpeicherZugriff();
if (!erlaubt) {
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
@@ -162,12 +150,89 @@ class _MeloHomeState extends State<MeloHome> {
}
return;
}
await _scanner.scanneMusikOrdner();
await _vm.scanner.scanneMusikOrdner();
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Scannen fertig: ${_scanner.anzahlNeueSongs} neue Songs gefunden')),
SnackBar(content: Text('Scannen fertig: ${_vm.scanner.anzahlNeueSongs} neue Songs gefunden')),
);
await _ladeSongs();
await _vm.ladeSongs();
}
}
void _zeigeServerBrowser() {
showModalBottomSheet(
context: context,
backgroundColor: MeloTheme.schwarz,
isScrollControlled: true,
builder: (_) => SizedBox(
height: MediaQuery.of(context).size.height * 0.7,
child: Column(
children: [
Container(
margin: const EdgeInsets.symmetric(vertical: 8),
width: 40, height: 4,
decoration: BoxDecoration(
color: MeloTheme.dunkel2,
borderRadius: BorderRadius.circular(2),
),
),
Expanded(child: NavidromeBrowser(vm: _vm)),
],
),
),
);
}
void _zeigePlaylistSheet() {
showModalBottomSheet(
context: context,
backgroundColor: MeloTheme.schwarz,
isScrollControlled: true,
builder: (_) => SizedBox(
height: MediaQuery.of(context).size.height * 0.7,
child: PlaylistSheet(vm: _vm),
),
);
}
void _zeigeAddToPlaylist(Song song) async {
final playlists = await _vm.playlists.allePlaylists();
if (!mounted || playlists.isEmpty) {
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Erst eine Playlist erstellen')),
);
}
return;
}
final auswahl = await showDialog<Playlist>(
context: context,
builder: (ctx) => AlertDialog(
backgroundColor: MeloTheme.dunkel1,
title: const Text('Zu Playlist hinzufügen', style: TextStyle(color: Colors.white, fontSize: 16)),
content: SizedBox(
width: double.maxFinite,
child: ListView.builder(
shrinkWrap: true,
itemCount: playlists.length,
itemBuilder: (_, i) => ListTile(
leading: const Icon(Icons.queue_music, color: MeloTheme.rot, size: 18),
title: Text(playlists[i].name, style: const TextStyle(color: Colors.white, fontSize: 14)),
subtitle: Text('${playlists[i].songCount} Songs', style: const TextStyle(fontSize: 11, color: MeloTheme.textSekundaer)),
onTap: () => Navigator.pop(ctx, playlists[i]),
),
),
),
actions: [TextButton(onPressed: () => Navigator.pop(ctx), child: const Text('Abbrechen'))],
),
);
if (auswahl != null && song.id != null) {
await _vm.playlists.songHinzufuegen(auswahl.id!, song.id!);
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('→ ${auswahl.name}')),
);
}
}
}
@@ -212,13 +277,13 @@ class _MeloHomeState extends State<MeloHome> {
if (ctx.mounted) setDialogState(() {});
});
_downloader.downloadVonUrl(url).then((song) {
_vm.downloader.downloadVonUrl(url).then((song) {
timer?.cancel();
if (song != null && ctx.mounted) {
setDialogState(() {});
Future.delayed(const Duration(milliseconds: 800), () {
if (ctx.mounted) Navigator.pop(ctx);
_ladeSongs();
_vm.ladeSongs();
});
} else if (ctx.mounted) {
Future.delayed(const Duration(seconds: 3), () {
@@ -227,9 +292,9 @@ class _MeloHomeState extends State<MeloHome> {
}
});
final fehler = _downloader.fehler;
final fortschritt = _downloader.fortschritt;
final statusText = fehler ?? _downloader.aktuellerTitel ?? 'Song wird heruntergeladen...';
final fehler = _vm.downloader.fehler;
final fortschritt = _vm.downloader.fortschritt;
final statusText = fehler ?? _vm.downloader.aktuellerTitel ?? 'Song wird heruntergeladen...';
return AlertDialog(
backgroundColor: MeloTheme.dunkel1,
@@ -263,62 +328,63 @@ class _MeloHomeState extends State<MeloHome> {
);
}
void _spieleSong(Song song) {
_player.setWarteschlange(_songs,
startIndex: _songs.indexWhere((s) => s.id == song.id));
_player.spiele(song);
}
Future<void> _favoritenUmschalten(Song song) async {
if (song.id == null) return;
await _favoriten.umschalten(song.id!);
final aktuelleIds = await _favoriten.favoritenIds();
if (mounted) setState(() => _favoritenIds = aktuelleIds);
}
@override
Widget build(BuildContext context) {
if (_ladt) {
return const Scaffold(
backgroundColor: MeloTheme.schwarz,
body: Center(child: CircularProgressIndicator(color: MeloTheme.rot)),
);
}
return ListenableBuilder(
listenable: _vm,
builder: (_, __) {
if (_vm.ladt) {
return const Scaffold(
backgroundColor: MeloTheme.schwarz,
body: Center(child: CircularProgressIndicator(color: MeloTheme.rot)),
);
}
final gesamtMB = _songs.isEmpty ? '0'
: (_songs.fold(0, (int s, Song song) => s + song.groesseBytes) / 1048576).toStringAsFixed(0);
final gesamtMin = _songs.isEmpty ? 0
: (_songs.fold(0, (int s, Song song) => s + song.dauerSekunden) / 60).round();
final gesamtMB = _vm.songs.isEmpty ? '0'
: (_vm.songs.fold(0, (int s, Song song) => s + song.groesseBytes) / 1048576).toStringAsFixed(0);
final gesamtMin = _vm.songs.isEmpty ? 0
: (_vm.songs.fold(0, (int s, Song song) => s + song.dauerSekunden) / 60).round();
return Scaffold(
backgroundColor: MeloTheme.schwarz,
body: SafeArea(
child: Column(
children: [
MeloHeader(onDownload: _zeigeDownloadDialog, onSearch: _zeigeSuche),
StatistikCard(
anzahlSongs: _songs.length,
gesamtMB: gesamtMB,
gesamtMin: gesamtMin,
anzahlFavoriten: _favoritenIds.length,
return Scaffold(
backgroundColor: MeloTheme.schwarz,
body: SafeArea(
child: Column(
children: [
MeloHeader(onDownload: _zeigeDownloadDialog, onSearch: _zeigeSuche),
// ─── EIN/AUS: RecentWidget (Zuletzt gehört) ───
// Entferne die Kommentarzeichen um RecentWidget zu aktivieren:
// RecentWidget(songs: _vm.letzteSongs, onPlay: _vm.spieleSong),
StatistikCard(
anzahlSongs: _vm.songs.length,
gesamtMB: gesamtMB,
gesamtMin: gesamtMin,
anzahlFavoriten: _vm.favoritenIds.length,
),
// ─── EIN/AUS: Hidden Message "Seit 2008" ───
// Entferne die Kommentarzeichen um die Botschaft zu aktivieren:
if (_vm.zeigeBotschaft) _botschaftBanner(),
TagLeiste(
tags: _vm.tags,
aktiveTags: _vm.aktiveTags,
onTagToggled: _vm.toggleTag,
),
// ─── EIN/AUS: TagStatsWidget (Tag-Counts) ───
// Entferne die Kommentarzeichen um TagStatsWidget zu aktivieren:
// TagStatsWidget(tagCounts: _vm.tagCounts),
Expanded(child: _songListe()),
const MiniPlayer(),
const SizedBox(height: 8),
],
),
TagLeiste(
tags: _beispielTags,
aktiverTag: _aktiverTag,
onTagSelected: (tag) => setState(() => _aktiverTag = tag),
),
Expanded(child: _songListe()),
const MiniPlayer(),
const SizedBox(height: 8),
],
),
),
bottomNavigationBar: _bottomNav(),
),
bottomNavigationBar: _bottomNav(),
);
},
);
}
Widget _songListe() {
final songs = _gefilterteSongs;
final songs = _vm.gefilterteSongs;
return Column(
children: [
Padding(
@@ -328,7 +394,7 @@ class _MeloHomeState extends State<MeloHome> {
children: [
const Text('📂 Alle Songs', style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600, color: Colors.white)),
Row(children: [
Text('${songs.length} Titel${_aktiverTag != 'Alle' ? ' (gefiltert)' : ''}', style: TextStyle(fontSize: 12, color: MeloTheme.rot)),
Text('${songs.length} Titel${_vm.aktiveTags.isNotEmpty ? ' (gefiltert)' : ''}', style: TextStyle(fontSize: 12, color: MeloTheme.rot)),
const SizedBox(width: 8),
GestureDetector(
onTap: _scanMusik,
@@ -358,10 +424,11 @@ class _MeloHomeState extends State<MeloHome> {
itemCount: songs.length,
itemBuilder: (_, i) => SongTile(
song: songs[i],
istFavorit: songs[i].id != null && _favoritenIds.contains(songs[i].id),
onFavoriteToggle: _favoritenUmschalten,
onPlay: _spieleSong,
onMetadataChanged: _ladeSongs,
istFavorit: songs[i].id != null && _vm.favoritenIds.contains(songs[i].id),
onFavoriteToggle: _vm.favoritenUmschalten,
onPlay: _vm.spieleSong,
onMetadataChanged: _vm.ladeSongs,
onAddToPlaylist: _zeigeAddToPlaylist,
),
),
),
@@ -379,6 +446,12 @@ class _MeloHomeState extends State<MeloHome> {
backgroundColor: MeloTheme.schwarz,
selectedItemColor: MeloTheme.rot,
unselectedItemColor: MeloTheme.textSekundaer,
currentIndex: _aktiverTab,
onTap: (i) {
setState(() => _aktiverTab = i);
if (i == 2) _zeigePlaylistSheet(); // Tags-Tab → Playlists
if (i == 3) _zeigePlaylistSheet(); // Favoriten-Tab → Playlists
},
items: const [
BottomNavigationBarItem(icon: Icon(Icons.music_note, size: 22), label: 'Musik'),
BottomNavigationBarItem(icon: Icon(Icons.download, size: 22), label: 'Downloads'),
@@ -389,4 +462,55 @@ class _MeloHomeState extends State<MeloHome> {
),
);
}
/// Hilfs-Widget für Such-Modus-Chips
Widget _suchChip(String label, bool aktiv, VoidCallback onTap) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: aktiv ? MeloTheme.rot : MeloTheme.dunkel2,
borderRadius: BorderRadius.circular(12),
),
child: Text(label, style: TextStyle(fontSize: 11, color: aktiv ? Colors.white : MeloTheme.textSekundaer)),
),
);
}
/// Banner "💌 Seit 2008" – erscheint nach 10 Playbacks
Widget _botschaftBanner() {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
decoration: BoxDecoration(
gradient: const LinearGradient(colors: [Color(0xFF2A0000), Color(0xFF1A0000)]),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: MeloTheme.rot.withValues(alpha: 0.4)),
),
child: Row(
children: [
const Text('💌', style: TextStyle(fontSize: 20)),
const SizedBox(width: 10),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Text('Seit 2008',
style: TextStyle(fontSize: 14, fontWeight: FontWeight.w700, color: Colors.white)),
Text('Danke, dass du immer da bist ♥',
style: TextStyle(fontSize: 11, color: MeloTheme.textSekundaer)),
],
),
),
GestureDetector(
onTap: _vm.botschaftAusblenden,
child: const Icon(Icons.close, size: 16, color: MeloTheme.textSekundaer),
),
],
),
),
);
}
}