flv demo

docs/flv/css/common.css

@@ -0,0 +1,44 @@
+html,
+body,
+.container {
+    height: 100%;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+}
+
+.part-top {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    height: 70%;
+}
+
+.part-top .config {
+    width: 500px;
+    display: flex;
+    margin-bottom: 20px;
+}
+
+.part-top .config .urlInput {
+    flex: 1;
+    outline: none;
+}
+
+.part-top .config .playBtn {
+    width: 50px;
+}
+
+.part-top .artplayer {
+    width: 500px;
+    height: 300px;
+    background: #fff;
+}
+
+.part-bottom {
+    position: relative;
+    height: 30%;
+}

docs/flv/index.html

@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title>Flv plugin for ArtPlayer</title>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta name="keywords" content="artplayer,html5,video,player,flv">
+    <meta name="description" content="Flv plugin for ArtPlayer">
+    <link rel="shortcut icon" href="../assets/img/favicon.ico">
+    <link rel="stylesheet" href="../assets/css/normalize.css">
+    <link rel="stylesheet" href="../assets/css/consola.css">
+    <link rel="stylesheet" href="./css/common.css">
+    <link rel="stylesheet" href="../uncompiled/artplayer.css">    
+</head>
+
+<body>
+    <div class="container">
+        <div class="part-top">
+            <div class="config">
+                <input class="urlInput" type="text" value="https://blog.zhw-island.com/assets-cdn/video/one-more-time-one-more-chance-480p.flv">
+                <input class="playBtn" type="button" value="play">
+            </div>
+            <div class="artplayer"></div>
+        </div>
+        <div class="part-bottom"></div>
+    </div>
+    <script src="../assets/js/consola.js"></script>
+    <script src="../uncompiled/artplayer.js"></script>
+    <script src="../uncompiled/artplayer-plugin-flv.js"></script>
+    <script src="./js/common.js"></script>
+    <script>
+        var _hmt = _hmt || [];
+        (function() {
+          var hm = document.createElement("script");
+          hm.src = "https://hm.baidu.com/hm.js?b6c9b8bafbf5fe7225160101dafbbc7d";
+          var s = document.getElementsByTagName("script")[0]; 
+          s.parentNode.insertBefore(hm, s);
+        })();
+    </script>
+</body>
+
+</html>

docs/flv/js/common.js

@@ -0,0 +1,36 @@
+'use strict';
+
+(function() {
+    consola.creat({
+        target: '.part-bottom',
+        size: '100%',
+        zIndex: 99,
+    });
+
+    console.info('Welcome, if you like it, consider star it, thank you.');
+    console.info('https://github.com/zhw2590582/ArtPlayer');
+
+    window.addEventListener('error', function(err) {
+        console.error(err.message);
+    });
+
+    var $urlInput = document.querySelector('.urlInput');
+    var $playBtn = document.querySelector('.playBtn');
+
+    function creatPlayer() {
+        Artplayer.instances.forEach(function(art) {
+            art.destroy(true);
+        });
+
+        new Artplayer({
+            container: '.artplayer',
+            url: function () {
+                return this.plugins.artplayerPluginFlv.attach($urlInput.value)
+            },
+            plugins: [artplayerPluginFlv]
+        });
+    }
+
+    creatPlayer();
+    $playBtn.addEventListener('click', creatPlayer);
+})();