@quicktvui/ai 1.0.9 → 1.1.1

package/rules/.source/hellotv/src/pages/detail-full-player/components/media-player/full-player-view.vue

@@ -0,0 +1,219 @@
+<template>
+  <es-player-manager
+    class="full-player-root-css"
+    ref="playerManager"
+    :focusable="false"
+    :initPlayerWindowType="playerWindowType"
+    :style="{ left: playerLeft, top: playerTop }"
+    :playerList="playerListRef"
+    :playerViewList="playerViewListRef"
+    @onPlayerPlayMedia="onPlayerPlayMedia"
+    @onPlayerPlaying="onPlayerPlaying"
+    @onPlayerPaused="onPlayerPaused"
+    @onPlayerStopped="onPlayerStopped"
+    @onPlayerWindowTypeChanged="onPlayerWindowTypeChanged"
+    @onPlayerCompleted="onPlayerCompleted"
+    @onPlayerInterceptSuccess="onPlayerInterceptSuccess"
+    @onPlayerInterceptError="onPlayerInterceptError"
+    @onPlayerInitialized="onPlayerInitialized"
+    @onPlayerProgressChanged="onPlayerProgressChanged"
+    @onPlayerDurationChanged="onPlayerDurationChanged"
+    @onPlayerError="onPlayerError"
+  />
+</template>
+
+<script lang="ts">
+import { ESKeyEvent } from "@extscreen/es3-core";
+import {
+  ESPlayerDecode,
+  ESPlayerError,
+  ESPlayerInterceptError,
+  ESPlayerInterceptResult,
+  ESPlayerPlayMode,
+  ESPlayerRate,
+  ESPlayerWindowType,
+} from "@extscreen/es3-player";
+import { defineComponent, markRaw, ref } from "vue";
+import {
+  ESIPlayerManager,
+  ESMediaItem,
+  ESMediaItemList,
+  ESPlayerManager,
+} from "@extscreen/es3-player-manager";
+import { ESVideoPlayer } from "@extscreen/es3-video-player";
+import { IMediaList } from "../../../../components/media/build-data/media-imp";
+import { IMedia } from "../../../detail/adapter/interface";
+import {
+  buildMediaList,
+  createESPlayerMediaSourceListInterceptor,
+} from "../../../detail/adapter/media-player";
+import FullPlayerLoadingView from "./full-player-loading.vue";
+import FullPlayerMenuView from "./full-player-menu-view.vue";
+
+export default defineComponent({
+  name: "FullPlayerView",
+  components: {
+    "es-player-manager": ESPlayerManager,
+  },
+  props: {
+    playerWindowType: {
+      type: Number,
+      default: ESPlayerWindowType.ES_PLAYER_WINDOW_TYPE_FULL,
+    },
+    playerLeft: {
+      type: Number,
+      default: 0,
+    },
+    playerTop: {
+      type: Number,
+      default: 0,
+    },
+  },
+  emits: [
+    "onPlayerPlayMedia",
+    "onPlayerPlaying",
+    "onPlayerWindowTypeChanged",
+    "onPlayerCompleted",
+    "onPlayerInterceptSuccess",
+    "onPlayerInterceptError",
+    "onPlayerInitialized",
+    "onPlayerProgressChanged",
+    "onPlayerDurationChanged",
+    "onPlayerError",
+  ],
+  setup(props, context) {
+    const playerManager = ref<ESIPlayerManager>();
+    const playerList = [markRaw(ESVideoPlayer)];
+    const playerListRef = ref(playerList);
+    const playerViewListRef = ref([
+      markRaw(FullPlayerLoadingView),
+      markRaw(FullPlayerMenuView),
+    ]);
+    const interceptor = createESPlayerMediaSourceListInterceptor();
+    let progressTimer: any;
+    let m: IMedia;
+
+    const initPlayInfo = (media: IMedia) => {
+      m = media;
+      let playList: ESMediaItemList = {
+        index: 0,
+        list: [],
+        media: media,
+      };
+      playerManager.value?.setPlayMediaListMode(
+        ESPlayerPlayMode.ES_PLAYER_PLAY_MODE_LOOP,
+      );
+      playerManager.value?.playMediaList(playList);
+    };
+
+    const loadMoreMediaList = (
+      page: number = 0,
+      mediaList: Array<IMediaList>,
+    ) => {
+      const mediaItemList = buildMediaList(page, mediaList, [interceptor], m);
+      playerManager.value?.addMediaToIndex((page - 1) * 10, mediaItemList);
+    };
+
+    const playMediaItemByIndex = (index: number) => {
+      playerManager.value?.playMediaByIndex(index);
+    };
+
+    const onPlayerPlayMedia = (mediaItem: ESMediaItem) => {
+      // payStatus = mediaItem.payStatus
+
+      context.emit("onPlayerPlayMedia", mediaItem);
+    };
+    const onPlayerPlaying = () => {
+      startProgressTimer();
+      context.emit("onPlayerPlaying");
+    };
+    const startProgressTimer = () => {
+      stopProgressTimer();
+      progressTimer = setInterval(() => {
+        playerManager.value?.getDuration();
+        playerManager.value?.getCurrentPosition();
+      }, 1000);
+    };
+    const stopProgressTimer = () => {
+      if (progressTimer) {
+        clearInterval(progressTimer);
+      }
+    };
+    const onPlayerPaused = (): void => {
+      stopProgressTimer();
+    };
+    const onPlayerStopped = (): void => {
+      stopProgressTimer();
+    };
+    const onPlayerWindowTypeChanged = (
+      windowType: ESPlayerWindowType,
+    ): void => {
+      context.emit("onPlayerWindowTypeChanged", windowType);
+    };
+    const onPlayerCompleted = (): void => {
+      context.emit("onPlayerCompleted");
+    };
+    const onPlayerInterceptSuccess = (
+      result: ESPlayerInterceptResult,
+    ): void => {
+      context.emit("onPlayerInterceptSuccess", result);
+    };
+    const onPlayerInterceptError = (result: ESPlayerInterceptError): void => {
+      context.emit("onPlayerInterceptError", result);
+    };
+    const onPlayerInitialized = (): void => {
+      context.emit("onPlayerInitialized");
+      playerManager.value?.setDecode(ESPlayerDecode.ES_PLAYER_DECODE_HARDWARE);
+      playerManager.value?.setPlayRate(ESPlayerRate.ES_PLAYER_RATE_1);
+    };
+    const onPlayerProgressChanged = (p: number): void => {
+      // curProgress = p
+      context.emit("onPlayerProgressChanged", p);
+    };
+
+    const onPlayerDurationChanged = (d: number): void => {
+      context.emit("onPlayerDurationChanged", d);
+    };
+    const onPlayerError = (error: ESPlayerError): void => {
+      context.emit("onPlayerError", error);
+    };
+    const onKeyDown = (keyEvent: ESKeyEvent): boolean => {
+      if (playerManager.value) {
+        return playerManager.value!.onKeyDown(keyEvent);
+      }
+      return false;
+    };
+
+    const onKeyUp = (keyEvent: ESKeyEvent): boolean => {
+      if (playerManager.value) {
+        return playerManager.value!.onKeyUp(keyEvent);
+      }
+      return false;
+    };
+    return {
+      playerManager,
+      playerListRef,
+      playerViewListRef,
+      onKeyDown,
+      onKeyUp,
+      initPlayInfo,
+      loadMoreMediaList,
+      playMediaItemByIndex,
+      onPlayerPlayMedia,
+      onPlayerPlaying,
+      onPlayerPaused,
+      onPlayerStopped,
+      onPlayerWindowTypeChanged,
+      onPlayerCompleted,
+      onPlayerInterceptSuccess,
+      onPlayerInterceptError,
+      onPlayerInitialized,
+      onPlayerProgressChanged,
+      onPlayerDurationChanged,
+      onPlayerError,
+    };
+  },
+});
+</script>
+
+<style lang="scss" src="../../scss/full-player-view.scss"></style>

