@quicktvui/ai 1.0.0

package/rules/.docs/examples/component/player-manager/player-view.vue

@@ -0,0 +1,381 @@
+<template>
+  <div class="es-player-view-root-css">
+    <span class="es-player-view-content-text-css">
+      {{ contentText }}
+    </span>
+  </div>
+</template>
+
+<script lang="ts">
+import { ref } from "vue";
+import { defineComponent } from "@vue/runtime-core";
+import { ESIPlayer } from "@extscreen/es3-player";
+import type {
+  ESIPlayerManager,
+  ESMediaItem,
+  ESMediaItemList,
+} from "@extscreen/es3-player-manager";
+import type { ESKeyEvent } from "@extscreen/es3-core";
+import type {
+  ESMediaSource,
+  ESMediaSourceList,
+  ESPlayerAspectRatio,
+  ESPlayerDecode,
+  ESPlayerDefinition,
+  ESPlayerError,
+  ESPlayerInfo,
+  ESPlayerInterceptError,
+  ESPlayerInterceptResult,
+  ESPlayerPlayMode,
+  ESPlayerRate,
+  ESPlayerWindowType,
+} from "@extscreen/es3-player";
+
+export default defineComponent({
+  name: "自定义播放器视图",
+  setup() {
+    const contentText = ref<string>("播放器事件回调：\n");
+
+    let enabled = true;
+    let player: ESIPlayerManager;
+
+    function getId(): string {
+      return "ESPlayerManagerView";
+    }
+
+    function setEnabled(value: boolean): void {
+      enabled = value;
+    }
+
+    function isEnabled(): boolean {
+      return enabled;
+    }
+
+    function setPlayerManager(value: ESIPlayerManager): void {
+      player = value;
+      contentText.value = `${contentText.value}player:`;
+    }
+
+    function getPlayerManager(): ESIPlayerManager {
+      return player;
+    }
+
+    function onPlayerInitialized(playerType: number): void {
+      contentText.value = `${contentText.value}onPlayerInitialized:${playerType}\n`;
+    }
+
+    function onPlayerPlayMediaSourceList(
+      mediaSourceList: ESMediaSourceList,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMediaSourceList:${JSON.stringify(mediaSourceList)}\n`;
+    }
+
+    function onPlayerPlayMediaSource(mediaSource: ESMediaSource): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMediaSource:${JSON.stringify(mediaSource)}\n`;
+    }
+
+    function onPlayerInterceptSuccess(value: ESPlayerInterceptResult): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerInterceptSuccess:${JSON.stringify(value)}\n`;
+    }
+
+    function onPlayerInterceptError(value: ESPlayerInterceptError): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerInterceptError:${JSON.stringify(value)}\n`;
+    }
+
+    function onPlayerPreparing(): void {
+      contentText.value = `${contentText.value}onPlayerPreparing` + `\n`;
+    }
+
+    function onPlayerPrepared(): void {
+      contentText.value = `${contentText.value}onPlayerPrepared` + `\n`;
+    }
+
+    function onPlayerBufferStart(): void {
+      contentText.value = `${contentText.value}onPlayerBufferStart` + `\n`;
+    }
+
+    function onPlayerBufferEnd(): void {
+      contentText.value = `${contentText.value}onPlayerBufferEnd` + `\n`;
+    }
+
+    function onPlayerPlaying(): void {
+      contentText.value = `${contentText.value}onPlayerPlaying` + `\n`;
+    }
+
+    function onPlayerProgressChanged(progress: number): void {
+      contentText.value = `${contentText.value}onPlayerProgressChanged:${progress}\n`;
+    }
+
+    function onPlayerDurationChanged(duration: number): void {
+      contentText.value = `${contentText.value}onPlayerDurationChanged:${duration}\n`;
+    }
+
+    function onPlayerSeekStart(): void {
+      contentText.value = `${contentText.value}onPlayerSeekStart` + `\n`;
+    }
+
+    function onPlayerSeekCompleted(): void {
+      contentText.value = `${contentText.value}onPlayerSeekCompleted` + `\n`;
+    }
+
+    function onPlayerPaused(): void {
+      contentText.value = `${contentText.value}onPlayerPaused` + `\n`;
+    }
+
+    function onPlayerResumed(): void {
+      contentText.value = `${contentText.value}onPlayerResumed` + `\n`;
+    }
+
+    function onPlayerStopped(): void {
+      contentText.value = `${contentText.value}onPlayerStopped` + `\n`;
+    }
+
+    function onPlayerCompleted(): void {
+      contentText.value = `${contentText.value}onPlayerCompleted` + `\n`;
+    }
+
+    function onPlayerError(error: ESPlayerError): void {
+      contentText.value = `${contentText.value}onPlayerError:${JSON.stringify(
+        error,
+      )}\n`;
+    }
+
+    function onPlayerInfo(info: ESPlayerInfo): void {
+      contentText.value = `${contentText.value}onPlayerInfo:${JSON.stringify(
+        info,
+      )}\n`;
+    }
+
+    function onPlayerNoMediaSourceCanPlay(next: boolean): void {
+      contentText.value = `${contentText.value}onPlayerNoMediaSourceCanPlay:${next}\n`;
+    }
+
+    function onPlayerVolumeChanged(
+      leftVolume: number,
+      rightVolume: number,
+    ): void {
+      contentText.value = `${contentText.value}onPlayerVolumeChanged:${leftVolume} ${rightVolume}\n`;
+    }
+
+    function onPlayerLeftVolumeChanged(leftVolume: number): void {
+      contentText.value = `${contentText.value}onPlayerLeftVolumeChanged:${leftVolume}\n`;
+    }
+
+    function onPlayerRightVolumeChanged(rightVolume: number): void {
+      contentText.value = `${contentText.value}onPlayerRightVolumeChanged:${rightVolume}\n`;
+    }
+
+    function onPlayerDefinitionListChanged(
+      definitionList: Array<ESPlayerDefinition>,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerDefinitionListChanged:${JSON.stringify(definitionList)}\n`;
+    }
+
+    function onPlayerDefinitionChanged(definition: ESPlayerDefinition): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerDefinitionChanged:${JSON.stringify(definition)}\n`;
+    }
+
+    function onPlayerPlayRateListChanged(rateList: Array<ESPlayerRate>): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayRateListChanged:${JSON.stringify(rateList)}\n`;
+    }
+
+    function onPlayerPlayRateChanged(rate: ESPlayerRate): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayRateChanged:${JSON.stringify(rate)}\n`;
+    }
+
+    function onPlayerDecodeListChanged(
+      decodeList: Array<ESPlayerDecode>,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerDecodeListChanged:${JSON.stringify(decodeList)}\n`;
+    }
+
+    function onPlayerDecodeChanged(decode: ESPlayerDecode): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerDecodeChanged:${JSON.stringify(decode)}\n`;
+    }
+
+    function onPlayerAspectRatioListChanged(
+      aspectRatioList: Array<ESPlayerAspectRatio>,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerAspectRatioListChanged:${JSON.stringify(aspectRatioList)}\n`;
+    }
+
+    function onPlayerAspectRatioChanged(
+      aspectRatio: ESPlayerAspectRatio,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerAspectRatioChanged:${JSON.stringify(aspectRatio)}\n`;
+    }
+
+    function onPlayerPlayMediaSourceListModeListChanged(
+      modeList: Array<ESPlayerPlayMode>,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMediaSourceListModeListChanged:${JSON.stringify(modeList)}\n`;
+    }
+
+    function onPlayerPlayMediaSourceListModeChanged(
+      mode: ESPlayerPlayMode,
+    ): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMediaSourceListModeChanged:${JSON.stringify(mode)}\n`;
+    }
+
+    function onPlayerViewChanged(): void {
+      contentText.value = `${contentText.value}onPlayerViewChanged` + `\n`;
+    }
+
+    function onPlayerSizeChanged(
+      playerWidth: number,
+      playerHeight: number,
+    ): void {
+      contentText.value = `${contentText.value}onPlayerSizeChanged:${playerWidth} ${playerHeight}\n`;
+    }
+
+    function onPlayerClickable(playerClickable: boolean): void {
+      contentText.value = `${contentText.value}onPlayerClickable:${playerClickable}\n`;
+    }
+
+    function onPlayerPlayMediaList(playList: ESMediaItemList): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMediaList:${JSON.stringify(playList)}\n`;
+    }
+
+    function onPlayerPlayMedia(mediaItem: ESMediaItem): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerPlayMedia:${JSON.stringify(mediaItem)}\n`;
+    }
+
+    function onPlayerNoMediaCanPlay(next: boolean): void {
+      contentText.value = `${contentText.value}onPlayerNoMediaCanPlay:${next}\n`;
+    }
+
+    function onPlayerWindowTypeChanged(windowType: ESPlayerWindowType): void {
+      contentText.value = `${
+        contentText.value
+      }onPlayerWindowTypeChanged:${JSON.stringify(windowType)}\n`;
+    }
+
+    function onPlayerWindowSizeChanged(
+      playerWidth: number,
+      playerHeight: number,
+    ): void {
+      contentText.value = `${contentText.value}onPlayerWindowSizeChanged:${playerWidth} ${playerHeight}\n`;
+    }
+
+    function onKeyDown(keyEvent: ESKeyEvent): boolean {
+      contentText.value = `${contentText.value}onKeyDown:${JSON.stringify(
+        keyEvent,
+      )}\n`;
+      return true;
+    }
+
+    function onKeyUp(keyEvent: ESKeyEvent): boolean {
+      contentText.value = `${contentText.value}onKeyUp:${JSON.stringify(
+        keyEvent,
+      )}\n`;
+      return true;
+    }
+
+    function onBackPressed(): boolean {
+      contentText.value = `${contentText.value}onBackPressed` + `\n`;
+      return true;
+    }
+
+    return {
+      contentText,
+      getId,
+      setEnabled,
+      isEnabled,
+      setPlayerManager,
+      getPlayerManager,
+      onPlayerInitialized,
+      onPlayerPlayMediaSourceList,
+      onPlayerPlayMediaSource,
+      onPlayerInterceptSuccess,
+      onPlayerInterceptError,
+      onPlayerPreparing,
+      onPlayerPrepared,
+      onPlayerBufferStart,
+      onPlayerBufferEnd,
+      onPlayerPlaying,
+      onPlayerProgressChanged,
+      onPlayerDurationChanged,
+      onPlayerSeekStart,
+      onPlayerSeekCompleted,
+      onPlayerPaused,
+      onPlayerResumed,
+      onPlayerStopped,
+      onPlayerCompleted,
+      onPlayerError,
+      onPlayerInfo,
+      onPlayerNoMediaSourceCanPlay,
+      onPlayerVolumeChanged,
+      onPlayerLeftVolumeChanged,
+      onPlayerRightVolumeChanged,
+      onPlayerDefinitionListChanged,
+      onPlayerDefinitionChanged,
+      onPlayerPlayRateListChanged,
+      onPlayerPlayRateChanged,
+      onPlayerDecodeListChanged,
+      onPlayerDecodeChanged,
+      onPlayerAspectRatioListChanged,
+      onPlayerAspectRatioChanged,
+      onPlayerPlayMediaSourceListModeListChanged,
+      onPlayerPlayMediaSourceListModeChanged,
+      onPlayerViewChanged,
+      onPlayerSizeChanged,
+      onPlayerClickable,
+      onPlayerPlayMediaList,
+      onPlayerPlayMedia,
+      onPlayerNoMediaCanPlay,
+      onPlayerWindowTypeChanged,
+      onPlayerWindowSizeChanged,
+      onKeyDown,
+      onKeyUp,
+      onBackPressed,
+    };
+  },
+});
+</script>
+
+<style scoped>
+.es-player-view-root-css {
+  width: 1920px;
+  height: 1080px;
+  background-color: transparent;
+}
+
+.es-player-view-content-text-css {
+  margin: 50px;
+  width: 1920px;
+  font-size: 25px;
+  color: red;
+}
+</style>

