Fix show view flyover for links in Email Detail
This commit is contained in:
@@ -4,9 +4,9 @@ import 'package:core/presentation/utils/html_transformer/base/dom_transformer.da
|
||||
import 'package:core/utils/app_logger.dart';
|
||||
import 'package:html/dom.dart';
|
||||
|
||||
class EnsureRelationNoReferrerTransformer extends DomTransformer {
|
||||
class LinkTransformer extends DomTransformer {
|
||||
|
||||
const EnsureRelationNoReferrerTransformer();
|
||||
const LinkTransformer();
|
||||
|
||||
@override
|
||||
Future<void> process(
|
||||
@@ -18,20 +18,28 @@ class EnsureRelationNoReferrerTransformer extends DomTransformer {
|
||||
final linkElements = document.getElementsByTagName('a');
|
||||
await Future.wait(linkElements.map((linkElement) async {
|
||||
linkElement.attributes['rel'] = 'noopener noreferrer';
|
||||
final tagClass = linkElement.attributes['class'];
|
||||
linkElement.attributes['class'] = '$tagClass tooltip';
|
||||
final url = linkElement.attributes['href'];
|
||||
final text = linkElement.text;
|
||||
if (url != null && url.isNotEmpty) {
|
||||
linkElement.innerHtml = textHasToolTip(text, url);
|
||||
}
|
||||
log('EnsureRelationNoReferrerTransformer::process(): ${linkElement.outerHtml}');
|
||||
_addToolTipWhenHoverLink(linkElement);
|
||||
}));
|
||||
}
|
||||
|
||||
String textHasToolTip(String text, String? url) {
|
||||
void _addToolTipWhenHoverLink(Element element) {
|
||||
log('LinkTransformer::_addToolTipWhenHoverLink(): Before: ${element.outerHtml}');
|
||||
final url = element.attributes['href'];
|
||||
final text = element.text;
|
||||
final children = element.children;
|
||||
if (children.isEmpty && text.isNotEmpty && url?.isNotEmpty == true) {
|
||||
final innerHtml = element.innerHtml;
|
||||
final tagClass = element.attributes['class'];
|
||||
element.attributes['class'] = '$tagClass tooltip';
|
||||
if (text.isNotEmpty && url != null && url.isNotEmpty) {
|
||||
element.innerHtml = innerHtml + textHasToolTip(url);
|
||||
}
|
||||
log('LinkTransformer::_addToolTipWhenHoverLink(): After: ${element.outerHtml}');
|
||||
}
|
||||
}
|
||||
|
||||
String textHasToolTip(String url) {
|
||||
return '''
|
||||
${text.isNotEmpty ? text : url}
|
||||
<span class="tooltiptext">$url</span>
|
||||
''';
|
||||
}
|
||||
|
||||
@@ -3,14 +3,14 @@ import 'package:core/data/network/dio_client.dart';
|
||||
import 'package:html/dom.dart';
|
||||
import 'package:core/presentation/utils/html_transformer/base/dom_transformer.dart';
|
||||
|
||||
class ViewPortTransformer extends DomTransformer {
|
||||
class MetaTransformer extends DomTransformer {
|
||||
|
||||
static final Element _viewPortMetaElement = Element.html(
|
||||
'<meta name="viewport" content="width=device-width, initial-scale=1.0">');
|
||||
static final Element _contentTypeMetaElement = Element.html(
|
||||
'<meta http-equiv="Content-Type" content="text/html; charset=utf-8">');
|
||||
|
||||
const ViewPortTransformer();
|
||||
const MetaTransformer();
|
||||
|
||||
@override
|
||||
Future<void> process(
|
||||
|
||||
@@ -58,10 +58,10 @@ class TransformConfiguration {
|
||||
static const int? standardMaxImageWidth = null;
|
||||
|
||||
static const List<DomTransformer> standardDomTransformers = [
|
||||
ViewPortTransformer(),
|
||||
MetaTransformer(),
|
||||
RemoveScriptTransformer(),
|
||||
ImageTransformer(),
|
||||
EnsureRelationNoReferrerTransformer(),
|
||||
LinkTransformer(),
|
||||
BlockQuotedTransformer(),
|
||||
];
|
||||
|
||||
|
||||
@@ -123,10 +123,6 @@ class _HtmlContentViewerOnWebState extends State<HtmlContentViewerOnWeb> {
|
||||
''';
|
||||
|
||||
final tooltipLinkCss = '''
|
||||
.tooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
.tooltip .tooltiptext {
|
||||
visibility: hidden;
|
||||
max-width: 400px;
|
||||
|
||||
Reference in New Issue
Block a user