Commit d80610b9 authored by sunzh's avatar sunzh

v1.1.0(logo、默认清晰度等功能)

parent adf74842
......@@ -27,8 +27,17 @@
- 仅mp4支持下载,实现下载功能有2种方式:
- 使用播放器插件内置按钮;
- 通过插件提供API来实现。
- 下载成功后,应在回调里处理删除缓存文件,避免超出小程序允许的存储空间大小,影响下载功能的使用。
版本更新记录:
1.1.0 发布时间: 2021-06-28 11:31:00
​ 更新日志: 新增自定义 logo;指定默认清晰度defaultDf; 指定开始播放时间参数 watchStartTime;清晰度、倍速、播放状态等相关api、回调。
1.0.1 发布时间: 2021-04-27 09:55:00
​ 更新日志: 下载功能、全屏按钮显示控制、封面
......@@ -6,7 +6,7 @@
],
"plugins": {
"ccvod": {
"version": "1.0.1",
"version": "1.1.0",
"provider": "wx70d57361939e63ef"
}
},
......
......@@ -40,6 +40,19 @@ Component({
showFullscreenBtn: {
type: Boolean,
value: true
},
progressbar_enable: {
type: Number,
value: 1
},
isStartPlay: {
type: Boolean, // 是否开播
value: false
},
logo: {
type: Object,
value: {},
observer: "handleLogoStyle"
}
},
......@@ -58,13 +71,45 @@ Component({
hdShow: false,
ccH5spTxt: '常速',
timer: {},
interFaceShow: true
interFaceShow: true,
logoStyle: ""
},
/**
* 组件的方法列表
*/
methods: {
handleLogoStyle: function(e) {
let logoStyle = {}, logoStr = "";
if(e.opacity !== undefined) {
logoStyle.opacity = e.opacity / 100;
}
if(e.size) {
logoStyle.width = e.size + '%';
}
let position = e.position || 1;
let posX = e.posX || 0;
let posY = e.posY || 0;
if(position == 2) {
logoStyle.top = posY + '%';
logoStyle.right = posX + '%';
} else if(position == 3) {
logoStyle.bottom = posY + '%';
logoStyle.left = posX + '%';
} else if(position == 4) {
logoStyle.bottom = posY + '%';
logoStyle.right = posX + '%';
} else {
logoStyle.top = posY + '%';
logoStyle.left = posX + '%';
}
for(let i in logoStyle) {
logoStr += (i + ':' + logoStyle[i] + ';')
}
this.setData({
logoStyle: logoStr
})
},
handleInterShow: function(flag) {
if(!this.data.totalTime) return;
if(!flag) {
......@@ -125,7 +170,7 @@ Component({
currentTime: currentTime
});
}
if(currentTime > 1) {
if(this.data.isStartPlay && currentTime > 1) {
this.setData({
isPlaying: isPlaying
})
......@@ -133,6 +178,9 @@ Component({
},
dragTimeStart: function(e) {
if(this.data.progressbar_enable !== 1){
return;
}
clearTimeout(this.data.timer);
this.setData({
dragStartEvent: e
......@@ -142,6 +190,9 @@ Component({
* 拖拽跳转时间
*/
dragTimeMove: function(e) {
if(this.data.progressbar_enable !== 1){
return;
}
this.moveIndex++;
let dragStartEvent = this.data.dragStartEvent
if(Math.abs(e.touches[0].pageX - dragStartEvent.touches[0].pageX) > 4) {
......@@ -163,11 +214,13 @@ Component({
* 拖拽抬起跳转时间
*/
dragTimeEnd: function() {
if(this.data.progressbar_enable !== 1){
return;
}
if(!this.data.isMove) {
this.setPercent(this.data.dragStartEvent);
}
var second = parseFloat(this.data.percent) * this.data.totalTime;
console.log('second: ', second)
this.setData({
isMove: false
})
......
<!--components/ccvod/controls/controls.wxml-->
<!--components/ccvod/controls/controls.wxml style="display:{{totalTime?'flex':'none'}}"-->
<cover-view
class='{{useCtrol? "ctrol-panel" : fullScreen ? "ctrol-panel panel-top":"ctrol-panel panel-bottom"}}'
class='{{useCtrol? "ctrol-panel" : "ctrol-panel panel-bottom"}}'
wx-if="{{showHdBtn||showRateBtn||useCtrol}}" bindtap='clickBtnsShow'>
<!-- 倍速按钮 -->
<cover-view class='{{useCtrol ? "ccH5sp btn-bottom" : "ccH5sp"}}' catchtap='clickSpShow' wx-if=
......@@ -49,4 +49,8 @@
<cover-image class='btnBg' src="../../images/{{fullScreen?'ccExitFullBtn':'ccFullBtn'}}.png"></cover-image>
</cover-view>
</cover-view>
<!-- logo -->
<cover-view class="{{'logo pos' + logo.position}}" style="{{logoStyle}}">
<cover-image src='{{logo.url}}' class="logo-img"></cover-image>
</cover-view>
</cover-view>
\ No newline at end of file
......@@ -8,11 +8,8 @@
position: relative;
}
.panel-bottom {
height: calc(100% - 110rpx);
}
.panel-top {
height: calc(100% - 190rpx);
margin-top:50px;
margin-top: 40px;
}
.ccPlayBtn,.ccPauseBtn{
width: 7vmin;
......@@ -146,4 +143,25 @@
}
.list-bottom {
bottom: 160rpx;
}
.logo {
position: absolute;
}
.logo.pos1 {
top: 0px;
left: 0px;
}
.logo.pos2 {
top: 0px;
right: 0px;
}
.logo.pos3 {
left: 0px;
bottom: 0rpx;
margin-bottom: 90rpx;
}
.logo.pos4 {
right: 0px;
bottom: 0rpx;
margin-bottom: 90rpx;
}
\ No newline at end of file
......@@ -7,19 +7,34 @@ Page({
vc: '',
custom_id: '',
fullScreen: false,
useCtrol: true, // 是否使用自定义controls组件 false=>则使用video原生control
useCtrol: true, // 是否使用自定义progress组件 false=>则使用video原生control
banDrag: false, // 是否禁止进度条拖动
time: {},
dfList: [],
spList: [],
ccH5hdTxt: '',
defaultDf: 20,
interShowDownload: true,
poster: '',
tip: '下载',
filePath: wx.env.USER_DATA_PATH // 临时文件路径
filePath: wx.env.USER_DATA_PATH, // 下载临时文件路径
isStartPlay: false, // 是否开播
logoConfig: {
url: '', // logo 地址
opacity: 100, // 透明度 [0-100]
position: 3, // logo位置原始点 1-左上,2-右上, 3-左下, 4-右下
posX: 5, // logo相对于原始点的水平百分比距离
posY: 7, // logo相对于原始点的垂直百分比距离
size: 6 // 显示区域大小(相对于播放器宽高百分比)
}
},
bindPlay: function() {
console.log('index bindPlay')
if(!this.data.isStartPlay) {
this.setData({
isStartPlay: true
})
}
},
bindPause: function() {
console.log('index bindPause')
......@@ -42,11 +57,31 @@ Page({
})
});
ccPlayer.on("getQualityList", (data) => {
let dfIdx = 0;
if(this.data.defaultDf) {
let idx = this.getDfIdx(this.data.defaultDf, data)
dfIdx = idx > -1 ? idx : 0;
}
this.setData({
dfList: data,
ccH5hdTxt: data[0] && data[0].desp || ''
ccH5hdTxt: data[dfIdx] && data[dfIdx].desp || ''
})
});
ccPlayer.on("onSwitchQuality", (data) => {
console.log('onSwitchQuality: ', data)
})
ccPlayer.on("onSwitchRate", (data) => {
console.log('onSwitchRate: ', data)
})
},
getDfIdx(df, copies) {
copies = copies || []
for(let i=0; i < copies.length; i++) {
if(df == copies[i].quality) {
return i
}
}
return -1
},
/***
* 全屏播放
......@@ -67,11 +102,6 @@ Page({
throw new Error('视频全屏出现异常');
}
}
},
bindFullscreenchange: function(e) {
this.setData({
fullScreen: e.detail.fullScreen
})
},
/***
* 下载实现方式1--插件内部按钮实现下载,下载完成后需删除缓存文件
......
......@@ -8,7 +8,6 @@
vc='{{vc}}'
poster="{{poster}}"
custom_id='{{custom_id}}'
bindfullscreenchange="bindFullscreenchange"
bindtimeupdate="bindTimeUpdate"
bindplay="bindPlay"
bindpause="bindPause"
......@@ -20,6 +19,8 @@
binddownloadsucc="downLoadSucc"
interShowDownload="{{interShowDownload}}"
showFullscreenBtn="{{true}}"
defaultDf="{{defaultDf}}"
watchStartTime="{{25}}"
bindabc="abc">
<controls
class="my-class"
......@@ -34,6 +35,9 @@
ccH5hdTxt='{{ccH5hdTxt}}'
dfList="{{dfList}}"
bindintershow="bindInterShow"
progressbar_enable="1"
isStartPlay="{{isStartPlay}}"
logo="{{logoConfig}}"
></controls>
</ccvod>
</view>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment