511 lines
17 KiB
Dart
511 lines
17 KiB
Dart
// ignore_for_file: prefer_const_constructors, sort_child_properties_last
|
|
|
|
import 'package:flutter/material.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
|
|
import '../../app/injection_container.dart';
|
|
import '../../core/errors/friendly_error.dart';
|
|
import '../../core/network/api_client.dart';
|
|
import '../../core/services/hardware_shortcut_listener.dart';
|
|
import '../../core/services/stt_service.dart';
|
|
import '../../core/services/tts_service.dart';
|
|
import '../../core/services/voice_command_handler.dart';
|
|
import '../../core/theme/app_colors.dart';
|
|
|
|
class UserShell extends StatefulWidget {
|
|
final Widget child;
|
|
const UserShell({super.key, required this.child});
|
|
|
|
@override
|
|
State<UserShell> createState() => _UserShellState();
|
|
}
|
|
|
|
class _UserShellState extends State<UserShell> {
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_loadVoiceCommands();
|
|
_startHardwareShortcuts();
|
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
|
_startVoiceListening();
|
|
});
|
|
sl<VoiceCommandHandler>().onCommand = (key) {
|
|
if (!mounted) return;
|
|
switch (key) {
|
|
case VoiceCommandKey.openWalkguide:
|
|
case VoiceCommandKey.startWalkguide:
|
|
context.go('/user/walkguide');
|
|
break;
|
|
case VoiceCommandKey.openSos:
|
|
case VoiceCommandKey.sendSos:
|
|
context.go('/user/sos');
|
|
break;
|
|
case VoiceCommandKey.openActivity:
|
|
context.go('/user/activity');
|
|
break;
|
|
case VoiceCommandKey.openNotification:
|
|
case VoiceCommandKey.readAllNotif:
|
|
context.go('/user/notifications');
|
|
break;
|
|
case VoiceCommandKey.openNavigation:
|
|
case VoiceCommandKey.whereAmI:
|
|
context.go('/user/navigation');
|
|
break;
|
|
case VoiceCommandKey.openSettings:
|
|
context.go('/user/settings');
|
|
break;
|
|
case VoiceCommandKey.callGuardian:
|
|
context.go('/user/call');
|
|
break;
|
|
case VoiceCommandKey.repeatLast:
|
|
case VoiceCommandKey.stopTts:
|
|
case VoiceCommandKey.stopWalkguide:
|
|
break;
|
|
}
|
|
sl<TtsService>().speak(_spokenRouteName(key));
|
|
};
|
|
}
|
|
|
|
Future<void> _startVoiceListening() async {
|
|
await runFriendlyAction(
|
|
() async {
|
|
await sl<SttService>().init();
|
|
await sl<SttService>().startListening();
|
|
},
|
|
onError: (_) {},
|
|
fallback: 'Voice listener belum bisa dimuat.',
|
|
);
|
|
}
|
|
|
|
Future<void> _loadVoiceCommands() async {
|
|
await runFriendlyAction(
|
|
() async {
|
|
final res = await sl<ApiClient>()
|
|
.dio
|
|
.get('/user/voice-commands')
|
|
.timeout(const Duration(seconds: 8));
|
|
final body = res.data;
|
|
final data = body is Map ? body['data'] : body;
|
|
if (data is! List) return;
|
|
final commands = data
|
|
.whereType<Map>()
|
|
.map((item) =>
|
|
_voiceCommandFromJson(Map<String, dynamic>.from(item)))
|
|
.whereType<VoiceCommand>()
|
|
.toList();
|
|
if (commands.isNotEmpty) {
|
|
sl<VoiceCommandHandler>().loadCommands(commands);
|
|
}
|
|
},
|
|
onError: (_) {},
|
|
fallback: 'Voice command belum bisa dimuat.',
|
|
);
|
|
}
|
|
|
|
Future<void> _startHardwareShortcuts() async {
|
|
await runFriendlyAction(
|
|
() => sl<HardwareShortcutListener>().startListening(
|
|
onAction: (action) {
|
|
if (!mounted) return;
|
|
switch (action) {
|
|
case HardwareShortcutAction.callGuardian:
|
|
context.go('/user/call');
|
|
sl<TtsService>().speak('Memanggil guardian');
|
|
break;
|
|
case HardwareShortcutAction.startWalkguide:
|
|
context.go('/user/walkguide');
|
|
sl<TtsService>().speak('WalkGuide dibuka');
|
|
break;
|
|
case HardwareShortcutAction.stopWalkguide:
|
|
context.go('/user/walkguide');
|
|
sl<TtsService>().speak('WalkGuide dibuka untuk dihentikan');
|
|
break;
|
|
case HardwareShortcutAction.sendSos:
|
|
context.go('/user/sos');
|
|
sl<TtsService>().speak('SOS dibuka');
|
|
break;
|
|
case HardwareShortcutAction.openNotification:
|
|
context.go('/user/notifications');
|
|
sl<TtsService>().speak('Notifikasi dibuka');
|
|
break;
|
|
}
|
|
},
|
|
),
|
|
onError: (_) {},
|
|
fallback: 'Hardware shortcut belum bisa dimuat.',
|
|
);
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
sl<HardwareShortcutListener>().stopListening();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final location = GoRouterState.of(context).matchedLocation;
|
|
final items = [
|
|
_ShellItem('Guide', Icons.visibility_outlined, Icons.visibility,
|
|
'/user/walkguide'),
|
|
_ShellItem('SOS', Icons.warning_amber_outlined, Icons.warning_amber,
|
|
'/user/sos'),
|
|
_ShellItem(
|
|
'Log', Icons.list_alt_outlined, Icons.list_alt, '/user/activity'),
|
|
_ShellItem('Notif', Icons.notifications_outlined, Icons.notifications,
|
|
'/user/notifications'),
|
|
_ShellItem('Map', Icons.map_outlined, Icons.map, '/user/navigation'),
|
|
_ShellItem(
|
|
'Set', Icons.settings_outlined, Icons.settings, '/user/settings'),
|
|
];
|
|
return _AppShell(child: widget.child, items: items, location: location);
|
|
}
|
|
}
|
|
|
|
class GuardianShell extends StatelessWidget {
|
|
final Widget child;
|
|
const GuardianShell({super.key, required this.child});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final location = GoRouterState.of(context).matchedLocation;
|
|
final items = [
|
|
_ShellItem('Home', Icons.dashboard_outlined, Icons.dashboard,
|
|
'/guardian/dashboard'),
|
|
_ShellItem('Map', Icons.map_outlined, Icons.map, '/guardian/map'),
|
|
_ShellItem('Logs', Icons.fact_check_outlined, Icons.fact_check,
|
|
'/guardian/logs'),
|
|
_ShellItem(
|
|
'Send', Icons.send_outlined, Icons.send, '/guardian/send-notif'),
|
|
_ShellItem('AI', Icons.tune_outlined, Icons.tune, '/guardian/ai-config'),
|
|
_ShellItem(
|
|
'Set', Icons.settings_outlined, Icons.settings, '/guardian/settings'),
|
|
];
|
|
return _AppShell(child: child, items: items, location: location);
|
|
}
|
|
}
|
|
|
|
class _AppShell extends StatelessWidget {
|
|
final Widget child;
|
|
final List<_ShellItem> items;
|
|
final String location;
|
|
|
|
const _AppShell(
|
|
{required this.child, required this.items, required this.location});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return LayoutBuilder(
|
|
builder: (context, constraints) {
|
|
final useRail = constraints.maxWidth >= 760;
|
|
final content = AnimatedSwitcher(
|
|
duration: const Duration(milliseconds: 180),
|
|
switchInCurve: Curves.easeOutCubic,
|
|
switchOutCurve: Curves.easeInCubic,
|
|
child: KeyedSubtree(
|
|
key: ValueKey(location),
|
|
child: child,
|
|
),
|
|
);
|
|
|
|
return Scaffold(
|
|
backgroundColor: AppColors.surface,
|
|
body: useRail
|
|
? Row(
|
|
children: [
|
|
_RailNavigation(
|
|
items: items,
|
|
selectedIndex: _selectedIndex,
|
|
),
|
|
const VerticalDivider(width: 1, color: AppColors.border),
|
|
Expanded(child: content),
|
|
],
|
|
)
|
|
: content,
|
|
bottomNavigationBar: useRail
|
|
? null
|
|
: _BottomScrollNavigation(
|
|
items: items,
|
|
selectedIndex: _selectedIndex,
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
int get _selectedIndex {
|
|
final index = items.indexWhere((item) => location.startsWith(item.route));
|
|
return index < 0 ? 0 : index;
|
|
}
|
|
}
|
|
|
|
class _RailNavigation extends StatelessWidget {
|
|
final List<_ShellItem> items;
|
|
final int selectedIndex;
|
|
|
|
const _RailNavigation({
|
|
required this.items,
|
|
required this.selectedIndex,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return LayoutBuilder(
|
|
builder: (context, constraints) {
|
|
final compact = constraints.maxHeight < 520;
|
|
final width = compact ? 76.0 : 86.0;
|
|
final itemHeight = compact ? 58.0 : 70.0;
|
|
|
|
return DecoratedBox(
|
|
decoration: const BoxDecoration(color: Colors.white),
|
|
child: SafeArea(
|
|
right: false,
|
|
child: SizedBox(
|
|
width: width,
|
|
child: ListView.separated(
|
|
padding: EdgeInsets.symmetric(
|
|
horizontal: 8,
|
|
vertical: compact ? 6 : 12,
|
|
),
|
|
itemCount: items.length,
|
|
separatorBuilder: (_, __) => SizedBox(height: compact ? 2 : 6),
|
|
itemBuilder: (context, index) {
|
|
final item = items[index];
|
|
final selected = index == selectedIndex;
|
|
return Semantics(
|
|
button: true,
|
|
selected: selected,
|
|
label: item.label,
|
|
child: InkWell(
|
|
borderRadius: BorderRadius.circular(18),
|
|
onTap: () => context.go(items[index].route),
|
|
child: AnimatedContainer(
|
|
duration: const Duration(milliseconds: 160),
|
|
height: itemHeight,
|
|
padding: const EdgeInsets.symmetric(horizontal: 4),
|
|
decoration: BoxDecoration(
|
|
color: selected
|
|
? const Color(0xFFEFF6FF)
|
|
: Colors.transparent,
|
|
borderRadius: BorderRadius.circular(18),
|
|
),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
selected ? item.selectedIcon : item.icon,
|
|
size: compact ? 23 : 25,
|
|
color: selected
|
|
? AppColors.primary
|
|
: const Color(0xFF334155),
|
|
),
|
|
SizedBox(height: compact ? 2 : 5),
|
|
Text(
|
|
item.label,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
textAlign: TextAlign.center,
|
|
style: TextStyle(
|
|
fontSize: compact ? 10 : 12,
|
|
height: 1,
|
|
fontWeight: selected
|
|
? FontWeight.w800
|
|
: FontWeight.w600,
|
|
color: selected
|
|
? const Color(0xFF1D4ED8)
|
|
: const Color(0xFF334155),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
);
|
|
}
|
|
}
|
|
|
|
class _BottomScrollNavigation extends StatelessWidget {
|
|
final List<_ShellItem> items;
|
|
final int selectedIndex;
|
|
|
|
const _BottomScrollNavigation({
|
|
required this.items,
|
|
required this.selectedIndex,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final bottom = MediaQuery.of(context).padding.bottom;
|
|
final extraBottom = bottom > 12 ? 12.0 : bottom;
|
|
return DecoratedBox(
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
border: const Border(top: BorderSide(color: AppColors.border)),
|
|
boxShadow: [
|
|
BoxShadow(
|
|
color: Colors.black.withValues(alpha: 0.06),
|
|
blurRadius: 18,
|
|
offset: const Offset(0, -8),
|
|
),
|
|
],
|
|
),
|
|
child: SafeArea(
|
|
top: false,
|
|
child: SizedBox(
|
|
height: 68 + extraBottom,
|
|
child: ListView.separated(
|
|
scrollDirection: Axis.horizontal,
|
|
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 8),
|
|
itemCount: items.length,
|
|
separatorBuilder: (_, __) => const SizedBox(width: 6),
|
|
itemBuilder: (context, index) {
|
|
final item = items[index];
|
|
final selected = index == selectedIndex;
|
|
return Semantics(
|
|
button: true,
|
|
selected: selected,
|
|
label: item.label,
|
|
child: InkWell(
|
|
borderRadius: BorderRadius.circular(12),
|
|
onTap: () => context.go(item.route),
|
|
child: AnimatedContainer(
|
|
duration: const Duration(milliseconds: 160),
|
|
width: 72,
|
|
padding: const EdgeInsets.symmetric(horizontal: 6),
|
|
decoration: BoxDecoration(
|
|
color: selected
|
|
? const Color(0xFFEFF6FF)
|
|
: Colors.transparent,
|
|
borderRadius: BorderRadius.circular(12),
|
|
border: Border.all(
|
|
color: selected
|
|
? const Color(0xFFBFDBFE)
|
|
: Colors.transparent,
|
|
),
|
|
),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
Icon(
|
|
selected ? item.selectedIcon : item.icon,
|
|
color: selected
|
|
? AppColors.primary
|
|
: const Color(0xFF64748B),
|
|
size: 22,
|
|
),
|
|
const SizedBox(height: 4),
|
|
Text(
|
|
item.label,
|
|
maxLines: 1,
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
fontSize: 11,
|
|
fontWeight:
|
|
selected ? FontWeight.w800 : FontWeight.w600,
|
|
color: selected
|
|
? AppColors.primary
|
|
: const Color(0xFF64748B),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class _ShellItem {
|
|
final String label;
|
|
final IconData icon;
|
|
final IconData selectedIcon;
|
|
final String route;
|
|
|
|
const _ShellItem(this.label, this.icon, this.selectedIcon, this.route);
|
|
}
|
|
|
|
String _spokenRouteName(VoiceCommandKey key) {
|
|
switch (key) {
|
|
case VoiceCommandKey.openWalkguide:
|
|
case VoiceCommandKey.startWalkguide:
|
|
return 'WalkGuide dibuka';
|
|
case VoiceCommandKey.openSos:
|
|
case VoiceCommandKey.sendSos:
|
|
return 'SOS dibuka';
|
|
case VoiceCommandKey.openActivity:
|
|
return 'Activity log dibuka';
|
|
case VoiceCommandKey.openNotification:
|
|
case VoiceCommandKey.readAllNotif:
|
|
return 'Notifikasi dibuka';
|
|
case VoiceCommandKey.openNavigation:
|
|
case VoiceCommandKey.whereAmI:
|
|
return 'Navigasi dibuka';
|
|
case VoiceCommandKey.openSettings:
|
|
return 'Settings dibuka';
|
|
case VoiceCommandKey.callGuardian:
|
|
return 'Memanggil guardian';
|
|
case VoiceCommandKey.repeatLast:
|
|
case VoiceCommandKey.stopTts:
|
|
case VoiceCommandKey.stopWalkguide:
|
|
return '';
|
|
}
|
|
}
|
|
|
|
VoiceCommand? _voiceCommandFromJson(Map<String, dynamic> item) {
|
|
final key = _commandKeyFromBackend(item['commandKey']?.toString());
|
|
final phrase = item['triggerPhrase']?.toString().trim();
|
|
if (key == null || phrase == null || phrase.isEmpty) return null;
|
|
return VoiceCommand(
|
|
key: key,
|
|
phrase: phrase,
|
|
enabled: item['enabled'] != false,
|
|
);
|
|
}
|
|
|
|
VoiceCommandKey? _commandKeyFromBackend(String? key) {
|
|
switch (key) {
|
|
case 'OPEN_WALKGUIDE':
|
|
return VoiceCommandKey.openWalkguide;
|
|
case 'START_WALKGUIDE':
|
|
return VoiceCommandKey.startWalkguide;
|
|
case 'STOP_WALKGUIDE':
|
|
return VoiceCommandKey.stopWalkguide;
|
|
case 'CALL_GUARDIAN':
|
|
return VoiceCommandKey.callGuardian;
|
|
case 'OPEN_NOTIFICATION':
|
|
return VoiceCommandKey.openNotification;
|
|
case 'READ_ALL_NOTIF':
|
|
return VoiceCommandKey.readAllNotif;
|
|
case 'OPEN_SOS':
|
|
return VoiceCommandKey.openSos;
|
|
case 'SEND_SOS':
|
|
return VoiceCommandKey.sendSos;
|
|
case 'WHERE_AM_I':
|
|
return VoiceCommandKey.whereAmI;
|
|
case 'OPEN_ACTIVITY':
|
|
return VoiceCommandKey.openActivity;
|
|
case 'OPEN_NAVIGATION':
|
|
return VoiceCommandKey.openNavigation;
|
|
case 'OPEN_SETTINGS':
|
|
return VoiceCommandKey.openSettings;
|
|
case 'REPEAT_LAST':
|
|
return VoiceCommandKey.repeatLast;
|
|
case 'STOP_TTS':
|
|
return VoiceCommandKey.stopTts;
|
|
default:
|
|
return null;
|
|
}
|
|
}
|