Skip to content

Commit

Permalink
TW-1650: reorganize image_builder folder
Browse files Browse the repository at this point in the history
  • Loading branch information
sherlockvn committed May 13, 2024
1 parent c0e6e7f commit e99132b
Show file tree
Hide file tree
Showing 18 changed files with 329 additions and 241 deletions.
2 changes: 1 addition & 1 deletion lib/pages/chat/events/event_video_player.dart
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import 'package:flutter_blurhash/flutter_blurhash.dart';
import 'package:linagora_design_flutter/linagora_design_flutter.dart';
import 'package:matrix/matrix.dart';

import 'package:fluffychat/pages/chat/events/image_bubble.dart';
import 'package:fluffychat/pages/chat/events/images_builder/image_bubble.dart';
import 'package:linagora_design_flutter/extensions/duration_extension.dart';

typedef DownloadVideoEventCallback = Future<String> Function(Event event);
Expand Down
2 changes: 1 addition & 1 deletion lib/pages/chat/events/html_message.dart
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ class HtmlMessage extends StatelessWidget {
double? height, {
bool? animated = false,
}) {
final ratio = MediaQuery.of(context).devicePixelRatio;
final ratio = MediaQuery.devicePixelRatioOf(context);
return Uri.parse(mxc)
.getThumbnail(
matrix.client,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import 'package:fluffychat/pages/chat/events/image_builder_web.dart';
import 'dart:typed_data';

import 'package:fluffychat/pages/chat/events/images_builder/image_builder_web.dart';
import 'package:fluffychat/pages/chat/events/images_builder/image_placeholder.dart';
import 'package:fluffychat/pages/chat/events/message_content_style.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions/event_extension.dart';
import 'package:fluffychat/utils/platform_infos.dart';
import 'package:flutter/material.dart';
Expand All @@ -21,6 +23,7 @@ class ImageBubble extends StatelessWidget {
final void Function()? onTapSelectMode;
final bool isPreview;
final Duration animationDuration;
final Uint8List? imageData;

final String? thumbnailCacheKey;
final Map<EventId, ImageData>? thumbnailCacheMap;
Expand All @@ -42,6 +45,7 @@ class ImageBubble extends StatelessWidget {
this.thumbnailCacheMap,
this.noResizeThumbnail = false,
this.isPreview = true,
this.imageData,
Key? key,
}) : super(key: key);

Expand Down Expand Up @@ -108,59 +112,11 @@ class ImageBubble extends StatelessWidget {
cacheKey: thumbnailCacheKey,
cacheMap: thumbnailCacheMap,
noResize: noResizeThumbnail,
imageData: imageData,
),
],
),
),
);
}
}

class ImagePlaceholder extends StatelessWidget {
const ImagePlaceholder({
super.key,
required this.event,
required this.width,
required this.height,
required this.fit,
});

final Event event;
final double width;
final double height;
final BoxFit fit;

@override
Widget build(BuildContext context) {
if (event.messageType == MessageTypes.Sticker) {
return const Center(
child: CircularProgressIndicator.adaptive(),
);
}
final String blurHashString =
event.blurHash ?? AppConfig.defaultImageBlurHash;
final ratio = event.infoMap['w'] is int && event.infoMap['h'] is int
? event.infoMap['w'] / event.infoMap['h']
: 1.0;
var width = 32;
var height = 32;
if (ratio > 1.0) {
height = (width / ratio).round();
} else {
width = (height * ratio).round();
}
return ClipRRect(
borderRadius: BorderRadius.zero,
child: SizedBox(
width: this.width,
height: this.height,
child: BlurHash(
hash: blurHashString,
decodingWidth: width,
decodingHeight: height,
imageFit: fit,
),
),
);
}
}
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
import 'package:fluffychat/pages/chat/events/image_bubble.dart';
import 'package:fluffychat/pages/chat/events/images_builder/unencrypted_image_builder_web.dart';
import 'package:fluffychat/pages/chat/events/message_content_style.dart';
import 'package:fluffychat/pages/image_viewer/image_viewer.dart';
import 'package:fluffychat/presentation/enum/chat/media_viewer_popup_result_enum.dart';
import 'package:fluffychat/utils/interactive_viewer_gallery.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions/event_extension.dart';
import 'package:fluffychat/utils/platform_infos.dart';
import 'package:fluffychat/widgets/hero_page_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_blurhash/flutter_blurhash.dart';
import 'package:matrix/matrix.dart';