package/rules/.source/hellotv/src/pages/detail-full-player/index.vue

@@ -0,0 +1,101 @@
+<template>
+  <div class="detail-full-player-view">
+    <full-player-view ref="fullPlayerViewRef" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ESKeyEvent, useESEventBus, useESRuntime } from "@extscreen/es3-core";
+import { ref } from "vue";
+import { IMedia, IMediaItem } from "../detail/adapter/interface";
+import detailManager from "../detail/api";
+import FullPlayerView from "./components/media-player/full-player-view.vue";
+
+defineOptions({
+  name: "index",
+});
+const runtime = useESRuntime();
+const eventbus = useESEventBus();
+const deviceId = runtime.getRuntimeDeviceId() ?? "";
+const fullPlayerViewRef = ref();
+let mediaId = ref("");
+let mediaDetail: IMedia;
+let currentPlayIndex = -1; // 当前播放视频的index
+const onESCreate = (params) => {
+  mediaId.value =
+    params && params.mediaId ? params.mediaId : "1584863712586579969";
+  getDetail();
+};
+
+const getDetail = () => {
+  detailManager.getMediaDetail(mediaId.value).then(async (res: IMedia) => {
+    mediaDetail = res;
+    mediaDetail.mediaSeriesType = 1; //设置选集类型
+    currentPlayIndex = 0;
+    mediaDetail._prevPlayIndex = currentPlayIndex;
+    // await getHistory()
+    // const index = currentPlayIndex + 1
+    // const pageNo = Math.ceil(index / 10)
+    fullPlayerViewRef.value.initPlayInfo(mediaDetail);
+    getMediaList(mediaDetail.episodesId, 1);
+  });
+};
+
+const getHistory = () => {
+  detailManager
+    .getRecordData(mediaDetail.id, deviceId, "history")
+    .then((res) => {
+      if (res) {
+        mediaDetail.history = res;
+        currentPlayIndex = Math.min(
+          Math.max((Number(res.episode) || 0) - 1, 0),
+          Math.max(mediaDetail.episodes - 1, 0),
+        );
+        mediaDetail._prevPlayIndex = currentPlayIndex;
+      } else {
+        currentPlayIndex = 0;
+        mediaDetail._prevPlayIndex = currentPlayIndex;
+      }
+    })
+    .catch(() => {
+      currentPlayIndex = 0;
+      mediaDetail._prevPlayIndex = currentPlayIndex;
+    });
+};
+
+const getMediaList = (episodesId: string, pageNo: number) => {
+  detailManager
+    .getMediaSeriesList(episodesId, pageNo, 10)
+    .then((mediaList: Array<IMediaItem>) => {
+      eventbus.emit("onFullPlayerMediaListLoad", pageNo, mediaList);
+      fullPlayerViewRef.value?.loadMoreMediaList(pageNo, mediaList);
+      if (currentPlayIndex >= 0) {
+        fullPlayerViewRef.value?.playMediaItemByIndex(currentPlayIndex);
+        currentPlayIndex = -1;
+        mediaDetail._prevPlayIndex = -1;
+      }
+    });
+};
+const onKeyDown = (keyEvent: ESKeyEvent): boolean => {
+  if (fullPlayerViewRef.value?.onKeyDown(keyEvent)) {
+    return true;
+  }
+  return false;
+};
+
+const onKeyUp = (keyEvent: ESKeyEvent): boolean => {
+  if (fullPlayerViewRef.value?.onKeyUp(keyEvent)) {
+    return true;
+  }
+  return false;
+};
+defineExpose({ onESCreate, onKeyDown, onKeyUp });
+</script>
+
+<style lang="scss">
+.detail-full-player-view {
+  width: 1920px;
+  height: 1080px;
+  background-color: transparent;
+}
+</style>

