SignApe.js
9.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
//*
// 点名卡模块
// */
import Loger from "../Loger";
import Ape from "./Ape";
import xdysdk from "libs/xdysdk";
import ClassDataProxy from "proxy/ClassDataProxy";
import $ from "jquery";
let loger = Loger.getLoger('PC-SignApe');
const newList = `<li class="turnListItem">
<p class="turnListItemName">{_userName}</p>
<p class="turnListItemTime">{time}</p>
</li>`;
class SignApe extends Ape {
constructor () {
super();
this._showPage = false;//判断当前是否关闭页面
this._questionObject = {};//问题 对象
this.timerList = [0,5,10,15,30]; //选择答题倒计时
this.isCancel = false;//控制学生端是否显示
this.isHide = false;//控制老师端是否显示结果数据,如果手动关闭后就不再显示
this.addEvent();
this.init();
}
init() {
$('.sign').on('click',this._signShow.bind(this)); //点击点名
$('.signHeadline .iconfont').on('click',this._closeSignHandler.bind(this));//关闭点名弹出框
$('.signStudentHeadlineA').on('click',this._closeSignStudentHandler.bind(this));//学生端关闭点名弹出框
$('#signShowBox').on("click", this._signShowHandler.bind(this));//老是断选择倒计时点名
$('.signUl').on("click",'li',this._signLiHandler.bind(this));//选择时间列表
$('.sponsorSign').on('click',this._sponsorSubmit.bind(this));//发起点名
$('.turnResultBtn').on('click',this._turnResultBtnClone.bind(this));//终止点名
$('.turnStudentBtn').on('click',this._turnStudentBtnRefer.bind(this));//学生端点击签到
$('body').on('click',function(evt){ //点击屏幕关闭时间选项
if(!$(evt.target).is('.signShow')){
$('.signUl').hide();
}
});
}
addEvent() {
//学生监听老师点名操作
xdysdk.on("start_answer_question", this.startAnswerQuestion.bind(this));
//老师监听学生签到情况
xdysdk.on("update_answer_question", this.upDateAnswerQuestion.bind(this));
//监听老师终止点名
xdysdk.on("stop_answer_question", this.stopAnswerQuestion.bind(this));
//点名的计时器
xdysdk.on("update_question_time",this.updateQuestionTime.bind(this));
}
//收到 点名 操作
startAnswerQuestion(_data){
console.log("startAnswerQuestion",_data,ClassDataProxy.userRole);
if(_data.type == 100){
if(ClassDataProxy.userRole==ClassDataProxy.USER_NOTMAL){
this._questionObject = _data;
if(_data.timeLimit == 100000){
$('.signCountdown').css('opacity',0);
}else{
$('.signCountdown').css('opacity',1);
}
if(!this.isCancel){
$('#signCountdown').html(ClassDataProxy.localConfig.namingTheCountdown)
this._showSignStudent();
}
}
}
}
//老师监听学生签到情况
upDateAnswerQuestion(_data){
//console.log("_data.totalUser",_data.totalUser);
if(_data.type == 100 && ClassDataProxy.userRole==ClassDataProxy.USER_HOST){
this._questionObject = _data;
//显示点名结果
if(!this.isHide) {
this._showSignResult();
}
this._messageAdd(_data);
}
}
//监听老师终止点名
stopAnswerQuestion(_data){
console.log("stopAnswerQuestion",_data);
if(_data.type == 100){
// this._questionObject = null;
this._closeSignStudentHandler();
this.isCancel = false;
this.isHide = false;
//老师端不做处理
// this._hideSignResult();
// this._showPage = false;
}
}
//点名的计时器
updateQuestionTime(_data){
if(_data.type==100){
//loger.log('点名的计时器',_data)
$('#signCountdown').html(this._newTime(_data.timestamp));
}
}
_newTime(timestamp){
let minute = 0,
second = 0;
minute = Math.floor(timestamp / 60)<10 ? '0'+Math.floor(timestamp / 60):Math.floor(timestamp / 60);
second = Math.floor(timestamp - minute * 60)<10?'0'+Math.floor(timestamp - minute * 60):Math.floor(timestamp - minute * 60)
let timeValue = ClassDataProxy.localConfig.namingTheCountdown
timeValue +=( minute > 0 ) ? minute + ' : ' : '00 : '
timeValue += (second > 0 ) ? second : '00'
return timeValue;
}
//学生端点击签到 把当前学生信息存起来
_messageAdd(_data){
let turnList = $('.turnList');
turnList.empty();
loger.log('学生端信息查询',_data)
for(let i=0,len = _data.list.length;i < len ;i++){
let _newList = this._format(newList,{
_userName : _data.list[i].userName, //学生签到列表
time : ClassDataProxy.timestampToDateTimeSign(parseInt(_data.list[i].time)) //学生签到时间
})
turnList.append(_newList);
$('.turnLen').html(_data.totalUser);
};
}
//渲染时间列表
_showTimerList(){
let signUl = $('.signUl'),newLi;
signUl.html('');
$.each(this.timerList,function(key,val){
if(val == 0){
newLi = '<li data-val="100000" data-ind="'+key+'" class="active">'+ClassDataProxy.localConfig.nothing+'</li>';
}else if(val/60 < 1){
newLi = '<li data-val="'+val+'" data-ind="'+key+'">'+val+ClassDataProxy.localConfig.second+'</li>';
}else{
newLi = '<li data-val="'+val+'" data-ind="'+key+'">'+val/60+ClassDataProxy.localConfig.minute+'</li>';
}
signUl.append(newLi);
})
}
//点击点名事件
_signShow(){
//渲染时间列表
this._showTimerList();
$('.signShow').html($('.signUl').find('li').eq(0).html()) //默认答题计时显示第一个
.attr('data-val',$('.signUl li').eq(0).attr('data-val'));
$('.signAllBox').show();
$('.signBox').fadeIn(800);
if(!this._showPage){
$('.signContentA').show();
}else{
$('.signContentB').show();
}
}
//关闭点名弹出框
_closeSignHandler(){
this.isHide = true;
$('.signAllBox').hide();
$('.signBox').hide();
}
//学生端关闭点名弹出框
_closeSignStudentHandler(){
this.isCancel = true;
$('.signAllBox').hide();
$('.signStudentBox').hide();
}
//老师选择倒计时点名
_signShowHandler(){
$('.signUl').is(':hidden') ? $('.signUl').show() : $('.signUl').hide();
}
//选择时间列表
_signLiHandler(evt){
let ele = $(evt.target);
let index = ele.index();
this._judgeDddClass($('.signUl li'),index);
$('.signShow').html(ele.html())
.attr('data-val',ele.data('val'));
$('.signUl').hide();
}
_judgeDddClass(ele,ind){
ele.eq(ind).addClass('active').siblings().removeClass('active');
}
//发起点名
_sponsorSubmit(){
this.isHide = false;
let _timeLimit = parseInt( $('.signShow').attr('data-val') );
let signInfo=
{
"type": parseInt(100),//1单选,2多选,3判断,4点名
"content": "点名",//没有就传""
"timeLimit": _timeLimit,//有效时间(秒)
"correct": [],//正确答案,没有就传[]
"options": ["A"],//选项数组,没有就传[]
};
xdysdk.api("creatQuestion", signInfo);
}
//终止点名
_turnResultBtnClone(){
//清除所有数据 还原默认数据
this._clearSign();
//调用SDK停止 点名
this._stopSign();
this._hideSignResult();
}
//调用SDK停止 点名
_stopSign(){
xdysdk.api("stopQuestion",{
"itemIdx": parseInt(this._questionObject.itemIdx) ,
"questionId": parseInt(this._questionObject.questionId)
});
this._questionObject = null;
}
//清除所有数据 还原默认数据
_clearSign(){
this._showPage = false;
this.isCancel = false;
this.isHide = false;
$('.turnLen').html(0);
this._revocation();
//默认 无 默认选中
this._judgeDddClass($('.signUl li'),0);
}
//学生端点击签到
_turnStudentBtnRefer(){
if(ClassDataProxy.userRole=="normal"){
let paramInfo = {};
paramInfo.itemIdx = this._questionObject.itemIdx;
paramInfo.questionId = this._questionObject.questionId;
paramInfo.answer = [0];//点名只有一个值
xdysdk.api("sendAnswer",paramInfo);
this._hideSignStudent();
}
}
//清空上一次点名信息
_revocation(){
$('.signShow').html(ClassDataProxy.localConfig.nothing);
$('.turnListItem').remove();
}
//工具类
_format(str, obj) {
return str.replace(/\{(\w+)\}/g, function (match, group, index) {
return obj[group];
});
};
//学生端显示 弹框
_showSignStudent(){
$('.signAllBox').show();
$('.signStudentBox').show();//学生端弹框
}
//学生端隐藏 弹框
_hideSignStudent(){
$('.signAllBox').hide();
$('.signStudentBox').hide();//学生端弹框
}
//老师端点名结果更新
_showSignResult(){
this._showPage = true;
$('.signAllBox').show();
$('.signBox').show();
$('.signContentA').hide();
$('.signContentB').show();
}
//终止点名时 老师端隐藏
_hideSignResult(){
$('.signAllBox').hide();
$('.signBox').hide();
$('.signContentB').hide();
}
}
export default SignApe;