package/rules/.docs/examples/component/player-manager/post-roll-ad.vue

@@ -0,0 +1,189 @@
+<template>
+  <div class="es-sdk-root-css">
+    <es-player-manager
+      ref="playerManager"
+      :initPlayerWindowType="2"
+      :playerList="playerListRef"
+      :adPlayerList="adPlayerListRef"
+      :adTest="true"
+      adChannel="ch"
+      :adDebug="true"
+      class="es-video-player-manager-page-css"
+      @onPlayerPlayList="onPlayerPlayList"
+      @onPlayerError="onPlayerError"
+      @onPlayerPlayMedia="onPlayerPlayMedia"
+      @onPlayerInterceptSuccess="onPlayerInterceptSuccess"
+      @onPlayerInterceptError="onPlayerInterceptError"
+    />
+    <s-title-view class="es-sdk-content-title-css" :text="$options.name" />
+    <div class="es-sdk-content-divider-css" />
+    <div class="es-sdk-content-row-css">
+      <s-text-button text="播放" @onButtonClicked="onPlayButtonClicked" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { markRaw, ref } from "vue";
+import { defineComponent } from "@vue/runtime-core";
+
+import { useESPlayerLog } from "@extscreen/es3-player";
+import { ESPlayerManager } from "@extscreen/es3-player-manager";
+import { ESVideoPlayer } from "@extscreen/es3-video-player";
+import { ESADPlayer, ESADType } from "@extscreen/es3-ad-player";
+import type {
+  ESMediaSource,
+  ESMediaSourceList,
+  ESPlayerError,
+  ESPlayerInterceptError,
+  ESPlayerInterceptResult,
+} from "@extscreen/es3-player";
+import type {
+  ESIPlayerManager,
+  ESMediaItem,
+  ESMediaItemList,
+} from "@extscreen/es3-player-manager";
+
+const TAG = "ESVideoPlayerManagerPage";
+
+export default defineComponent({
+  name: "后贴广告",
+  components: {
+    "es-player-manager": ESPlayerManager,
+  },
+  setup() {
+    const log = useESPlayerLog();
+    const playerManager = ref<ESIPlayerManager>();
+    const playerWidth = 1920;
+    const playerHeight = 1080;
+
+    const playerList = [markRaw(ESVideoPlayer)];
+    const playerListRef = ref(playerList);
+
+    const adPlayerList = [markRaw(ESADPlayer)];
+    const adPlayerListRef = ref(adPlayerList);
+
+    let isPaused = false;
+
+    const onPlayButtonClicked = () => {
+      const mediaSource: ESMediaSource = {
+        uri: "http://qcloudcdn.a311.ottcn.com/data_center/videos/SHORT/DEFAULT/2023/09/17/f4ccf8e2-0e58-4d36-ae2b-0555190ac340.mp4",
+      };
+      //视频广告
+      const adMediaSource: ESMediaSource = {
+        uri: {
+          id: "extscreen-cast",
+          mediaId: "1111",
+          count: 1,
+          type: ESADType.ES_AD_TYPE_LAUNCH,
+        },
+      };
+
+      //后贴
+      const postRollADList: ESMediaSourceList = {
+        index: 0,
+        list: [adMediaSource],
+        support: true,
+      };
+
+      //视频
+      const mediaSourceList: ESMediaSourceList = {
+        index: 0,
+        list: [mediaSource],
+      };
+
+      const mediaItemOne: ESMediaItem = {
+        playerType: 1,
+        mediaSourceList,
+        postRollADList,
+      };
+
+      //----------------------------------------------------------
+      const mediaSourceTwo: ESMediaSource = {
+        uri: "http://qcloudcdn.a311.ottcn.com/data_center/videos/SHORT/DEFAULT/2023/09/17/22edb94d-8ffc-4736-a633-3f9e38c096e8.mp4",
+      };
+
+      const mediaSourceListTwo: ESMediaSourceList = {
+        index: 0,
+        list: [mediaSourceTwo],
+      };
+      const mediaItemTwo: ESMediaItem = {
+        playerType: 1,
+        mediaSourceList: mediaSourceListTwo,
+      };
+      //----------------------------------------------------------
+      const playList: ESMediaItemList = {
+        index: 0,
+        list: [mediaItemOne, mediaItemTwo],
+      };
+      playerManager.value?.initialize();
+      playerManager.value?.playMediaList(playList);
+    };
+
+    const onESCreate = () => {
+      log.e(TAG, "-------onESCreate------START---->>>>>");
+    };
+
+    const onESResume = () => {
+      log.e(TAG, "-------onESResume---------->>>>>");
+      if (isPaused) {
+        playerManager.value?.resume();
+      }
+      isPaused = false;
+    };
+    const onESPause = () => {
+      log.e(TAG, "-------onESPause---------->>>>>");
+      isPaused = true;
+      playerManager.value?.stop();
+    };
+    const onESDestroy = () => {
+      log.e(TAG, "-------onESDestroy---------->>>>>");
+      playerManager.value?.release();
+    };
+
+    const onPlayerPlayList = (playList: ESMediaItemList) => {
+      log.e(TAG, "-------onPlayerPlayList---------->>>>>", playList);
+    };
+
+    const onPlayerPlayMedia = (mediaItem: ESMediaItem) => {
+      log.e(TAG, "-------onPlayerPlayMedia---------->>>>>", mediaItem);
+    };
+
+    const onPlayerError = (error: ESPlayerError) => {
+      log.e(TAG, "-------onPlayerError---------->>>>>", error);
+    };
+
+    const onPlayerInterceptSuccess = (result: ESPlayerInterceptResult) => {
+      log.e(TAG, "-------onPlayerInterceptSuccess---------->>>>>", result);
+    };
+
+    const onPlayerInterceptError = (error: ESPlayerInterceptError) => {
+      log.e(TAG, "-------onPlayerInterceptError---------->>>>>", error);
+    };
+
+    return {
+      onESCreate,
+      onESResume,
+      onESPause,
+      onESDestroy,
+      playerListRef,
+      adPlayerListRef,
+      playerWidth,
+      playerHeight,
+      playerManager,
+      onPlayerPlayList,
+      onPlayerPlayMedia,
+      onPlayerError,
+      onPlayerInterceptSuccess,
+      onPlayerInterceptError,
+      onPlayButtonClicked,
+    };
+  },
+});
+</script>
+
+<style>
+.es-video-player-manager-page-css {
+  position: absolute;
+}
+</style>