forked from Foxyz/sync_replay_project
1.0 shell: one window with a party strip; protocol 9 profile + avatars by hash
The shell (lib/src/shell/) replaces the Home and session screens:
- Party strip: profile, Library / Schedule / Settings tabs, Join and
Host cards (hosting no longer takes media), status-ring avatar stack
with the member list, chat & activity panel, Leave.
- The real session player is mounted once and shown full, as a
draggable corner-snapping mini player, or fullscreen (window_manager,
party and toasts overlaid); the Video is never mounted twice.
- Profile popover with inline rename, colour and a crop picker (256 px
PNG), pushed live to the session; avatar toasts; waiting pill.
- Motion kit (fastEaseInToSlowEaseOut, fade-through, popovers,
mouse-drag/wheel horizontal scrolling).
- Library = the existing picker for now (restyled next round); Schedule
= the new SchedulePage; Settings = left nav over the existing panels.
Protocol 9 (packages/core, packages/server, sync client):
- {"t":"profile"} renames / changes the picture mid-session ("rename",
"avatar" feed actions); names are cleaned the same way at hello.
- state.members carry avatarHash; pictures are served once from
/a/<sid>/<token>/<hash> (PNG/JPEG/WebP/GIF by magic bytes only) and
cached by hash in the app (AvatarCache).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
foxyzandClaude Opus 5.5 committed
1 parent
f790470935
commit
d29c12e4f0
62 files changed
+5777
-3572
No files matched your search
@@ -25,9 +25,10 @@ Future<bool> openInBrowser(String url) async {
|
||||
}
|
||||
}
|
||||
|
||||
class AboutPage extends StatelessWidget {
|
||||
/// Name, version, update state and the source link (Settings → About).
|
||||
class AboutPanel extends StatelessWidget {
|
||||
final UpdateController? updates;
|
||||
const AboutPage({super.key, this.updates});
|
||||
const AboutPanel({super.key, this.updates});
|
||||
|
||||
Future<void> _open(BuildContext context) async {
|
||||
final messenger = ScaffoldMessenger.maybeOf(context);
|
||||
@@ -40,11 +41,7 @@ class AboutPage extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return PageScroll(
|
||||
maxWidth: 680,
|
||||
children: [
|
||||
const PageTitle('About'),
|
||||
Panel(
|
||||
return Panel(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
@@ -73,8 +70,6 @@ class AboutPage extends StatelessWidget {
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,12 +1,8 @@
|
||||
import 'dart:io';
|
||||
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:sync_relay_core/core.dart' show HelloMedia;
|
||||
|
||||
import '../../session/session_coordinator.dart';
|
||||
import '../../state/session_state.dart';
|
||||
import '../../widgets/avatar_pipeline.dart';
|
||||
import '../../widgets/media_input.dart';
|
||||
import 'profile.dart';
|
||||
|
||||
/// What a card shows under its fields after a failed attempt.
|
||||
class CardError {
|
||||
@@ -15,7 +11,7 @@ class CardError {
|
||||
const CardError(this.title, this.message);
|
||||
}
|
||||
|
||||
/// Host/Join submit state for the two Home cards. One attempt at a time;
|
||||
/// Host/Join submit state for the strip's two connect cards. One attempt at a time;
|
||||
/// [cancel] abandons it via [SessionState.cancelPending].
|
||||
class ConnectFlow extends ChangeNotifier {
|
||||
ConnectFlow({SessionState? session}) : _session = session ?? SessionState.instance;
|
||||
@@ -27,7 +23,8 @@ class ConnectFlow extends ChangeNotifier {
|
||||
int _attempt = 0;
|
||||
bool _disposed = false;
|
||||
|
||||
/// Set when an attempt ends in a kick, so Home shows the removal dialog.
|
||||
/// Set when an attempt ends in a kick, so the shell shows the removal
|
||||
/// dialog.
|
||||
void Function(String reason)? onKicked;
|
||||
|
||||
@override
|
||||
@@ -54,61 +51,38 @@ class ConnectFlow extends ChangeNotifier {
|
||||
}
|
||||
|
||||
/// Validates and builds the params; throws [FormatException] with a
|
||||
/// user-facing message.
|
||||
static Future<ConnectParams> buildParams(ConnectMode mode, ConnectForm f) async {
|
||||
/// user-facing message. [avatar] is the base64 picture (the profile's).
|
||||
/// Hosting puts nothing up: what to watch is picked in the library.
|
||||
static ConnectParams buildParams(ConnectMode mode, ConnectForm f, {String avatar = ''}) {
|
||||
final rawPort = mode == ConnectMode.host ? f.hostPort : f.port;
|
||||
final port = int.tryParse(rawPort.trim());
|
||||
if (port == null || port <= 0 || port > 65535) {
|
||||
throw const FormatException('port must be 1–65535');
|
||||
}
|
||||
if (f.name.trim().isEmpty) {
|
||||
throw const FormatException('set your display name first (click your profile at the top)');
|
||||
throw const FormatException('set your display name first (click your avatar at the top left)');
|
||||
}
|
||||
if (mode == ConnectMode.join && f.host.trim().isEmpty) {
|
||||
throw const FormatException('enter the server address');
|
||||
}
|
||||
String avatar = '';
|
||||
try {
|
||||
avatar = await encodeAvatar(f.avatarPath);
|
||||
} on FormatException catch (e) {
|
||||
throw FormatException(e.message);
|
||||
} catch (_) {
|
||||
throw const FormatException('could not process that avatar — pick a PNG, JPG or WebP photo');
|
||||
}
|
||||
if (mode == ConnectMode.host &&
|
||||
f.mediaPath.isNotEmpty &&
|
||||
!await File(f.mediaPath).exists()) {
|
||||
throw const FormatException('media file not found — check the path or pick again with Browse');
|
||||
}
|
||||
return ConnectParams(
|
||||
host: f.host.trim(),
|
||||
port: port,
|
||||
secret: mode == ConnectMode.host ? f.hostSecret : f.secret,
|
||||
name: f.name.trim(),
|
||||
avatar: avatar,
|
||||
mediaPath: mode == ConnectMode.host ? f.mediaPath : '',
|
||||
linkUrl: mode == ConnectMode.host ? f.linkUrl : '',
|
||||
);
|
||||
}
|
||||
|
||||
/// [edit] fills the card's fields into a copy of the last form, so the
|
||||
/// other card's saved values survive. [media] (host only) is put up
|
||||
/// instead of the form's link or file (a Jellyfin ref; the pick itself is
|
||||
/// remembered in the Jellyfin box, not the form).
|
||||
Future<void> submit(ConnectMode mode, void Function(ConnectForm f) edit,
|
||||
{HelloMedia? media}) async {
|
||||
/// other card's saved values survive.
|
||||
Future<void> submit(ConnectMode mode, void Function(ConnectForm f) edit) async {
|
||||
if (busy != null) return;
|
||||
final myAttempt = ++_attempt;
|
||||
final form = _session.lastForm.copy();
|
||||
edit(form);
|
||||
form.name = form.name.trim();
|
||||
form.host = form.host.trim();
|
||||
if (mode == ConnectMode.host) {
|
||||
final parsed = parseMediaInput(form.linkUrl.isNotEmpty ? form.linkUrl : form.mediaPath);
|
||||
form
|
||||
..mediaPath = parsed.mediaPath
|
||||
..linkUrl = parsed.linkUrl;
|
||||
}
|
||||
busy = mode;
|
||||
errors[mode] = null;
|
||||
notices[mode] = null;
|
||||
@@ -116,8 +90,9 @@ class ConnectFlow extends ChangeNotifier {
|
||||
|
||||
ConnectParams params;
|
||||
try {
|
||||
params = await buildParams(mode, form);
|
||||
if (media != null && mode == ConnectMode.host) params = params.withMedia(media);
|
||||
final profile = Profile.instance;
|
||||
await profile.ensureLoaded();
|
||||
params = buildParams(mode, form, avatar: profile.avatarBase64());
|
||||
} catch (e) {
|
||||
if (myAttempt != _attempt) return;
|
||||
busy = null;
|
||||
|
||||
@@ -1,175 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:signals/signals_flutter.dart';
|
||||
|
||||
import '../../jellyfin/accounts.dart';
|
||||
import '../../state/session_state.dart';
|
||||
import '../../state/settings.dart';
|
||||
import '../../update/update_controller.dart';
|
||||
import 'about_page.dart';
|
||||
import 'connect_flow.dart';
|
||||
import 'health_probe.dart';
|
||||
import 'host_tab.dart';
|
||||
import 'integrations_page.dart';
|
||||
import 'join_tab.dart';
|
||||
import 'profile.dart';
|
||||
import 'settings_page.dart';
|
||||
import 'top_bar.dart';
|
||||
import 'update_indicator.dart';
|
||||
|
||||
/// Everything outside a session: one top bar (profile, Join/Host tabs,
|
||||
/// Settings/Integrations/About, window buttons) over a full-width body.
|
||||
class HomeScreen extends StatelessWidget {
|
||||
const HomeScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return const Scaffold(body: HomeShell(windowControls: true));
|
||||
}
|
||||
}
|
||||
|
||||
/// [HomeScreen]'s content. Tests pump it with [windowControls] off (the
|
||||
/// drag area and window buttons need window_manager) and a fake [healthGet].
|
||||
class HomeShell extends StatefulWidget {
|
||||
final UpdateController? updates;
|
||||
final bool autoUpdateCheck;
|
||||
final bool windowControls;
|
||||
final HealthGetter healthGet;
|
||||
/// Linked Jellyfin servers; defaults to [JellyfinAccounts.instance].
|
||||
final JellyfinAccounts? jellyfin;
|
||||
const HomeShell({
|
||||
super.key,
|
||||
this.updates,
|
||||
this.autoUpdateCheck = true,
|
||||
this.windowControls = false,
|
||||
this.healthGet = defaultHealthGet,
|
||||
this.jellyfin,
|
||||
});
|
||||
|
||||
@override
|
||||
State<HomeShell> createState() => _HomeShellState();
|
||||
}
|
||||
|
||||
class _HomeShellState extends State<HomeShell> {
|
||||
HomeView _view = HomeView.join;
|
||||
final _flow = ConnectFlow();
|
||||
late final _join = JoinFields(SessionState.instance.lastForm);
|
||||
late final _jellyfin = widget.jellyfin ?? JellyfinAccounts.instance;
|
||||
late final _host = HostFields(SessionState.instance.lastForm, jellyfin: _jellyfin);
|
||||
late final void Function() _stopKickWatch;
|
||||
late final void Function() _stopCrashWatch;
|
||||
bool _dialogOpen = false;
|
||||
String? _lastKickShown;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
Profile.instance.ensureLoaded();
|
||||
// Reads linked servers and checks their tokens in the background.
|
||||
_jellyfin.ensureLoaded();
|
||||
if (widget.autoUpdateCheck) _autoCheck();
|
||||
_flow.onKicked = _showKickedDialog;
|
||||
// Back from a session that ended in a kick: say so.
|
||||
_stopKickWatch = effect(() {
|
||||
final kick = SessionState.instance.coordinator.kickReason.value;
|
||||
if (kick == null || kick.isEmpty) {
|
||||
_lastKickShown = null;
|
||||
return;
|
||||
}
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) => _showKickedDialog(kick));
|
||||
});
|
||||
// Back from a session whose hosted server crashed: say so on the Host tab.
|
||||
_stopCrashWatch = effect(() {
|
||||
final crash = SessionState.instance.serverCrash.value;
|
||||
if (crash == null) return;
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
SessionState.instance.serverCrash.value = null;
|
||||
if (!mounted) return;
|
||||
_flow.showError(ConnectMode.host, CardError('Server crashed', crash));
|
||||
setState(() => _view = HomeView.host);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_stopKickWatch();
|
||||
_stopCrashWatch();
|
||||
_flow.dispose();
|
||||
_join.dispose();
|
||||
_host.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _autoCheck() async {
|
||||
final s = AppSettings.instance;
|
||||
await s.ensureLoaded();
|
||||
if (s.autoCheckUpdates.peek()) await runUpdateCheck(widget.updates);
|
||||
}
|
||||
|
||||
Future<void> _showKickedDialog(String reason) async {
|
||||
if (!mounted || _dialogOpen || reason == _lastKickShown) return;
|
||||
_lastKickShown = reason;
|
||||
_dialogOpen = true;
|
||||
try {
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => AlertDialog(
|
||||
title: const Text('You were removed'),
|
||||
content: Text(reason.isEmpty ? 'The host removed you from the server.' : reason),
|
||||
actions: [TextButton(onPressed: () => Navigator.pop(context), child: const Text('OK'))],
|
||||
),
|
||||
);
|
||||
} finally {
|
||||
_dialogOpen = false;
|
||||
}
|
||||
}
|
||||
|
||||
void _select(HomeView v) => setState(() => _view = v);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final scheme = Theme.of(context).colorScheme;
|
||||
// Only the visible view is mounted: the Join tab polls /health only
|
||||
// while shown. Form state lives here, so nothing is lost on switch.
|
||||
final body = switch (_view) {
|
||||
HomeView.join =>
|
||||
JoinTab(flow: _flow, fields: _join, healthGet: widget.healthGet),
|
||||
HomeView.host => HostTab(
|
||||
flow: _flow,
|
||||
fields: _host,
|
||||
onOpenIntegrations: () => _select(HomeView.integrations),
|
||||
),
|
||||
HomeView.settings => SettingsPage(updates: widget.updates),
|
||||
HomeView.integrations => IntegrationsPage(jellyfin: _jellyfin),
|
||||
HomeView.about => AboutPage(updates: widget.updates),
|
||||
};
|
||||
return CallbackShortcuts(
|
||||
bindings: {
|
||||
const SingleActivator(LogicalKeyboardKey.digit1, control: true): () =>
|
||||
_select(HomeView.join),
|
||||
const SingleActivator(LogicalKeyboardKey.digit2, control: true): () =>
|
||||
_select(HomeView.host),
|
||||
const SingleActivator(LogicalKeyboardKey.comma, control: true): () =>
|
||||
_select(HomeView.settings),
|
||||
},
|
||||
child: FocusScope(
|
||||
autofocus: true,
|
||||
child: Column(
|
||||
children: [
|
||||
HomeTopBar(
|
||||
view: _view,
|
||||
onSelect: _select,
|
||||
updates: widget.updates,
|
||||
windowControls: widget.windowControls,
|
||||
),
|
||||
Divider(height: 1, thickness: 1, color: scheme.outlineVariant.withValues(alpha: 0.4)),
|
||||
Expanded(
|
||||
child: KeyedSubtree(key: ValueKey(_view), child: body),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,392 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:signals/signals_flutter.dart';
|
||||
import 'package:sync_relay_core/core.dart' show HelloMedia;
|
||||
|
||||
import '../../jellyfin/accounts.dart';
|
||||
import '../../jellyfin/session_media.dart';
|
||||
import '../../state/session_state.dart';
|
||||
import 'connect_flow.dart';
|
||||
import 'connect_status.dart';
|
||||
import 'media_picker.dart';
|
||||
import 'ui.dart';
|
||||
|
||||
/// Host form state, owned by the Home shell so it survives tab switches.
|
||||
class HostFields {
|
||||
HostFields(ConnectForm f, {JellyfinAccounts? jellyfin})
|
||||
: jellyfin = jellyfin ?? JellyfinAccounts.instance,
|
||||
port = TextEditingController(text: f.hostPort),
|
||||
secret = TextEditingController(text: f.hostSecret),
|
||||
media = MediaPickerController(mediaPath: f.mediaPath, linkUrl: f.linkUrl) {
|
||||
// The last Jellyfin pick lives in the Jellyfin box (the connect form
|
||||
// only knows links and files); restore it once that box is read.
|
||||
final noMedia = f.mediaPath.isEmpty && f.linkUrl.isEmpty;
|
||||
this.jellyfin.ensureLoaded().then((_) {
|
||||
final pick = this.jellyfin.lastPick;
|
||||
if (_disposed || pick == null || media.jellyfin != null) return;
|
||||
if (this.jellyfin.account(pick.serverId) == null) return;
|
||||
if (noMedia) {
|
||||
media.pickJellyfin(pick);
|
||||
} else {
|
||||
final source = media.source;
|
||||
media.pickJellyfin(pick);
|
||||
media.source = source;
|
||||
}
|
||||
});
|
||||
}
|
||||
final JellyfinAccounts jellyfin;
|
||||
final TextEditingController port;
|
||||
final TextEditingController secret;
|
||||
final MediaPickerController media;
|
||||
/// Jellyfin browser enlarged: the server column shrinks to a bar.
|
||||
final browserExpanded = ValueNotifier(false);
|
||||
bool _disposed = false;
|
||||
|
||||
void dispose() {
|
||||
_disposed = true;
|
||||
port.dispose();
|
||||
secret.dispose();
|
||||
media.dispose();
|
||||
browserExpanded.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
/// What hosting a picked Jellyfin item sends: its ref (no URL, no token).
|
||||
/// Throws [FormatException] with a user-facing message when the server is
|
||||
/// not linked any more or its sign-in expired.
|
||||
HelloMedia hostJellyfinMedia(JellyfinAccounts accounts, JellyfinMedia media) {
|
||||
if (accounts.account(media.serverId) == null) {
|
||||
throw const FormatException('that Jellyfin server is not linked any more — pick again');
|
||||
}
|
||||
if (accounts.statusOf(media.serverId) == JellyfinAccountStatus.expired) {
|
||||
throw const FormatException('Jellyfin sign-in expired — reconnect it in Integrations');
|
||||
}
|
||||
return mediaForPick(media);
|
||||
}
|
||||
|
||||
/// Below this width the server column moves under the media picker.
|
||||
const hostStackBelow = 860.0;
|
||||
const _columnWidth = 340.0;
|
||||
|
||||
/// Media picker as the main area; port/password/Host in a narrow column.
|
||||
class HostTab extends StatelessWidget {
|
||||
final ConnectFlow flow;
|
||||
final HostFields fields;
|
||||
final VoidCallback? onOpenIntegrations;
|
||||
const HostTab(
|
||||
{super.key, required this.flow, required this.fields, this.onOpenIntegrations});
|
||||
|
||||
void _host() {
|
||||
if (flow.busy != null) return;
|
||||
final media = fields.media.selection;
|
||||
HelloMedia? jellyfinMedia;
|
||||
if (media is JellyfinMedia) {
|
||||
try {
|
||||
jellyfinMedia = hostJellyfinMedia(fields.jellyfin, media);
|
||||
} on FormatException catch (e) {
|
||||
flow.showError(ConnectMode.host, CardError('Check the form', e.message));
|
||||
return;
|
||||
}
|
||||
fields.jellyfin.rememberPick(media);
|
||||
}
|
||||
flow.submit(
|
||||
ConnectMode.host,
|
||||
(f) => f
|
||||
..hostPort = fields.port.text.trim()
|
||||
..hostSecret = fields.secret.text
|
||||
..mediaPath = media is FileMedia ? media.path : ''
|
||||
..linkUrl = media is LinkMedia ? media.url : '',
|
||||
media: jellyfinMedia,
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return ListenableBuilder(
|
||||
listenable: Listenable.merge([flow, fields.media, fields.browserExpanded]),
|
||||
builder: (context, _) {
|
||||
final busy = flow.busy == ConnectMode.host;
|
||||
final jellyfin = fields.media.source == MediaKind.jellyfin;
|
||||
final expanded = jellyfin && fields.browserExpanded.value;
|
||||
Widget picker({required bool fill}) {
|
||||
final p = MediaPicker(
|
||||
controller: fields.media,
|
||||
enabled: !busy,
|
||||
autofocus: true,
|
||||
onSubmit: _host,
|
||||
onOpenIntegrations: onOpenIntegrations,
|
||||
jellyfin: fields.jellyfin,
|
||||
expanded: expanded,
|
||||
onToggleExpanded: () => fields.browserExpanded.value = !fields.browserExpanded.value,
|
||||
);
|
||||
return Column(
|
||||
key: const ValueKey('host-picker'),
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Text('What to watch', style: t.titleMedium),
|
||||
const SizedBox(height: 12),
|
||||
fill ? Expanded(child: p) : p,
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
final column = _ServerColumn(flow: flow, fields: fields, onHost: _host);
|
||||
return LayoutBuilder(builder: (context, box) {
|
||||
final stacked = box.maxWidth < hostStackBelow;
|
||||
// Jellyfin browser: fills the height (lazy grids need a bounded
|
||||
// viewport); the form sits beside it or, enlarged, in a bar below.
|
||||
if (expanded) {
|
||||
return Padding(
|
||||
padding: kPagePadding,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(child: picker(fill: true)),
|
||||
const SizedBox(height: 12),
|
||||
_HostBar(flow: flow, fields: fields, onHost: _host),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
if (jellyfin && !stacked) {
|
||||
return Padding(
|
||||
padding: kPagePadding,
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(child: picker(fill: true)),
|
||||
const SizedBox(width: 24),
|
||||
SizedBox(
|
||||
width: _columnWidth,
|
||||
child: SingleChildScrollView(child: column),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
return SingleChildScrollView(
|
||||
padding: kPagePadding,
|
||||
child: stacked
|
||||
? Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
picker(fill: false),
|
||||
const SizedBox(height: 24),
|
||||
Align(
|
||||
alignment: Alignment.topLeft,
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: kFieldMaxWidth),
|
||||
child: column,
|
||||
),
|
||||
),
|
||||
],
|
||||
)
|
||||
: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Expanded(child: picker(fill: false)),
|
||||
const SizedBox(width: 24),
|
||||
SizedBox(width: _columnWidth, child: column),
|
||||
],
|
||||
),
|
||||
);
|
||||
});
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ServerColumn extends StatelessWidget {
|
||||
final ConnectFlow flow;
|
||||
final HostFields fields;
|
||||
final VoidCallback onHost;
|
||||
const _ServerColumn({required this.flow, required this.fields, required this.onHost});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final t = theme.textTheme;
|
||||
return Panel(
|
||||
key: const ValueKey('host-column'),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.cast, size: 20, color: theme.colorScheme.primary),
|
||||
const SizedBox(width: 10),
|
||||
Text('Your server', style: t.titleMedium),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text('Runs on this computer. Friends need this port reachable.',
|
||||
style: t.bodySmall?.copyWith(color: Colors.grey)),
|
||||
const SizedBox(height: kGap),
|
||||
AbsorbPointer(
|
||||
absorbing: flow.busy == ConnectMode.host,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
spacing: 12,
|
||||
children: [
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: SizedBox(
|
||||
width: 120,
|
||||
child: TextField(
|
||||
key: const ValueKey('host-port'),
|
||||
controller: fields.port,
|
||||
decoration: fieldDecoration('Port'),
|
||||
keyboardType: TextInputType.number,
|
||||
onChanged: (_) => flow.clearError(ConnectMode.host),
|
||||
onSubmitted: (_) => onHost(),
|
||||
),
|
||||
),
|
||||
),
|
||||
ListenableBuilder(
|
||||
listenable: fields.secret,
|
||||
builder: (context, _) => TextField(
|
||||
key: const ValueKey('host-password'),
|
||||
controller: fields.secret,
|
||||
obscureText: true,
|
||||
decoration: fieldDecoration('Password').copyWith(
|
||||
helperText:
|
||||
fields.secret.text.isEmpty ? 'No password — anyone can join' : null,
|
||||
),
|
||||
onSubmitted: (_) => onHost(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
ListenableBuilder(
|
||||
listenable: fields.media,
|
||||
builder: (context, _) => Padding(
|
||||
padding: const EdgeInsets.only(top: 12),
|
||||
child: Text(mediaSummary(fields.media.selection),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: t.bodySmall?.copyWith(color: Colors.grey)),
|
||||
),
|
||||
),
|
||||
ConnectFeedback(flow: flow, mode: ConnectMode.host),
|
||||
const SizedBox(height: kGap),
|
||||
ConnectButton(
|
||||
flow: flow, mode: ConnectMode.host, label: 'Host', onSubmit: onHost, expand: true),
|
||||
_HostedRecents(fields: fields, enabled: flow.busy == null),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
String mediaSummary(PickedMedia? s) =>
|
||||
s == null ? 'No media selected (optional).' : 'Playing: ${s.label}';
|
||||
|
||||
/// Enlarged-browser mode: what is picked, port, password and Host in one
|
||||
/// row under the browser.
|
||||
class _HostBar extends StatelessWidget {
|
||||
final ConnectFlow flow;
|
||||
final HostFields fields;
|
||||
final VoidCallback onHost;
|
||||
const _HostBar({required this.flow, required this.fields, required this.onHost});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return Panel(
|
||||
key: const ValueKey('host-bar'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.cast, size: 20, color: Theme.of(context).colorScheme.primary),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Text(mediaSummary(fields.media.selection),
|
||||
maxLines: 1, overflow: TextOverflow.ellipsis, style: t.bodyMedium),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
AbsorbPointer(
|
||||
absorbing: flow.busy == ConnectMode.host,
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 100,
|
||||
child: TextField(
|
||||
controller: fields.port,
|
||||
decoration: fieldDecoration('Port'),
|
||||
keyboardType: TextInputType.number,
|
||||
onChanged: (_) => flow.clearError(ConnectMode.host),
|
||||
onSubmitted: (_) => onHost(),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
SizedBox(
|
||||
width: 200,
|
||||
child: TextField(
|
||||
controller: fields.secret,
|
||||
obscureText: true,
|
||||
decoration: fieldDecoration('Password', hint: 'none = open'),
|
||||
onSubmitted: (_) => onHost(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
ConnectButton(flow: flow, mode: ConnectMode.host, label: 'Host', onSubmit: onHost),
|
||||
],
|
||||
),
|
||||
ConnectFeedback(flow: flow, mode: ConnectMode.host),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Ports hosted before: one click refills port and password.
|
||||
class _HostedRecents extends StatelessWidget {
|
||||
final HostFields fields;
|
||||
final bool enabled;
|
||||
const _HostedRecents({required this.fields, required this.enabled});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SignalBuilder(builder: (context) {
|
||||
final list = [
|
||||
for (final r in SessionState.instance.recents.value)
|
||||
if (r.hosted) r
|
||||
];
|
||||
if (list.isEmpty) return const SizedBox.shrink();
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(top: kGap),
|
||||
child: Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: [
|
||||
for (final r in list)
|
||||
InputChip(
|
||||
key: ValueKey('recent-${r.key}'),
|
||||
avatar: Icon(r.secret.isEmpty ? Icons.history : Icons.lock_outline, size: 16),
|
||||
label: Text('Port ${r.port}'),
|
||||
tooltip: 'Use port ${r.port} again',
|
||||
isEnabled: enabled,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
|
||||
onPressed: () {
|
||||
fields.port.text = r.port;
|
||||
fields.secret.text = r.secret;
|
||||
},
|
||||
deleteButtonTooltipMessage: 'Forget',
|
||||
onDeleted: () => SessionState.instance.forgetServer(r),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -1,23 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../jellyfin/accounts.dart';
|
||||
import '../../jellyfin/accounts_panel.dart';
|
||||
import 'ui.dart';
|
||||
|
||||
class IntegrationsPage extends StatelessWidget {
|
||||
/// Defaults to [JellyfinAccounts.instance].
|
||||
final JellyfinAccounts? jellyfin;
|
||||
const IntegrationsPage({super.key, this.jellyfin});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return PageScroll(
|
||||
maxWidth: 820,
|
||||
children: [
|
||||
const PageTitle('Integrations',
|
||||
subtitle: 'Connect media libraries to pick what to watch.'),
|
||||
JellyfinAccountsPanel(accounts: jellyfin ?? JellyfinAccounts.instance),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,388 +0,0 @@
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:signals/signals_flutter.dart';
|
||||
import 'package:sync_relay_core/core.dart';
|
||||
|
||||
import '../../state/session_state.dart';
|
||||
import 'connect_flow.dart';
|
||||
import 'connect_status.dart';
|
||||
import 'health_probe.dart';
|
||||
import 'ui.dart';
|
||||
|
||||
/// Join form text, owned by the Home shell so it survives tab switches.
|
||||
class JoinFields {
|
||||
JoinFields(ConnectForm f)
|
||||
: host = TextEditingController(text: f.host),
|
||||
port = TextEditingController(text: f.port),
|
||||
secret = TextEditingController(text: f.secret);
|
||||
final TextEditingController host;
|
||||
final TextEditingController port;
|
||||
final TextEditingController secret;
|
||||
|
||||
void dispose() {
|
||||
host.dispose();
|
||||
port.dispose();
|
||||
secret.dispose();
|
||||
}
|
||||
}
|
||||
|
||||
/// Smallest recent-server tile; the grid adds columns as the window widens.
|
||||
const _minTileWidth = 300.0;
|
||||
|
||||
/// One compact address/port/password row, then recent servers with live
|
||||
/// status, as a grid that fills the width.
|
||||
class JoinTab extends StatelessWidget {
|
||||
final ConnectFlow flow;
|
||||
final JoinFields fields;
|
||||
final HealthGetter healthGet;
|
||||
const JoinTab(
|
||||
{super.key, required this.flow, required this.fields, required this.healthGet});
|
||||
|
||||
void _join() => flow.submit(ConnectMode.join, (f) {
|
||||
f
|
||||
..host = fields.host.text
|
||||
..port = fields.port.text.trim()
|
||||
..secret = fields.secret.text;
|
||||
});
|
||||
|
||||
void _joinRecent(RecentServer r) {
|
||||
fields.host.text = r.host;
|
||||
fields.port.text = r.port;
|
||||
fields.secret.text = r.secret;
|
||||
_join();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return ListenableBuilder(
|
||||
listenable: flow,
|
||||
builder: (context, _) => SingleChildScrollView(
|
||||
padding: kPagePadding,
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Text('Join a friend’s server', style: t.titleMedium),
|
||||
const SizedBox(height: 12),
|
||||
AbsorbPointer(
|
||||
absorbing: flow.busy == ConnectMode.join,
|
||||
child: _joinRow(),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: kFieldMaxWidth),
|
||||
child: ConnectFeedback(flow: flow, mode: ConnectMode.join),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
Text('Recent servers', style: t.titleMedium),
|
||||
const SizedBox(height: 12),
|
||||
SignalBuilder(builder: (context) {
|
||||
final list = [
|
||||
for (final r in SessionState.instance.recents.value)
|
||||
if (!r.hosted) r
|
||||
];
|
||||
return RecentServersGrid(
|
||||
servers: list,
|
||||
enabled: flow.busy == null,
|
||||
healthGet: healthGet,
|
||||
onJoin: _joinRecent,
|
||||
onForget: SessionState.instance.forgetServer,
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _joinRow() {
|
||||
return Wrap(
|
||||
key: const ValueKey('join-row'),
|
||||
spacing: 12,
|
||||
runSpacing: 12,
|
||||
crossAxisAlignment: WrapCrossAlignment.center,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 280,
|
||||
child: TextField(
|
||||
key: const ValueKey('join-address'),
|
||||
controller: fields.host,
|
||||
decoration: fieldDecoration('Address', hint: 'IP or hostname'),
|
||||
onChanged: (_) => flow.clearError(ConnectMode.join),
|
||||
onSubmitted: (_) => _join(),
|
||||
),
|
||||
),
|
||||
const Padding(
|
||||
padding: EdgeInsets.symmetric(horizontal: 6),
|
||||
child: Text(':', style: TextStyle(fontSize: 18, color: Colors.grey)),
|
||||
),
|
||||
SizedBox(
|
||||
width: 96,
|
||||
child: TextField(
|
||||
key: const ValueKey('join-port'),
|
||||
controller: fields.port,
|
||||
decoration: fieldDecoration('Port'),
|
||||
keyboardType: TextInputType.number,
|
||||
onSubmitted: (_) => _join(),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
width: 220,
|
||||
child: TextField(
|
||||
key: const ValueKey('join-password'),
|
||||
controller: fields.secret,
|
||||
obscureText: true,
|
||||
decoration: fieldDecoration('Password', hint: 'If the server has one'),
|
||||
onSubmitted: (_) => _join(),
|
||||
),
|
||||
),
|
||||
ConnectButton(flow: flow, mode: ConnectMode.join, label: 'Join', onSubmit: _join),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Recent servers as tiles; polls each one's `/health` every
|
||||
/// [healthPollEvery] while mounted (i.e. while the Join tab is visible).
|
||||
class RecentServersGrid extends StatefulWidget {
|
||||
final List<RecentServer> servers;
|
||||
final bool enabled;
|
||||
final HealthGetter healthGet;
|
||||
final ValueChanged<RecentServer> onJoin;
|
||||
final ValueChanged<RecentServer> onForget;
|
||||
const RecentServersGrid({
|
||||
super.key,
|
||||
required this.servers,
|
||||
required this.enabled,
|
||||
required this.healthGet,
|
||||
required this.onJoin,
|
||||
required this.onForget,
|
||||
});
|
||||
|
||||
@override
|
||||
State<RecentServersGrid> createState() => _RecentServersGridState();
|
||||
}
|
||||
|
||||
class _RecentServersGridState extends State<RecentServersGrid> {
|
||||
final _health = <String, ServerHealth>{};
|
||||
final _inFlight = <String>{};
|
||||
Timer? _timer;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_pollAll();
|
||||
_timer = Timer.periodic(healthPollEvery, (_) => _pollAll());
|
||||
}
|
||||
|
||||
@override
|
||||
void didUpdateWidget(RecentServersGrid old) {
|
||||
super.didUpdateWidget(old);
|
||||
for (final r in widget.servers) {
|
||||
if (!_health.containsKey(r.key)) _poll(r);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_timer?.cancel();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _pollAll() {
|
||||
for (final r in widget.servers) {
|
||||
_poll(r);
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _poll(RecentServer r) async {
|
||||
if (!_inFlight.add(r.key)) return;
|
||||
try {
|
||||
final h = await probeHealth(r.host, r.port, widget.healthGet);
|
||||
if (mounted) setState(() => _health[r.key] = h);
|
||||
} finally {
|
||||
_inFlight.remove(r.key);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (widget.servers.isEmpty) return const _EmptyRecents();
|
||||
return LayoutBuilder(builder: (context, box) {
|
||||
final cols = ((box.maxWidth + kGap) / (_minTileWidth + kGap)).floor().clamp(1, 64);
|
||||
final width = (box.maxWidth - kGap * (cols - 1)) / cols;
|
||||
return Wrap(
|
||||
spacing: kGap,
|
||||
runSpacing: kGap,
|
||||
children: [
|
||||
for (final r in widget.servers)
|
||||
SizedBox(
|
||||
width: width,
|
||||
child: _RecentTile(
|
||||
key: ValueKey('recent-${r.key}'),
|
||||
server: r,
|
||||
health: _health[r.key],
|
||||
enabled: widget.enabled,
|
||||
onJoin: () => widget.onJoin(r),
|
||||
onForget: () => widget.onForget(r),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
class _RecentTile extends StatelessWidget {
|
||||
final RecentServer server;
|
||||
/// Null until the first probe answers.
|
||||
final ServerHealth? health;
|
||||
final bool enabled;
|
||||
final VoidCallback onJoin;
|
||||
final VoidCallback onForget;
|
||||
const _RecentTile({
|
||||
super.key,
|
||||
required this.server,
|
||||
required this.health,
|
||||
required this.enabled,
|
||||
required this.onJoin,
|
||||
required this.onForget,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
final t = theme.textTheme;
|
||||
final h = health;
|
||||
final address = '${server.host}:${server.port}';
|
||||
final title = h != null && h.name.isNotEmpty ? h.name : server.host;
|
||||
final (status, statusColor) = switch (h) {
|
||||
null => ('Checking…', Colors.grey),
|
||||
ServerHealth(online: true) => (
|
||||
'● online · ${h.viewers} watching',
|
||||
Colors.greenAccent.shade400
|
||||
),
|
||||
_ => ('○ offline', Colors.grey),
|
||||
};
|
||||
return Material(
|
||||
color: scheme.surfaceContainer,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(kRadius),
|
||||
side: BorderSide(color: scheme.outlineVariant.withValues(alpha: 0.5)),
|
||||
),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
onTap: enabled ? onJoin : null,
|
||||
child: Tooltip(
|
||||
message: 'Join $address',
|
||||
waitDuration: const Duration(milliseconds: 600),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 10, 6, 14),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.dns_outlined, size: 20, color: scheme.primary),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(title,
|
||||
maxLines: 1, overflow: TextOverflow.ellipsis, style: t.titleMedium),
|
||||
),
|
||||
if (server.secret.isNotEmpty)
|
||||
const Tooltip(
|
||||
message: 'Password saved',
|
||||
child: Icon(Icons.lock_outline, size: 16, color: Colors.grey),
|
||||
),
|
||||
IconButton(
|
||||
tooltip: 'Forget',
|
||||
visualDensity: VisualDensity.compact,
|
||||
iconSize: 18,
|
||||
onPressed: onForget,
|
||||
icon: const Icon(Icons.close),
|
||||
),
|
||||
],
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 30, right: 10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(address,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: t.bodySmall?.copyWith(color: Colors.grey)),
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(status,
|
||||
key: const ValueKey('recent-status'),
|
||||
style: t.bodyMedium?.copyWith(color: statusColor)),
|
||||
),
|
||||
if (h != null && h.needsUpdate)
|
||||
Tooltip(
|
||||
message: 'Server protocol ${h.proto}, this app '
|
||||
'${RelayConstants.protoVersion} — update so both match',
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: scheme.errorContainer,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Text('needs update',
|
||||
style: t.labelSmall
|
||||
?.copyWith(color: scheme.onErrorContainer)),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EmptyRecents extends StatelessWidget {
|
||||
const _EmptyRecents();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return Panel(
|
||||
key: const ValueKey('recents-empty'),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(Icons.history, size: 28, color: Colors.grey),
|
||||
const SizedBox(width: kGap),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('No recent servers yet', style: t.titleSmall),
|
||||
const SizedBox(height: 2),
|
||||
Text('Servers you join show up here with live status; click one to rejoin.',
|
||||
style: t.bodySmall?.copyWith(color: Colors.grey)),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -15,8 +15,8 @@ const videoExtensions = ['mp4', 'mkv', 'webm', 'avi', 'mov', 'm4v', 'ts'];
|
||||
|
||||
enum MediaKind { jellyfin, link, file }
|
||||
|
||||
/// State of a [MediaPicker], owned by whoever hosts it (Home's Host tab,
|
||||
/// later the session's swap panel) so it survives rebuilds.
|
||||
/// State of a [MediaPicker], owned by whoever hosts it (the shell, for the
|
||||
/// Library tab) so it survives rebuilds and tab switches.
|
||||
class MediaPickerController extends ChangeNotifier {
|
||||
MediaPickerController(
|
||||
{String mediaPath = '', String linkUrl = '', JellyfinMedia? jellyfin, MediaKind? source})
|
||||
|
||||
@@ -1,285 +1,131 @@
|
||||
import 'dart:async';
|
||||
import 'dart:convert';
|
||||
import 'dart:typed_data';
|
||||
|
||||
import 'package:file_picker/file_picker.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:signals/signals_flutter.dart';
|
||||
|
||||
import '../../state/connect_prefs.dart';
|
||||
import '../../state/session_state.dart';
|
||||
import '../../widgets/avatar_pipeline.dart';
|
||||
import 'ui.dart';
|
||||
|
||||
/// Display name + avatar, shared by the Home profile row and Settings.
|
||||
/// Backed by [SessionState.lastForm]; every change is persisted. The
|
||||
/// avatar goes through [encodeAvatar] (the same shrink the server gets)
|
||||
/// before its path is stored, and the encoded bytes are the preview.
|
||||
/// Colours offered in the profile card; the first is the default.
|
||||
const profileColors = <Color>[
|
||||
Colors.deepPurple,
|
||||
Colors.indigo,
|
||||
Colors.teal,
|
||||
Colors.pink,
|
||||
Colors.orange,
|
||||
Colors.blueGrey,
|
||||
];
|
||||
|
||||
const _keyPicture = 'avatarPng';
|
||||
const _keyColor = 'profileColor';
|
||||
|
||||
/// Sends a mid-session name/picture change (null = unchanged, empty
|
||||
/// avatar = removed). Swappable so tests can watch it.
|
||||
typedef ProfilePush = void Function({String? name, String? avatar});
|
||||
|
||||
/// The one place a profile change reaches the server.
|
||||
void pushProfileToSession({String? name, String? avatar}) {
|
||||
final session = SessionState.instance;
|
||||
if (session.route.peek() != AppRoute.session) return;
|
||||
session.coordinator.updateProfile(name: name, avatar: avatar);
|
||||
}
|
||||
|
||||
/// Display name, picture and colour of this app's user. Backed by
|
||||
/// [SessionState.lastForm] (name) and the connect-form box (the cropped
|
||||
/// 256 px PNG and the colour); every change is persisted, and while in a
|
||||
/// server it is pushed through [push] so everyone sees it at once.
|
||||
class Profile {
|
||||
static final Profile instance = Profile._();
|
||||
Profile._();
|
||||
|
||||
final name = signal('');
|
||||
final preview = signal<Uint8List?>(null);
|
||||
/// The cropped PNG; null shows the initial on [color].
|
||||
final picture = signal<Uint8List?>(null);
|
||||
final color = signal<Color>(profileColors.first);
|
||||
final error = signal<String?>(null);
|
||||
final picking = signal(false);
|
||||
ProfilePush push = pushProfileToSession;
|
||||
bool _loaded = false;
|
||||
Timer? _nameTimer;
|
||||
|
||||
void ensureLoaded() {
|
||||
/// Reads the stored profile once (the app shell starts it). Old installs
|
||||
/// stored a picture path: it is shrunk through [encodeAvatar] once and
|
||||
/// kept as bytes. A caller during the first read does not wait for it
|
||||
/// (no shared Future: tests run each in its own zone).
|
||||
Future<void> ensureLoaded() async {
|
||||
if (_loaded) return;
|
||||
_loaded = true;
|
||||
final f = SessionState.instance.lastForm;
|
||||
name.value = f.name;
|
||||
_refreshPreview(f.avatarPath);
|
||||
await _load();
|
||||
}
|
||||
|
||||
Future<void> _refreshPreview(String path) async {
|
||||
Future<void> _load() async {
|
||||
final form = SessionState.instance.lastForm;
|
||||
name.value = form.name;
|
||||
try {
|
||||
final b64 = await encodeAvatar(path);
|
||||
preview.value = b64.isEmpty ? null : base64Decode(b64);
|
||||
} catch (_) {
|
||||
preview.value = null;
|
||||
final box = connectFormBoxIfOpen() ?? await openConnectFormBox();
|
||||
final png = box.get(_keyPicture);
|
||||
final c = box.get(_keyColor);
|
||||
if (c is int) color.value = Color(c);
|
||||
if (png is Uint8List && png.isNotEmpty) {
|
||||
picture.value = png;
|
||||
} else if (form.avatarPath.isNotEmpty) {
|
||||
final b64 = await encodeAvatar(form.avatarPath);
|
||||
if (b64.isNotEmpty) picture.value = base64Decode(b64);
|
||||
form.avatarPath = '';
|
||||
await _save();
|
||||
}
|
||||
} catch (e) {
|
||||
// No store (tests) or an unreadable old picture: start without.
|
||||
debugPrint('profile load: $e');
|
||||
}
|
||||
}
|
||||
|
||||
/// The picture as sent in hello and profile updates; '' when none.
|
||||
String avatarBase64() {
|
||||
final png = picture.peek();
|
||||
return png == null ? '' : avatarWireBase64(png);
|
||||
}
|
||||
|
||||
void setName(String value) {
|
||||
name.value = value.trim();
|
||||
SessionState.instance.lastForm.name = value.trim();
|
||||
_save();
|
||||
final v = value.trim();
|
||||
if (v.isEmpty || v == name.peek()) return;
|
||||
name.value = v;
|
||||
SessionState.instance.lastForm.name = v;
|
||||
unawaited(_save());
|
||||
// Typing renames once it settles, not on every key.
|
||||
_nameTimer?.cancel();
|
||||
_nameTimer = Timer(const Duration(milliseconds: 600), () => push(name: name.peek()));
|
||||
}
|
||||
|
||||
Future<void> pickAvatar() async {
|
||||
if (picking.peek()) return;
|
||||
picking.value = true;
|
||||
Future<void> setPicture(Uint8List? png) async {
|
||||
picture.value = png;
|
||||
error.value = null;
|
||||
await _save();
|
||||
try {
|
||||
final List<PlatformFile> files;
|
||||
try {
|
||||
files = await FilePicker.pickFiles(
|
||||
dialogTitle: 'Pick avatar image',
|
||||
type: FileType.custom,
|
||||
allowedExtensions: const ['png', 'jpg', 'jpeg', 'webp'],
|
||||
);
|
||||
} catch (_) {
|
||||
error.value = 'file dialog unavailable — try again';
|
||||
return;
|
||||
}
|
||||
final path = files.isEmpty ? null : files.first.path;
|
||||
if (path == null) return;
|
||||
final String b64;
|
||||
try {
|
||||
b64 = await encodeAvatar(path);
|
||||
} on FormatException catch (e) {
|
||||
error.value = e.message;
|
||||
return;
|
||||
} catch (_) {
|
||||
error.value = 'could not read that image — pick a PNG, JPG or WebP photo';
|
||||
return;
|
||||
}
|
||||
SessionState.instance.lastForm.avatarPath = path;
|
||||
preview.value = b64.isEmpty ? null : base64Decode(b64);
|
||||
await _save();
|
||||
} finally {
|
||||
picking.value = false;
|
||||
push(avatar: png == null ? '' : avatarWireBase64(png));
|
||||
} on FormatException catch (e) {
|
||||
error.value = e.message;
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> clearAvatar() async {
|
||||
SessionState.instance.lastForm.avatarPath = '';
|
||||
preview.value = null;
|
||||
error.value = null;
|
||||
Future<void> setColor(Color c) async {
|
||||
color.value = c;
|
||||
await _save();
|
||||
}
|
||||
|
||||
Future<void> _save() async {
|
||||
try {
|
||||
await SessionState.instance.saveForm();
|
||||
final box = connectFormBoxIfOpen() ?? await openConnectFormBox();
|
||||
final png = picture.peek();
|
||||
await box.putAll({
|
||||
_keyPicture: png ?? Uint8List(0),
|
||||
_keyColor: color.peek().toARGB32(),
|
||||
});
|
||||
} catch (_) {
|
||||
error.value = 'could not save profile — try again';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Avatar circle with the initial as fallback.
|
||||
class ProfileAvatar extends StatelessWidget {
|
||||
final double radius;
|
||||
const ProfileAvatar({super.key, this.radius = 20});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = Profile.instance;
|
||||
return SignalBuilder(builder: (context) {
|
||||
final img = p.preview.value;
|
||||
final n = p.name.value;
|
||||
return CircleAvatar(
|
||||
radius: radius,
|
||||
backgroundColor: Theme.of(context).colorScheme.surfaceContainerHighest,
|
||||
backgroundImage: img != null ? MemoryImage(img) : null,
|
||||
child: img != null
|
||||
? null
|
||||
: p.picking.value
|
||||
? SizedBox(
|
||||
width: radius * 0.8,
|
||||
height: radius * 0.8,
|
||||
child: const CircularProgressIndicator(strokeWidth: 2))
|
||||
: Text(n.isEmpty ? '?' : n[0].toUpperCase(),
|
||||
style: TextStyle(fontSize: radius * 0.8)),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/// Avatar (tap to change) + name field. Used inline in Settings and in
|
||||
/// the Home profile dialog.
|
||||
class ProfileEditor extends StatefulWidget {
|
||||
final bool autofocus;
|
||||
final VoidCallback? onSubmitted;
|
||||
const ProfileEditor({super.key, this.autofocus = false, this.onSubmitted});
|
||||
|
||||
@override
|
||||
State<ProfileEditor> createState() => _ProfileEditorState();
|
||||
}
|
||||
|
||||
class _ProfileEditorState extends State<ProfileEditor> {
|
||||
late final _name = TextEditingController(text: Profile.instance.name.peek());
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_name.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = Profile.instance;
|
||||
return Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Tooltip(
|
||||
message: 'Change avatar',
|
||||
child: InkWell(
|
||||
customBorder: const CircleBorder(),
|
||||
onTap: p.pickAvatar,
|
||||
child: const ProfileAvatar(radius: 36),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: kGap),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
TextField(
|
||||
controller: _name,
|
||||
autofocus: widget.autofocus,
|
||||
decoration: fieldDecoration('Display name'),
|
||||
onChanged: p.setName,
|
||||
onSubmitted: (_) => widget.onSubmitted?.call(),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
SignalBuilder(builder: (context) {
|
||||
final err = p.error.value;
|
||||
return Wrap(
|
||||
crossAxisAlignment: WrapCrossAlignment.center,
|
||||
children: [
|
||||
TextButton(
|
||||
onPressed: p.pickAvatar,
|
||||
child: const Text('Change avatar')),
|
||||
if (p.preview.value != null)
|
||||
TextButton(
|
||||
onPressed: p.clearAvatar,
|
||||
child: const Text('Remove avatar')),
|
||||
if (err != null)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 8),
|
||||
child: Text(err,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: Theme.of(context).colorScheme.error)),
|
||||
),
|
||||
],
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> showProfileDialog(BuildContext context) {
|
||||
return showDialog<void>(
|
||||
context: context,
|
||||
builder: (context) => AlertDialog(
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(kRadius)),
|
||||
title: const Text('Profile'),
|
||||
content: SizedBox(
|
||||
width: 380,
|
||||
child: ProfileEditor(
|
||||
autofocus: true,
|
||||
onSubmitted: () => Navigator.pop(context),
|
||||
),
|
||||
),
|
||||
actions: [
|
||||
FilledButton(
|
||||
onPressed: () => Navigator.pop(context), child: const Text('Done')),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// Home's top-left: avatar + name, click to edit.
|
||||
class ProfileChip extends StatelessWidget {
|
||||
/// One line and a small avatar, for the Home top bar.
|
||||
final bool dense;
|
||||
/// Just the avatar, for very narrow windows.
|
||||
final bool avatarOnly;
|
||||
const ProfileChip({super.key, this.dense = false, this.avatarOnly = false});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final p = Profile.instance;
|
||||
return Tooltip(
|
||||
message: 'Edit profile',
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(kRadius),
|
||||
onTap: () => showProfileDialog(context),
|
||||
child: avatarOnly
|
||||
? const Padding(padding: EdgeInsets.all(4), child: ProfileAvatar(radius: 14))
|
||||
: Padding(
|
||||
padding: dense
|
||||
? const EdgeInsets.fromLTRB(4, 4, 10, 4)
|
||||
: const EdgeInsets.fromLTRB(6, 6, 14, 6),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
ProfileAvatar(radius: dense ? 14 : 20),
|
||||
SizedBox(width: dense ? 8 : 12),
|
||||
SignalBuilder(builder: (context) {
|
||||
final n = p.name.value;
|
||||
final t = Theme.of(context).textTheme;
|
||||
final name = Text(n.isEmpty ? 'Set your name' : n,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: (dense ? t.titleSmall : t.titleMedium)
|
||||
?.copyWith(color: n.isEmpty ? Colors.grey : null));
|
||||
if (dense) {
|
||||
return ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 200), child: name);
|
||||
}
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
name,
|
||||
Text('Edit profile',
|
||||
style: t.bodySmall?.copyWith(color: Colors.grey)),
|
||||
],
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -6,57 +6,31 @@ import '../../playback/playback_controller.dart';
|
||||
import '../../shaders/shader_presets.dart';
|
||||
import '../../state/settings.dart';
|
||||
import '../../update/update_controller.dart';
|
||||
import 'profile.dart';
|
||||
import 'ui.dart';
|
||||
import 'update_indicator.dart';
|
||||
|
||||
/// In-session keys, as handled by the session screen's global key handler.
|
||||
/// Player keys, as handled by the session player's key handler (while
|
||||
/// the player fills the window).
|
||||
const sessionShortcuts = [
|
||||
('Space', 'Toggle ready'),
|
||||
('← / →', 'Seek back / forward 10 s'),
|
||||
('Shift+→', 'Skip 1:30 (for everyone)'),
|
||||
('PgUp / PgDn', 'Previous / next chapter'),
|
||||
('F', 'Toggle fullscreen'),
|
||||
('Tab', 'Open / close the people & chat panel'),
|
||||
('Tab', 'Open / close chat & activity'),
|
||||
('Ctrl+R', 'Reload the video'),
|
||||
('> or Shift+N', 'Put up the next Jellyfin episode'),
|
||||
('< or Shift+P', 'Put up the previous Jellyfin episode'),
|
||||
('Ctrl+1…6', 'Shaders: Anime4K mode A, B, C, A+A, B+B, C+A'),
|
||||
('Ctrl+0', 'Shaders off'),
|
||||
('Esc', 'Close panel or fullscreen, else ask to leave'),
|
||||
('Esc', 'Close the panel or fullscreen, else ask to leave'),
|
||||
];
|
||||
|
||||
class SettingsPage extends StatelessWidget {
|
||||
final UpdateController? updates;
|
||||
const SettingsPage({super.key, this.updates});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return PageScroll(
|
||||
maxWidth: 680,
|
||||
children: [
|
||||
const PageTitle('Settings'),
|
||||
const _Section(title: 'Profile', child: ProfileEditor()),
|
||||
const _Section(
|
||||
title: 'Player',
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [_HwdecSetting(), SizedBox(height: 12), _MpvControlsSetting()],
|
||||
),
|
||||
),
|
||||
const _Section(title: 'Jellyfin', child: _AutoAdvanceSetting()),
|
||||
_Section(title: 'Updates', child: _UpdateSettings(controller: updates)),
|
||||
const _Section(title: 'Keyboard shortcuts', child: _ShortcutList()),
|
||||
const _Section(title: 'Video quality & shaders', child: _ShaderSettings()),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Section extends StatelessWidget {
|
||||
/// One titled panel of the Settings tab.
|
||||
class SettingsPanel extends StatelessWidget {
|
||||
final String title;
|
||||
final Widget child;
|
||||
const _Section({required this.title, required this.child});
|
||||
const SettingsPanel({super.key, required this.title, required this.child});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@@ -72,14 +46,14 @@ class _Section extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
class _HwdecSetting extends StatefulWidget {
|
||||
const _HwdecSetting();
|
||||
class HwdecSetting extends StatefulWidget {
|
||||
const HwdecSetting({super.key});
|
||||
|
||||
@override
|
||||
State<_HwdecSetting> createState() => _HwdecSettingState();
|
||||
State<HwdecSetting> createState() => _HwdecSettingState();
|
||||
}
|
||||
|
||||
class _HwdecSettingState extends State<_HwdecSetting> {
|
||||
class _HwdecSettingState extends State<HwdecSetting> {
|
||||
final _s = AppSettings.instance;
|
||||
late final _custom = TextEditingController(text: _s.hwdecCustom.peek());
|
||||
|
||||
@@ -130,8 +104,8 @@ class _HwdecSettingState extends State<_HwdecSetting> {
|
||||
}
|
||||
}
|
||||
|
||||
class _ShaderSettings extends StatelessWidget {
|
||||
const _ShaderSettings();
|
||||
class ShaderSettings extends StatelessWidget {
|
||||
const ShaderSettings({super.key});
|
||||
|
||||
Future<void> _addFiles() async {
|
||||
final List<PlatformFile> files;
|
||||
@@ -249,9 +223,9 @@ class _ShaderSettings extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
class _UpdateSettings extends StatelessWidget {
|
||||
class UpdateSettings extends StatelessWidget {
|
||||
final UpdateController? controller;
|
||||
const _UpdateSettings({this.controller});
|
||||
const UpdateSettings({super.key, this.controller});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@@ -301,8 +275,8 @@ class _UpdateSettings extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
class _MpvControlsSetting extends StatelessWidget {
|
||||
const _MpvControlsSetting();
|
||||
class MpvControlsSetting extends StatelessWidget {
|
||||
const MpvControlsSetting({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@@ -321,8 +295,8 @@ class _MpvControlsSetting extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
class _AutoAdvanceSetting extends StatelessWidget {
|
||||
const _AutoAdvanceSetting();
|
||||
class AutoAdvanceSetting extends StatelessWidget {
|
||||
const AutoAdvanceSetting({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
@@ -341,8 +315,8 @@ class _AutoAdvanceSetting extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
class _ShortcutList extends StatelessWidget {
|
||||
const _ShortcutList();
|
||||
class ShortcutList extends StatelessWidget {
|
||||
const ShortcutList({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
@@ -1,160 +0,0 @@
|
||||
import 'package:flutter/foundation.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:window_manager/window_manager.dart';
|
||||
|
||||
import '../../update/update_controller.dart';
|
||||
import '../../widgets/window_buttons.dart';
|
||||
import '../demo/shell_demo.dart';
|
||||
import 'profile.dart';
|
||||
import 'update_indicator.dart';
|
||||
|
||||
/// What the Home body shows: the two tabs, or one of the side pages.
|
||||
enum HomeView { join, host, settings, integrations, about }
|
||||
|
||||
const homeTopBarHeight = 48.0;
|
||||
|
||||
/// Below this width the bar drops the profile name and tab icons.
|
||||
const _compactBelow = 760.0;
|
||||
|
||||
/// Home's single top bar: profile, Join/Host tabs, update pill, page
|
||||
/// buttons and (in the real window) the drag area and window buttons.
|
||||
class HomeTopBar extends StatelessWidget {
|
||||
final HomeView view;
|
||||
final ValueChanged<HomeView> onSelect;
|
||||
final UpdateController? updates;
|
||||
/// Off in tests: the drag area and window buttons need window_manager.
|
||||
final bool windowControls;
|
||||
const HomeTopBar({
|
||||
super.key,
|
||||
required this.view,
|
||||
required this.onSelect,
|
||||
this.updates,
|
||||
this.windowControls = false,
|
||||
});
|
||||
|
||||
static const _pages = [
|
||||
(HomeView.settings, Icons.settings_outlined, Icons.settings, 'Settings'),
|
||||
(HomeView.integrations, Icons.extension_outlined, Icons.extension, 'Integrations'),
|
||||
(HomeView.about, Icons.info_outline, Icons.info, 'About'),
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(
|
||||
builder: (context, box) => _bar(context, compact: box.maxWidth < _compactBelow));
|
||||
}
|
||||
|
||||
Widget _bar(BuildContext context, {required bool compact}) {
|
||||
final scheme = Theme.of(context).colorScheme;
|
||||
final row = Row(
|
||||
children: [
|
||||
const SizedBox(width: 12),
|
||||
ProfileChip(dense: true, avatarOnly: compact),
|
||||
SizedBox(width: compact ? 8 : 20),
|
||||
_Tab(
|
||||
key: const ValueKey('tab-join'),
|
||||
label: 'Join',
|
||||
icon: compact ? null : Icons.login,
|
||||
selected: view == HomeView.join,
|
||||
onTap: () => onSelect(HomeView.join),
|
||||
),
|
||||
_Tab(
|
||||
key: const ValueKey('tab-host'),
|
||||
label: 'Host',
|
||||
icon: compact ? null : Icons.cast,
|
||||
selected: view == HomeView.host,
|
||||
onTap: () => onSelect(HomeView.host),
|
||||
),
|
||||
const Spacer(),
|
||||
UpdateIndicator(controller: updates),
|
||||
const SizedBox(width: 8),
|
||||
if (kDebugMode)
|
||||
IconButton(
|
||||
tooltip: 'Layout demo (debug builds only)',
|
||||
icon: const Icon(Icons.bug_report_outlined, size: 20, color: Colors.amber),
|
||||
onPressed: () => Navigator.of(context)
|
||||
.push(MaterialPageRoute<void>(builder: (_) => const ShellDemo())),
|
||||
),
|
||||
for (final (v, icon, selectedIcon, label) in _pages)
|
||||
IconButton(
|
||||
tooltip: label,
|
||||
isSelected: view == v,
|
||||
icon: Icon(icon, size: 20),
|
||||
selectedIcon: Icon(selectedIcon, size: 20, color: scheme.primary),
|
||||
onPressed: () => onSelect(v),
|
||||
),
|
||||
if (windowControls) ...[
|
||||
const SizedBox(width: 4),
|
||||
SizedBox(
|
||||
height: 20,
|
||||
child: VerticalDivider(width: 12, color: scheme.outlineVariant),
|
||||
),
|
||||
const WindowButtons(),
|
||||
] else
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
);
|
||||
final bar = SizedBox(height: homeTopBarHeight, child: row);
|
||||
return ColoredBox(
|
||||
color: scheme.surfaceContainerLowest,
|
||||
// Empty bar space drags the window; the controls on top take their
|
||||
// own clicks without waiting out the drag area's double-tap.
|
||||
child: windowControls
|
||||
? Stack(children: [
|
||||
const Positioned.fill(child: DragToMoveArea(child: SizedBox.expand())),
|
||||
bar,
|
||||
])
|
||||
: bar,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Tab extends StatelessWidget {
|
||||
final String label;
|
||||
final IconData? icon;
|
||||
final bool selected;
|
||||
final VoidCallback onTap;
|
||||
const _Tab(
|
||||
{super.key,
|
||||
required this.label,
|
||||
this.icon,
|
||||
required this.selected,
|
||||
required this.onTap});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final scheme = Theme.of(context).colorScheme;
|
||||
final color = selected ? scheme.primary : scheme.onSurfaceVariant;
|
||||
return Semantics(
|
||||
selected: selected,
|
||||
button: true,
|
||||
child: InkWell(
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
child: Container(
|
||||
height: homeTopBarHeight,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
decoration: BoxDecoration(
|
||||
border: Border(
|
||||
bottom: BorderSide(
|
||||
color: selected ? scheme.primary : Colors.transparent, width: 2),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
if (icon != null) ...[
|
||||
Icon(icon, size: 18, color: color),
|
||||
const SizedBox(width: 8),
|
||||
],
|
||||
Text(label,
|
||||
style: Theme.of(context).textTheme.titleSmall?.copyWith(
|
||||
color: color, fontWeight: selected ? FontWeight.w600 : null)),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,9 +7,8 @@ const repoUrl = 'https://git.senkochan.moe/Foxyz/sync_replay_project';
|
||||
|
||||
const kRadius = 12.0;
|
||||
const kGap = 16.0;
|
||||
const kPagePadding = EdgeInsets.fromLTRB(28, 20, 28, 28);
|
||||
|
||||
/// Rounded panel used by every Home/Settings section.
|
||||
/// Rounded panel used by every Settings section.
|
||||
class Panel extends StatelessWidget {
|
||||
final Widget child;
|
||||
final EdgeInsetsGeometry padding;
|
||||
@@ -38,33 +37,6 @@ class Panel extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// Page heading + optional subtitle, same spacing everywhere.
|
||||
class PageTitle extends StatelessWidget {
|
||||
final String title;
|
||||
final String? subtitle;
|
||||
const PageTitle(this.title, {super.key, this.subtitle});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final t = Theme.of(context).textTheme;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(bottom: kGap),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: t.headlineSmall),
|
||||
if (subtitle != null)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 4),
|
||||
child: Text(subtitle!,
|
||||
style: t.bodyMedium?.copyWith(color: Colors.grey)),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Small grey heading inside a panel.
|
||||
class SectionLabel extends StatelessWidget {
|
||||
final String text;
|
||||
@@ -87,7 +59,7 @@ class SectionLabel extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// Text field style shared by the connect cards.
|
||||
/// Outlined text field style (settings, Jellyfin sign-in).
|
||||
InputDecoration fieldDecoration(String label, {String? hint, Widget? suffix}) =>
|
||||
InputDecoration(
|
||||
labelText: label,
|
||||
@@ -97,31 +69,6 @@ InputDecoration fieldDecoration(String label, {String? hint, Widget? suffix}) =>
|
||||
border: OutlineInputBorder(borderRadius: BorderRadius.circular(8)),
|
||||
);
|
||||
|
||||
/// Single-item scrollable page body, width-capped so it doesn't sprawl
|
||||
/// on wide windows.
|
||||
class PageScroll extends StatelessWidget {
|
||||
final List<Widget> children;
|
||||
final double maxWidth;
|
||||
const PageScroll({super.key, required this.children, this.maxWidth = 920});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SingleChildScrollView(
|
||||
padding: kPagePadding,
|
||||
child: Align(
|
||||
alignment: Alignment.topLeft,
|
||||
child: ConstrainedBox(
|
||||
constraints: BoxConstraints(maxWidth: maxWidth),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: children,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Widest a single text field gets, however wide the window.
|
||||
const kFieldMaxWidth = 720.0;
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@ import '../../update/update_controller.dart';
|
||||
import '../../widgets/update_banner.dart';
|
||||
import 'ui.dart';
|
||||
|
||||
/// Compact "Update vX" pill for Home's top-right; hidden until there is
|
||||
/// Compact "Update vX" pill for the party strip; hidden until there is
|
||||
/// something to install. Click opens the full [UpdateBanner].
|
||||
class UpdateIndicator extends StatelessWidget {
|
||||
final UpdateController? controller;
|
||||
|
||||
Reference in new issue
Block a user