From 9705f9a3a140607e965009f47e5734dffc87a299 Mon Sep 17 00:00:00 2001 From: Ellet Date: Tue, 14 Nov 2023 06:05:24 +0300 Subject: [PATCH] Update flutter_quill_extensions --- CHANGELOG.md | 2 + flutter_quill_extensions/CHANGELOG.md | 8 ++ .../lib/logic/extensions/attribute.dart | 18 ++- .../lib/logic/utils/string.dart | 38 ++++++ .../embeds/editor/image/image.dart | 114 +----------------- .../embeds/editor/image/image_menu.dart | 4 +- .../embeds/editor/video/video.dart | 25 +++- .../presentation/embeds/widgets/image.dart | 2 +- .../embeds/widgets/video_app.dart | 5 +- .../lib/presentation/utils/utils.dart | 113 +++++++++++++++++ .../lib/presentation/utils/web_utils.dart | 4 +- lib/src/l10n/extensions/localizations.dart | 2 +- lib/src/models/documents/attribute.dart | 2 + lib/src/models/rules/insert.dart | 1 + lib/src/utils/string.dart | 8 +- 15 files changed, 214 insertions(+), 132 deletions(-) create mode 100644 flutter_quill_extensions/lib/logic/utils/string.dart diff --git a/CHANGELOG.md b/CHANGELOG.md index 6ec72d1c..b97d6959 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,8 @@ All notable changes to this project will be documented in this file. ## 8.5.4 - The `mobileWidth`, `mobileHeight`, `mobileMargin` and `mobileAlignment` is now deprecated in `flutter_quill`, they are are now defined in `flutter_quill_extensions` +- Deprecate `replaceStyleStringWithSize` function which is in `string.dart` +- Deprecate `alignment`, and `margin` as they don't confirm to offical Quill JS ## 8.5.3 - Update doc diff --git a/flutter_quill_extensions/CHANGELOG.md b/flutter_quill_extensions/CHANGELOG.md index 270ed664..fb438d6f 100644 --- a/flutter_quill_extensions/CHANGELOG.md +++ b/flutter_quill_extensions/CHANGELOG.md @@ -1,3 +1,11 @@ +# Changelog + +All notable changes to this project will be documented in this file. + +## 0.6.10 +- Update deprecated members from `flutter_quill` +- Update doc and `README.md` + ## 0.6.9 - Remove duplicated class - Drop the support for `QuillEditorFormulaEmbedBuilder` for now as it's not usable, we are working on providing a fixes diff --git a/flutter_quill_extensions/lib/logic/extensions/attribute.dart b/flutter_quill_extensions/lib/logic/extensions/attribute.dart index 84cdecf6..fd939e77 100644 --- a/flutter_quill_extensions/lib/logic/extensions/attribute.dart +++ b/flutter_quill_extensions/lib/logic/extensions/attribute.dart @@ -11,4 +11,20 @@ class MobileHeightAttribute extends Attribute { : super('mobileHeight', AttributeScope.ignore, val); } -extension AttributeExt on Attribute {} +class MobileMarginAttribute extends Attribute { + const MobileMarginAttribute(String? val) + : super('mobileMargin', AttributeScope.ignore, val); +} + +class MobileAlignmentAttribute extends Attribute { + const MobileAlignmentAttribute(String? val) + : super('mobileAlignment', AttributeScope.ignore, val); +} + +extension AttributeExt on Attribute { + static const MobileWidthAttribute mobileWidth = MobileWidthAttribute(null); + static const MobileHeightAttribute mobileHeight = MobileHeightAttribute(null); + static const MobileMarginAttribute mobileMargin = MobileMarginAttribute(null); + static const MobileAlignmentAttribute mobileAlignment = + MobileAlignmentAttribute(null); +} diff --git a/flutter_quill_extensions/lib/logic/utils/string.dart b/flutter_quill_extensions/lib/logic/utils/string.dart new file mode 100644 index 00000000..aca39f68 --- /dev/null +++ b/flutter_quill_extensions/lib/logic/utils/string.dart @@ -0,0 +1,38 @@ +import 'package:flutter_quill/flutter_quill.dart' show Attribute; + +import '../extensions/attribute.dart'; + +String replaceStyleStringWithSize( + String cssStyle, { + required double width, + required double height, + required bool isMobile, +}) { + final result = {}; + final pairs = cssStyle.split(';'); + for (final pair in pairs) { + final index = pair.indexOf(':'); + if (index < 0) { + continue; + } + final key = pair.substring(0, index).trim(); + result[key] = pair.substring(index + 1).trim(); + } + + if (isMobile) { + result[AttributeExt.mobileWidth.key] = width.toString(); + result[AttributeExt.mobileHeight.key] = height.toString(); + } else { + result[Attribute.width.key] = width.toString(); + result[Attribute.height.key] = height.toString(); + } + final sb = StringBuffer(); + for (final pair in result.entries) { + sb + ..write(pair.key) + ..write(': ') + ..write(pair.value) + ..write('; '); + } + return sb.toString(); +} diff --git a/flutter_quill_extensions/lib/presentation/embeds/editor/image/image.dart b/flutter_quill_extensions/lib/presentation/embeds/editor/image/image.dart index bcd72fa9..d718fa0b 100644 --- a/flutter_quill_extensions/lib/presentation/embeds/editor/image/image.dart +++ b/flutter_quill_extensions/lib/presentation/embeds/editor/image/image.dart @@ -1,5 +1,3 @@ -// ignore_for_file: deprecated_member_use - import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:flutter_quill/extensions.dart' as base; @@ -7,6 +5,7 @@ import 'package:flutter_quill/flutter_quill.dart' hide OptionalSize; import '../../../../logic/models/config/shared_configurations.dart'; import '../../../models/config/editor/image/image.dart'; +import '../../../utils/utils.dart'; import '../../widgets/image.dart'; import 'image_menu.dart'; @@ -34,7 +33,7 @@ class QuillEditorImageEmbedBuilder extends EmbedBuilder { assert(!kIsWeb, 'Please provide image EmbedBuilder for Web'); final imageSource = standardizeImageUrl(node.value.data); - final ((imageSize), margin, alignment) = _getImageAttributes(node); + final ((imageSize), margin, alignment) = getElementAttributes(node); final width = imageSize.width; final height = imageSize.height; @@ -147,112 +146,3 @@ class QuillEditorImageEmbedBuilder extends EmbedBuilder { ); } } - -( - OptionalSize imageSize, - double? margin, - Alignment alignment, -) _getImageAttributes( - Node node, -) { - var imageSize = const OptionalSize(null, null); - var imageAlignment = Alignment.center; - double? imageMargin; - - // Usually double value - final heightValue = double.tryParse( - node.style.attributes[Attribute.height.key]?.value.toString() ?? ''); - final widthValue = double.tryParse( - node.style.attributes[Attribute.width.key]?.value.toString() ?? ''); - - if (heightValue != null) { - imageSize = imageSize.copyWith( - height: heightValue, - ); - } - if (widthValue != null) { - imageSize = imageSize.copyWith( - width: widthValue, - ); - } - - final cssStyle = node.style.attributes['style']; - - if (cssStyle != null) { - final attrs = base.isMobile(supportWeb: false) - ? base.parseKeyValuePairs(cssStyle.value.toString(), { - Attribute.mobileWidth, - Attribute.mobileHeight, - Attribute.mobileMargin, - Attribute.mobileAlignment, - }) - : base.parseKeyValuePairs(cssStyle.value.toString(), { - Attribute.width.key, - Attribute.height.key, - Attribute.margin, - Attribute.alignment, - }); - if (attrs.isEmpty) { - return (imageSize, imageMargin, imageAlignment); - } - - // It css value as string but we will try to support it anyway - - // TODO: This could be improved much better - final cssHeightValue = double.tryParse(((base.isMobile(supportWeb: false) - ? attrs[Attribute.mobileHeight] - : attrs[Attribute.height.key]) ?? - '') - .replaceFirst('px', '')); - final cssWidthValue = double.tryParse(((!base.isMobile(supportWeb: false) - ? attrs[Attribute.width.key] - : attrs[Attribute.mobileWidth]) ?? - '') - .replaceFirst('px', '')); - - if (cssHeightValue != null) { - imageSize = imageSize.copyWith(height: cssHeightValue); - } - if (cssWidthValue != null) { - imageSize = imageSize.copyWith(width: cssWidthValue); - } - - imageAlignment = base.getAlignment(base.isMobile(supportWeb: false) - ? attrs[Attribute.mobileAlignment] - : attrs[Attribute.alignment]); - final margin = (base.isMobile(supportWeb: false) - ? double.tryParse(Attribute.mobileMargin) - : double.tryParse(Attribute.margin)); - if (margin != null) { - imageMargin = margin; - } - } - - return (imageSize, imageMargin, imageAlignment); -} - -@immutable -class OptionalSize { - const OptionalSize( - this.width, - this.height, - ); - - /// If non-null, requires the child to have exactly this width. - /// If null, the child is free to choose its own width. - final double? width; - - /// If non-null, requires the child to have exactly this height. - /// If null, the child is free to choose its own height. - final double? height; - - OptionalSize copyWith({ - double? width, - double? height, - }) { - return OptionalSize( - width ?? this.width, - height ?? this.height, - ); - } -} diff --git a/flutter_quill_extensions/lib/presentation/embeds/editor/image/image_menu.dart b/flutter_quill_extensions/lib/presentation/embeds/editor/image/image_menu.dart index c5bd3daf..1126228b 100644 --- a/flutter_quill_extensions/lib/presentation/embeds/editor/image/image_menu.dart +++ b/flutter_quill_extensions/lib/presentation/embeds/editor/image/image_menu.dart @@ -1,13 +1,13 @@ import 'package:flutter/cupertino.dart' show showCupertinoModalPopup; import 'package:flutter/material.dart'; -import 'package:flutter_quill/extensions.dart' - show isDesktop, isMobile, replaceStyleStringWithSize; +import 'package:flutter_quill/extensions.dart' show isDesktop, isMobile; import 'package:flutter_quill/flutter_quill.dart' show ImageUrl, QuillController, StyleAttribute, getEmbedNode; import 'package:flutter_quill/translations.dart'; import '../../../../logic/models/config/shared_configurations.dart'; import '../../../../logic/services/image_saver/s_image_saver.dart'; +import '../../../../logic/utils/string.dart'; import '../../../models/config/editor/image/image.dart'; import '../../../utils/utils.dart'; import '../../widgets/image.dart' show ImageTapWrapper, getImageStyleString; diff --git a/flutter_quill_extensions/lib/presentation/embeds/editor/video/video.dart b/flutter_quill_extensions/lib/presentation/embeds/editor/video/video.dart index 532fa72b..11b4b74a 100644 --- a/flutter_quill_extensions/lib/presentation/embeds/editor/video/video.dart +++ b/flutter_quill_extensions/lib/presentation/embeds/editor/video/video.dart @@ -32,13 +32,26 @@ class QuillEditorVideoEmbedBuilder extends EmbedBuilder { final videoUrl = node.value.data; if (isYouTubeUrl(videoUrl)) { return YoutubeVideoApp( - videoUrl: videoUrl, context: context, readOnly: readOnly); + videoUrl: videoUrl, + context: context, + readOnly: readOnly, + ); } - return VideoApp( - videoUrl: videoUrl, - context: context, - readOnly: readOnly, - onVideoInit: configurations.onVideoInit, + final ((imageSize), margin, alignment) = getElementAttributes(node); + + final width = imageSize.width; + final height = imageSize.height; + return Container( + width: width, + height: height, + margin: EdgeInsets.all(margin ?? 0.0), + alignment: alignment, + child: VideoApp( + videoUrl: videoUrl, + context: context, + readOnly: readOnly, + onVideoInit: configurations.onVideoInit, + ), ); } } diff --git a/flutter_quill_extensions/lib/presentation/embeds/widgets/image.dart b/flutter_quill_extensions/lib/presentation/embeds/widgets/image.dart index 70a7b0cb..13c77eb9 100644 --- a/flutter_quill_extensions/lib/presentation/embeds/widgets/image.dart +++ b/flutter_quill_extensions/lib/presentation/embeds/widgets/image.dart @@ -50,7 +50,7 @@ ImageProvider getImageProviderByImageSource( } if (imageSource.startsWith(assetsPrefix)) { - // TODO: This impl needs to be improved + // TODO: This impl could be improved return AssetImage(imageSource); } return FileImage(File(imageSource)); diff --git a/flutter_quill_extensions/lib/presentation/embeds/widgets/video_app.dart b/flutter_quill_extensions/lib/presentation/embeds/widgets/video_app.dart index 895d40cd..5b794394 100644 --- a/flutter_quill_extensions/lib/presentation/embeds/widgets/video_app.dart +++ b/flutter_quill_extensions/lib/presentation/embeds/widgets/video_app.dart @@ -6,6 +6,8 @@ import 'package:flutter_quill/flutter_quill.dart'; import 'package:url_launcher/url_launcher.dart'; import 'package:video_player/video_player.dart'; +import '../../../flutter_quill_extensions.dart'; + /// Widget for playing back video /// Refer to https://github.com/flutter/plugins/tree/master/packages/video_player/video_player class VideoApp extends StatefulWidget { @@ -34,7 +36,7 @@ class VideoAppState extends State { void initState() { super.initState(); - _controller = widget.videoUrl.startsWith('http') + _controller = isHttpBasedUrl(widget.videoUrl) ? VideoPlayerController.networkUrl(Uri.parse(widget.videoUrl)) : VideoPlayerController.file(File(widget.videoUrl)) ..initialize().then((_) { @@ -82,7 +84,6 @@ class VideoAppState extends State { return Container( key: videoContainerKey, - // height: 300, child: InkWell( onTap: () { setState(() { diff --git a/flutter_quill_extensions/lib/presentation/utils/utils.dart b/flutter_quill_extensions/lib/presentation/utils/utils.dart index 0dfe9578..681e44cd 100644 --- a/flutter_quill_extensions/lib/presentation/utils/utils.dart +++ b/flutter_quill_extensions/lib/presentation/utils/utils.dart @@ -1,6 +1,10 @@ import 'dart:io' show File; import 'package:flutter/foundation.dart' show immutable; +import 'package:flutter/widgets.dart' show Alignment; +import 'package:flutter_quill/extensions.dart' as base; +import 'package:flutter_quill/flutter_quill.dart' show Attribute, Node; +import '../../logic/extensions/attribute.dart'; import '../../logic/services/image_saver/s_image_saver.dart'; import '../embeds/widgets/image.dart'; @@ -86,3 +90,112 @@ Future saveImage({ ); } } + +( + OptionalSize imageSize, + double? margin, + Alignment alignment, +) getElementAttributes( + Node node, +) { + var imageSize = const OptionalSize(null, null); + var imageAlignment = Alignment.center; + double? imageMargin; + + // Usually double value + final heightValue = double.tryParse( + node.style.attributes[Attribute.height.key]?.value.toString() ?? ''); + final widthValue = double.tryParse( + node.style.attributes[Attribute.width.key]?.value.toString() ?? ''); + + if (heightValue != null) { + imageSize = imageSize.copyWith( + height: heightValue, + ); + } + if (widthValue != null) { + imageSize = imageSize.copyWith( + width: widthValue, + ); + } + + final cssStyle = node.style.attributes['style']; + + if (cssStyle != null) { + final attrs = base.isMobile(supportWeb: false) + ? base.parseKeyValuePairs(cssStyle.value.toString(), { + AttributeExt.mobileWidth.key, + AttributeExt.mobileHeight.key, + AttributeExt.mobileMargin.key, + AttributeExt.mobileAlignment.key, + }) + : base.parseKeyValuePairs(cssStyle.value.toString(), { + Attribute.width.key, + Attribute.height.key, + 'margin', + 'alignment', + }); + if (attrs.isEmpty) { + return (imageSize, imageMargin, imageAlignment); + } + + // It css value as string but we will try to support it anyway + + // TODO: This could be improved much better + final cssHeightValue = double.tryParse(((base.isMobile(supportWeb: false) + ? attrs[AttributeExt.mobileHeight.key] + : attrs[Attribute.height.key]) ?? + '') + .replaceFirst('px', '')); + final cssWidthValue = double.tryParse(((!base.isMobile(supportWeb: false) + ? attrs[Attribute.width.key] + : attrs[AttributeExt.mobileWidth.key]) ?? + '') + .replaceFirst('px', '')); + + if (cssHeightValue != null) { + imageSize = imageSize.copyWith(height: cssHeightValue); + } + if (cssWidthValue != null) { + imageSize = imageSize.copyWith(width: cssWidthValue); + } + + imageAlignment = base.getAlignment(base.isMobile(supportWeb: false) + ? attrs[AttributeExt.mobileAlignment.key] + : attrs['alignment']); + final margin = (base.isMobile(supportWeb: false) + ? double.tryParse(AttributeExt.mobileMargin.key) + : double.tryParse('margin')); + if (margin != null) { + imageMargin = margin; + } + } + + return (imageSize, imageMargin, imageAlignment); +} + +@immutable +class OptionalSize { + const OptionalSize( + this.width, + this.height, + ); + + /// If non-null, requires the child to have exactly this width. + /// If null, the child is free to choose its own width. + final double? width; + + /// If non-null, requires the child to have exactly this height. + /// If null, the child is free to choose its own height. + final double? height; + + OptionalSize copyWith({ + double? width, + double? height, + }) { + return OptionalSize( + width ?? this.width, + height ?? this.height, + ); + } +} diff --git a/flutter_quill_extensions/lib/presentation/utils/web_utils.dart b/flutter_quill_extensions/lib/presentation/utils/web_utils.dart index aeb365c2..527f668e 100644 --- a/flutter_quill_extensions/lib/presentation/utils/web_utils.dart +++ b/flutter_quill_extensions/lib/presentation/utils/web_utils.dart @@ -28,8 +28,8 @@ import 'package:flutter_quill/flutter_quill.dart' show Attribute, Node; final attrs = base.parseKeyValuePairs(cssStyle.value.toString(), { Attribute.width.key, Attribute.height.key, - Attribute.margin, - Attribute.alignment, + 'margin', + 'alignment', }); final cssHeightValue = attrs[Attribute.height.key]; if (cssHeightValue != null) { diff --git a/lib/src/l10n/extensions/localizations.dart b/lib/src/l10n/extensions/localizations.dart index 32bf2525..dea6be89 100644 --- a/lib/src/l10n/extensions/localizations.dart +++ b/lib/src/l10n/extensions/localizations.dart @@ -7,7 +7,7 @@ typedef FlutterQuillLocalizations = generated.FlutterQuillLocalizations; extension LocalizationsExt on BuildContext { /// Require the [FlutterQuillLocalizations] instance /// - /// `loc` is short for localizations + /// `loc` is short for `localizations` FlutterQuillLocalizations get loc { return FlutterQuillLocalizations.of(this) ?? (throw UnimplementedError( diff --git a/lib/src/models/documents/attribute.dart b/lib/src/models/documents/attribute.dart index b8127881..fdfa9928 100644 --- a/lib/src/models/documents/attribute.dart +++ b/lib/src/models/documents/attribute.dart @@ -121,8 +121,10 @@ class Attribute extends Equatable { @Deprecated('This property is no logner used in flutter_quill') static const String mobileAlignment = 'mobileAlignment'; + @Deprecated("Will be removed as it doesn't confirm to Quill js") static const String alignment = 'alignment'; + @Deprecated("Will be removed as it doesn't confirm to Quill js") static const String margin = 'margin'; static const ImageAttribute image = ImageAttribute(null); diff --git a/lib/src/models/rules/insert.dart b/lib/src/models/rules/insert.dart index 1bd42717..daf3c110 100644 --- a/lib/src/models/rules/insert.dart +++ b/lib/src/models/rules/insert.dart @@ -520,6 +520,7 @@ class AutoFormatLinksRule extends InsertRule { try { final cand = (prev.data as String).split('\n').last.split(' ').last; final link = Uri.parse(cand); + // TODO: Can be improved a little if (!['https', 'http'].contains(link.scheme)) { return null; } diff --git a/lib/src/utils/string.dart b/lib/src/utils/string.dart index a4619cbe..529ec24d 100644 --- a/lib/src/utils/string.dart +++ b/lib/src/utils/string.dart @@ -19,6 +19,7 @@ Map parseKeyValuePairs(String s, Set targetKeys) { return result; } +@Deprecated('This function is no longer used in flutter_quill') String replaceStyleStringWithSize( String cssStyle, { required double width, @@ -37,11 +38,8 @@ String replaceStyleStringWithSize( } if (isMobile) { - // TODO: Will be updated soon. - // ignore: deprecated_member_use_from_same_package - result[Attribute.mobileWidth] = width.toString(); - // ignore: deprecated_member_use_from_same_package - result[Attribute.mobileHeight] = height.toString(); + result['mobileWidth'] = width.toString(); + result['mobileHeight'] = height.toString(); } else { result[Attribute.width.key] = width.toString(); result[Attribute.height.key] = height.toString();