import 'package:matrix/matrix.dart'; import 'package:fluffychat/widgets/event_content/message_content.dart'; import 'package:fluffychat/widgets/event_content/reply_content.dart'; import 'package:fluffychat/config/themes.dart'; import 'package:fluffychat/utils/date_time_extension.dart'; import 'package:fluffychat/utils/matrix_sdk_extensions.dart/event_extension.dart'; import 'package:fluffychat/utils/string_color.dart'; import 'package:flutter/material.dart'; import '../../config/app_config.dart'; import '../avatar.dart'; import '../matrix.dart'; import 'message_reactions.dart'; import 'state_message.dart'; import 'verification_request_content.dart'; class Message extends StatefulWidget { final Event event; final Event nextEvent; final void Function(Event) onSelect; final void Function(Event) onAvatarTab; final void Function(String) scrollToEventId; final void Function(String) unfold; final bool longPressSelect; final bool selected; final Timeline timeline; const Message(this.event, {this.nextEvent, this.longPressSelect, this.onSelect, this.onAvatarTab, this.scrollToEventId, @required this.unfold, this.selected, this.timeline}); @override _MessageState createState() => _MessageState(); } class _MessageState extends State { /// Indicates wheither the user may use a mouse instead /// of touchscreen. static bool useMouse = false; @override Widget build(BuildContext context) { // if the sender isn't in-memory yet we want to queue a re-rendering of the widget for // when it is in-memory, for nicer displaying if (widget.event.room .getState(EventTypes.RoomMember, widget.event.senderId) == null) { widget.event.room.requestUser(widget.event.senderId).then((_) { WidgetsBinding.instance.addPostFrameCallback((_) { setState(() => null); }); }); } if (![EventTypes.Message, EventTypes.Sticker, EventTypes.Encrypted] .contains(widget.event.type)) { return StateMessage(widget.event, unfold: widget.unfold); } if (widget.event.type == EventTypes.Message && widget.event.messageType == EventTypes.KeyVerificationRequest) { return VerificationRequestContent( event: widget.event, timeline: widget.timeline); } final client = Matrix.of(context).client; final ownMessage = widget.event.senderId == client.userID; final alignment = ownMessage ? Alignment.topRight : Alignment.topLeft; var color = Theme.of(context).secondaryHeaderColor; final sameSender = widget.nextEvent != null && [EventTypes.Message, EventTypes.Sticker] .contains(widget.nextEvent.type) ? widget.nextEvent.sender.id == widget.event.sender.id : false; var textColor = ownMessage ? Colors.white : Theme.of(context).brightness == Brightness.dark ? Colors.white : Colors.black; final rowMainAxisAlignment = ownMessage ? MainAxisAlignment.end : MainAxisAlignment.start; final displayEvent = widget.event.getDisplayEvent(widget.timeline); if (widget.event.showThumbnail) { color = Theme.of(context).scaffoldBackgroundColor; textColor = Theme.of(context).textTheme.bodyText2.color; } else if (ownMessage) { color = displayEvent.status == -1 ? Colors.redAccent : Theme.of(context).primaryColor; } final rowChildren = [ Expanded( child: Container( alignment: alignment, padding: const EdgeInsets.symmetric(horizontal: 8), child: Material( color: color, borderRadius: BorderRadius.circular(AppConfig.borderRadius), child: InkWell( onHover: (b) => useMouse = true, onTap: !useMouse && widget.longPressSelect ? () => null : () => widget.onSelect(widget.event), onLongPress: !widget.longPressSelect ? null : () => widget.onSelect(widget.event), borderRadius: BorderRadius.circular(AppConfig.borderRadius), child: Container( padding: const EdgeInsets.symmetric(vertical: 6, horizontal: 10), constraints: BoxConstraints(maxWidth: FluffyThemes.columnWidth * 1.5), child: Stack( children: [ Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [ if (widget.event.relationshipType == RelationshipTypes.reply) FutureBuilder( future: widget.event.getReplyEvent(widget.timeline), builder: (BuildContext context, snapshot) { final replyEvent = snapshot.hasData ? snapshot.data : Event( eventId: widget.event.relationshipEventId, content: { 'msgtype': 'm.text', 'body': '...' }, senderId: widget.event.senderId, type: 'm.room.message', room: widget.event.room, roomId: widget.event.roomId, status: 1, originServerTs: DateTime.now(), ); return InkWell( onTap: () { if (widget.scrollToEventId != null) { widget.scrollToEventId(replyEvent.eventId); } }, child: AbsorbPointer( child: Container( margin: EdgeInsets.symmetric(vertical: 4.0), child: ReplyContent(replyEvent, lightText: ownMessage, timeline: widget.timeline), ), ), ); }, ), MessageContent( displayEvent, textColor: textColor, ), SizedBox(height: 3), Opacity( opacity: 0, child: _MetaRow( widget .event, // meta information should be from the unedited event ownMessage, textColor, widget.timeline, displayEvent, ), ), ], ), Positioned( bottom: 0, right: ownMessage ? 0 : null, left: !ownMessage ? 0 : null, child: _MetaRow( widget.event, ownMessage, textColor, widget.timeline, displayEvent, ), ), ], ), ), ), ), ), ), ]; final avatarOrSizedBox = sameSender ? SizedBox(width: Avatar.defaultSize) : Avatar( widget.event.sender.avatarUrl, widget.event.sender.calcDisplayname(), onTap: () => widget.onAvatarTab(widget.event), ); if (ownMessage) { rowChildren.add(avatarOrSizedBox); } else { rowChildren.insert(0, avatarOrSizedBox); } final row = Row( crossAxisAlignment: CrossAxisAlignment.end, mainAxisAlignment: rowMainAxisAlignment, children: rowChildren, ); Widget container; if (widget.event .hasAggregatedEvents(widget.timeline, RelationshipTypes.reaction)) { container = Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: ownMessage ? CrossAxisAlignment.end : CrossAxisAlignment.start, children: [ row, Padding( padding: EdgeInsets.only( top: 4.0, left: (ownMessage ? 0 : Avatar.defaultSize) + 12.0, right: (ownMessage ? Avatar.defaultSize : 0) + 12.0, ), child: MessageReactions(widget.event, widget.timeline), ), ], ); } else { container = row; } return Center( child: Container( color: widget.selected ? Theme.of(context).primaryColor.withAlpha(100) : Theme.of(context).primaryColor.withAlpha(0), constraints: BoxConstraints(maxWidth: FluffyThemes.columnWidth * 2.5), child: Padding( padding: EdgeInsets.only(left: 8.0, right: 8.0, bottom: 4.0, top: 4.0), child: container, ), ), ); } } class _MetaRow extends StatelessWidget { final Event event; final bool ownMessage; final Color color; final Timeline timeline; final Event displayEvent; const _MetaRow( this.event, this.ownMessage, this.color, this.timeline, this.displayEvent, {Key key}) : super(key: key); @override Widget build(BuildContext context) { final displayname = event.sender.calcDisplayname(); final showDisplayname = !ownMessage && event.senderId != event.room.directChatMatrixID; return Row( mainAxisSize: MainAxisSize.min, children: [ if (showDisplayname) Text( displayname, style: TextStyle( fontSize: 10 * AppConfig.fontSizeFactor, fontWeight: FontWeight.bold, color: (Theme.of(context).brightness == Brightness.light ? displayname.darkColor : displayname.lightColor) .withAlpha(200), ), ), if (showDisplayname) SizedBox(width: 4), Text( event.originServerTs.localizedTime(context), style: TextStyle( color: color.withAlpha(180), fontSize: 10 * AppConfig.fontSizeFactor, ), ), if (event.hasAggregatedEvents(timeline, RelationshipTypes.edit)) Padding( padding: const EdgeInsets.only(left: 2.0), child: Icon( Icons.edit_outlined, size: 12 * AppConfig.fontSizeFactor, color: color, ), ), if (ownMessage) SizedBox(width: 2), if (ownMessage) Icon( displayEvent.statusIcon, size: 14 * AppConfig.fontSizeFactor, color: color, ), ], ); } }