2020-04-02 14:05:32 +02:00
|
|
|
import 'package:famedlysdk/famedlysdk.dart';
|
2020-05-16 08:02:33 +02:00
|
|
|
import 'package:fluffychat/utils/app_route.dart';
|
|
|
|
import 'package:fluffychat/views/image_view.dart';
|
2020-04-02 14:05:32 +02:00
|
|
|
import 'package:flutter/material.dart';
|
2020-09-03 12:58:54 +02:00
|
|
|
import 'package:flutter/foundation.dart';
|
|
|
|
import 'package:flutter_blurhash/flutter_blurhash.dart';
|
2020-09-07 17:08:01 +02:00
|
|
|
import 'package:cached_network_image/cached_network_image.dart';
|
2020-04-28 14:11:56 +02:00
|
|
|
|
2020-04-02 14:05:32 +02:00
|
|
|
class ImageBubble extends StatefulWidget {
|
|
|
|
final Event event;
|
2020-05-16 08:02:33 +02:00
|
|
|
final bool tapToView;
|
2020-05-16 09:16:46 +02:00
|
|
|
final BoxFit fit;
|
2020-05-20 19:29:26 +02:00
|
|
|
final bool maxSize;
|
|
|
|
final Color backgroundColor;
|
|
|
|
final double radius;
|
2020-09-03 12:58:54 +02:00
|
|
|
final bool thumbnailOnly;
|
2020-04-02 14:05:32 +02:00
|
|
|
|
2020-05-16 09:16:46 +02:00
|
|
|
const ImageBubble(
|
|
|
|
this.event, {
|
|
|
|
this.tapToView = true,
|
2020-05-20 19:29:26 +02:00
|
|
|
this.maxSize = true,
|
|
|
|
this.backgroundColor,
|
2020-05-16 09:16:46 +02:00
|
|
|
this.fit = BoxFit.cover,
|
2020-05-20 19:29:26 +02:00
|
|
|
this.radius = 10.0,
|
2020-09-03 12:58:54 +02:00
|
|
|
this.thumbnailOnly = true,
|
2020-05-16 09:16:46 +02:00
|
|
|
Key key,
|
|
|
|
}) : super(key: key);
|
2020-04-02 14:05:32 +02:00
|
|
|
|
|
|
|
@override
|
|
|
|
_ImageBubbleState createState() => _ImageBubbleState();
|
|
|
|
}
|
|
|
|
|
|
|
|
class _ImageBubbleState extends State<ImageBubble> {
|
2020-09-03 12:58:54 +02:00
|
|
|
bool get isUnencrypted => widget.event.content['url'] is String;
|
|
|
|
|
2020-05-13 15:58:59 +02:00
|
|
|
static final Map<String, MatrixFile> _matrixFileMap = {};
|
2020-04-09 10:00:18 +02:00
|
|
|
MatrixFile get _file => _matrixFileMap[widget.event.eventId];
|
|
|
|
set _file(MatrixFile file) {
|
2020-09-03 12:58:54 +02:00
|
|
|
if (file != null) {
|
|
|
|
_matrixFileMap[widget.event.eventId] = file;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
static final Map<String, MatrixFile> _matrixThumbnailMap = {};
|
|
|
|
MatrixFile get _thumbnail => _matrixThumbnailMap[widget.event.eventId];
|
|
|
|
set _thumbnail(MatrixFile thumbnail) {
|
|
|
|
if (thumbnail != null) {
|
|
|
|
_matrixThumbnailMap[widget.event.eventId] = thumbnail;
|
|
|
|
}
|
2020-04-09 10:00:18 +02:00
|
|
|
}
|
|
|
|
|
2020-04-02 14:05:32 +02:00
|
|
|
dynamic _error;
|
|
|
|
|
2020-09-03 12:58:54 +02:00
|
|
|
bool _requestedFile = false;
|
2020-04-02 14:05:32 +02:00
|
|
|
Future<MatrixFile> _getFile() async {
|
2020-09-03 12:58:54 +02:00
|
|
|
_requestedFile = true;
|
|
|
|
if (widget.thumbnailOnly) return null;
|
2020-04-02 14:05:32 +02:00
|
|
|
if (_file != null) return _file;
|
2020-09-03 12:58:54 +02:00
|
|
|
return widget.event.downloadAndDecryptAttachment();
|
|
|
|
}
|
|
|
|
|
|
|
|
bool _requestedThumbnail = false;
|
|
|
|
Future<MatrixFile> _getThumbnail() async {
|
|
|
|
_requestedThumbnail = true;
|
|
|
|
if (isUnencrypted) return null;
|
|
|
|
if (_thumbnail != null) return _thumbnail;
|
2020-05-07 12:14:26 +02:00
|
|
|
return widget.event
|
|
|
|
.downloadAndDecryptAttachment(getThumbnail: widget.event.hasThumbnail);
|
2020-04-02 14:05:32 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
@override
|
|
|
|
Widget build(BuildContext context) {
|
2020-09-19 16:21:57 +02:00
|
|
|
return ClipRRect(
|
|
|
|
borderRadius: BorderRadius.circular(widget.radius),
|
2020-04-02 14:05:32 +02:00
|
|
|
child: Container(
|
2020-05-20 19:29:26 +02:00
|
|
|
height: widget.maxSize ? 300 : null,
|
|
|
|
width: widget.maxSize ? 400 : null,
|
2020-04-02 14:05:32 +02:00
|
|
|
child: Builder(
|
|
|
|
builder: (BuildContext context) {
|
|
|
|
if (_error != null) {
|
|
|
|
return Center(
|
|
|
|
child: Text(
|
|
|
|
_error.toString(),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
}
|
2020-09-03 12:58:54 +02:00
|
|
|
if (_thumbnail == null && !_requestedThumbnail && !isUnencrypted) {
|
|
|
|
_getThumbnail().then((MatrixFile thumbnail) {
|
|
|
|
setState(() => _thumbnail = thumbnail);
|
|
|
|
}, onError: (error, stacktrace) {
|
|
|
|
setState(() => _error = error);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
if (_file == null && !widget.thumbnailOnly && !_requestedFile) {
|
|
|
|
_getFile().then((MatrixFile file) {
|
|
|
|
setState(() => _file = file);
|
|
|
|
}, onError: (error, stacktrace) {
|
|
|
|
setState(() => _error = error);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
final display = _file ?? _thumbnail;
|
|
|
|
|
|
|
|
final generatePlaceholderWidget = () => Stack(
|
|
|
|
children: <Widget>[
|
|
|
|
if (widget.event.content['info'] is Map &&
|
|
|
|
widget.event.content['info']['xyz.amorgan.blurhash']
|
|
|
|
is String)
|
|
|
|
BlurHash(
|
|
|
|
hash: widget.event.content['info']
|
|
|
|
['xyz.amorgan.blurhash']),
|
|
|
|
Center(
|
|
|
|
child: CircularProgressIndicator(),
|
2020-05-16 08:02:33 +02:00
|
|
|
),
|
2020-09-03 12:58:54 +02:00
|
|
|
],
|
|
|
|
);
|
|
|
|
|
|
|
|
Widget renderWidget;
|
|
|
|
if (display != null) {
|
|
|
|
renderWidget = Image.memory(
|
|
|
|
display.bytes,
|
|
|
|
fit: widget.fit,
|
|
|
|
);
|
|
|
|
} else if (isUnencrypted) {
|
2020-09-07 17:08:01 +02:00
|
|
|
renderWidget = CachedNetworkImage(
|
|
|
|
imageUrl: Uri.parse(widget.event.content['url']).getThumbnail(
|
|
|
|
widget.event.room.client,
|
|
|
|
width: 800,
|
|
|
|
height: 800,
|
|
|
|
method: ThumbnailMethod.scale),
|
|
|
|
placeholder: (context, url) => generatePlaceholderWidget(),
|
2020-09-03 12:58:54 +02:00
|
|
|
fit: widget.fit,
|
2020-04-02 14:05:32 +02:00
|
|
|
);
|
2020-09-03 12:58:54 +02:00
|
|
|
} else {
|
|
|
|
renderWidget = generatePlaceholderWidget();
|
2020-04-02 14:05:32 +02:00
|
|
|
}
|
2020-09-03 12:58:54 +02:00
|
|
|
return InkWell(
|
|
|
|
onTap: () {
|
|
|
|
if (!widget.tapToView) return;
|
|
|
|
Navigator.of(context).push(
|
|
|
|
AppRoute(
|
|
|
|
ImageView(widget.event),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
},
|
|
|
|
child: Hero(
|
|
|
|
tag: widget.event.eventId,
|
|
|
|
child: renderWidget,
|
|
|
|
),
|
2020-04-02 14:05:32 +02:00
|
|
|
);
|
|
|
|
},
|
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|