class UnencryptedImageBuilderWeb extends StatelessWidget {
Expand All @@ -31,8 +29,8 @@ class UnencryptedImageBuilderWeb extends StatelessWidget {
super.key,
required this.event,
this.isThumbnail = true,
this.width = 256,
this.height = 300,
this.width = MessageContentStyle.imageBubbleWidthForMobileAndTablet,
this.height = MessageContentStyle.imageBubbleHeightForMobileAndTable,
this.fit = BoxFit.cover,
this.onTapSelectMode,
this.onTapPreview,
Expand All @@ -46,7 +44,7 @@ class UnencryptedImageBuilderWeb extends StatelessWidget {
child: Material(
child: InkWell(
mouseCursor: SystemMouseCursors.click,
borderRadius: BorderRadius.circular(12.0),
borderRadius: MessageContentStyle.borderRadiusBubble,
onTap: onTapPreview != null || onTapSelectMode != null
? () => _onTap(context)
: null,
Expand Down Expand Up @@ -82,74 +80,6 @@ class UnencryptedImageBuilderWeb extends StatelessWidget {
}
} else if (onTapSelectMode != null) {
onTapSelectMode!();
return;
} else {
return;
}
}
}

class UnencryptedImageWidget extends StatelessWidget {
const UnencryptedImageWidget({
super.key,
required this.event,
required this.isThumbnail,
required this.width,
required this.height,
required this.fit,
});

final Event event;
final bool isThumbnail;
final double width;
final double height;
final BoxFit fit;

@override
Widget build(BuildContext context) {
return Image.network(
event
.attachmentOrThumbnailMxcUrl(getThumbnail: isThumbnail)!
.getDownloadLink(event.room.client)
.toString(),
frameBuilder: (context, child, frame, wasSynchronouslyLoaded) {
if (wasSynchronouslyLoaded) {
return child;
}
return AnimatedSwitcher(
duration: const Duration(milliseconds: 300),
child: frame != null
? child
: ImagePlaceholder(
event: event,
width: width,
height: height,
fit: fit,
),
);
},
fit: fit,
width: width,
height: height,
cacheWidth: (width * MediaQuery.of(context).devicePixelRatio).toInt(),
filterQuality: FilterQuality.none,
errorBuilder: (context, error, stackTrace) {
return BlurHash(
hash: event.blurHash ?? MessageContentStyle.defaultBlurHash,
);
},
loadingBuilder: (context, child, loadingProgress) {
if (loadingProgress == null) {
return child;
}
return SizedBox(
width: width,
height: height,
child: BlurHash(
hash: event.blurHash ?? MessageContentStyle.defaultBlurHash,
),
);
},
);
}
}
55 changes: 55 additions & 0 deletions lib/pages/chat/events/images_builder/image_placeholder.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/pages/chat/events/message_content_style.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions/event_extension.dart';
import 'package:flutter/material.dart';
import 'package:flutter_blurhash/flutter_blurhash.dart';
import 'package:matrix/matrix.dart';

class ImagePlaceholder extends StatelessWidget {
const ImagePlaceholder({
super.key,
required this.event,
required this.width,
required this.height,
required this.fit,
});

final Event event;
final double width;
final double height;
final BoxFit fit;

@override
Widget build(BuildContext context) {
if (event.messageType == MessageTypes.Sticker) {
return const Center(
child: CircularProgressIndicator.adaptive(),
);
}
final String blurHashString =
event.blurHash ?? AppConfig.defaultImageBlurHash;
final ratio = event.infoMap['w'] is int && event.infoMap['h'] is int
? event.infoMap['w'] / event.infoMap['h']
: 1.0;
var width = MessageContentStyle.blurhashSize;
var height = MessageContentStyle.blurhashSize;
if (ratio > 1.0) {
height = (width / ratio).round();
} else {
width = (height * ratio).round();
}
return ClipRRect(
borderRadius: BorderRadius.zero,
child: SizedBox(
width: this.width,
height: this.height,
child: BlurHash(
hash: blurHashString,
decodingWidth: width,
decodingHeight: height,
imageFit: fit,
),
),
);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
import 'package:fluffychat/pages/chat/events/images_builder/image_bubble.dart';
import 'package:fluffychat/pages/chat/events/message_content_style.dart';
import 'package:fluffychat/pages/chat/events/images_builder/sending_image_info_widget.dart';
import 'package:fluffychat/presentation/model/file/display_image_info.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions/event_extension.dart';
import 'package:fluffychat/utils/platform_infos.dart';
import 'package:flutter/material.dart';
import 'package:matrix/matrix.dart';
import 'package:fluffychat/utils/extension/image_size_extension.dart';

class MessageImageBuilder extends StatelessWidget {
final Event event;

final void Function()? onTapPreview;

final void Function()? onTapSelectMode;

const MessageImageBuilder({
super.key,
required this.event,
this.onTapPreview,
this.onTapSelectMode,
});

@override
Widget build(BuildContext context) {
final matrixFile = event.getMatrixFile();

DisplayImageInfo? displayImageInfo =
event.getOriginalResolution()?.getDisplayImageInfo(context);

if (isSendingImageInMobile(matrixFile)) {
final file = matrixFile as MatrixImageFile;
displayImageInfo = Size(
file.width?.toDouble() ?? MessageContentStyle.imageWidth(context),
file.height?.toDouble() ?? MessageContentStyle.imageHeight(context),
).getDisplayImageInfo(context);
return SendingImageInfoWidget(
key: ValueKey(event.eventId),
matrixFile: file,
event: event,
onTapPreview: onTapPreview,
displayImageInfo: displayImageInfo,
);
}
displayImageInfo ??= DisplayImageInfo(
size: Size(
MessageContentStyle.imageWidth(context),
MessageContentStyle.imageHeight(context),
),
hasBlur: true,
);
if (isSendingImageInWeb(matrixFile)) {
final file = matrixFile as MatrixImageFile;
displayImageInfo = Size(
file.width?.toDouble() ?? MessageContentStyle.imageWidth(context),
file.height?.toDouble() ?? MessageContentStyle.imageHeight(context),
).getDisplayImageInfo(context);
return SendingImageInfoWidget(
key: ValueKey(event.eventId),
matrixFile: file,
event: event,
onTapPreview: onTapPreview,
displayImageInfo: displayImageInfo,
);
}
return ImageBubble(
event,
width: displayImageInfo.size.width,
height: displayImageInfo.size.height,
fit: BoxFit.cover,
onTapSelectMode: onTapSelectMode,
onTapPreview: onTapPreview,
animated: true,
thumbnailOnly: true,
);
}

bool isSendingImageInWeb(MatrixFile? matrixFile) {
return matrixFile != null &&
matrixFile.bytes != null &&
matrixFile is MatrixImageFile;
}

bool isSendingImageInMobile(MatrixFile? matrixFile) {
return matrixFile != null &&
matrixFile.filePath != null &&
matrixFile is MatrixImageFile &&
!PlatformInfos.isWeb;
}
}
Loading

0 comments on commit e99132b

Please sign in to comment.