张桐

音视频功能做完

... ... @@ -1267,8 +1267,20 @@ height: 1080px;
background: url("../images/hangupHover.gif") no-repeat center center;
}
.stuVideo-videoNotClick{
display: none;
position: absolute;
left: 3px;
bottom: -5px;
cursor: pointer;
color: #999;
margin: 0px 5px 0px 5px;
}
.stuVideo-voice{
position: absolute;
left:23px;
bottom: 4px;
... ... @@ -1298,6 +1310,20 @@ height: 1080px;
}
.stuVideo-voiceNotClick{
display: none;
position: absolute;
left:23px;
bottom: 4px;
width: 16px;
height: 16px;
font-size: 16px;
cursor: pointer;
color: #999;
margin: 0px 5px 0px 5px;
}
.teacherVideo {
... ... @@ -1336,6 +1362,19 @@ height: 1080px;
width: 100%;
}
.curUserName{
position: absolute;
left: 47px;
bottom: 5px;
width: auto;
height: 16px;
color: #333333;
font-size: 15px;
}
.teacherVideo-video{
position: absolute;
left: 3px;
... ... @@ -1362,6 +1401,17 @@ height: 1080px;
background: url("../images/hangupHover.gif") no-repeat center center;
}
.teacherVideo-videoNotClick{
display: none;
position: absolute;
left: 3px;
bottom: -5px;
color: #999;
margin: 0px 5px 0px 5px;
}
.teacherVideo-voice{
position: absolute;
... ... @@ -1391,7 +1441,18 @@ height: 1080px;
.teacherVideo-voiceBg:hover{
background: url("../images/hangupHover.gif") no-repeat center center;
}
.teacherVideo-voiceNotClick{
display: none;
position: absolute;
left:23px;
bottom: 4px;
width: 16px;
height: 16px;
font-size: 16px;
color: #999;
margin: 0px 5px 0px 5px;
}
... ...
... ... @@ -16,8 +16,8 @@
<script type="text/javascript" src="js/xdyEvent.js"></script>
<script type="text/javascript" src="js/drag.js"></script>
<!--<script type="text/javascript" src="js/McuClient.js?v=1.0.0303.10"></script>-->
<script type="text/javascript" src="http://192.168.1.140/McuClient/McuClient.js?722898936"></script>
<script type="text/javascript" src="js/McuClient.js?v=1.0.0303.10"></script>
<!--<script type="text/javascript" src="http://192.168.1.140/McuClient/McuClient.js?722898936"></script>-->
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="src/main.js"></script>
... ... @@ -173,7 +173,6 @@
<li><span id="am-dropdown-content-span-1" class="am-dropdown-content-span iconfont">&#xe61d;</span>
<button id="classes-status-1" type="button"
class="am-btn am-btn-primary am-dropdown-content-button"
data-am-modal="{target: '#begin-classes', closeViaDimmer: 0, width: 340, height: 172}"
href="#">开始上课
</button>
</li>
... ... @@ -190,19 +189,6 @@
</ul>
</div>
<!--弹出层-正在上课-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="begin-classes">
<div class="am-modal-dialog">
<p id="p-text" class="p-text">确定开始录制吗?</p>
<div class="am-modal-confirm-cancel">
<button id="confirm" class="confirm" data-am-modal-close>确定</button>
<button class="cancel" data-am-modal-close>取消</button>
</div>
</div>
</div>
<!--弹出层-结束课堂-->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="end-classes">
... ... @@ -388,10 +374,15 @@
<div id="stuPlay"></div>
</div>
<img class="stuVideoBg"/>
<div id="stuVideo-video" class="stuVideo-video iconfont">&#xe62e;</div>
<div id="stuVideo-video" class="stuVideo-video iconfont" title="发起学生视频">&#xe62e;</div>
<div id="stuVideo-videoBg" class="stuVideo-videoBg iconfont"></div>
<div id="stuVideo-voice" class="stuVideo-voice iconfont">&#xe62d;</div>
<div id="stuVideo-videoNotClick" class="stuVideo-videoNotClick iconfont" title="当前不能点击">&#xe62e;</div>
<div id="stuVideo-voice" class="stuVideo-voice iconfont" title="发起学生音频">&#xe62d;</div>
<div id="stuVideo-voiceBg" class="stuVideo-voiceBg iconfont"></div>
<div id="stuVideo-voiceNotClick" class="stuVideo-voiceNotClick iconfont" title="当前不能点击">&#xe62d;</div>
<!--<span>lucy</span>-->
</div>
<div class="teacherVideo">
... ... @@ -403,10 +394,14 @@
</div>
<img class="teacherVideoBg"/>
<img class="teacherVoicing"/>
<div id="teacherVideo-video" class="teacherVideo-video iconfont">&#xe62e;</div>
<div class="curUserName"></div>
<div id="teacherVideo-video" class="teacherVideo-video iconfont" title="发起视频">&#xe62e;</div>
<div id="teacherVideo-videoBg" class="teacherVideo-videoBg iconfont"></div>
<div id="teacherVideo-voice" class="teacherVideo-voice iconfont">&#xe62d;</div>
<div id="teacherVideo-videoNotClick" class="teacherVideo-videoNotClick iconfont" title="当前不能点击">&#xe62e;</div>
<div id="teacherVideo-voice" class="teacherVideo-voice iconfont" title="发起音频">&#xe62d;</div>
<div id="teacherVideo-voiceBg" class="teacherVideo-voiceBg iconfont"></div>
<div id="teacherVideo-voiceNotClick" class="teacherVideo-voiceNotClick iconfont" title="当前不能点击">&#xe62d;</div>
</div>
... ... @@ -842,54 +837,54 @@
var classesStatus2 = document.getElementById('classes-status-2');
var amDrospanIcon = document.getElementById('am-dropdown-content-span-1');
confirm.onclick = function changeStatus() {
if (flag == '0') {
flag++;
console.log(flag);
spaniconfont.innerHTML = '&#xe609;';
classnow.innerHTML = '直播中';
aStatus.innerHTML = '直播中';
aStatus.style.color = '#d95136';
ptext.innerHTML = '确定暂停录制吗'
noStart.style.display = 'none';
oLive.style.display = 'block';
amDrospanIcon.innerHTML = "&#xe60a;";
classesStatus1.innerHTML = '课间休息';
console.log(classesStatus1.innerHTML);
classesStatus2.innerHTML = '结束课堂';
console.log(classesStatus2.innerHTML);
}
else if (flag == '1') {
console.log(flag);
ptext.innerHTML = '确定继续上课吗'
spaniconfont.innerHTML = '&#xe60a;';
classnow.innerHTML = '休息';
aStatus.innerHTML = '休息';
aStatus.style.color = '#333333';
noStart.style.display = 'block';
oLive.style.display = 'none';
amDrospanIcon.innerHTML = "&#xe61d;";
classesStatus1.innerHTML = '继续上课';
console.log(classesStatus1.innerHTML);
classesStatus2.innerHTML = '结束课堂';
console.log(classesStatus2.innerHTML);
flag--;
}
}
end.onclick = function endStatus() {
spaniconfont.innerHTML = '&#xe609;';
classnow.innerHTML = '结束';
aStatus.innerHTML = '结束';
oLive.style.display = 'none';
spaniconfont.innerHTML = '&#xe607;';
noStart.innerHTML = "&#xe62b;";
noStart.style.display = 'block';
aStatus.style.color = '#333333';
}
// confirm.onclick = function changeStatus() {
// if (flag == '0') {
// flag++;
// console.log(flag);
// spaniconfont.innerHTML = '&#xe609;';
// classnow.innerHTML = '直播中';
// aStatus.innerHTML = '直播中';
// aStatus.style.color = '#d95136';
// ptext.innerHTML = '确定暂停录制吗'
// noStart.style.display = 'none';
// oLive.style.display = 'block';
// amDrospanIcon.innerHTML = "&#xe60a;";
// classesStatus1.innerHTML = '课间休息';
// console.log(classesStatus1.innerHTML);
// classesStatus2.innerHTML = '结束课堂';
// console.log(classesStatus2.innerHTML);
//
//
// }
// else if (flag == '1') {
// console.log(flag);
// ptext.innerHTML = '确定继续上课吗'
// spaniconfont.innerHTML = '&#xe60a;';
// classnow.innerHTML = '休息';
// aStatus.innerHTML = '休息';
// aStatus.style.color = '#333333';
// noStart.style.display = 'block';
// oLive.style.display = 'none';
// amDrospanIcon.innerHTML = "&#xe61d;";
// classesStatus1.innerHTML = '继续上课';
// console.log(classesStatus1.innerHTML);
// classesStatus2.innerHTML = '结束课堂';
// console.log(classesStatus2.innerHTML);
// flag--;
// }
//
//
// }
// end.onclick = function endStatus() {
// spaniconfont.innerHTML = '&#xe609;';
// classnow.innerHTML = '结束';
// aStatus.innerHTML = '结束';
// oLive.style.display = 'none';
// spaniconfont.innerHTML = '&#xe607;';
// noStart.innerHTML = "&#xe62b;";
// noStart.style.display = 'block';
// aStatus.style.color = '#333333';
// }
</script>
... ...
... ... @@ -78,11 +78,14 @@ function listenClass() {
// // //点击开始上课
//
// $("#classes-status-1").click(function (e){
//
// if($("#classes-status-1").html()=="开始上课"){
// $("#classes-status-1").click(function (e){
// client.sendStartClass();
// });
// client.sendStartClass();
// }
//
// });
// if($("#classes-status-1").html()=="课间休息"){
// $("#classes-status-1").click(function (e){
// client.sendPauseClass();
... ...
... ... @@ -42,6 +42,8 @@ $(function () {
//学生视频按钮点击
$("#stuVideo-video").click(function (e) {
console.log("stuVideo-video点击");
$(".stuVideo-voiceNotClick").css("display","block");
$(".stuVideo-voice").css("display","none");
if (classAllInfo.userRole=="host"){
$(".stuVideoBg").css("display","none");
... ... @@ -63,6 +65,8 @@ $(function () {
//学生视频关闭按钮点击
$("#stuVideo-videoBg").click(function (e) {
$(".stuVideo-voiceNotClick").css("display","none");
$(".stuVideo-voice").css("display","block");
var paramInfo={
"actionType":2,
... ... @@ -80,8 +84,9 @@ $(function () {
//学生音频按钮点击
$("#stuVideo-voice").click(function (e) {
console.log("stuVideo-voice点击");
$(".stuVideo-videoNotClick").css("display","block");
$(".stuVideo-video").css("display","none");
if (classAllInfo.userRole=="host"){
$(".stuVideoBg").css("display","none");
... ... @@ -107,6 +112,8 @@ $(function () {
});
//学生音频关闭按钮点击
$("#stuVideo-voiceBg").click(function(e){
$(".stuVideo-videoNotClick").css("display","none");
$(".stuVideo-video").css("display","block");
var paramInfo={
"actionType":2,
"toNodeId":stuNodeId,
... ... @@ -118,24 +125,14 @@ $(function () {
$("#stuVideo-voiceBg").css("display","none");
}
// if (classAllInfo.userRole=="normal"){
// $(".stuVideo-voice").css("display","none");
// $(".stuVideo-video").css("display","none");
// }
});
//老师视频按钮点击
$("#teacherVideo-video").click(function (e) {
console.log("teacherVideo-video点击");
$(".teacherVideo-voice").css("color","#cccccc");
// $(".teacherVideo-voice").unbind("click");//音频按钮不可点
// var teaVoiceDisplay= $(".teacherVideo-voiceBg").css("display");
// if(teaVoiceDisplay=="block"){
// $("#teacherVideo-voiceBg").trigger("click");
// }
$(".teacherVideo-voice").css("display","none");
$(".teacherVideo-voiceNotClick").css("display","block");
if (classAllInfo.userRole=="host"){
$(".teacherVideo-videoBg").css("display","block");
$(".teacherVideo-video").css("display","none");
... ... @@ -143,7 +140,6 @@ $(function () {
$("#teacherVideo-voice").addClass("teacherVideo-voice");
$("#teacherVideo-voice").removeClass("teacherVideo-voiceBg");
$(".teacherVideoBg").css("display","none");
// $(".teacherVideo").css("background", "#CCCCCC");
$(".teacherVideo-voice").css("bottom","4px");
$(".teacherVoicing").css("display","none");
... ... @@ -156,7 +152,8 @@ $(function () {
//老师视频关闭按钮点击
$("#teacherVideo-videoBg").click(function (e) {
$(".teacherVideo-voice").css("color","#333333");
$(".teacherVideo-voice").css("display","block");
$(".teacherVideo-voiceNotClick").css("display","none");
if(window.publishflash) {
const stopInfo = JSON.stringify({
type: 5,
... ... @@ -190,10 +187,8 @@ $(function () {
//老师音频按钮点击
$("#teacherVideo-voice").click(function (e) {
console.log("teacherVideo-voice点击");
// var teaVideoDisplay= $(".teacherVideo-videoBg").css("display");
// if(teaVideoDisplay=="block"){
//
// }
$(".teacherVideo-video").css("display","none");
$(".teacherVideo-videoNotClick").css("display","block");
if (classAllInfo.userRole=="host"){
$(".publish").css({"width":"240px","height":"180px"});
... ... @@ -203,6 +198,7 @@ $(function () {
$(".teacherVideoBg").css("display","none");
}
// /获取老师只推音频地址
achieveTeaAudioStream();
... ... @@ -211,6 +207,8 @@ $(function () {
$("#teacherVideo-voiceBg").click(function (e) {
console.log("teacherVideo-voice点击");
$(".teacherVideo-video").css("display","block");
$(".teacherVideo-videoNotClick").css("display","none");
if (classAllInfo.userRole=="host"){
$(".publish").css({"width":"1px","height":"1px"});
... ... @@ -237,21 +235,6 @@ $(function () {
});
//老师音频点击事件
function teaAudioClick(){
console.log("teacherVideo-voice点击");
if (classAllInfo.userRole=="host"){
$(".publish").css({"width":"240px","height":"180px"});
$(".play").css({"width":"1px","height":"1px"});
$("#teacherVideo-voice").css("display","none");
$("#teacherVideo-voiceBg").css("display","block");
$(".teacherVideoBg").css("display","none");
}
// /获取老师只推音频地址
achieveTeaAudioStream();
}
//监听学生视频更新
... ... @@ -359,7 +342,7 @@ function userListUpdate(callbackData) {
console.log("人员进入",callbackData);
if (classAllInfo.nodeId==callbackData.nodeId){
$(".curUserName").html(callbackData.nodeData.name);
}else{
console.log("callbackData.nodeId================>",callbackData.nodeId)
stuNodeId=callbackData.nodeId;
... ... @@ -786,7 +769,7 @@ function achieveTeaAudioStream() {
console.log(' [publish] native 2 js', msg);
var _msg=JSON.parse(msg);
console.log("_msg===========>",_msg);
if(_msg.data.result == 0){
if((_msg.data.result == 0)&&(_msg.data.type == 10)){
//将之前底层取的推流结果传递给底层
var _successErrorResult= client.publishAudio(pushTeaAudioResult);
console.log("_successErrorResult======>",_successErrorResult)
... ... @@ -797,7 +780,11 @@ function achieveTeaAudioStream() {
console.log("底层广播推流失败,关闭推流");
}
}else {
} else if((_msg.data.result == 0)&&(_msg.data.type == 5)){
console.log("5,flash把推老师音频流关闭");
}
else {
console.error('publish error');
}
}
... ... @@ -814,7 +801,7 @@ function achieveTeaAudioStream() {
}
//推老师音频 js2native
//推老师音频 js2native
function publishTeaAudioURL(rtmpURL) {
const msg = JSON.stringify({
type: 10,
... ... @@ -828,7 +815,7 @@ function publishTeaAudioURL(rtmpURL) {
console.log(publishflashAudio._js2native(msg));
}
//获取老师推流音视频地址
//获取老师推音视频流地址
function achieveTeaVideoStream(){
$(".publish").css({"width":"240px","height":"180px"});
$(".play").css({"width":"1px","height":"1px"});
... ... @@ -858,7 +845,8 @@ function achieveTeaVideoStream(){
console.log(' [publish] native 2 js', msg);
var _msg=JSON.parse(msg);
console.log("_msg===========>",_msg);
if(_msg.data.result == 0){
if((_msg.data.result == 0)&&(_msg.data.type == 10)){
//将之前底层取的推流结果传递给底层
console.log("之前的推流结果",pushTeaResult);
var _successErrorResult= client.publishVideo(pushTeaResult);
... ... @@ -869,7 +857,11 @@ function achieveTeaVideoStream(){
console.log("底层广播推流失败,关闭推流");
}
}else {
}
else if ((_msg.data.result == 0)&&(_msg.data.type == 5)){
console.log("5,flash把老师的推音视频流关闭");
}
else {
console.error('publish error');
}
}
... ... @@ -901,7 +893,7 @@ function publishURL(rtmpURL) {
//获取播放音频地址
//获取老师播放音频流地址
function achievePlayAudioStream(_pubResultObj){
console.log("_pubResultObj==========>",_pubResultObj)
... ... @@ -916,6 +908,7 @@ function achievePlayAudioStream(_pubResultObj){
var streamInfo=client.getAudioPlayPath(_paramInfo);
console.log("result是=============>",streamInfo);
$(".play").css({"width":"240px","height":"180px"});
$(".publish").css({"width":"1px","height":"1px"});
$(".teacherVideoBg").css("display","none");
... ... @@ -937,15 +930,25 @@ function achievePlayAudioStream(_pubResultObj){
playAudioURL(streamInfo.playUrl);
},
function (msg) {
console.log(' [play] native 2 js', msg);
console.log(' [playAudio] native 2 js', msg);
var _msg=JSON.parse(msg);
console.log("playAudio_msg===========>",_msg);
if((_msg.data.result == 0)&&(_msg.data.type == 2)){
console.log("2,老师播音频流");
}
else if ((_msg.data.result == 0)&&(_msg.data.type == 5)){
console.log("5,flash把老师的播音频流关闭");
}
else {
console.error('playAudio error');
}
}
)
}
else {
playAudioURL(streamInfo.playUrl);
}
}
function playAudioURL(rtmpURL){
... ... @@ -960,7 +963,7 @@ function playAudioURL(rtmpURL){
console.log(playflashAudio._js2native(msg));
}
//获取老师音视频播流地址
//获取老师播音视频流地址
function achievePlayStream(_pubResultObj){
console.log("_pubResultObj==========>",_pubResultObj)
var _paramInfo={
... ... @@ -974,6 +977,7 @@ function playAudioURL(rtmpURL){
var streamInfo=client.getVideoPlayPath(_paramInfo);
console.log("result是=============>",streamInfo);
$(".play").css({"width":"240px","height":"180px"});
$(".publish").css({"width":"1px","height":"1px"});
$(".teacherVideoBg").css("display","none");
$(".teacherVideo-voice").css("bottom","4px");
... ... @@ -993,6 +997,20 @@ function playAudioURL(rtmpURL){
},
function (msg) {
console.log(' [play] native 2 js', msg);
var _msg=JSON.parse(msg);
console.log("play_msg===========>",_msg);
if((_msg.data.result == 0)&&(_msg.data.type == 2)){
console.log("老师播流成功");
}
else if ((_msg.data.result == 0)&&(_msg.data.type == 5)){
console.log("5,flash把老师的播音视频流关闭");
}
else {
console.error('play error');
}
}
)
}
... ...