adjustment to layouts of toolbar content to make dynamic sizing work

This commit is contained in:
ggurdin 2024-10-22 14:44:26 -04:00
parent 4d0b2a3df1
commit f1ac5709f7
No known key found for this signature in database
GPG key ID: A01CB41737CBB478
8 changed files with 135 additions and 158 deletions

View file

@ -4114,14 +4114,14 @@
"placeholders": {}
},
"addChatToSpaceDesc": "Adding a chat to a space will make the chat appear within the space for students and give them access.",
"addSpaceToSpaceDesc": "Adding a sub space to space will make the sub space appear in the main space''s chat list.",
"addSpaceToSpaceDesc": "Adding a sub space to space will make the sub space appear in the main space's chat list.",
"spaceAnalytics": "Space Analytics",
"changeAnalyticsLanguage": "Change Analytics Language",
"suggestToSpace": "Suggest this space",
"suggestToSpaceDesc": "Suggested sub spaces will appear in their main space''s chat list",
"suggestToSpaceDesc": "Suggested sub spaces will appear in their main space's chat list",
"practice": "Practice",
"noLanguagesSet": "No languages set",
"noActivitiesFound": "That''s enough on this for now! Come back later for more.",
"noActivitiesFound": "That's enough on this for now! Come back later for more.",
"hintTitle": "Hint:",
"speechToTextBody": "See how well you did by looking at your Accuracy and Words Per Minute scores",
"previous": "Previous",
@ -4225,14 +4225,14 @@
"discoverHomeservers": "Discover homeservers",
"whatIsAHomeserver": "What is a homeserver?",
"homeserverDescription": "All your data is stored on the homeserver, just like an email provider. You can choose which homeserver you want to use, while you can still communicate with everyone. Learn more at at https://matrix.org.",
"doesNotSeemToBeAValidHomeserver": "Doesn''t seem to be a compatible homeserver. Wrong URL?",
"doesNotSeemToBeAValidHomeserver": "Doesn't seem to be a compatible homeserver. Wrong URL?",
"grammar": "Grammar",
"contactHasBeenInvitedToTheChat": "Contact has been invited to the chat",
"inviteChat": "📨 Invite chat",
"chatName": "Chat name",
"reportContentIssueTitle": "Report content issue",
"feedback": "Optional feedback",
"reportContentIssueDescription": "Uh oh! AI can faciliate personalized learning experiences but... also hallucinates. Please provide any feedback you have and we''ll try again.",
"reportContentIssueDescription": "Uh oh! AI can faciliate personalized learning experiences but... also hallucinates. Please provide any feedback you have and we'll try again.",
"clickTheWordAgainToDeselect": "Click the selected word to deselect it.",
"l2SupportNa": "Not Available",
"l2SupportAlpha": "Alpha",
@ -4355,7 +4355,7 @@
"grammarCopyNumber": "Number",
"grammarCopyConjType": "Conjunction Type",
"grammarCopyPolarity": "Polarity",
"grammarCopyNumberPsor": "Possessor''s Number",
"grammarCopyNumberPsor": "Possessor's Number",
"grammarCopyCase": "Case",
"grammarCopyDefinite": "Definiteness",
"grammarCopyNumForm": "Numeral Form",

View file

@ -187,26 +187,32 @@ class MessageAudioCardState extends State<MessageAudioCard> {
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(8),
constraints: const BoxConstraints(minHeight: minCardHeight),
alignment: Alignment.center,
child: _isLoading
? const ToolbarContentLoadingIndicator()
: audioFile != null
? Column(
children: [
AudioPlayerWidget(
null,
matrixFile: audioFile,
sectionStartMS: sectionStartMS,
sectionEndMS: sectionEndMS,
color: Theme.of(context).colorScheme.onPrimaryContainer,
),
tts.missingVoiceButton,
],
)
: const CardErrorWidget(),
return Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
padding: const EdgeInsets.all(8),
constraints: const BoxConstraints(minHeight: minCardHeight),
alignment: Alignment.center,
child: _isLoading
? const ToolbarContentLoadingIndicator()
: audioFile != null
? Column(
children: [
AudioPlayerWidget(
null,
matrixFile: audioFile,
sectionStartMS: sectionStartMS,
sectionEndMS: sectionEndMS,
color:
Theme.of(context).colorScheme.onPrimaryContainer,
),
tts.missingVoiceButton,
],
)
: const CardErrorWidget(),
),
],
);
}
}

