第64篇一对多之学生端修改私有白板并保存(三)及私有白板传到老师端
来源:互联网 发布:牛人的工作效率 知乎 编辑:程序博客网 时间:2024/05/08 03:18
关键词:学生端修改私有白板并保存,私有白板传到老师端
一、私有白板向老师端传图片数据
1.1 本地服务器运行平台
老师端:https://localhost:9101/demos/index.html?roomid=888&t=600
学生一:
https://localhost:9101/demos/student.html?studentId=1001&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1479740395ZMJkiF.jpg&t=600#888
学生二:
https://localhost:9101/demos/student.html?studentId=1002&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480494624FDjMGetutor.png&t=600#888
学生三:
https://localhost:9101/demos/student.html?studentId=1003&userAvatar=http://123.57.206.36:8003/uploadfiles/2016/11/1480475198N2F0kntutor.png&t=600#888
1.2 学生端保存共享白板
1)描述
现在学生端需要一个保存按钮,用于保存共享白板上的某一张,追加到其私有白板上,供学生以后查看。
2)去掉了----------student.html
新建白板去掉了(准确来说是隐藏了),并且把所有的_qhzp改成了PWBS(私有白板学生),并且把globelIdPWBS = this.id.substr(19);改为了globelIdPWBS =this.id.substr(18);因为_qhzp长度为5,PWBS长度为4。
3)saveSharetoPri()----------student.html
保存做好了,代码如下:
//保存共享白板到学生的私有白板
functionsaveSharetoPri(){
varimgIdPWBS = $("#picWrapPWBS .picContentPWBS").children().length-1;
designer.saveImg('image/png',imgIdPWBS, function(dataURLPWBS, imgIdPWBS) {
var page_index_divPWBS = imgIdPWBS+ 1;
var imgContentPWBS = ' <span class="img_divPWBStea_base64_selectPWBS"><img id= "arr_base64_imgPWBS' + imgIdPWBS + '"name="thumbnailPWBS" class="tea_base64PWBS " src='+dataURLPWBS +'><span class="page_index_divPWBS">' +page_index_divPWBS + '</span> </span>';
$(imgContentPWBS).appendTo($("#picWrapPWBS .picContentPWBS"));
});
}
4)建个数组,使学生端老板老师能查到
分析:学生保存老师的共享白板,也要传到老师那里去。
代码实现了,如下:
a.)新建一个数组如下:
vardataURLSPriTShaArr = new Array();
b.)学生私有白板数据压到数组里去
dataURLSPriTShaArr.push(dataURLPWBS);//追加私有白板到数组中传到老师那边去
c.)学生端共享白板数据压到数组里去
dataURLSPriTShaArr.push(dataURLPWBS);//追加共享白板到数组中传到老师那边去
d.)发到老师端如下:
if (event.data.askStudentId == studentId) {
connection.send({
studentPri: true,
studentId:studentId,
stuPriDataURLArr:dataURLSPriTShaArr
});
}
e.)老师端接收如下:
//获取指定学生私有白板图片数组并展示
if (event.data.studentPri){
//把收到的私有白板数组展示出来,供老师查看
stuPriUrlIdArray =event.data.stuPriDataURLArr;
if(isArray(stuPriUrlIdArray) && stuPriUrlIdArray.length){
$('#picContentStuPri').html("");
for (var i = 0; i <stuPriUrlIdArray.length; i++) {
if(isArray(stuPriUrlIdArray)){
dataURL_Pri =stuPriUrlIdArray[i];
varj = i+1;
varpageIndexPri = i + 1;
varimgContentPri = ' <span class="img_divStuPritea_base64_selectStuPri"><img id= "arr_base64_imgStuPri' + j + '"src = "'+dataURL_Pri+'" name="thumbnailStuPri" class="tea_base64StuPri"><span class="page_index_divStuPri">' + pageIndexPri +'</span> </span>';
$(imgContentPri).appendTo($("#picWrapStuPriPic.picContentStuPri"));
$(".tea_base64StuPri").off("click");
$(".tea_base64StuPri").on("click",onImgClickPrivate);
}
}
}
return;
}
5)现在有个新问题
就是老师端和学生端显示的私有白板不一样,具体如下:
老师端和学生端第4张和第5张反了,如下:
这个问题再议!
2017年3月5日星期日
- 第64篇一对多之学生端修改私有白板并保存(三)及私有白板传到老师端
- 第62篇一对多之学生端修改私有白板并保存及array_shift
- 第63篇一对多之学生端修改私有白板并保存(二)
- 第60篇一对多之学生端私有白板图片保存及学生传数组过去不再单张传周三
- 第61篇一对多之老师端私有白板点击上共享白板及老师端学生私有白板加载多次及点头像出私有白板列表周四
- 第57篇一对多实现之私有白板向老师端传图片数据(四)新建一个iframe及成功获取私有白板数据 周日
- 第55篇一对多实现之私有白板向老师端传图片数据(二)及array_reduce
- 第56篇一对多实现之私有白板向老师端传图片数据(三)仿制传图片dataURL及array_replace及array_replace_recursive
- 第58篇老师端私有白板展示(一)老师端详细建私有白板及PHP array_reverse 周一
- 第70篇一对多之addImgByUrl优化及学生端实时传输白板到老师端及头像下面添加姓名
- 第59篇老师端私有白板展示(二)老师端私有白板列表显示及列表图片上传到白板 周二
- 第72篇一对多之优化实时共享私有白板最后一页(三)两个学生相互刷新解决及追加div传参数周一
- 第71篇一对多之优化实时共享私有白板最后一页(二)添加了一个老师辅导按钮
- 第67篇一对多之头像与视频合成(二)私有白板在视频上拉取成功
- 第53篇一对多实现之学生白板传图片到服务器(三)及array_pad
- 第47篇一对多实现(四)学生端向老师端传id及头像及php键值函数
- 第7篇白板之图片旋转标记做成箭头(三)及quadraticCurveTo
- 第73篇一对多之两个学生相互刷新解决(二)重写最后一张白板的刷新及array_udiff_assoc及array_udiff_uassoc
- Java反射机制总结学习--通过反射机制了解泛型本质
- 和我一起学 Selenium WebDriver(5)——基础篇
- Softmax Regression
- spss、R语言、Python数据分析系列(2)---spss读取数据
- 深入理解Hadoop集群和网络
- 第64篇一对多之学生端修改私有白板并保存(三)及私有白板传到老师端
- Docker适合应用于生产环境了吗?
- 在play framework 1.x中,自定义cron执行实现
- Hadoop生态系统
- java中wait()、notify()以及notifyAll()的使用
- 和我一起学 Selenium WebDriver(6)——基础篇
- @Controller和@RestController的区别
- FineUIMvc随笔_0
- java--Calender类