TF-341 Show view flyover for links in Email Detail

This commit is contained in:
dab246
2022-04-12 17:19:07 +07:00
committed by Dat H. Pham
parent b4fd1ce5e5
commit 33c6d01bda
2 changed files with 51 additions and 3 deletions
@@ -1,6 +1,7 @@
import 'package:core/data/network/dio_client.dart';
import 'package:core/presentation/utils/html_transformer/base/dom_transformer.dart';
import 'package:core/utils/app_logger.dart';
import 'package:html/dom.dart';
class EnsureRelationNoReferrerTransformer extends DomTransformer {
@@ -17,6 +18,21 @@ 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}');
}));
}
String textHasToolTip(String text, String? url) {
return '''
${text.isNotEmpty ? text : url}
<span class="tooltiptext">$url</span>
''';
}
}
@@ -93,15 +93,22 @@ class _HtmlContentViewerOnWebState extends State<HtmlContentViewerOnWeb> {
}
function handleOnClickLink(e) {
var link = e.target;
let link = e.target;
let textContent = e.target.textContent;
console.log("handleOnClickLink: " + link);
if (link && isValidHttpUrl(link)) {
console.log("handleOnClickLink: " + textContent);
if (link && isValidUrl(link)) {
window.parent.postMessage(JSON.stringify({"view": "$createdViewId", "type": "toDart: OpenLink", "url": "" + link}), "*");
e.preventDefault();
} else if (textContent && isValidUrl(textContent)) {
window.parent.postMessage(JSON.stringify({"view": "$createdViewId", "type": "toDart: OpenLink", "url": "" + textContent}), "*");
e.preventDefault();
} else {
e.preventDefault();
}
}
function isValidHttpUrl(string) {
function isValidUrl(string) {
let url;
try {
@@ -115,6 +122,30 @@ class _HtmlContentViewerOnWebState extends State<HtmlContentViewerOnWeb> {
</script>
''';
final tooltipLinkCss = '''
.tooltip {
position: relative;
display: inline-block;
}
.tooltip .tooltiptext {
visibility: hidden;
max-width: 400px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 8px 5px 8px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
''';
final htmlTemplate = '''
<!DOCTYPE html>
<html>
@@ -143,6 +174,7 @@ class _HtmlContentViewerOnWebState extends State<HtmlContentViewerOnWeb> {
padding: 13px;
margin: 0px;
}
$tooltipLinkCss
</style>
$htmlScripts
</head>