Designed talk message reactions

This commit is contained in:
2023-07-08 21:50:25 +02:00
parent db87b7c3ff
commit 0b2fab5b6d
6 changed files with 222 additions and 171 deletions

View File

@ -56,9 +56,10 @@ class _ChatBubbleState extends State<ChatBubble> {
}
BubbleStyle getSelfStyle(bool seamless) {
var color = AppTheme.isDarkMode(context) ? const Color(0xff005c4b) : const Color(0xffd3d3d3);
return BubbleStyle(
nip: BubbleNip.rightBottom,
color: seamless ? Colors.transparent : const Color(0xff005c4b),
color: seamless ? Colors.transparent : color,
borderWidth: seamless ? 0 : 1,
elevation: seamless ? 0 : 1,
margin: const BubbleEdges.only(bottom: 10, right: 10, left: 50),
@ -99,162 +100,191 @@ class _ChatBubbleState extends State<ChatBubble> {
bool showBubbleTime = widget.bubbleData.messageType != GetRoomResponseObjectMessageType.system;
var actorTextStyle = TextStyle(color: Theme.of(context).primaryColor, fontWeight: FontWeight.bold);
return GestureDetector(
child: Bubble(
return Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
textDirection: TextDirection.ltr,
crossAxisAlignment: CrossAxisAlignment.end,
style: getStyle(),
child: Container(
constraints: BoxConstraints(
maxWidth: MediaQuery.of(context).size.width * 0.9,
minWidth: showActorDisplayName ? _textSize(widget.bubbleData.actorDisplayName, actorTextStyle).width : 30,
),
child: Stack(
children: [
Padding(
padding: EdgeInsets.only(bottom: showBubbleTime ? 18 : 0, top: showActorDisplayName ? 18 : 0),
child: FutureBuilder(
future: message.getWidget(),
builder: (context, snapshot) {
if(!snapshot.hasData) return const CircularProgressIndicator();
return snapshot.data ?? const Icon(Icons.error);
},
)
children: [
GestureDetector(
child: Bubble(
style: getStyle(),
child: Container(
constraints: BoxConstraints(
maxWidth: MediaQuery.of(context).size.width * 0.9,
minWidth: showActorDisplayName ? _textSize(widget.bubbleData.actorDisplayName, actorTextStyle).width : 30,
),
Visibility(
visible: showActorDisplayName,
child: Positioned(
top: 0,
left: 0,
child: Text(
widget.bubbleData.actorDisplayName,
textAlign: TextAlign.start,
style: actorTextStyle,
child: Stack(
children: [
Padding(
padding: EdgeInsets.only(bottom: showBubbleTime ? 18 : 0, top: showActorDisplayName ? 18 : 0),
child: message.getWidget()
),
),
),
Visibility(
visible: showBubbleTime,
child: Positioned(
bottom: 0,
right: 0,
child: Text(
Jiffy.parseFromMillisecondsSinceEpoch(widget.bubbleData.timestamp * 1000).format(pattern: "HH:mm"),
textAlign: TextAlign.end,
style: const TextStyle(color: Colors.grey, fontSize: 12),
Visibility(
visible: showActorDisplayName,
child: Positioned(
top: 0,
left: 0,
child: Text(
widget.bubbleData.actorDisplayName,
textAlign: TextAlign.start,
style: actorTextStyle,
),
),
),
),
Visibility(
visible: showBubbleTime,
child: Positioned(
bottom: 0,
right: 0,
child: Text(
Jiffy.parseFromMillisecondsSinceEpoch(widget.bubbleData.timestamp * 1000).format(pattern: "HH:mm"),
textAlign: TextAlign.end,
style: const TextStyle(color: Colors.grey, fontSize: 12),
),
),
),
Visibility(
visible: downloadProgress > 0,
child: Positioned(
top: 0,
left: 0,
right: 0,
bottom: 0,
child: Stack(
children: [
const Center(child: Icon(Icons.download)),
const Center(child: CircularProgressIndicator(color: Colors.white)),
Center(child: CircularProgressIndicator(value: downloadProgress/100)),
],
)
),
),
],
),
Visibility(
visible: downloadProgress > 0,
child: Positioned(
top: 0,
left: 0,
right: 0,
bottom: 0,
child: Stack(
children: [
const Center(child: Icon(Icons.download)),
const Center(child: CircularProgressIndicator(color: Colors.white)),
Center(child: CircularProgressIndicator(value: downloadProgress/100)),
],
)
),
),
],
),
),
),
),
onLongPress: () {
showDialog(context: context, builder: (context) {
return SimpleDialog(
children: [
Visibility(
visible: !message.containsFile && widget.bubbleData.messageType == GetRoomResponseObjectMessageType.comment,
child: ListTile(
leading: const Icon(Icons.copy),
title: const Text("Nachricht kopieren"),
onTap: () => {
Clipboard.setData(ClipboardData(text: widget.bubbleData.message)),
Navigator.of(context).pop(),
},
),
),
Visibility(
visible: !widget.isSender && widget.chatData.type != GetRoomResponseObjectConversationType.oneToOne,
child: ListTile(
leading: const Icon(Icons.sms_outlined),
title: Text("Private Nachricht an '${widget.bubbleData.actorDisplayName}'"),
onTap: () => {},
),
),
Visibility(
visible: widget.isSender,
child: ListTile(
leading: const Icon(Icons.delete_outline),
title: const Text("Nachricht löschen"),
onTap: () {
DeleteMessage(widget.chatData.token, widget.bubbleData.id).run().then((value) {
Provider.of<ChatProps>(context, listen: false).run();
Navigator.of(context).pop();
});
},
),
),
DebugTile(widget.bubbleData.toJson()).asTile(context),
],
);
});
},
onTap: () {
if(message.file == null) return;
if(downloadProgress > 0) {
showDialog(context: context, builder: (context) {
return AlertDialog(
title: const Text("Download abbrechen?"),
content: const Text("Möchtest du den Download abbrechen?"),
actions: [
TextButton(onPressed: () {
Navigator.of(context).pop();
}, child: const Text("Nein")),
TextButton(onPressed: () {
downloadCore?.then((value) {
if(!value.isCancelled) value.cancel();
Navigator.of(context).pop();
});
setState(() {
downloadProgress = 0;
downloadCore = null;
});
}, child: const Text("Ja, Abbrechen"))
],
);
});
return;
}
downloadProgress = 1;
downloadCore = FileElement.download(context, message.file!.path!, message.file!.name, (progress) {
if(progress > 1) {
setState(() {
downloadProgress = progress;
});
}
}, (result) {
setState(() {
downloadProgress = 0;
});
if(result.type != ResultType.done) {
onLongPress: () {
showDialog(context: context, builder: (context) {
return AlertDialog(
content: Text(result.message),
return SimpleDialog(
children: [
Visibility(
visible: !message.containsFile && widget.bubbleData.messageType == GetRoomResponseObjectMessageType.comment,
child: ListTile(
leading: const Icon(Icons.copy),
title: const Text("Nachricht kopieren"),
onTap: () => {
Clipboard.setData(ClipboardData(text: widget.bubbleData.message)),
Navigator.of(context).pop(),
},
),
),
Visibility(
visible: !widget.isSender && widget.chatData.type != GetRoomResponseObjectConversationType.oneToOne,
child: ListTile(
leading: const Icon(Icons.sms_outlined),
title: Text("Private Nachricht an '${widget.bubbleData.actorDisplayName}'"),
onTap: () => {},
),
),
Visibility(
visible: widget.isSender,
child: ListTile(
leading: const Icon(Icons.delete_outline),
title: const Text("Nachricht löschen"),
onTap: () {
DeleteMessage(widget.chatData.token, widget.bubbleData.id).run().then((value) {
Provider.of<ChatProps>(context, listen: false).run();
Navigator.of(context).pop();
});
},
),
),
DebugTile(widget.bubbleData.toJson()).asTile(context),
],
);
});
}
});
},
},
onTap: () {
if(message.file == null) return;
if(downloadProgress > 0) {
showDialog(context: context, builder: (context) {
return AlertDialog(
title: const Text("Download abbrechen?"),
content: const Text("Möchtest du den Download abbrechen?"),
actions: [
TextButton(onPressed: () {
Navigator.of(context).pop();
}, child: const Text("Nein")),
TextButton(onPressed: () {
downloadCore?.then((value) {
if(!value.isCancelled) value.cancel();
Navigator.of(context).pop();
});
setState(() {
downloadProgress = 0;
downloadCore = null;
});
}, child: const Text("Ja, Abbrechen"))
],
);
});
return;
}
downloadProgress = 1;
downloadCore = FileElement.download(context, message.file!.path!, message.file!.name, (progress) {
if(progress > 1) {
setState(() {
downloadProgress = progress;
});
}
}, (result) {
setState(() {
downloadProgress = 0;
});
if(result.type != ResultType.done) {
showDialog(context: context, builder: (context) {
return AlertDialog(
content: Text(result.message),
);
});
}
});
},
),
Visibility(
visible: widget.bubbleData.reactions != null,
child: Transform.translate(
offset: const Offset(0, -10),
child: Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 5, right: 5),
child: Wrap(
alignment: widget.isSender ? WrapAlignment.end : WrapAlignment.start,
crossAxisAlignment: WrapCrossAlignment.start,
//mainAxisSize: MainAxisSize.max,
children: widget.bubbleData.reactions?.entries.map<Widget>((e) {
return Container(
margin: const EdgeInsets.only(right: 2.5, left: 2.5),
child: Chip(
label: Text("${e.key} ${e.value}"),
visualDensity: const VisualDensity(vertical: VisualDensity.minimumDensity, horizontal: VisualDensity.minimumDensity),
padding: EdgeInsets.zero,
backgroundColor: widget.bubbleData.reactionsSelf?.contains(e.key) ?? false ? Theme.of(context).primaryColor : null,
),
);
}).toList() ?? [],
),
),
),
),
],
);
}
}

View File

@ -1,13 +1,12 @@
import 'dart:convert';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_linkify/flutter_linkify.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:url_launcher/url_launcher_string.dart';
import '../../../api/marianumcloud/talk/chat/getChatResponse.dart';
import '../../../api/marianumcloud/talk/chat/richObjectStringProcessor.dart';
import '../../../model/accountData.dart';
class ChatMessage {
String originalMessage;
@ -27,8 +26,7 @@ class ChatMessage {
}
}
Future<Widget> getWidget() async {
SharedPreferences preferences = await SharedPreferences.getInstance();
Widget getWidget() {
if(file == null) {
return SelectableLinkify(
@ -50,10 +48,9 @@ class ChatMessage {
placeholder: (context, url) {
return const Padding(padding: EdgeInsets.all(10), child: CircularProgressIndicator());
},
fadeInDuration: const Duration(seconds: 1),
imageUrl: "https://cloud.marianum-fulda.de/core/preview?fileId=${file!.id}&x=100&y=-1&a=1",
httpHeaders: {
"Authorization": "Basic ${base64.encode(utf8.encode("${preferences.getString("username")}:${preferences.getString("password")}"))}" // TODO move authentication
"Authorization": "Basic ${AccountData().buildHttpAuthString()}"
},
);
}

View File

@ -1,6 +1,5 @@
import 'package:flutter/material.dart';
import 'package:jiffy/jiffy.dart';
import 'package:loader_overlay/loader_overlay.dart';
import 'package:provider/provider.dart';
@ -47,25 +46,15 @@ class _ChatViewState extends State<ChatView> {
DateTime lastDate = DateTime.now();
data.getChatResponse.sortByTimestamp().forEach((element) {
DateTime elementDate = DateTime.fromMillisecondsSinceEpoch(element.timestamp * 1000);
if(element.systemMessage.contains("reaction")) return;
if(elementDate.weekday != lastDate.weekday) {
lastDate = elementDate;
messages.add(ChatBubble(
context: context,
isSender: true,
bubbleData: GetChatResponseObject(
1,
"asd",
GetRoomResponseObjectMessageActorType.bridge,
"system",
"System",
element.timestamp,
elementDate.toIso8601String(),
GetRoomResponseObjectMessageType.system,
false,
"",
Jiffy.parseFromDateTime(elementDate).format(pattern: "dd.MM.yyyy"),
null
),
bubbleData: GetChatResponseObject.getDateDummy(element.timestamp),
chatData: widget.room
));
}