Sub6Resources · erickok · Feb 25, 2021 · Feb 24, 2021 · Feb 24, 2021 · Feb 24, 2021
diff --git a/example/lib/generated_plugin_registrant.dart b/example/lib/generated_plugin_registrant.dart
@@ -0,0 +1,17 @@
+//
+// Generated file. Do not edit.
+//
+
+// ignore_for_file: lines_longer_than_80_chars
+
+import 'package:video_player_web/video_player_web.dart';
+import 'package:wakelock_web/wakelock_web.dart';
+
+import 'package:flutter_web_plugins/flutter_web_plugins.dart';
+
+// ignore: public_member_api_docs
+void registerPlugins(Registrar registrar) {
+  VideoPlayerPlugin.registerWith(registrar);
+  WakelockWeb.registerWith(registrar);
+  registrar.registerMessageHandler();
+}
diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -167,10 +167,10 @@ class _MyHomePageState extends State<MyHomePage> {
             // Custom placeholder image for broken links
             networkSourceMatcher(): networkImageRender(altWidget: (_) => FlutterLogo()),
           },
-          onLinkTap: (url) {
+          onLinkTap: (url, _, __, ___) {
             print("Opening $url...");
           },
-          onImageTap: (src) {
+          onImageTap: (src, _, __, ___) {
             print(src);
           },
           onImageError: (exception, stackTrace) {

diff --git a/example/web/favicon.png b/example/web/favicon.png
diff --git a/example/web/icons/Icon-192.png b/example/web/icons/Icon-192.png
diff --git a/example/web/icons/Icon-512.png b/example/web/icons/Icon-512.png
diff --git a/example/web/index.html b/example/web/index.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <!--
+    If you are serving your web app in a path other than the root, change the
+    href value below to reflect the base path you are serving from.
+
+    The path provided below has to start and end with a slash "/" in order for
+    it to work correctly.
+
+    Fore more details:
+    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
+  -->
+  <base href="/">
+
+  <meta charset="UTF-8">
+  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
+  <meta name="description" content="A new Flutter project.">
+
+  <!-- iOS meta tags & icons -->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+  <meta name="apple-mobile-web-app-title" content="example">
+  <link rel="apple-touch-icon" href="icons/Icon-192.png">
+
+  <!-- Favicon -->
+  <link rel="icon" type="image/png" href="favicon.png"/>
+
+  <title>example</title>
+  <link rel="manifest" href="manifest.json">
+</head>
+<body>
+  <!-- This script installs service_worker.js to provide PWA functionality to
+       application. For more information, see:
+       https://developers.google.com/web/fundamentals/primers/service-workers -->
+  <script>
+    if ('serviceWorker' in navigator) {
+      window.addEventListener('flutter-first-frame', function () {
+        navigator.serviceWorker.register('flutter_service_worker.js');
+      });
+    }
+  </script>
+  <script src="main.dart.js" type="application/javascript"></script>
+</body>
+</html>
diff --git a/example/web/manifest.json b/example/web/manifest.json
@@ -0,0 +1,23 @@
+{
+    "name": "example",
+    "short_name": "example",
+    "start_url": ".",
+    "display": "standalone",
+    "background_color": "#0175C2",
+    "theme_color": "#0175C2",
+    "description": "A new Flutter project.",
+    "orientation": "portrait-primary",
+    "prefer_related_applications": false,
+    "icons": [
+        {
+            "src": "icons/Icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ]
+}
diff --git a/lib/src/replaced_element.dart b/lib/src/replaced_element.dart
@@ -3,12 +3,14 @@ import 'dart:math';
 import 'package:chewie/chewie.dart';
 import 'package:chewie_audio/chewie_audio.dart';
 import 'package:flutter/foundation.dart';
-import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/widgets.dart';
 import 'package:flutter_html/html_parser.dart';
 import 'package:flutter_html/src/html_elements.dart';
 import 'package:flutter_html/src/utils.dart';
+import 'package:flutter_html/src/widgets/iframe_unsupported.dart'
+  if (dart.library.io) 'package:flutter_html/src/widgets/iframe_mobile.dart'
+  if (dart.library.html) 'package:flutter_html/src/widgets/iframe_web.dart';
 import 'package:flutter_html/style.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:html/dom.dart' as dom;
@@ -100,45 +102,6 @@ class ImageContentElement extends ReplacedElement {
   }
 }
 
-/// [IframeContentElement is a [ReplacedElement] with web content.
-class IframeContentElement extends ReplacedElement {
-  final String src;
-  final double width;
-  final double height;
-  final NavigationDelegate navigationDelegate;
-  final UniqueKey key = UniqueKey();
-
-  IframeContentElement({
-    String name,
-    Style style,
-    this.src,
-    this.width,
-    this.height,
-    dom.Element node,
-    this.navigationDelegate,
-  }) : super(name: name, style: style, node: node);
-
-  @override
-  Widget toWidget(RenderContext context) {
-    final sandboxMode = attributes["sandbox"];
-    return Container(
-      width: width ?? (height ?? 150) * 2,
-      height: height ?? (width ?? 300) / 2,
-      child: WebView(
-        initialUrl: src,
-        key: key,
-        javascriptMode: sandboxMode == null || sandboxMode == "allow-scripts"
-            ? JavascriptMode.unrestricted
-            : JavascriptMode.disabled,
-        navigationDelegate: navigationDelegate,
-        gestureRecognizers: {
-          Factory<VerticalDragGestureRecognizer>(() => VerticalDragGestureRecognizer())
-        },
-      ),
-    );
-  }
-}
-
 /// [AudioContentElement] is a [ContentElement] with an audio file as its content.
 class AudioContentElement extends ReplacedElement {
   final List<String> src;

diff --git a/lib/src/utils.dart b/lib/src/utils.dart
@@ -1,5 +1,8 @@
 import 'package:flutter/gestures.dart';
 
+import 'dart:math';
+import 'dart:convert';
+
 class Context<T> {
   T data;
 
@@ -43,3 +46,9 @@ class MultipleTapGestureRecognizer extends TapGestureRecognizer {
     }
   }
 }
+
+String getRandString(int len) {
+  var random = Random.secure();
+  var values = List<int>.generate(len, (i) =>  random.nextInt(255));
+  return base64UrlEncode(values);
+}
diff --git a/lib/src/widgets/iframe_mobile.dart b/lib/src/widgets/iframe_mobile.dart
@@ -0,0 +1,47 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_html/html_parser.dart';
+import 'package:flutter_html/src/replaced_element.dart';
+import 'package:flutter_html/style.dart';
+import 'package:webview_flutter/webview_flutter.dart';
+import 'package:html/dom.dart' as dom;
+
+/// [IframeContentElement is a [ReplacedElement] with web content.
+class IframeContentElement extends ReplacedElement {
+  final String src;
+  final double width;
+  final double height;
+  final NavigationDelegate navigationDelegate;
+  final UniqueKey key = UniqueKey();
+
+  IframeContentElement({
+    String name,
+    Style style,
+    this.src,
+    this.width,
+    this.height,
+    dom.Element node,
+    this.navigationDelegate,
+  }) : super(name: name, style: style, node: node);
+
+  @override
+  Widget toWidget(RenderContext context) {
+    final sandboxMode = attributes["sandbox"];
+    return Container(
+      width: width ?? (height ?? 150) * 2,
+      height: height ?? (width ?? 300) / 2,
+      child: WebView(
+        initialUrl: src,
+        key: key,
+        javascriptMode: sandboxMode == null || sandboxMode == "allow-scripts"
+            ? JavascriptMode.unrestricted
+            : JavascriptMode.disabled,
+        navigationDelegate: navigationDelegate,
+        gestureRecognizers: {
+          Factory<VerticalDragGestureRecognizer>(() => VerticalDragGestureRecognizer())
+        },
+      ),
+    );
+  }
+}
diff --git a/lib/src/widgets/iframe_unsupported.dart b/lib/src/widgets/iframe_unsupported.dart
@@ -0,0 +1,34 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_html/html_parser.dart';
+import 'package:flutter_html/src/replaced_element.dart';
+import 'package:flutter_html/style.dart';
+import 'package:webview_flutter/webview_flutter.dart';
+import 'package:html/dom.dart' as dom;
+
+/// [IframeContentElement is a [ReplacedElement] with web content.
+class IframeContentElement extends ReplacedElement {
+  final String src;
+  final double width;
+  final double height;
+  final NavigationDelegate navigationDelegate;
+  final UniqueKey key = UniqueKey();
+
+  IframeContentElement({
+    String name,
+    Style style,
+    this.src,
+    this.width,
+    this.height,
+    dom.Element node,
+    this.navigationDelegate,
+  }) : super(name: name, style: style, node: node);
+
+  @override
+  Widget toWidget(RenderContext context) {
+    return Container(
+      width: width ?? (height ?? 150) * 2,
+      height: height ?? (width ?? 300) / 2,
+      child: Text("Iframes are currently not supported in this environment"),
+    );
+  }
+}
diff --git a/lib/src/widgets/iframe_web.dart b/lib/src/widgets/iframe_web.dart
@@ -0,0 +1,51 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_html/html_parser.dart';
+import 'package:flutter_html/src/replaced_element.dart';
+import 'package:flutter_html/src/utils.dart';
+import 'package:flutter_html/style.dart';
+import 'package:webview_flutter/webview_flutter.dart';
+import 'package:html/dom.dart' as dom;
+// ignore: avoid_web_libraries_in_flutter
+import 'dart:html' as html;
+import 'dart:ui' as ui;
+
+/// [IframeContentElement is a [ReplacedElement] with web content.
+class IframeContentElement extends ReplacedElement {
+  final String src;
+  final double width;
+  final double height;
+  final NavigationDelegate navigationDelegate;
+  final UniqueKey key = UniqueKey();
+  final String createdViewId = getRandString(10);
+
+  IframeContentElement({
+    String name,
+    Style style,
+    this.src,
+    this.width,
+    this.height,
+    dom.Element node,
+    this.navigationDelegate,
+  }) : super(name: name, style: style, node: node);
+
+  @override
+  Widget toWidget(RenderContext context) {
+    final html.IFrameElement iframe = html.IFrameElement()
+      ..width = (width ?? (height ?? 150) * 2).toString()
+      ..height = (height ?? (width ?? 300) / 2).toString()
+      ..src = src
+      ..style.border = 'none';
+    //not actually an error
+    ui.platformViewRegistry.registerViewFactory(createdViewId, (int viewId) => iframe);
+    return Container(
+      width: width ?? (height ?? 150) * 2,
+      height: height ?? (width ?? 300) / 2,
+      child: Directionality(
+          textDirection: TextDirection.ltr,
+          child: HtmlElementView(
+            viewType: createdViewId,
+          )
+      )
+    );
+  }
+}