更新 VAST 插件文档和类型定义，修复描述和版本号，增强广告播放器功能

packages/artplayer-plugin-vast/README.md

@@ -1,6 +1,6 @@
 # artplayer-plugin-vast
 
-vast plugin for ArtPlayer
+VAST plugin for ArtPlayer
 
 ## Demo
 

packages/artplayer-plugin-vast/package.json

@@ -1,8 +1,8 @@
 {
     "license": "MIT",
-    "version": "1.0.0",
+    "version": "1.0.1",
     "name": "artplayer-plugin-vast",
-    "description": "vast plugin for ArtPlayer",
+    "description": "VAST plugin for ArtPlayer",
     "main": "dist/artplayer-plugin-vast.js",
     "legacy": "dist/artplayer-plugin-vast.legacy.js",
     "module": "dist/artplayer-plugin-vast.esm.js",

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

@@ -3,7 +3,7 @@ import { Player, PlayerOptions, loadImaSdk } from '@glomex/vast-ima-player';
 export default function artplayerPluginVast(callback) {
     return async (art) => {
         const { template, constructor } = art;
-        const { createElement, setStyles, append } = constructor.utils;
+        const { createElement, setStyles } = constructor.utils;
         const { $video, $player } = template;
 
         await loadImaSdk();
@@ -11,45 +11,101 @@ export default function artplayerPluginVast(callback) {
         const ima = google.ima;
 
         const adsRenderingSettings = new ima.AdsRenderingSettings();
+        adsRenderingSettings.restoreCustomPlaybackStateOnAdBreakComplete = true;
+        adsRenderingSettings.enablePreloading = true;
+
         const playerOptions = new PlayerOptions();
+        let isAdPlaying = false;
+        let imaPlayer = null;
+        let $container = null;
 
-        const id = `art-${Date.now()}`;
+        function createContainer() {
-        const $container = createElement('div');
+            const container = createElement('div');
-        append($player, $container);
+            const id = `art-vast-${Date.now()}`;
-        $container.id = id;
+            container.id = id;
-        setStyles($container, {
+            setStyles(container, {
-            position: 'absolute',
+                position: 'absolute',
-            inset: '0',
+                inset: '0',
-            width: '100%',
+                width: '100%',
-            height: '100%',
+                height: '100%',
-            zIndex: '150',
+                zIndex: '150',
-            display: 'none',
+                backgroundColor: 'black',
-        });
+                display: 'none',
+                pointerEvents: 'auto',
+            });
+            return container;
+        }
 
-        const imaPlayer = new Player(ima, $video, $container, adsRenderingSettings, playerOptions);
+        function initPlayer() {
+            $container = createContainer();
+            $player.appendChild($container);
+            imaPlayer = new Player(ima, $video, $container, adsRenderingSettings, playerOptions);
+
+            // ✅ 事件绑定
+            imaPlayer.onAdStarted = () => {
+                isAdPlaying = true;
+                $container.style.display = 'block';
+                art.pause();
+            };
+
+            imaPlayer.onAdEnd = () => {
+                isAdPlaying = false;
+                $container.style.display = 'none';
+                art.play();
+            };
+
+            imaPlayer.onAdError = (error) => {
+                console.error('VAST Ad Error:', error);
+                isAdPlaying = false;
+                $container.style.display = 'none';
+                art.play();
+            };
+        }
+
+        function destroyPlayer() {
+            if ($container && $container.parentNode) {
+                $container.parentNode.removeChild($container);
+            }
+            $container = null;
+            imaPlayer = null;
+        }
 
         function playUrl(url) {
-            const playAdsRequest = new ima.AdsRequest();
+            if (isAdPlaying) return;
-            playAdsRequest.adTagUrl = url;
+            if (!imaPlayer) initPlayer();
-            imaPlayer.playAds(playAdsRequest);
+            const request = new ima.AdsRequest();
+            request.adTagUrl = url;
+            imaPlayer.playAds(request);
         }
 
         function playRes(res) {
-            const playAdsRequest = new ima.AdsRequest();
+            if (isAdPlaying) return;
-            playAdsRequest.adsResponse = res;
+            if (!imaPlayer) initPlayer();
-            imaPlayer.playAds(playAdsRequest);
+            const request = new ima.AdsRequest();
+            request.adsResponse = res;
+            imaPlayer.playAds(request);
         }
 
         if (typeof callback === 'function') {
-            await callback({ art, id, ima, imaPlayer, $container, playUrl, playRes });
+            await callback({
+                art,
+                playUrl,
+                playRes,
+                ima,
+                imaPlayer,
+                get container() {
+                    return $container;
+                },
+            });
         }
 
         return {
             name: 'artplayerPluginVast',
+            destroy: destroyPlayer,
         };
     };
 }
 
 if (typeof window !== 'undefined') {
-    window['artplayerPluginVast'] = artplayerPluginVast;
+    window.artplayerPluginVast = artplayerPluginVast;
 }

packages/artplayer-plugin-vast/types/artplayer-plugin-vast.d.ts

@@ -1,20 +1,34 @@
 import type Artplayer from 'artplayer';
+import { Player } from '@glomex/vast-ima-player';
 
 export = artplayerPluginVast;
 export as namespace artplayerPluginVast;
 
-type Option = (params: {
+declare global {
+    interface Window {
+        artplayerPluginVast?: typeof artplayerPluginVast;
+    }
+}
+
+type PlayUrlFn = (url: string) => void;
+type PlayResFn = (res: string) => void;
+
+interface VastPluginContext {
     art: Artplayer;
-    id: string;
+    ima: typeof google.ima;
-    ima: any;
+    imaPlayer: Player;
-    imaPlayer: any;
+    playUrl: PlayUrlFn;
-    $container: HTMLDivElement;
+    playRes: PlayResFn;
-    playUrl: (url: string) => void;
+    container: HTMLDivElement | null;
-    playRes: (res: string) => void;
+}
-}) => void;
 
-type Result = {
+export type ArtplayerPluginVastOption = (params: VastPluginContext) => void | Promise<void>;
+
+export interface ArtplayerPluginVastInstance {
     name: 'artplayerPluginVast';
-};
+    destroy?: () => void;
+}
 
-declare const artplayerPluginVast: (option: Option) => (art: Artplayer) => Result;
+declare function artplayerPluginVast(
+    option: ArtplayerPluginVastOption,
+): (art: Artplayer) => ArtplayerPluginVastInstance;