第75篇一对多之合并开关声音按钮及获取当前按钮id及一个按钮控制两个函数
关键词：合并开关声音按钮,获取当前按钮id,一个按钮控制两个函数
一、合并开关声音按钮
1.1 测试平台--本地服务器运行平台
老师端：带老师名字
https://localhost:9101/demos/index.html?roomid=888&t=600&&teaNameMobile=莫言
学生一：
https://localhost:9101/demos/student.html?studentId=1001&stuNameMobile=张三丰&t=600#888
学生二：带学生中文名字
https://localhost:9101/demos/student.html?studentId=1002&stuNameMobile=白子画&t=600#888
学生三：带学生英文名字
https://localhost:9101/demos/student.html?studentId=1003&stuNameMobile=司马南&t=600#888
1.1 测试平台--本地服务器运行平台
老师端：带老师名字
https://123.57.206.36:9101/demos/index.html?roomid=888&t=600&&teaNameMobile=莫言
学生一：
https://123.57.206.36:9101/demos/student.html?studentId=1001&stuNameMobile=张三丰&t=600#888
学生二：带学生中文名字
https://123.57.206.36:9101/demos/student.html?studentId=1002&stuNameMobile=白子画&t=600#888
学生三：带学生英文名字
https://123.57.206.36:9101/demos/student.html?studentId=1003&stuNameMobile=司马南&t=600#888
1.2 合并开声音关声音按钮
1)追加控制面版（私有白板+声音）
描述：之前追加时，点击之后删除，现在追加之后，3秒后自动隐藏，而不是删除。
代码如下：
//点击视频，获取id，并追加个小div进去----拉私有白板+控制音视频按钮
mediaBox.οnclick= function(){
studentVideoId= mediaElementContainer.id;
if($("#"+studentVideoId+"stu").length<= 0){
$("#"+studentVideoId).append("
}
document.getElementById(studentVideoId+'stu').style.display='block';
setTimeout("document.getElementById('"+studentVideoId+"stu').style.display='none'",3000);
}
注：优化了两点，一是追加后不再删除，而是3秒后隐藏。
二是防止用户多次连续单击，加了一个if控制语句，如果要追加的div已经存在，就不再二次追加。
2）在开声音里面加入关声音的代码
声音控制实现了，具体如下：
a.)单击单个学生视频时，追加两个按钮（私有白板+声音控制）
//点击视频，获取id，并追加个小div进去----拉私有白板+控制音视频按钮
mediaBox.onclick = function(){
stuIdVA =mediaElementContainer.id;
if($("#"+stuIdVA+"stu").length <= 0){
$("#"+stuIdVA).append("
+"stu'class='PriWB_controlVideoAudioDiv'>");
}
document.getElementById(stuIdVA+'stu').style.display='block';
setTimeout("document.getElementById('"+stuIdVA+"stu').style.display='none'",5000);
}
注：里面的私有白板函数没有大改，改了控制声音视频函数，用按钮值的改变来控制不同函数的调用。
b.) getPriWB(stuIdVA)函数如下：
//拉学生白板-------------------------------------------------------3.1
function getPriWB(stuIdVA) {
connection.send({
stuIdVAPri:stuIdVA,
stopTimer:true
});
document.getElementById(stuIdVA+'stu').style.display='none';
}
c.) ctrlSgVA(stuIdVA)函数如下：
//控制某个学生的音视频---------------------------------------------3.2
function ctrlSgVA(stuIdVA) {
//var valVA= $("#"+event.target.id).text();
var valVA =$("#ctrl"+stuIdVA).text();
if(valVA =='关声音'){
closeSgVA(stuIdVA);
$("#ctrl"+stuIdVA).text("开声音");
}else{
openSgVA(stuIdVA);
$("#ctrl"+stuIdVA).text("关声音");
}
document.getElementById(stuIdVA+'stu').style.display='none';
}
注：其实一个按钮变来变去，想通了，很容易实现，下午时，一直纠结怎么获取当前按钮的值（目前找到两种方法：var valVA = $("#"+event.target.id).text();和var valVA =$("#ctrl"+stuIdVA).text();），以及怎么实现一个按钮控制两个函数，其实只要找到一个改变的值对其进行限定即可。
注：当按钮的值为关声音时，调用closeSgVA(stuIdVA);
当按钮的值为开声音时，调用openSgVA(stuIdVA);
d.)关声音及开声音函数分别如下：
//关闭单个学生的音视频----------------------------------------------3.2.1
function closeSgVA(stuIdVA) {
connection.send({
action:"silent",
uid:stuIdVA
});
}
//打开单个学生的音视频----------------------------------------------3.2.2
function openSgVA(stuIdVA) {
connection.send({
action:"unsilent",
uid:stuIdVA
});
}
e.)关闭声音时，修改了学生端的函数，如下：
//禁音
if(event.data.action =="silent"){
//console.log('event.data.uid--->',event.data.uid);
//全员禁音
if(event.data.uid =="all"){
//console.log('eeeeeeeeeeeeeee');
connection.removeStream(connection.localMediaStreamId);
return;
}
//单个禁音
if(event.data.uid ==connection.localMediaStreamId){
connection.removeStream(connection.localMediaStreamId);
return;
}
return;
}
注：单个禁音，就只关闭他一个人的声音和视频，不对其他人做任何操作。
f.)开声音时，也做了修改，如下：
//开声音
if(event.data.action =="unsilent"){
if(event.data.uid =="all" ){//全员通话
connection.renegotiate();
return;
}
if(event.data.uid ==connection.localMediaStreamId){//单个通话
connection.renegotiate(connection.sessionid);
//单独辅导作业时，要辅导的学生切换到共享白板
toSharedWB();
return;
}
return;
}
注：老师开启某个学生的声音时，只开启他一个人的声音，也不对别的学生做任何操作。
2017年3月16日星期四
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！