View file

@ -5,7 +5,6 @@ import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dar
import 'package:fluffychat/pangea/models/speech_to_text_models.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/utils/inline_tooltip.dart';
import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart';
import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart';
import 'package:fluffychat/pangea/widgets/common/icon_number_widget.dart';
import 'package:fluffychat/pangea/widgets/igc/card_error_widget.dart';
@ -154,16 +153,11 @@ class MessageSpeechToTextCardState extends State<MessageSpeechToTextCard> {
return CardErrorWidget(error: error);
}
final int words = speechToTextResponse!.transcript.sttTokens.length;
final int accuracy = speechToTextResponse!.transcript.confidence;
final int total = words * accuracy;
//TODO: find better icons
return Container(
return Padding(
padding: const EdgeInsets.all(8),
constraints: const BoxConstraints(minHeight: minCardHeight),
alignment: Alignment.center,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 8),
RichText(
@ -171,19 +165,15 @@ class MessageSpeechToTextCardState extends State<MessageSpeechToTextCard> {
),
const SizedBox(height: 16),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
mainAxisSize: MainAxisSize.min,
children: [
// IconNumberWidget(
// icon: Icons.abc,
// number: (selectedToken == null ? words : 1).toString(),
// toolTip: L10n.of(context)!.words,
// ),
IconNumberWidget(
icon: Symbols.target,
number:
"${selectedToken?.confidence ?? speechToTextResponse!.transcript.confidence}%",
toolTip: L10n.of(context)!.accuracy,
),
const SizedBox(width: 16),
IconNumberWidget(
icon: Icons.speed,
number: wordsPerMinuteString != null

View file

@ -101,47 +101,25 @@ class MessageToolbar extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Material(
key: MatrixState.pAnyState
.layerLinkAndKey('${pangeaMessageEvent.eventId}-toolbar')
.key,
type: MaterialType.transparency,
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Column(
children: [
Container(
decoration: BoxDecoration(
color: Theme.of(context).cardColor,
border: Border.all(
width: 2,
color:
Theme.of(context).colorScheme.primary.withOpacity(0.5),
),
borderRadius: const BorderRadius.all(
Radius.circular(AppConfig.borderRadius),
),
),
constraints: const BoxConstraints(
maxHeight: AppConfig.toolbarMaxHeight,
),
// child: Row(
// children: [
// Expanded(
child: SingleChildScrollView(
child: AnimatedSize(
duration: FluffyThemes.animationDuration,
child: toolbarContent,
),
),
// ),
// ],
// ),
),
],
),
],
return Container(
decoration: BoxDecoration(
color: Theme.of(context).cardColor,
border: Border.all(
width: 2,
color: Theme.of(context).colorScheme.primary.withOpacity(0.5),
),
borderRadius: const BorderRadius.all(
Radius.circular(AppConfig.borderRadius),
),
),
constraints: const BoxConstraints(
maxHeight: AppConfig.toolbarMaxHeight,
),
child: SingleChildScrollView(
child: AnimatedSize(
duration: FluffyThemes.animationDuration,
child: toolbarContent,
),
),
);
}

View file

@ -6,7 +6,6 @@ import 'package:fluffychat/pangea/repo/full_text_translation_repo.dart';
import 'package:fluffychat/pangea/utils/bot_style.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/utils/inline_tooltip.dart';
import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart';
import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart';
import 'package:fluffychat/pangea/widgets/igc/card_error_widget.dart';
import 'package:fluffychat/widgets/matrix.dart';
@ -134,36 +133,41 @@ class MessageTranslationCardState extends State<MessageTranslationCard> {
return const CardErrorWidget();
}
return Container(
return Padding(
padding: const EdgeInsets.all(8),
constraints: const BoxConstraints(minHeight: minCardHeight),
alignment: Alignment.center,
child: _fetchingTranslation
? const ToolbarContentLoadingIndicator()
: Column(
children: [
widget.selection != null
? Text(
selectionTranslation!,
style: BotStyle.text(context),
)
: Text(
repEvent!.text,
style: BotStyle.text(context),
),
if (notGoingToTranslate && widget.selection == null)
InlineTooltip(
instructionsEnum: InstructionsEnum.l1Translation,
onClose: () => setState(() {}),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
_fetchingTranslation
? const ToolbarContentLoadingIndicator()
: Flexible(
child: Column(
children: [
widget.selection != null
? Text(
selectionTranslation!,
style: BotStyle.text(context),
)
: Text(
repEvent!.text,
style: BotStyle.text(context),
),
if (notGoingToTranslate && widget.selection == null)
InlineTooltip(
instructionsEnum: InstructionsEnum.l1Translation,
onClose: () => setState(() {}),
),
if (widget.selection != null)
InlineTooltip(
instructionsEnum:
InstructionsEnum.clickAgainToDeselect,
onClose: () => setState(() {}),
),
],
),
if (widget.selection != null)
InlineTooltip(
instructionsEnum: InstructionsEnum.clickAgainToDeselect,
onClose: () => setState(() {}),
),
// if (widget.selection != null)
],
),
),
],
),
);
}
}

View file

@ -30,7 +30,7 @@ class IconNumberWidget extends StatelessWidget {
),
onPressed: onPressed,
),
const SizedBox(width: 8),
const SizedBox(width: 5),
Text(
number.toString(),
style: TextStyle(

View file

@ -14,7 +14,6 @@ import 'package:fluffychat/pangea/utils/bot_style.dart';
import 'package:fluffychat/pangea/utils/error_handler.dart';
import 'package:fluffychat/pangea/widgets/animations/gain_points.dart';
import 'package:fluffychat/pangea/widgets/chat/message_selection_overlay.dart';
import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart';
import 'package:fluffychat/pangea/widgets/content_issue_button.dart';
import 'package:fluffychat/pangea/widgets/practice_activity/multiple_choice_activity.dart';
import 'package:fluffychat/pangea/widgets/practice_activity/no_more_practice_card.dart';
@ -314,45 +313,43 @@ class MessagePracticeActivityCardState extends State<PracticeActivityCard> {
return GamifiedTextWidget(userMessage: userMessage!);
}
return Container(
constraints: const BoxConstraints(
maxWidth: 350,
minWidth: 350,
minHeight: minCardHeight,
),
child: Stack(
alignment: Alignment.center,
children: [
// Main content
const Positioned(
child: PointsGainedAnimation(),
),
Container(
padding: const EdgeInsets.all(8),
child: activityWidget,
),
// Conditionally show the darkening and progress indicator based on the loading state
if (!savoringTheJoy && fetchingActivity) ...[
// Semi-transparent overlay
Container(
color: Colors.black.withOpacity(0.5), // Darkening effect
return Row(
mainAxisSize: MainAxisSize.min,
children: [
Stack(
alignment: Alignment.center,
children: [
// Main content
const Positioned(
child: PointsGainedAnimation(),
),
// Circular progress indicator in the center
const Center(
child: CircularProgressIndicator(),
Container(
padding: const EdgeInsets.all(8),
child: activityWidget,
),
// Conditionally show the darkening and progress indicator based on the loading state
if (!savoringTheJoy && fetchingActivity) ...[
// Semi-transparent overlay
Container(
color: Colors.black.withOpacity(0.5), // Darkening effect
),
// Circular progress indicator in the center
const Center(
child: CircularProgressIndicator(),
),
],
// Flag button in the top right corner
Positioned(
top: 0,
right: 0,
child: ContentIssueButton(
isActive: currentActivity != null,
submitFeedback: submitFeedback,
),
),
],
// Flag button in the top right corner
Positioned(
top: 0,
right: 0,
child: ContentIssueButton(
isActive: currentActivity != null,
submitFeedback: submitFeedback,
),
),
],
),
),
],
);
}
}

View file

@ -1,5 +1,4 @@
import 'package:fluffychat/pangea/utils/bot_style.dart';
import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/l10n.dart';
@ -10,16 +9,19 @@ class SelectToDefine extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: Container(
constraints: const BoxConstraints(minHeight: minCardHeight),
padding: const EdgeInsets.all(8),
child: Center(
child: Text(
L10n.of(context)!.selectToDefine,
style: BotStyle.text(context),
return Padding(
padding: const EdgeInsets.all(8),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Flexible(
child: Text(
L10n.of(context)!.selectToDefine,
style: BotStyle.text(context),
textAlign: TextAlign.center,
),
),
),
],
),
);
}