refactor: call_ui/voice_channel.dart (1123 Zeilen) in 5 thematische part-Dateien unter view/ geteilt (M2, zeichenidentisch verifiziert)
This commit is contained in:
Bernd Steckmeister
@@ -1413,3 +1413,5 @@
|
||||
2026-07-06 17:10 [Edit] C:\Users\nordm\pyramid - Kopie\ROADMAP.md
|
||||
2026-07-06 17:10 [Edit] C:\Users\nordm\pyramid - Kopie\docs\M2_MODULE_SCHNITT.md
|
||||
2026-07-06 17:10 [Edit] C:\Users\nordm\pyramid - Kopie\PROGRESS.md
|
||||
2026-07-06 17:12 [Write] C:\Users\nordm\AppData\Local\Temp\claude\C--Users-nordm-pyramid---Kopie\179608a1-16b3-4b6b-a9ed-c7969b88b37f\scratchpad\split_voice_channel.ps1
|
||||
2026-07-06 17:13 [Edit] C:\Users\nordm\AppData\Local\Temp\claude\C--Users-nordm-pyramid---Kopie\179608a1-16b3-4b6b-a9ed-c7969b88b37f\scratchpad\split_voice_channel.ps1
|
||||
|
||||
@@ -0,0 +1,173 @@
|
||||
part of '../voice_channel.dart';
|
||||
|
||||
class _BigAvatar extends StatelessWidget {
|
||||
final _ParticipantData data;
|
||||
final PyramidTheme pt;
|
||||
const _BigAvatar({required this.data, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Center(
|
||||
child: Container(
|
||||
width: 100, height: 100,
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(colors: [data.avatarColor, data.avatarColor.withAlpha(150)], begin: Alignment.topLeft, end: Alignment.bottomRight),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Center(child: Text(data.name.isNotEmpty ? data.name[0].toUpperCase() : '?', style: const TextStyle(color: Colors.white, fontSize: 40, fontWeight: FontWeight.bold))),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _SmallAvatar extends StatelessWidget {
|
||||
final _ParticipantData data;
|
||||
final PyramidTheme pt;
|
||||
const _SmallAvatar({required this.data, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Center(
|
||||
child: Container(
|
||||
width: 44, height: 44,
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(colors: [data.avatarColor, data.avatarColor.withAlpha(150)], begin: Alignment.topLeft, end: Alignment.bottomRight),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Center(child: Text(data.name.isNotEmpty ? data.name[0].toUpperCase() : '?', style: const TextStyle(color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold))),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CallControls extends StatelessWidget {
|
||||
final bool isMuted;
|
||||
final bool isDeafened;
|
||||
final bool isCameraOff;
|
||||
final bool isScreenSharing;
|
||||
final VoidCallback onToggleMic;
|
||||
final VoidCallback onToggleDeafen;
|
||||
final VoidCallback onToggleCam;
|
||||
final VoidCallback onToggleScreen;
|
||||
final VoidCallback onHangUp;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _CallControls({
|
||||
required this.isMuted,
|
||||
required this.isDeafened,
|
||||
required this.isCameraOff,
|
||||
required this.isScreenSharing,
|
||||
required this.onToggleMic,
|
||||
required this.onToggleDeafen,
|
||||
required this.onToggleCam,
|
||||
required this.onToggleScreen,
|
||||
required this.onHangUp,
|
||||
required this.pt,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SafeArea(
|
||||
top: false,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 20),
|
||||
decoration: BoxDecoration(color: pt.bg1, border: Border(top: BorderSide(color: pt.border))),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
_VoiceCtrlBtn(icon: isMuted ? Icons.mic_off_rounded : Icons.mic_rounded, danger: isMuted, pt: pt, onTap: onToggleMic),
|
||||
const SizedBox(width: 16),
|
||||
_VoiceCtrlBtn(icon: isDeafened ? Icons.headset_off_rounded : Icons.headphones_rounded, danger: isDeafened, pt: pt, onTap: onToggleDeafen),
|
||||
const SizedBox(width: 16),
|
||||
_VoiceCtrlBtn(icon: isCameraOff ? Icons.videocam_off_rounded : Icons.videocam_rounded, active: !isCameraOff, pt: pt, onTap: onToggleCam),
|
||||
const SizedBox(width: 16),
|
||||
_VoiceCtrlBtn(icon: Icons.screen_share_rounded, active: isScreenSharing, pt: pt, onTap: onToggleScreen),
|
||||
const SizedBox(width: 24),
|
||||
Container(width: 1, height: 32, color: pt.border),
|
||||
const SizedBox(width: 24),
|
||||
_VoiceCtrlBtn(icon: Icons.call_end_rounded, isDanger: true, pt: pt, onTap: onHangUp),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _NoCall extends StatelessWidget {
|
||||
final PyramidTheme pt;
|
||||
final WidgetRef ref;
|
||||
const _NoCall({required this.pt, required this.ref});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
color: pt.bg1,
|
||||
child: Column(
|
||||
children: [
|
||||
Container(
|
||||
height: 52,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
decoration: BoxDecoration(border: Border(bottom: BorderSide(color: pt.border))),
|
||||
child: Row(
|
||||
children: [
|
||||
PyrIconBtn(
|
||||
icon: const Icon(Icons.menu_rounded),
|
||||
tooltip: 'Toggle sidebar',
|
||||
onPressed: () => ref.read(railCollapsedProvider.notifier).update((s) => !s),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Icon(Icons.headphones_rounded, size: 16, color: pt.fgMuted),
|
||||
const SizedBox(width: 8),
|
||||
Text('No active call', style: TextStyle(color: pt.fg, fontSize: 15, fontWeight: FontWeight.w600)),
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text('𐃏', style: TextStyle(fontSize: 48, color: pt.fgDim.withAlpha(100))),
|
||||
const SizedBox(height: 12),
|
||||
Text('Join a voice room to start a call', style: TextStyle(color: pt.fgMuted, fontSize: 14)),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _FullscreenVideoPage extends StatelessWidget {
|
||||
final _ParticipantData data;
|
||||
const _FullscreenVideoPage({required this.data});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.black,
|
||||
body: Stack(children: [
|
||||
Positioned.fill(
|
||||
child: data.videoWidget != null
|
||||
? _MirrorWrapper(
|
||||
isLocal: data.id == 'local' || (data.originalParticipant is LocalParticipant),
|
||||
isScreenShare: data.isScreenShare,
|
||||
child: data.videoWidget!,
|
||||
)
|
||||
: _BigAvatar(data: data, pt: PyramidTheme.of(context)),
|
||||
),
|
||||
Positioned(
|
||||
top: 0, right: 0,
|
||||
child: SafeArea(
|
||||
child: IconButton(
|
||||
icon: const Icon(Icons.fullscreen_exit_rounded, color: Colors.white, size: 28),
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
),
|
||||
),
|
||||
),
|
||||
]),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,214 @@
|
||||
part of '../voice_channel.dart';
|
||||
|
||||
class _UnifiedCallView extends StatefulWidget {
|
||||
final List<_ParticipantData> participants;
|
||||
final bool isLiveKit;
|
||||
final String displayName;
|
||||
final bool isConnecting;
|
||||
final VoidCallback onHangUp;
|
||||
final VoidCallback onMinimize;
|
||||
final VoidCallback onToggleMic;
|
||||
final VoidCallback onToggleDeafen;
|
||||
final VoidCallback onToggleCam;
|
||||
final VoidCallback onToggleScreen;
|
||||
final bool isMuted;
|
||||
final bool isDeafened;
|
||||
final bool isCameraOff;
|
||||
final bool isScreenSharing;
|
||||
final Function(Offset)? onQualityMenu;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _UnifiedCallView({
|
||||
required this.participants,
|
||||
required this.isLiveKit,
|
||||
required this.displayName,
|
||||
required this.isConnecting,
|
||||
required this.onHangUp,
|
||||
required this.onMinimize,
|
||||
required this.onToggleMic,
|
||||
required this.onToggleDeafen,
|
||||
required this.onToggleCam,
|
||||
required this.onToggleScreen,
|
||||
required this.isMuted,
|
||||
required this.isDeafened,
|
||||
required this.isCameraOff,
|
||||
required this.isScreenSharing,
|
||||
this.onQualityMenu,
|
||||
required this.pt,
|
||||
});
|
||||
|
||||
@override
|
||||
State<_UnifiedCallView> createState() => _UnifiedCallViewState();
|
||||
}
|
||||
|
||||
class _UnifiedCallViewState extends State<_UnifiedCallView> {
|
||||
String? _heroId;
|
||||
bool _isGridView = false;
|
||||
bool _stripCollapsed = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_autoSelectHero();
|
||||
}
|
||||
|
||||
@override
|
||||
void didUpdateWidget(_UnifiedCallView oldWidget) {
|
||||
super.didUpdateWidget(oldWidget);
|
||||
_autoSelectHero();
|
||||
}
|
||||
|
||||
void _autoSelectHero() {
|
||||
if (_isGridView) return;
|
||||
final screenshare = widget.participants.firstWhereOrNull((p) => p.isScreenShare);
|
||||
if (screenshare != null && (_heroId == null || !widget.participants.any((p) => p.id == _heroId && p.hasVideo))) {
|
||||
_heroId = screenshare.id;
|
||||
} else if (_heroId == null && widget.participants.isNotEmpty) {
|
||||
final firstVideo = widget.participants.firstWhereOrNull((p) => p.hasVideo);
|
||||
if (firstVideo != null) _heroId = firstVideo.id;
|
||||
}
|
||||
}
|
||||
|
||||
List<_ParticipantData> _sorted(List<_ParticipantData> all) {
|
||||
int rank(_ParticipantData p) {
|
||||
if (p.isScreenShare) return 0;
|
||||
if (p.hasVideo) return 1;
|
||||
if (p.isSpeaking) return 2;
|
||||
return 3;
|
||||
}
|
||||
return [...all]..sort((a, b) => rank(a).compareTo(rank(b)));
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final pt = widget.pt;
|
||||
final all = _sorted(widget.participants);
|
||||
final hero = all.firstWhereOrNull((p) => p.id == _heroId) ?? (all.isNotEmpty ? all.first : null);
|
||||
|
||||
if (widget.isConnecting) {
|
||||
return Scaffold(
|
||||
backgroundColor: pt.bg1,
|
||||
body: Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const PyramidLoader(size: 80),
|
||||
const SizedBox(height: 20),
|
||||
Text('Verbinde…',
|
||||
style: TextStyle(color: pt.fgMuted, fontSize: 14)),
|
||||
const SizedBox(height: 16),
|
||||
TextButton.icon(
|
||||
style: TextButton.styleFrom(foregroundColor: pt.danger),
|
||||
onPressed: widget.onHangUp,
|
||||
icon: const Icon(Icons.call_end_rounded, size: 16),
|
||||
label: const Text('Abbrechen'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return Scaffold(
|
||||
backgroundColor: pt.bg1,
|
||||
body: Column(
|
||||
children: [
|
||||
_CallHeader(
|
||||
displayName: widget.displayName,
|
||||
isGridView: _isGridView,
|
||||
onToggleView: () => setState(() => _isGridView = !_isGridView),
|
||||
onMinimize: widget.onMinimize,
|
||||
pt: pt,
|
||||
),
|
||||
Expanded(
|
||||
child: AnimatedSwitcher(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
child: _isGridView || hero == null
|
||||
? _ParticipantGrid(participants: all, pt: pt, onSelect: (p) => setState(() { _heroId = p.id; _isGridView = false; }))
|
||||
: _HeroLayout(
|
||||
hero: hero,
|
||||
others: all.where((p) => p.id != hero.id).toList(),
|
||||
stripCollapsed: _stripCollapsed,
|
||||
onToggleStrip: () => setState(() => _stripCollapsed = !_stripCollapsed),
|
||||
onSetStripCollapsed: (v) => setState(() => _stripCollapsed = v),
|
||||
onSelectOther: (p) => setState(() => _heroId = p.id),
|
||||
onQualityMenu: widget.onQualityMenu,
|
||||
pt: pt,
|
||||
),
|
||||
),
|
||||
),
|
||||
_CallControls(
|
||||
isMuted: widget.isMuted,
|
||||
isDeafened: widget.isDeafened,
|
||||
isCameraOff: widget.isCameraOff,
|
||||
isScreenSharing: widget.isScreenSharing,
|
||||
onToggleMic: widget.onToggleMic,
|
||||
onToggleDeafen: widget.onToggleDeafen,
|
||||
onToggleCam: widget.onToggleCam,
|
||||
onToggleScreen: widget.onToggleScreen,
|
||||
onHangUp: widget.onHangUp,
|
||||
pt: pt,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CallHeader extends StatelessWidget {
|
||||
final String displayName;
|
||||
final bool isGridView;
|
||||
final VoidCallback onToggleView;
|
||||
final VoidCallback onMinimize;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _CallHeader({required this.displayName, required this.isGridView, required this.onToggleView, required this.onMinimize, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
height: 52,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
decoration: BoxDecoration(border: Border(bottom: BorderSide(color: pt.border))),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.headphones_rounded, size: 16, color: pt.fgMuted),
|
||||
const SizedBox(width: 8),
|
||||
Text(displayName, style: TextStyle(color: pt.fg, fontSize: 15, fontWeight: FontWeight.w600)),
|
||||
const SizedBox(width: 8),
|
||||
_LiveBadge(pt: pt),
|
||||
const Spacer(),
|
||||
PyrIconBtn(
|
||||
icon: Icon(isGridView ? Icons.grid_view_rounded : Icons.featured_video_rounded, color: isGridView ? pt.accent : pt.fg),
|
||||
tooltip: isGridView ? 'Hero mode' : 'Grid mode',
|
||||
onPressed: onToggleView,
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
PyrIconBtn(
|
||||
icon: Icon(Icons.close_fullscreen_rounded, color: pt.fg),
|
||||
tooltip: 'Minimieren',
|
||||
onPressed: onMinimize,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _LiveBadge extends StatelessWidget {
|
||||
final PyramidTheme pt;
|
||||
const _LiveBadge({required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(borderRadius: BorderRadius.circular(999), color: pt.online.withAlpha(30)),
|
||||
child: Row(children: [
|
||||
Container(width: 6, height: 6, decoration: BoxDecoration(color: pt.online, shape: BoxShape.circle)),
|
||||
const SizedBox(width: 4),
|
||||
Text('Live', style: TextStyle(color: pt.online, fontSize: 11, fontWeight: FontWeight.w600)),
|
||||
]),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,424 @@
|
||||
part of '../voice_channel.dart';
|
||||
|
||||
class _ParticipantGrid extends StatelessWidget {
|
||||
final List<_ParticipantData> participants;
|
||||
final PyramidTheme pt;
|
||||
final Function(_ParticipantData) onSelect;
|
||||
|
||||
const _ParticipantGrid({required this.participants, required this.pt, required this.onSelect});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, box) {
|
||||
final cols = box.maxWidth > 900 ? 4 : (box.maxWidth > 600 ? 3 : 2);
|
||||
const spacing = 12.0;
|
||||
final tileWidth = (box.maxWidth - spacing * (cols - 1) - 24) / cols;
|
||||
|
||||
return SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: Wrap(
|
||||
spacing: spacing,
|
||||
runSpacing: spacing,
|
||||
children: participants.map((p) => SizedBox(
|
||||
width: tileWidth,
|
||||
height: tileWidth / p.aspectRatio,
|
||||
child: _ParticipantTile(data: p, pt: pt, onTap: () => onSelect(p)),
|
||||
)).toList(),
|
||||
),
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
class _HeroLayout extends StatelessWidget {
|
||||
final _ParticipantData hero;
|
||||
final List<_ParticipantData> others;
|
||||
final bool stripCollapsed;
|
||||
final VoidCallback onToggleStrip;
|
||||
final Function(bool) onSetStripCollapsed;
|
||||
final Function(_ParticipantData) onSelectOther;
|
||||
final Function(Offset)? onQualityMenu;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _HeroLayout({
|
||||
required this.hero,
|
||||
required this.others,
|
||||
required this.stripCollapsed,
|
||||
required this.onToggleStrip,
|
||||
required this.onSetStripCollapsed,
|
||||
required this.onSelectOther,
|
||||
this.onQualityMenu,
|
||||
required this.pt,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(builder: (context, box) {
|
||||
final isLandscape = box.maxWidth > box.maxHeight && box.maxWidth > 600;
|
||||
|
||||
final heroView = _HeroSection(
|
||||
data: hero,
|
||||
onQualityMenu: onQualityMenu,
|
||||
pt: pt,
|
||||
);
|
||||
|
||||
final strip = _ParticipantStrip(
|
||||
participants: others,
|
||||
isVertical: isLandscape,
|
||||
onSelect: onSelectOther,
|
||||
pt: pt,
|
||||
);
|
||||
|
||||
if (isLandscape) {
|
||||
return Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: GestureDetector(
|
||||
onHorizontalDragEnd: (details) {
|
||||
if (details.primaryVelocity! < -300) onSetStripCollapsed(false);
|
||||
if (details.primaryVelocity! > 300) onSetStripCollapsed(true);
|
||||
},
|
||||
child: heroView,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (!stripCollapsed)
|
||||
SizedBox(width: 200, child: Padding(padding: const EdgeInsets.only(right: 12, top: 12, bottom: 12), child: strip)),
|
||||
_CollapseHandle(isVertical: true, collapsed: stripCollapsed, onToggle: onToggleStrip, pt: pt),
|
||||
],
|
||||
);
|
||||
} else {
|
||||
return Column(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: GestureDetector(
|
||||
onVerticalDragEnd: (details) {
|
||||
if (details.primaryVelocity! < -300) onSetStripCollapsed(false);
|
||||
if (details.primaryVelocity! > 300) onSetStripCollapsed(true);
|
||||
},
|
||||
child: heroView,
|
||||
),
|
||||
),
|
||||
),
|
||||
_CollapseHandle(isVertical: false, collapsed: stripCollapsed, onToggle: onToggleStrip, pt: pt),
|
||||
if (!stripCollapsed)
|
||||
SizedBox(height: 120, child: Padding(padding: const EdgeInsets.only(bottom: 12, left: 12, right: 12), child: strip)),
|
||||
],
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
class _HeroSection extends StatefulWidget {
|
||||
final _ParticipantData data;
|
||||
final Function(Offset)? onQualityMenu;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _HeroSection({required this.data, this.onQualityMenu, required this.pt});
|
||||
|
||||
@override
|
||||
State<_HeroSection> createState() => _HeroSectionState();
|
||||
}
|
||||
|
||||
class _HeroSectionState extends State<_HeroSection> {
|
||||
bool _hovered = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final pt = widget.pt;
|
||||
return MouseRegion(
|
||||
onEnter: (_) => setState(() => _hovered = true),
|
||||
onExit: (_) => setState(() => _hovered = false),
|
||||
child: GestureDetector(
|
||||
onTap: () => setState(() => _hovered = !_hovered),
|
||||
child: Center(
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(pt.rLg),
|
||||
child: Container(
|
||||
color: Colors.black,
|
||||
child: Stack(
|
||||
children: [
|
||||
Positioned.fill(
|
||||
child: widget.data.videoWidget != null
|
||||
? _MirrorWrapper(
|
||||
isLocal: widget.data.id == 'local' || (widget.data.originalParticipant is LocalParticipant),
|
||||
isScreenShare: widget.data.isScreenShare,
|
||||
child: widget.data.videoWidget!,
|
||||
)
|
||||
: _BigAvatar(data: widget.data, pt: pt),
|
||||
),
|
||||
|
||||
AnimatedPositioned(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
top: _hovered ? 0 : -60, left: 0, right: 0,
|
||||
child: _HeroTopBar(data: widget.data, pt: pt),
|
||||
),
|
||||
|
||||
AnimatedPositioned(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
bottom: _hovered ? 0 : -60, left: 0, right: 0,
|
||||
child: _HeroBottomBar(
|
||||
data: widget.data,
|
||||
onQualityMenu: widget.onQualityMenu,
|
||||
pt: pt,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _HeroTopBar extends StatelessWidget {
|
||||
final _ParticipantData data;
|
||||
final PyramidTheme pt;
|
||||
const _HeroTopBar({required this.data, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [Colors.black54, Colors.transparent]),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
if (data.isScreenShare) _LivePill(pt: pt),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
data.isScreenShare ? "${data.name} präsentiert" : data.name,
|
||||
style: const TextStyle(color: Colors.white, fontWeight: FontWeight.w600, fontSize: 14),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _HeroBottomBar extends StatelessWidget {
|
||||
final _ParticipantData data;
|
||||
final Function(Offset)? onQualityMenu;
|
||||
final PyramidTheme pt;
|
||||
const _HeroBottomBar({required this.data, this.onQualityMenu, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(begin: Alignment.bottomCenter, end: Alignment.topCenter, colors: [Colors.black54, Colors.transparent]),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Spacer(),
|
||||
if (onQualityMenu != null)
|
||||
_HeroActionBtn(icon: Icons.settings_rounded, onTapDown: (d) => onQualityMenu!(d.globalPosition)),
|
||||
const SizedBox(width: 8),
|
||||
_HeroActionBtn(
|
||||
icon: Icons.fullscreen_rounded,
|
||||
onTap: () => Navigator.of(context).push(MaterialPageRoute(
|
||||
fullscreenDialog: true,
|
||||
builder: (_) => _FullscreenVideoPage(data: data),
|
||||
)),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _HeroActionBtn extends StatelessWidget {
|
||||
final IconData icon;
|
||||
final VoidCallback? onTap;
|
||||
final Function(TapDownDetails)? onTapDown;
|
||||
const _HeroActionBtn({required this.icon, this.onTap, this.onTapDown});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
onTapDown: onTapDown,
|
||||
child: Container(
|
||||
width: 36, height: 36,
|
||||
decoration: BoxDecoration(color: Colors.white24, borderRadius: BorderRadius.circular(8)),
|
||||
child: Icon(icon, color: Colors.white, size: 20),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _LivePill extends StatelessWidget {
|
||||
final PyramidTheme pt;
|
||||
const _LivePill({required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(color: const Color(0xFFEF4444), borderRadius: BorderRadius.circular(4)),
|
||||
child: Row(mainAxisSize: MainAxisSize.min, children: [
|
||||
Container(width: 4, height: 4, decoration: const BoxDecoration(color: Colors.white, shape: BoxShape.circle)),
|
||||
const SizedBox(width: 4),
|
||||
const Text('LIVE', style: TextStyle(color: Colors.white, fontSize: 9, fontWeight: FontWeight.w800, letterSpacing: 0.5)),
|
||||
]),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ParticipantStrip extends StatelessWidget {
|
||||
final List<_ParticipantData> participants;
|
||||
final bool isVertical;
|
||||
final Function(_ParticipantData) onSelect;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _ParticipantStrip({required this.participants, required this.isVertical, required this.onSelect, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ListView.separated(
|
||||
scrollDirection: isVertical ? Axis.vertical : Axis.horizontal,
|
||||
itemCount: participants.length,
|
||||
separatorBuilder: (_, _) => const SizedBox(width: 12, height: 12),
|
||||
itemBuilder: (context, i) => SizedBox(
|
||||
width: isVertical ? double.infinity : 101 * participants[i].aspectRatio,
|
||||
height: 101,
|
||||
child: _ParticipantTile(data: participants[i], pt: pt, onTap: () => onSelect(participants[i])),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ParticipantTile extends StatefulWidget {
|
||||
final _ParticipantData data;
|
||||
final PyramidTheme pt;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const _ParticipantTile({required this.data, required this.pt, required this.onTap});
|
||||
|
||||
@override
|
||||
State<_ParticipantTile> createState() => _ParticipantTileState();
|
||||
}
|
||||
|
||||
class _ParticipantTileState extends State<_ParticipantTile> with SingleTickerProviderStateMixin {
|
||||
late AnimationController _speakingCtrl;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_speakingCtrl = AnimationController(vsync: this, duration: const Duration(milliseconds: 800))..repeat(reverse: true);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_speakingCtrl.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final pt = widget.pt;
|
||||
final data = widget.data;
|
||||
|
||||
return GestureDetector(
|
||||
onTap: widget.onTap,
|
||||
child: AnimatedBuilder(
|
||||
animation: _speakingCtrl,
|
||||
builder: (context, _) {
|
||||
final isSpeaking = data.isSpeaking;
|
||||
final pulse = isSpeaking ? _speakingCtrl.value : 0.0;
|
||||
|
||||
return AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 200),
|
||||
decoration: BoxDecoration(
|
||||
color: pt.bg2,
|
||||
borderRadius: BorderRadius.circular(pt.rBase),
|
||||
border: Border.all(
|
||||
color: isSpeaking
|
||||
? pt.accent.withAlpha((150 + pulse * 105).toInt())
|
||||
: pt.border,
|
||||
width: isSpeaking ? 2 : 1,
|
||||
),
|
||||
boxShadow: isSpeaking
|
||||
? [BoxShadow(color: pt.accent.withAlpha((20 + pulse * 40).toInt()), blurRadius: 4 + pulse * 8, spreadRadius: pulse * 2)]
|
||||
: null,
|
||||
),
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(pt.rBase - 1),
|
||||
child: Stack(
|
||||
children: [
|
||||
Positioned.fill(
|
||||
child: data.videoWidget != null
|
||||
? _MirrorWrapper(
|
||||
isLocal: data.id == 'local' || (data.originalParticipant is LocalParticipant),
|
||||
isScreenShare: data.isScreenShare,
|
||||
child: data.videoWidget!,
|
||||
)
|
||||
: _SmallAvatar(data: data, pt: pt),
|
||||
),
|
||||
|
||||
Positioned(
|
||||
left: 6, bottom: 6, right: 6,
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(color: Colors.black54, borderRadius: BorderRadius.circular(4)),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
if (data.isMuted) ...[Icon(Icons.mic_off_rounded, size: 10, color: pt.danger), const SizedBox(width: 4)],
|
||||
Flexible(child: Text(data.name, style: const TextStyle(color: Colors.white, fontSize: 10, fontWeight: FontWeight.w500), overflow: TextOverflow.ellipsis)),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (data.isScreenShare) Positioned(top: 6, left: 6, child: _LivePill(pt: pt)),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CollapseHandle extends StatelessWidget {
|
||||
final bool isVertical;
|
||||
final bool collapsed;
|
||||
final VoidCallback onToggle;
|
||||
final PyramidTheme pt;
|
||||
|
||||
const _CollapseHandle({required this.isVertical, required this.collapsed, required this.onToggle, required this.pt});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onToggle,
|
||||
child: Container(
|
||||
width: isVertical ? 24 : double.infinity,
|
||||
height: isVertical ? double.infinity : 24,
|
||||
color: Colors.transparent,
|
||||
child: Center(
|
||||
child: Icon(
|
||||
isVertical
|
||||
? (collapsed ? Icons.chevron_left_rounded : Icons.chevron_right_rounded)
|
||||
: (collapsed ? Icons.keyboard_arrow_up_rounded : Icons.keyboard_arrow_down_rounded),
|
||||
color: pt.fgDim, size: 20,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,126 @@
|
||||
part of '../voice_channel.dart';
|
||||
|
||||
void _handleLiveKitScreenShare(BuildContext context, VoiceChannelService call) async {
|
||||
if (call.isScreenSharing) {
|
||||
await call.stopScreenShare();
|
||||
} else {
|
||||
final source = await ScreenSharePicker.show(context);
|
||||
if (source != null) await call.startScreenShare(source.id);
|
||||
}
|
||||
}
|
||||
|
||||
void _showLiveKitQualityMenu(BuildContext context, VoiceChannelService call, Offset pos) {
|
||||
final pt = PyramidTheme.of(context);
|
||||
showMenu(
|
||||
context: context,
|
||||
position: RelativeRect.fromLTRB(pos.dx - 210, pos.dy - 350, pos.dx, pos.dy),
|
||||
color: pt.bg2,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(pt.rBase)),
|
||||
items: <PopupMenuEntry>[
|
||||
const PopupMenuItem(enabled: false, height: 28, child: Text('SENDEN', style: TextStyle(fontSize: 10, fontWeight: FontWeight.w700, color: Colors.grey))),
|
||||
for (final q in [('sd', 'SD', '360p'), ('hd', 'HD', '720p'), ('fhd', 'Full HD', '1080p'), ('4k', '4K', '2160p')])
|
||||
PopupMenuItem(onTap: () => call.changeQuality(q.$1), child: _QualityItem(label: q.$2, hint: q.$3, active: call.currentQualityKey == q.$1, pt: pt)),
|
||||
const PopupMenuDivider(),
|
||||
const PopupMenuItem(enabled: false, height: 28, child: Text('EMPFANGEN', style: TextStyle(fontSize: 10, fontWeight: FontWeight.w700, color: Colors.grey))),
|
||||
for (final q in [('auto', 'Auto', ''), ('high', 'Hoch', 'FHD'), ('medium', 'Mittel', 'HD'), ('low', 'Niedrig', 'SD')])
|
||||
PopupMenuItem(onTap: () => call.setSubscribeQuality(q.$1), child: _QualityItem(label: q.$2, hint: q.$3, active: call.subscribeQualityKey == q.$1, pt: pt)),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
void _showVoipQualityMenu(BuildContext context, CallSignalingService voip, Offset pos) {
|
||||
final pt = PyramidTheme.of(context);
|
||||
showMenu(
|
||||
context: context,
|
||||
position: RelativeRect.fromLTRB(pos.dx - 210, pos.dy - 200, pos.dx, pos.dy),
|
||||
color: pt.bg2,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(pt.rBase)),
|
||||
items: <PopupMenuEntry>[
|
||||
const PopupMenuItem(enabled: false, height: 28, child: Text('SENDEN', style: TextStyle(fontSize: 10, fontWeight: FontWeight.w700, color: Colors.grey))),
|
||||
for (final q in [('sd', 'SD', '360p'), ('hd', 'HD', '720p'), ('fhd', 'Full HD', '1080p'), ('4k', '4K', '2160p')])
|
||||
PopupMenuItem(onTap: () => voip.changeQuality(q.$1), child: _QualityItem(label: q.$2, hint: q.$3, active: voip.currentQualityKey == q.$1, pt: pt)),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
class _QualityItem extends StatelessWidget {
|
||||
final String label;
|
||||
final String? hint;
|
||||
final bool active;
|
||||
final PyramidTheme pt;
|
||||
const _QualityItem({required this.label, required this.active, required this.pt, this.hint});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Row(children: [
|
||||
if (active) Icon(Icons.check_rounded, size: 16, color: pt.accent) else const SizedBox(width: 16),
|
||||
const SizedBox(width: 8),
|
||||
Text(label, style: TextStyle(color: active ? pt.accent : pt.fg, fontSize: 13, fontWeight: active ? FontWeight.bold : FontWeight.normal)),
|
||||
if (hint != null && hint!.isNotEmpty) ...[const Spacer(), Text(hint!, style: TextStyle(color: pt.fgMuted, fontSize: 11))],
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
class _VoiceCtrlBtn extends StatefulWidget {
|
||||
final IconData icon;
|
||||
final PyramidTheme pt;
|
||||
final bool active;
|
||||
final bool danger;
|
||||
final bool isDanger;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const _VoiceCtrlBtn({required this.icon, required this.pt, this.onTap, this.active = false, this.danger = false, this.isDanger = false});
|
||||
|
||||
@override
|
||||
State<_VoiceCtrlBtn> createState() => _VoiceCtrlBtnState();
|
||||
}
|
||||
|
||||
class _VoiceCtrlBtnState extends State<_VoiceCtrlBtn> {
|
||||
bool _hovered = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final pt = widget.pt;
|
||||
Color bg;
|
||||
Color iconColor;
|
||||
if (widget.isDanger) { bg = pt.danger; iconColor = Colors.white; }
|
||||
else if (widget.danger) { bg = pt.danger.withAlpha(30); iconColor = pt.danger; }
|
||||
else if (widget.active) { bg = pt.accent.withAlpha(30); iconColor = pt.accent; }
|
||||
else { bg = _hovered ? pt.bgHover : pt.bg3; iconColor = pt.fg; }
|
||||
|
||||
return MouseRegion(
|
||||
cursor: SystemMouseCursors.click,
|
||||
onEnter: (_) => setState(() => _hovered = true),
|
||||
onExit: (_) => setState(() => _hovered = false),
|
||||
child: GestureDetector(
|
||||
onTap: widget.onTap,
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 150),
|
||||
width: 52, height: 52,
|
||||
decoration: BoxDecoration(color: bg, borderRadius: BorderRadius.circular(26)),
|
||||
child: Center(child: Icon(widget.icon, size: 20, color: iconColor)),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _MirrorWrapper extends StatelessWidget {
|
||||
final Widget child;
|
||||
final bool isLocal;
|
||||
final bool isScreenShare;
|
||||
|
||||
const _MirrorWrapper({required this.child, required this.isLocal, required this.isScreenShare});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (isLocal && !isScreenShare) {
|
||||
return Transform(
|
||||
alignment: Alignment.center,
|
||||
transform: Matrix4.identity()..rotateY(3.14159),
|
||||
child: child,
|
||||
);
|
||||
}
|
||||
return child;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,178 @@
|
||||
part of '../voice_channel.dart';
|
||||
|
||||
// Unified participant data to handle both LiveKit and VoIP
|
||||
class _ParticipantData {
|
||||
final String id;
|
||||
final String name;
|
||||
final Widget? videoWidget;
|
||||
final bool isSpeaking;
|
||||
final bool isMuted;
|
||||
final bool hasVideo;
|
||||
final bool isScreenShare;
|
||||
final Color avatarColor;
|
||||
final dynamic originalParticipant;
|
||||
final double aspectRatio;
|
||||
|
||||
const _ParticipantData({
|
||||
required this.id,
|
||||
required this.name,
|
||||
this.videoWidget,
|
||||
this.isSpeaking = false,
|
||||
this.isMuted = false,
|
||||
this.hasVideo = false,
|
||||
this.isScreenShare = false,
|
||||
this.avatarColor = Colors.grey,
|
||||
this.originalParticipant,
|
||||
this.aspectRatio = 16.0 / 9.0,
|
||||
});
|
||||
}
|
||||
|
||||
class VoiceChannelView extends ConsumerWidget {
|
||||
const VoiceChannelView({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final pt = PyramidTheme.of(context);
|
||||
final call = ref.watch(voiceChannelProvider);
|
||||
final voip = ref.watch(callSignalingProvider);
|
||||
|
||||
if (voip.currentCall != null && voip.currentCall!.state != CallState.kEnded) {
|
||||
return _UnifiedCallView(
|
||||
participants: _getVoipParticipants(voip),
|
||||
isLiveKit: false,
|
||||
displayName: voip.currentCall!.room.getLocalizedDisplayname(),
|
||||
isConnecting: false,
|
||||
onHangUp: () {
|
||||
voip.hangup();
|
||||
ref.read(viewModeProvider.notifier).state = ViewMode.chat;
|
||||
},
|
||||
onMinimize: () =>
|
||||
ref.read(viewModeProvider.notifier).state = ViewMode.chat,
|
||||
onToggleMic: voip.toggleMic,
|
||||
onToggleDeafen: voip.toggleDeafen,
|
||||
onToggleCam: voip.toggleCamera,
|
||||
onToggleScreen: () => voip.toggleScreenSharing(context),
|
||||
isMuted: voip.isMicMuted,
|
||||
isDeafened: voip.isDeafened,
|
||||
isCameraOff: voip.isCameraMuted,
|
||||
isScreenSharing: voip.isScreensharing,
|
||||
onQualityMenu: (pos) => _showVoipQualityMenu(context, voip, pos),
|
||||
pt: pt,
|
||||
);
|
||||
}
|
||||
|
||||
if (!call.isActive) {
|
||||
return _NoCall(pt: pt, ref: ref);
|
||||
}
|
||||
|
||||
return _UnifiedCallView(
|
||||
participants: _getLiveKitParticipants(call),
|
||||
isLiveKit: true,
|
||||
displayName: call.displayName,
|
||||
isConnecting: call.isConnecting,
|
||||
onHangUp: () {
|
||||
call.hangUp();
|
||||
ref.read(viewModeProvider.notifier).state = ViewMode.chat;
|
||||
},
|
||||
onMinimize: () =>
|
||||
ref.read(viewModeProvider.notifier).state = ViewMode.chat,
|
||||
onToggleMic: call.toggleMute,
|
||||
onToggleDeafen: call.toggleDeafen,
|
||||
onToggleCam: call.toggleCamera,
|
||||
onToggleScreen: () => _handleLiveKitScreenShare(context, call),
|
||||
isMuted: call.isMuted,
|
||||
isDeafened: call.isDeafened,
|
||||
isCameraOff: call.isCameraOff,
|
||||
isScreenSharing: call.isScreenSharing,
|
||||
onQualityMenu: (pos) => _showLiveKitQualityMenu(context, call, pos),
|
||||
pt: pt,
|
||||
);
|
||||
}
|
||||
|
||||
List<_ParticipantData> _getLiveKitParticipants(VoiceChannelService call) {
|
||||
final room = call.room;
|
||||
if (room == null) return [];
|
||||
final all = <Participant>[
|
||||
if (room.localParticipant != null) room.localParticipant!,
|
||||
...room.remoteParticipants.values,
|
||||
];
|
||||
|
||||
return all.mapIndexed((i, p) {
|
||||
final screenPub = p.videoTrackPublications.firstWhereOrNull((v) => v.source == TrackSource.screenShareVideo);
|
||||
final camPub = p.videoTrackPublications.firstWhereOrNull((v) => v.source == TrackSource.camera);
|
||||
final videoTrack = (screenPub?.track ?? camPub?.track) as VideoTrack?;
|
||||
final isScreen = screenPub != null;
|
||||
|
||||
double ar = 16.0 / 9.0;
|
||||
if (videoTrack != null) {
|
||||
try {
|
||||
final dim = (videoTrack as dynamic).currentDimensions ?? (videoTrack as dynamic).dimensions;
|
||||
if (dim != null) {
|
||||
final w = (dim.width as num?)?.toDouble() ?? 0;
|
||||
final h = (dim.height as num?)?.toDouble() ?? 0;
|
||||
if (w > 0 && h > 0) ar = w / h;
|
||||
}
|
||||
} catch (_) {}
|
||||
}
|
||||
|
||||
return _ParticipantData(
|
||||
id: p.identity,
|
||||
name: p.identity == room.localParticipant?.identity ? 'Du' : p.identity,
|
||||
videoWidget: videoTrack != null ? VideoTrackRenderer(videoTrack, fit: VideoViewFit.contain) : null,
|
||||
isSpeaking: p.isSpeaking,
|
||||
isMuted: !p.isMicrophoneEnabled(),
|
||||
hasVideo: videoTrack != null,
|
||||
isScreenShare: isScreen,
|
||||
avatarColor: _avatarColors[i % _avatarColors.length],
|
||||
originalParticipant: p,
|
||||
aspectRatio: ar,
|
||||
);
|
||||
}).toList();
|
||||
}
|
||||
|
||||
List<_ParticipantData> _getVoipParticipants(CallSignalingService voip) {
|
||||
final participants = <_ParticipantData>[];
|
||||
|
||||
double ar(rtc.RTCVideoRenderer r) {
|
||||
final w = r.videoWidth.toDouble();
|
||||
final h = r.videoHeight.toDouble();
|
||||
return (w > 0 && h > 0) ? w / h : 16.0 / 9.0;
|
||||
}
|
||||
|
||||
// Remote
|
||||
final isRemoteScreen = voip.isRemoteScreensharing;
|
||||
final hasRemoteVideo = voip.remoteRenderer.srcObject != null && voip.remoteRenderer.srcObject!.getVideoTracks().isNotEmpty;
|
||||
participants.add(_ParticipantData(
|
||||
id: 'remote',
|
||||
name: voip.currentCall?.room.getLocalizedDisplayname() ?? 'Remote',
|
||||
videoWidget: hasRemoteVideo ? rtc.RTCVideoView(voip.remoteRenderer, objectFit: rtc.RTCVideoViewObjectFit.RTCVideoViewObjectFitContain) : null,
|
||||
isMuted: false,
|
||||
hasVideo: hasRemoteVideo,
|
||||
isScreenShare: isRemoteScreen,
|
||||
avatarColor: _avatarColors[1],
|
||||
aspectRatio: hasRemoteVideo ? ar(voip.remoteRenderer) : 16.0 / 9.0,
|
||||
));
|
||||
|
||||
// Local
|
||||
final isLocalScreen = voip.isScreensharing;
|
||||
final hasLocalVideo = voip.localRenderer.srcObject != null && voip.localRenderer.srcObject!.getVideoTracks().isNotEmpty;
|
||||
participants.add(_ParticipantData(
|
||||
id: 'local',
|
||||
name: 'Du',
|
||||
videoWidget: hasLocalVideo ? rtc.RTCVideoView(voip.localRenderer, objectFit: rtc.RTCVideoViewObjectFit.RTCVideoViewObjectFitContain) : null,
|
||||
isMuted: voip.isMicMuted,
|
||||
hasVideo: hasLocalVideo,
|
||||
isScreenShare: isLocalScreen,
|
||||
avatarColor: _avatarColors[0],
|
||||
aspectRatio: hasLocalVideo ? ar(voip.localRenderer) : 16.0 / 9.0,
|
||||
));
|
||||
|
||||
return participants;
|
||||
}
|
||||
|
||||
static const _avatarColors = [
|
||||
Color(0xFFFF6B9D), Color(0xFF06B6D4), Color(0xFFA855F7),
|
||||
Color(0xFF10B981), Color(0xFFF59E0B), Color(0xFFEF4444),
|
||||
Color(0xFF3B82F6), Color(0xFF84CC16),
|
||||
];
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user