From 783cc313f00f7dab3c5a6ffb7ebef7c1df45b0cd Mon Sep 17 00:00:00 2001 From: jiaogan Date: Fri, 22 Nov 2024 09:48:59 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=AE=98=E6=96=B9=E6=92=AD?= =?UTF-8?q?=E6=94=BE=E5=99=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/player/player.json | 4 + components/player/player.ts | 105 ++++++++++++++++++++++ components/player/player.ttml | 55 ++++++++++++ components/player/player.ttss | 6 ++ pages/videoByte/videoByte.json | 14 +++ pages/videoByte/videoByte.ts | 154 +++++++++++++++++++++++++++++++++ pages/videoByte/videoByte.ttml | 0 pages/videoByte/videoByte.ttss | 0 8 files changed, 338 insertions(+) create mode 100644 components/player/player.json create mode 100644 components/player/player.ts create mode 100644 components/player/player.ttml create mode 100644 components/player/player.ttss create mode 100644 pages/videoByte/videoByte.json create mode 100644 pages/videoByte/videoByte.ts create mode 100644 pages/videoByte/videoByte.ttml create mode 100644 pages/videoByte/videoByte.ttss diff --git a/components/player/player.json b/components/player/player.json new file mode 100644 index 0000000..62389a9 --- /dev/null +++ b/components/player/player.json @@ -0,0 +1,4 @@ +{ + "component": true, + "usingComponents": {} + } \ No newline at end of file diff --git a/components/player/player.ts b/components/player/player.ts new file mode 100644 index 0000000..5010cb4 --- /dev/null +++ b/components/player/player.ts @@ -0,0 +1,105 @@ + +const { + getPlayletManager +} = tt; +Component({ + pm: undefined, + data: { + adBanner: null, + videoAlbumId: null, + videoEpisodeId: null, + }, + ready() { + const pm = getPlayletManager(); + this.pm = pm; + + pm.onPlay((e) => { + console.log("触发开始播放onPlay回调，时间是:", new Date()); + }); + pm.onPause((e) => { + console.error('触发暂停播放onPause回调', e) + }) + pm.onEnded((e) => { + console.error('触发播放到末尾onEnded回调', e) + }) + pm.onError((e) => { + console.error('触发onError回调', e) + }) + + // 播放进度变化时 + pm.onTimeUpdate((e) => { + // 播放进度变化时触发，返回当前播放时间点及视频总时长，单位：秒(s)。event.detail = { currentTime, duration }。 + }) + + pm.onChangeEpisode((e) => { + //更新剧集信息 + this.setData({ + videoAlbumId: e.albumId, + videoEpisodeId: e.episodeId, + }) + }) + + pm.onShareSuccess((res) => { + console.log('shareSuccess-uuuu', res); + }) + pm.onShareFail((res) => { + console.log('shareFail-uuuu', err); + }) + + pm.onClickUnlock((e) => { + this.adOpen() + }) + + this.adLoad() + }, + methods: { + //向父组件传值 + emitInfoToParent(val:string,data?:any) { + const instance = this.selectOwnerComponent(); + instance.emitInfoFromChildren(val,data); + }, + + adLoad() { + let isAdBanner: any = this.data.adBanner; + // const context: any = tt.createVideoContext(`${videoInfo.id}`); + // this.watchInfo.isvip = 0; + if (!isAdBanner) { + const adBanner: any = tt.createRewardedVideoAd({ + adUnitId: "wh0y4vcxsbk7ixwktg", + }); + + // 监听错误 + adBanner.onError((err: any) => { + tt.hideLoading({}); + switch (err.errCode) { + case 1004: + // 无合适的广告 + break; + default: + // 更多请参考错误码文档 + } + }); + + // 监听视频播放完成 + adBanner.onClose((res: any) => { + console.log(res, "resres") + if (res.isEnded) { + this.emitInfoToParent('advunlock',{album_id: this.data.videoAlbumId,episode_id:this.data.videoEpisodeId}) + } else { + tt.showToast({ + title: '看完广告方可解锁', + icon: 'none', + duration: 2000 + }) + } + }); + + // 预加载资源 + adBanner.load(); + this.setData({ + adBanner: adBanner, + }) + } + }, + } +}) \ No newline at end of file diff --git a/components/player/player.ttml b/components/player/player.ttml new file mode 100644 index 0000000..1672f7a --- /dev/null +++ b/components/player/player.ttml @@ -0,0 +1,55 @@ + + + + + diff --git a/components/player/player.ttss b/components/player/player.ttss new file mode 100644 index 0000000..4633de2 --- /dev/null +++ b/components/player/player.ttss @@ -0,0 +1,6 @@ +.video-header { + z-index: 9; + background-color: yellow; + width: 100%; + position: fixed; +} \ No newline at end of file diff --git a/pages/videoByte/videoByte.json b/pages/videoByte/videoByte.json new file mode 100644 index 0000000..83391ca --- /dev/null +++ b/pages/videoByte/videoByte.json @@ -0,0 +1,14 @@ +{ + "extends": "ext://industry/playlet-plugin", + "usingComponents": { + "player": "/components/player/player" + }, + "isPageExtension": true, + "enablePullDownRefresh": false, + "navigationBarTextStyle": "white", + "backgroundColor": "#fff", + "navigationStyle": "default", + "transparentTitle": "none", + "disableScroll": true, + "disableSwipeBack": true +} \ No newline at end of file diff --git a/pages/videoByte/videoByte.ts b/pages/videoByte/videoByte.ts new file mode 100644 index 0000000..f712b33 --- /dev/null +++ b/pages/videoByte/videoByte.ts @@ -0,0 +1,154 @@ +import {httpRequest} from "../../utils/httpReques"; + +const { + PlayletExtension, + getPlayletManager +} = tt; + +// 可以使用tt.canIUse('PlayletExtension')判断是否可用，不可用可调用tt.navigateTo等跳转离开 + +PlayletExtension({ + pm: undefined, + options: undefined, + data: { + watchInfo: null, + }, + methods: { + emitInfoFromChildren(val,data) { + console.log('收到消息', val) + console.log('收到消息', data) + if(val=="advunlock"){ + this.init('advunlock',data) + } + }, + onLoad(options) { + const caniuse = !!tt.canIUse('PlayletExtension'); + // console.log('行业SDK版本号', tt.getIndustrySdkInfo().version); + // console.log('TMAR版本号', tt.getSystemInfoSync().SDKUpdateVersion); + // console.error('caniuse', caniuse); + const pm = getPlayletManager(); + this.pm = pm; + this.options = options; + this.setData({ + tt_album_id: options.tt_album_id, + tt_episode_id: options.tt_episode_id, + seq: options.seq, + }) + + }, + async onReady() { + console.log('页面完成Ready', JSON.stringify(options)) + const pm = getPlayletManager(); + const options = this.options; + + // 初始化自定义组件 + // this.pm.setConfig({ + // activityInfo: [ + // { + // icon: "https://dyxykjweb.hunanjj.cn/sta_images/icon/welfare_gift_icon.png", + // title: "福利", + // }, + // ], + // objectFit: 'contain' + // }); + + //是否展示解锁页 + this.pm.setConfig({ + showLockPage: true + }); + + //播放器分享按钮 + this.pm.onTapShare((e) => { + console.log(`/pages/videoByte/videoByte?is_continue=0&tt_album_id=${ this.data?.watchInfo?.album_id}&tt_episode_id=${ this.data?.watchInfo?.episode_id}&tid=${ this.options?.tid || ""}&launchsite=${ this.options?.launchsite || ""}`) + return { // 分享数据 + title: "古言剧场", + desc: "精彩剧情，尽在古言剧场", + path: `/pages/videoByte/videoByte?is_continue=0&tt_album_id=${ this.data?.watchInfo?.album_id}&tt_episode_id=${ this.data?.watchInfo?.episode_id}&tid=${ this.options?.tid || ""}&launchsite=${ this.options?.launchsite || ""}`, + imageUrl: this.data?.watchInfo?.cover, + } + }) + + //初始化页面分享内容 + this.pm.getPlayletInfo().then(res => { + console.log('getPlayletInfo', res) + this.setData({ + tt_album_id: res.albumId, + tt_episode_id: res.episodeId, + seq: res.seq + }) + this.pm.setConfig({ + shareParam: { // 分享数据 + title: "古言剧场", + desc: "精彩剧情，尽在古言剧场", + path: `/pages/videoByte/videoByte?is_continue=0&tt_album_id=${ this.data?.watchInfo?.album_id}&tt_episode_id=${ this.data?.watchInfo?.episode_id}&tid=${ this.options?.tid || ""}&launchsite=${ this.options?.launchsite || ""}`, + imageUrl: this.data?.watchInfo?.cover, + } + // title: this.watchInfo.title, + // imageUrl: this.watchInfo.cover, + // desc: `精彩剧情，尽在${this.pageGlobalData.appName}`, + // path: `/pages/videobyte/index?tt_album_id=${this.$store.state.currentVideoInfo.album_id}&tt_episode_id=${this.$store.state.currentVideoInfo.episode_id}&is_continue=0&tid=${this.$store.state.linkParams.tid || ""}&launchsite=${this.$store.state.linkParams.launchsite || ""}`, + }); + }); + + this.init(); + + }, + async init(status?:string,data?:any) { + console.log("data",data) + let params = { + ...this.options, + album_id: !!data ? data.album_id : this.options.tt_album_id, + episode_id: !!data ? data.episode_id : this.options.tt_episode_id, + sid: null, + id: null, + tt_album_id: null, + tt_episode_id: null, + adunlocking: status == 'advunlock' ? 1 : null + } + //初始化目录 + const res = await httpRequest('/douyinNewRead', 'post', params); + //设置剧集上锁状态 + const _freeList = res.data.freelist != null ? res.data.freelist : [] + const _lockList = res.data.locklist != null ? res.data.locklist : [] + console.log('res',res); + this.pm.setCatalog({ + freeList: _freeList, + lockList: _lockList + }) + const _watchinfo = { + ...res.data.library, + ...res.data.video, + ...res.data.read_data + } + this.setData({ + watchInfo: _watchinfo + }) + } + + }, + + lifetimes: { + + ready() { + console.log('ready') + }, + + created() { + console.log('created') + }, + + attached() { + console.log('attached') + }, + + detached() { + console.log('detached') + }, + }, + + pageLifetimes: { + hide() { + console.log('触发hide') + }, + } +}); \ No newline at end of file diff --git a/pages/videoByte/videoByte.ttml b/pages/videoByte/videoByte.ttml new file mode 100644 index 0000000..e69de29 diff --git a/pages/videoByte/videoByte.ttss b/pages/videoByte/videoByte.ttss new file mode 100644 index 0000000..e69de29