Commit c7c87ca1 authored by liujiangnan's avatar liujiangnan

feat: 趣配音播放视频

parent 458a7926
...@@ -2,7 +2,7 @@ import { ...@@ -2,7 +2,7 @@ import {
asyncDelay, asyncDelay,
onHomeworkFinish, onHomeworkFinish,
asyncCallNetworkApiGet, asyncCallNetworkApiGet,
asyncCallNetworkApiPost asyncCallNetworkApiPost,
} from "../script/util"; } from "../script/util";
import { MyCocosSceneComponent } from "../script/MyCocosSceneComponent"; import { MyCocosSceneComponent } from "../script/MyCocosSceneComponent";
...@@ -41,7 +41,7 @@ export default class SceneComponent extends MyCocosSceneComponent { ...@@ -41,7 +41,7 @@ export default class SceneComponent extends MyCocosSceneComponent {
initData() { initData() {
const middleLayer = cc.find('middleLayer'); const middleLayer = cc.find('middleLayer');
if (!middleLayer) { if (!middleLayer) {
cc.sys.localStorage.setItem('token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6NCwicGhvbmUiOiIxNTUwMDAwMDAwMSIsInNpZ24iOiI3MjhlYzkwZC1kZmIyLTQxMzktOWMyMS0yNGQwZjg4NDYwMmUiLCJpYXQiOjE2NTU3MDY4MjUsImV4cCI6MTY1ODI5ODgyNX0.Rkhjn9MJxXAOoHnjBzjdCcLBtE-87ps5790SIdYQrZE'); cc.sys.localStorage.setItem('token', 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6NCwicGhvbmUiOiIxNTUwMDAwMDAwMSIsInNpZ24iOiJjZTRlMDk1Yi1mNTVkLTQyNGUtYWQyMC0yN2UxNjc2ZTcyZDQiLCJpYXQiOjE2NTU3MjgyNDQsImV4cCI6MTY1ODMyMDI0NH0.JFVw7Ip-qzDlMU2qp7iMaOuuIT-NkWxRndZog3CAU1s');
} }
this.token = cc.sys.localStorage.getItem("token"); this.token = cc.sys.localStorage.getItem("token");
} }
...@@ -270,10 +270,12 @@ export default class SceneComponent extends MyCocosSceneComponent { ...@@ -270,10 +270,12 @@ export default class SceneComponent extends MyCocosSceneComponent {
cc.find(`Canvas/usercenter/view/content/scollpage/bg`).height = Math.abs(bottomItem.y) + 400; cc.find(`Canvas/usercenter/view/content/scollpage/bg`).height = Math.abs(bottomItem.y) + 400;
} }
// update (dt) {}
initListener() { initListener() {
} }
update (dt) {
}
} }
...@@ -332,13 +332,22 @@ export default class NewClass extends cc.Component { ...@@ -332,13 +332,22 @@ export default class NewClass extends cc.Component {
cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult/itembg/tips_bg/row`).active = false; cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult/itembg/tips_bg/row`).active = false;
} }
if (OP_06_3) {
const rowData = JSON.parse(OP_06_3);
cc.find(`Canvas/videoContainer`).attr({rowData});
// TODO 星星算法和评语
cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult/itembg/pyx`).active = true;
} else {
cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult/itembg/pyx`).active = false;
}
// 设置页面高度 // 设置页面高度
this.scheduleOnce(() => { setTimeout(() => {
const learnresult = cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult`); const learnresult = cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage/learnresult`);
const pageHight = cc.find(`itembg`, learnresult).height + Math.abs(learnresult.y); const pageHight = cc.find(`itembg`, learnresult).height + Math.abs(learnresult.y);
cc.find(`Canvas/reportdetail/view/content`).height = pageHight + 100; cc.find(`Canvas/reportdetail/view/content`).height = pageHight + 100;
cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage`).height = pageHight + 100; cc.find(`Canvas/reportdetail/view/content/userdetail_scollpage`).height = pageHight + 100;
}, 0); }, 1000);
} }
...@@ -396,4 +405,12 @@ export default class NewClass extends cc.Component { ...@@ -396,4 +405,12 @@ export default class NewClass extends cc.Component {
cc.find("Canvas/reportdetail").active = false; cc.find("Canvas/reportdetail").active = false;
} }
// 播放趣配音视频
async onClickToPlayVideo() {
cc.find(`Canvas/videoContainer`).active = true;
cc.find(`Canvas/bg`).opacity = 0;
cc.find("Canvas/reportdetail").opacity = 0;
}
} }
...@@ -483,3 +483,71 @@ export function callNetworkApiGet(uri, data, callBack) { ...@@ -483,3 +483,71 @@ export function callNetworkApiGet(uri, data, callBack) {
xhr.open('GET', url, true); xhr.open('GET', url, true);
xhr.send(); xhr.send();
} }
function httpHeadCall(requsetUrl, callback) {
let xhr = new XMLHttpRequest();
console.log("Status: Send Post Request to " + requsetUrl);
try {
xhr.onreadystatechange = () => {
try {
console.log('xhr.readyState: ', xhr.readyState);
if (xhr.readyState == 4) {
if ((xhr.status >= 200 && xhr.status < 400)) {
callback(true);
} else {
callback(false);
}
}
} catch (e) {
console.log(e)
}
};
xhr.open("HEAD", requsetUrl, true);
xhr.send();
xhr.timeout = 15000;
xhr.onerror = (e) => {
console.log("汪汪汪 posterror", e);
callback(false);
};
xhr.ontimeout = (e) => {
console.log("汪汪汪 ontimeout", e);
callback(false);
};
} catch (e) {
console.log("Send Get Request error: ", e)
}
};
export function getVideoUrl(video_url, callback) {
const url1 = video_url;
const url2 = url1.replace(/.mp4$/g, "_l.mp4");
httpHeadCall(url2, (success) => {
if (success) {
console.log('return url2: ', url2);
callback(url2);
} else {
console.log('return url1: ', url1);
callback(url1);
}
})
};
export function buttonOnClick(button: cc.Node, callback: Function, scale = 1.0) {
button.addComponent(cc.Button);
button.on('click', () => {
if (button['cantClick']) {
return;
}
button['cantClick'] = true;
cc.tween(button)
.to(0.1, { scale: scale * 1.1 })
.to(0.1, { scale: scale })
.call(() => {
button['cantClick'] = false;
callback && callback();
})
.start();
});
}
import {
getVideoUrl, buttonOnClick,
} from "../script/util";
import { MyCocosSceneComponent } from "./MyCocosSceneComponent";
const {ccclass, property} = cc._decorator;
@ccclass
export default class NewClass extends MyCocosSceneComponent {
@property(cc.Node)
dot: cc.Node = null;
@property(cc.Node)
processBg: cc.Node = null;
@property(cc.Node)
process: cc.Node = null;
@property(cc.Node)
playBtn: cc.Node = null;
@property(cc.VideoPlayer)
videoplayer: cc.VideoPlayer = null;
dotX = null;
processX = null;
onLoad () {
this.dotX = this.dot.x;
this.processX = this.process.x;
this.initListener();
}
rowData = null;
start () {
}
onEnable () {
// this.videoplayer.remoteURL = "";
this.rowData = this.node["rowData"];
this.dot.x = this.dotX;
this.process.width = 0;
getVideoUrl(this.rowData.video_url, (url) => {
this.videoplayer.remoteURL = url+`?t=${Date.now()}`;
})
}
updateVideoStrip() {
if (!this.videoplayer?.isPlaying()) {
return;
}
let percent;
const duration = this.videoplayer.getDuration();
if (!duration) {
percent = 0;
} else {
percent = this.videoplayer.currentTime / duration;
}
this.setProgress(percent);
}
setProgress(progress) {
setTimeout(() => {
const w = this.processBg.width * progress;
this.process.width = w;
this.dot.x = this.dotX + w -5;
}, 1);
}
closeVideo() {
this.videoplayer.stop();
this.dot.x = this.dotX;
this.process.width = 0;
cc.find(`Canvas/videoContainer`).active = false;
cc.find(`Canvas/bg`).opacity = 255;
cc.find("Canvas/reportdetail").opacity = 255;
}
initListener() {
const back = cc.find(`Canvas/videoContainer/back`);
buttonOnClick(back, () => {
this.closeVideo();
}, 0.5);
buttonOnClick(this.playBtn, () => {
this.videoplayer.play();
});
this.videoplayer.node.on('clicked', () => {
if (this.videoplayer.isPlaying()) {
this.videoplayer.pause();
this.playBtn.active = true;
}
});
this.videoplayer.node.on('ready-to-play', () => {
this.videoplayer.play();
});
this.videoplayer.node.on('playing', (evt) => {
this.playBtn.active = false;
});
this.videoplayer.node.on('completed', (evt) => {
this.closeVideo();
});
}
update (dt) {
this.updateVideoStrip();
}
}
{
"ver": "1.0.8",
"uuid": "21524a61-0153-43e6-9163-8ed85e8cdb95",
"isPlugin": false,
"loadPluginInWeb": true,
"loadPluginInNative": true,
"loadPluginInEditor": false,
"subMetas": {}
}
\ No newline at end of file
...@@ -26,10 +26,10 @@ ...@@ -26,10 +26,10 @@
"height": 298, "height": 298,
"rawWidth": 512, "rawWidth": 512,
"rawHeight": 298, "rawHeight": 298,
"borderTop": 0, "borderTop": 25,
"borderBottom": 0, "borderBottom": 25,
"borderLeft": 0, "borderLeft": 25,
"borderRight": 0, "borderRight": 25,
"subMetas": {} "subMetas": {}
} }
} }
......
...@@ -26,10 +26,10 @@ ...@@ -26,10 +26,10 @@
"height": 280, "height": 280,
"rawWidth": 494, "rawWidth": 494,
"rawHeight": 280, "rawHeight": 280,
"borderTop": 0, "borderTop": 25,
"borderBottom": 0, "borderBottom": 25,
"borderLeft": 0, "borderLeft": 25,
"borderRight": 0, "borderRight": 25,
"subMetas": {} "subMetas": {}
} }
} }
......
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