chore: Better call UX sounds and timeline design

lib/pages/chat/chat.dart

@@ -990,9 +990,7 @@ class ChatController extends State<Chat> {
       final voipPlugin = Matrix.of(context).voipPlugin;
       await voipPlugin!.voip.inviteToCall(room!.id, callType).catchError((e) {
         ScaffoldMessenger.of(context).showSnackBar(
-          SnackBar(content: Text(e.toString())
-              // Text(LocalizedExceptionExtension(context, e)),
-              ),
+          SnackBar(content: Text((e as Object).toLocalizedString(context))),
         );
       });
     } else {

lib/pages/chat/events/message.dart

@@ -45,8 +45,15 @@ class Message extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    if (![EventTypes.Message, EventTypes.Sticker, EventTypes.Encrypted]
-        .contains(event.type)) {
+    if (!{
+      EventTypes.Message,
+      EventTypes.Sticker,
+      EventTypes.Encrypted,
+      EventTypes.CallInvite
+    }.contains(event.type)) {
+      if (event.type.startsWith('m.call.')) {
+        return Container();
+      }
       return StateMessage(event, unfold: unfold);
     }
 

lib/pages/chat/events/message_content.dart

@@ -199,6 +199,13 @@ class MessageContent extends StatelessWidget {
               onLinkTap: (url) => UrlLauncher(context, url).launchUrl(),
             );
         }
+      case EventTypes.CallInvite:
+        return _ButtonContent(
+          label: L10n.of(context)!.startedACall(event.sender.calcDisplayname()),
+          icon: const Icon(Icons.phone_outlined),
+          textColor: buttonTextColor,
+          onPressed: () => onInfoTab!(event),
+        );
       default:
         return _ButtonContent(
           label: L10n.of(context)!
@@ -227,11 +234,14 @@ class _ButtonContent extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return TextButton.icon(
+    return OutlinedButton.icon(
       onPressed: onPressed,
       icon: icon,
       label: Text(label, overflow: TextOverflow.ellipsis),
-      style: TextButton.styleFrom(primary: textColor),
+      style: OutlinedButton.styleFrom(
+        primary: textColor,
+        backgroundColor: Colors.white.withAlpha(64),
+      ),
     );
   }
 }

lib/pages/dialer/dialer.dart

@@ -26,7 +26,6 @@ import 'package:assets_audio_player/assets_audio_player.dart';
 import 'package:flutter_webrtc/flutter_webrtc.dart';
 import 'package:matrix/matrix.dart';
 import 'package:pedantic/pedantic.dart';
-import 'package:universal_html/html.dart' as darthtml;
 import 'package:wakelock/wakelock.dart';
 
 import 'package:fluffychat/utils/platform_infos.dart';
@@ -174,12 +173,7 @@ class _MyCallingPage extends State<Calling> {
 
   void _playCallSound() async {
     const path = 'assets/sounds/call.ogg';
-    if (kIsWeb) {
-      darthtml.AudioElement()
-        ..src = 'assets/$path'
-        ..autoplay = true
-        ..load();
-    } else if (PlatformInfos.isMobile) {
+    if (kIsWeb || PlatformInfos.isMobile || PlatformInfos.isMacOS) {
       await AssetsAudioPlayer.newPlayer().open(Audio(path));
     } else {
       Logs().w('Playing sound not implemented for this platform!');
@@ -269,7 +263,6 @@ class _MyCallingPage extends State<Calling> {
   }
 
   void _hangUp() {
-    _playCallSound();
     setState(() {
       if (call != null && (call?.isRinging ?? false)) {
         call?.reject();

lib/utils/voip/user_media_manager.dart

@@ -1,7 +1,10 @@
 import 'package:flutter/foundation.dart';
 
+import 'package:assets_audio_player/assets_audio_player.dart';
 import 'package:flutter_ringtone_player/flutter_ringtone_player.dart';
 
+import 'package:fluffychat/utils/platform_infos.dart';
+
 class UserMediaManager {
   factory UserMediaManager() {
     return _instance;
@@ -11,17 +14,27 @@ class UserMediaManager {
 
   static final UserMediaManager _instance = UserMediaManager._internal();
 
-  Future<void> startRingingTone() {
-    if (kIsWeb) {
-      throw 'Platform [web] not supported';
+  AssetsAudioPlayer? _assetsAudioPlayer;
+
+  Future<void> startRingingTone() async {
+    if (PlatformInfos.isMobile) {
+      await FlutterRingtonePlayer.playRingtone(volume: 80);
+    } else if ((kIsWeb || PlatformInfos.isMacOS) &&
+        _assetsAudioPlayer != null) {
+      const path = 'assets/sounds/phone.ogg';
+      final player = _assetsAudioPlayer = AssetsAudioPlayer.newPlayer();
+      await player.open(Audio(path),
+          autoStart: true, loopMode: LoopMode.playlist);
     }
-    return FlutterRingtonePlayer.playRingtone(volume: 80);
+    return;
   }
 
-  Future<void> stopRingingTone() {
-    if (kIsWeb) {
-      throw 'Platform [web] not supported';
+  Future<void> stopRingingTone() async {
+    if (PlatformInfos.isMobile) {
+      await FlutterRingtonePlayer.stop();
     }
-    return FlutterRingtonePlayer.stop();
+    await _assetsAudioPlayer?.stop();
+    _assetsAudioPlayer = null;
+    return;
   }
 }