ember/fluffychat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Emoji picker works now

Browse source
This commit is contained in:
Kelrap 2024-08-01 17:02:47 -04:00
parent 5ed0f59db2
commit 23ac51c766
4 changed files with 124 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
lib/pages/chat/chat.dart
View file

@ -10,6 +10,7 @@ import 'package:file_picker/file_picker.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/config/setting_keys.dart';
import 'package:fluffychat/config/themes.dart';
import 'package:fluffychat/pages/chat/chat_emoji_picker.dart';
import 'package:fluffychat/pages/chat/chat_view.dart';
import 'package:fluffychat/pages/chat/event_info_dialog.dart';
import 'package:fluffychat/pages/chat/recording_dialog.dart';
@ -23,6 +24,7 @@ import 'package:fluffychat/pangea/models/representation_content_model.dart';
import 'package:fluffychat/pangea/models/tokens_event_content_model.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/utils/firebase_analytics.dart';
import 'package:fluffychat/pangea/utils/overlay.dart';
import 'package:fluffychat/pangea/utils/report_message.dart';
import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart';
import 'package:fluffychat/pangea/widgets/igc/pangea_text_controller.dart';
@ -841,6 +843,11 @@ class ChatController extends State<ChatPageWithRoom>
}
void hideEmojiPicker() {
// #Pangea
MatrixState.pAnyState.closeOverlay();
MatrixState.pAnyState.closeOverlay();
clearSelectedEvents();
// Pangea
setState(() => showEmojiPicker = false);
}
@ -1234,11 +1241,29 @@ class ChatController extends State<ChatPageWithRoom>
_allReactionEvents = allReactionEvents;
emojiPickerType = EmojiPickerType.reaction;
setState(() => showEmojiPicker = true);
// #Pangea
OverlayUtil.showOverlay(
context: context,
child: ChatEmojiPicker(this),
transformTargetId: selectedEvents.first.eventId,
targetAnchor: Alignment.center,
followerAnchor: Alignment.center,
backgroundColor: const Color.fromRGBO(0, 0, 0, 1).withAlpha(100),
closePrevOverlay: false,
targetScreen: true,
onDismiss: hideEmojiPicker,
centered: false,
bottom: true,
);
// Pangea#
}
void sendEmojiAction(String? emoji) async {
final events = List<Event>.from(selectedEvents);
setState(() => selectedEvents.clear());
// #Pangea
MatrixState.pAnyState.closeOverlay();
// Pangea#
for (final event in events) {
await room.sendReaction(
event.eventId,

169
lib/pages/chat/chat_emoji_picker.dart
View file

@ -14,90 +14,97 @@ class ChatEmojiPicker extends StatelessWidget {
@override
Widget build(BuildContext context) {
final ThemeData theme = Theme.of(context);
return AnimatedContainer(
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
height: controller.showEmojiPicker
? MediaQuery.of(context).size.height / 2
: 0,
child: controller.showEmojiPicker
? DefaultTabController(
length: 2,
child: Column(
children: [
TabBar(
tabs: [
Tab(text: L10n.of(context)!.emojis),
Tab(text: L10n.of(context)!.stickers),
],
),
Expanded(
child: TabBarView(
children: [
EmojiPicker(
onEmojiSelected: controller.onEmojiSelected,
onBackspacePressed: controller.emojiPickerBackspace,
config: Config(
emojiViewConfig: EmojiViewConfig(
noRecents: const NoRecent(),
backgroundColor: Theme.of(context)
.colorScheme
.onInverseSurface,
),
bottomActionBarConfig: const BottomActionBarConfig(
enabled: false,
),
categoryViewConfig: CategoryViewConfig(
backspaceColor: theme.colorScheme.primary,
iconColor:
theme.colorScheme.primary.withOpacity(0.5),
iconColorSelected: theme.colorScheme.primary,
indicatorColor: theme.colorScheme.primary,
),
skinToneConfig: SkinToneConfig(
dialogBackgroundColor: Color.lerp(
theme.colorScheme.surface,
theme.colorScheme.primaryContainer,
0.75,
)!,
indicatorColor: theme.colorScheme.onSurface,
),
),
),
StickerPickerDialog(
room: controller.room,
onSelected: (sticker) {
controller.room.sendEvent(
{
'body': sticker.body,
'info': sticker.info ?? {},
'url': sticker.url.toString(),
},
type: EventTypes.Sticker,
);
controller.hideEmojiPicker();
},
),
return
// #Pangea
Material(
child:
// Pangea#
AnimatedContainer(
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(),
height: controller.showEmojiPicker
? MediaQuery.of(context).size.height / 2
: 0,
child: controller.showEmojiPicker
? DefaultTabController(
length: 2,
child: Column(
children: [
TabBar(
tabs: [
Tab(text: L10n.of(context)!.emojis),
Tab(text: L10n.of(context)!.stickers),
],
),
),
// #Pangea
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: FloatingActionButton(
onPressed: controller.hideEmojiPicker,
shape: const CircleBorder(),
mini: true,
child: const Icon(Icons.close),
Expanded(
child: TabBarView(
children: [
EmojiPicker(
onEmojiSelected: controller.onEmojiSelected,
onBackspacePressed: controller.emojiPickerBackspace,
config: Config(
emojiViewConfig: EmojiViewConfig(
noRecents: const NoRecent(),
backgroundColor: Theme.of(context)
.colorScheme
.onInverseSurface,
),
bottomActionBarConfig:
const BottomActionBarConfig(
enabled: false,
),
categoryViewConfig: CategoryViewConfig(
backspaceColor: theme.colorScheme.primary,
iconColor:
theme.colorScheme.primary.withOpacity(0.5),
iconColorSelected: theme.colorScheme.primary,
indicatorColor: theme.colorScheme.primary,
),
skinToneConfig: SkinToneConfig(
dialogBackgroundColor: Color.lerp(
theme.colorScheme.surface,
theme.colorScheme.primaryContainer,
0.75,
)!,
indicatorColor: theme.colorScheme.onSurface,
),
),
),
StickerPickerDialog(
room: controller.room,
onSelected: (sticker) {
controller.room.sendEvent(
{
'body': sticker.body,
'info': sticker.info ?? {},
'url': sticker.url.toString(),
},
type: EventTypes.Sticker,
);
controller.hideEmojiPicker();
},
),
],
),
),
),
// Pangea#
],
),
)
: null,
// #Pangea
Padding(
padding: const EdgeInsets.symmetric(vertical: 8.0),
child: FloatingActionButton(
onPressed: controller.hideEmojiPicker,
shape: const CircleBorder(),
mini: true,
child: const Icon(Icons.close),
),
),
// Pangea#
],
),
)
: null,
),
);
}
}

13
lib/pangea/utils/overlay.dart
View file

@ -29,6 +29,7 @@ class OverlayUtil {
bool targetScreen = false,
Function? onDismiss,
bool centered = true,
bool bottom = false,
}) {
try {
if (closePrevOverlay) {
@ -47,16 +48,20 @@ class OverlayUtil {
onDismiss: onDismiss,
),
Positioned(
top: (targetScreen && !centered)
top: (targetScreen && !centered && !bottom)
? FluffyThemes.isColumnMode(context)
? 20
: 65
: null,
right: (targetScreen && !centered)
? FluffyThemes.isColumnMode(context)
? 20
: 15
? bottom
? 0
: FluffyThemes.isColumnMode(context)
? 20
: 15
: null,
left: bottom ? 0 : null,
bottom: bottom ? 0 : null,
width: width,
height: height,
child: targetScreen

2
lib/pangea/widgets/chat/message_toolbar.dart
View file

@ -66,6 +66,8 @@ class ToolbarDisplayController {
void showToolbar(BuildContext context, {MessageMode? mode}) {
// Close keyboard, if open
FocusManager.instance.primaryFocus?.unfocus();
// Close emoji picker, if open
controller.showEmojiPicker = false;
if (highlighted) return;
if (!MatrixState.pangeaController.languageController.languagesSet) {
pLanguageDialog(context, () {});