Iframe inject (#406)

docs/iframe-inject/index.html

@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Artplayer Iframe Inject</title>
+    <style>
+        html,
+        body {
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+        }
+
+        .container {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 100%;
+            height: 100%;
+            padding: 50px;
+            box-sizing: border-box;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="container">
+        <iframe id="iframe" frameborder="0" width="100%" height="100%" allowfullscreen="true"></iframe>
+    </div>
+    <script src="./iframe.helper.js"></script>
+    <script>
+        (async function () {
+            // Init iframe helper
+            const helper = new IframeHelper({
+                iframe: document.getElementById('iframe'),
+                url: './inner.html',
+            });
+
+            // Instantiate the player and mount the instance in the window
+            await helper.commit(() => {
+                window.art = new Artplayer({
+                    container: '.artplayer-app',
+                    url: '../assets/sample/video.mp4',
+                });
+            });
+
+            // The value of the player can be returned through the resolve method
+            const currentTime = await helper.commit((resolve) => {
+                window.art.on('ready', () => {
+                    window.art.seek = 5;
+                    resolve(window.art.currentTime);
+                });
+            });
+
+            console.log(currentTime);
+
+            // The value of the player can be returned through the return
+            const currentTime2 = await helper.commit(() => {
+                return window.art.currentTime;
+            });
+
+            console.log(currentTime2);
+        })();
+
+    </script>
+</body>
+
+</html>