update

packages/artplayer-plugin-ads/src/index.js

@@ -9,14 +9,46 @@ export default function artplayerPluginAds(option) {
             template: { $player },
         } = art;
 
-        const $ads = append($player, '<div class="artplayer-plugin-ads"></div>');
-        append($ads, option.video ? `<video src="${option.video}" controls="false"></video>` : option.html);
+        function skip() {
+            //
+        }
+
+        function toggleFullscreen() {
+            //
+        }
+
+        function toggleMuted() {
+            //
+        }
+
+        function show() {
+            art.template.$ads = append($player, '<div class="artplayer-plugin-ads"></div>');
+
+            const html = option.video
+                ? `<video class="artplayer-plugin-ads-video" src="${option.video}" controls="false"></video>`
+                : option.html;
+
+            const $ads = append(art.template.$ads, html);
+
+            art.proxy($ads, 'click', () => {
+                if (option.url) window.open(option.url);
+                art.emit('artplayerPluginAds:click', option);
+            });
+
+            return $ads;
+        }
+
+        art.on('ready', () => {
+            art.once('play', () => {
+                art.pause();
+                const $ads = show();
+                const isVideo = $ads instanceof HTMLVideoElement;
+            });
+        });
 
         return {
             name: 'artplayerPluginAds',
-            skip() {
-                //
-            },
+            skip,
         };
     };
 }

packages/artplayer-plugin-ads/src/style.less

@@ -13,4 +13,9 @@
     overflow: hidden;
     color: #fff;
     background-color: #000;
+
+    .artplayer-plugin-ads-video {
+        width: 100%;
+        height: 100%;
+    }
 }