package/rules/.source/hellotv/src/pages/detail-full-player/scss/full-player-view.scss

@@ -0,0 +1,6 @@
+.full-player-root-css{
+  width:1920px;
+  height: 1080px;
+  background-color: transparent;
+  position: absolute;
+}

package/rules/.source/hellotv/src/pages/detail-full-screen/adapter/interface.ts

@@ -0,0 +1,133 @@
+import { ESKeyEvent } from "@extscreen/es3-core";
+import { ESPlayerWindowType } from "@extscreen/es3-player";
+import { QTIBaseView } from "@quicktvui/quicktvui3/dist/src/base/QTIBaseView";
+// import {QTListViewItem, QTICollapseItem} from "@quicktvui/quicktvui3";
+//选集展示类型
+export enum IMediaSeriesType {
+  MEDIA_ITEM_LIST_TYPE_NUMBER = 0,
+  MEDIA_ITEM_LIST_TYPE_LEFT_RIGHT = 1,
+  MEDIA_ITEM_LIST_TYPE_TEXT = 2,
+  MEDIA_ITEM_LIST_TYPE_TOP_DOWN = 3,
+}
+// 详情
+export interface IMedia {
+  //id
+  id: string;
+  //标题
+  title: string;
+  description: string;
+  //标签
+  tags: string;
+  //评分
+  actors: string;
+  score: string;
+  offLine: string;
+  vipType: string;
+  //集数
+  episodes: number;
+  episodesId: string;
+  //选集类型
+  mediaSeriesType: IMediaSeriesType | number;
+  [prop: string]: any;
+}
+export enum IEpisodeAuthType {
+  MEDIA_AUTH_TYPE_VIP = 0,
+  MEDIA_AUTH_TYPE_FREE = 1,
+}
+// 选集item
+export interface IMediaItem {
+  //分集id
+  id: string;
+  //分集展示的标题
+  title: string;
+  subTitle: string;
+  cover: string;
+  //
+  episode: number;
+  vipType: number;
+  [prop: string]: any;
+}
+// 相关推荐item
+export interface IRecommendItem {
+  id: string;
+  title: string;
+  cover: string;
+  description: string;
+  tags: string;
+  actors: string;
+  score: number;
+  offLine: boolean;
+  vipType: number;
+  episodes: number;
+  episodesId: string;
+  [prop: string]: any;
+}
+export enum IMediaPlayerViewState {
+  MEDIA_PLAYER_VIEW_STATE_DISMISS = 0,
+  MEDIA_PLAYER_VIEW_STATE_PROGRESS = 1,
+  MEDIA_PLAYER_VIEW_STATE_MENU = 2,
+}
+export const MEDIA_PLAYER_ERROR_AUTH = -2000;
+//播放器url
+export interface IMediaUrl {
+  definition: string;
+  playUrl: string;
+}
+// 媒体播放器
+export interface IMediaPlayer extends QTIBaseView {
+  play(media: IMedia);
+  addMediaItemList(page: number, mediaList: Array<IMediaItem>);
+  playMediaItemById(id: string);
+  playMediaItemByIndex(index: number);
+  getPlayingMediaIndex(): number;
+  setFloatWindow();
+  setSmallWindow();
+  getWindowType(): ESPlayerWindowType;
+  getLoadLow(): boolean;
+  stop();
+  release();
+  resume();
+  reset();
+  setFullWindow(): void;
+  onKeyDown(keyEvent: ESKeyEvent): boolean;
+  onKeyUp(keyEvent: ESKeyEvent): boolean;
+  onBackPressed(): boolean;
+
+  changeVisible(value: boolean): void;
+}
+
+//api
+export interface DetailApi {
+  /**
+   * 获取详情页详情数据
+   */
+  getMediaDetail(id: string): Promise<IMedia>;
+  /**
+   * 获取详情页选集列表
+   */
+  getMediaSeriesList(
+    id: string,
+    page: number,
+    limit: number,
+  ): Promise<Array<IMediaItem>>;
+  /**
+   * 获取相关推荐数据
+   */
+  getRecommendList(id: string): Promise<Array<IRecommendItem>>;
+  /**
+   * 获取详情页播放请求地址
+   */
+  getPlayUrl(id: string, type: string): Promise<any>;
+  /**
+   * 获取历史/收藏 数据
+   */
+  getRecordData(id: string, deviceId: string, type: string): Promise<any>;
+  /**
+   * 上报历史/收藏
+   */
+  reportRecordData(data: any): Promise<any>;
+  /**
+   * 删除历史/收藏
+   */
+  deleteRecordData(id: string, deviceId: string, type: string): Promise<any>;
+}

package/rules/.source/hellotv/src/pages/detail-full-screen/api/index.ts

@@ -0,0 +1,77 @@
+import requestManager from "../../../tools/request";
+import BuildConfig from "../../../config/build-config";
+import {
+  DetailUrl,
+  DetailMediaSeriesUrl,
+  RecommendListUrl,
+  PlayUrl,
+  RecordsUrl,
+} from "./request-url";
+import {
+  IMedia,
+  IMediaItem,
+  IRecommendItem,
+  DetailApi,
+} from "../adapter/interface";
+
+class DetailManager implements DetailApi {
+  //获取详情页数据
+  getMediaDetail(id: string): Promise<IMedia> {
+    const url = `${DetailUrl}${id}?packageName=${BuildConfig.packageName}`;
+    return requestManager.get(url).then((res: any) => {
+      const media: IMedia = res;
+      return Promise.resolve(media);
+    });
+  }
+  //获取详情页选集列表
+  getMediaSeriesList(
+    id: string,
+    page: number,
+    limit: number,
+  ): Promise<Array<IMediaItem>> {
+    const url = `${DetailMediaSeriesUrl}${id}?packageName=${BuildConfig.packageName}&page=${page}&limit=${limit}`;
+    return requestManager.get(url).then((res: any) => {
+      const mediaSeriesList: Array<IMediaItem> = res.items;
+      return Promise.resolve(mediaSeriesList);
+    });
+  }
+  //获取详情页推荐列表
+  getRecommendList(id: string): Promise<Array<IRecommendItem>> {
+    const url = `${RecommendListUrl}?packageName=${BuildConfig.packageName}&id=${id}&page=1&limit=12`;
+    return requestManager.get(url).then((res: any) => {
+      const recommendist: Array<IRecommendItem> = res.items;
+      return Promise.resolve(recommendist);
+    });
+  }
+  //获取播放地址
+  getPlayUrl(id: string, type: string): Promise<any> {
+    const url = `${PlayUrl}${id}?packageName=${BuildConfig.packageName}&type=${type}`;
+    return requestManager.get(url).then((res: any) => {
+      return Promise.resolve(res);
+    });
+  }
+  //获取历史/收藏 数据
+  getRecordData(id: string, deviceId: string, type: string): Promise<any> {
+    const url = `${RecordsUrl}/${id}?packageName=${BuildConfig.packageName}&deviceId=${deviceId}&recordType=${type}`;
+    return requestManager.get(url).then((res: any) => {
+      return Promise.resolve(res);
+    });
+  }
+  //上报历史/收藏
+  reportRecordData(data: any): Promise<any> {
+    const url = `${RecordsUrl}?packageName=${BuildConfig.packageName}`;
+    return requestManager.post(url, data).then((res: any) => {
+      return Promise.resolve(res);
+    });
+  }
+  //删除历史/收藏
+  deleteRecordData(id: string, deviceId: string, type: string): Promise<any> {
+    const url = `${RecordsUrl}/${deviceId}?recordId=${id}&recordType=${type}`;
+    return requestManager.delete(url).then((res: any) => {
+      return Promise.resolve(res);
+    });
+  }
+}
+
+const detailManager = new DetailManager();
+export default detailManager;

package/rules/.source/hellotv/src/pages/detail-full-screen/api/request-url.ts

@@ -0,0 +1,8 @@
+import BuildConfig from "../../../config/build-config";
+
+export const DetailUrl = BuildConfig.requestBaseUrl + "/album/details/";
+export const DetailMediaSeriesUrl =
+  BuildConfig.requestBaseUrl + "/album/episodes/";
+export const RecommendListUrl = BuildConfig.requestBaseUrl + "/recommendations";
+export const PlayUrl = BuildConfig.requestBaseUrl + "/streams/";
+export const RecordsUrl = BuildConfig.requestBaseUrl + "/records";