function internetMonitoring(data) {
    var linkClass = document.getElementById('linkClass');
    var noLink = document.getElementById('noLink');
    var studentsStatus = document.getElementById('studentsStatus');
    var linkStu = {}, noLinkStu = {}, linkNum = 0, noLinkNum = 0;
    
    function init() {
        if(typeof data !== 'string') return;
        data = JSON.parse(data);
        if(!data.StudentsList) {
            var classinfo = studentsStatus.getAttribute('data-classinfo');
            if(!classinfo) return console.log('学生信息更新失败！');
            classinfo = resetData(JSON.parse(classinfo), data);
            studentsStatus.setAttribute('data-classinfo', JSON.stringify(classinfo));
            addClass(classinfo);
        } else {
            studentsStatus.setAttribute('data-classinfo', JSON.stringify(data));
            addClass(data);
        }
    }
    init();

    function resetData(classinfo, data) {
        var flag = false;
        classinfo.StudentsList.forEach(function(stu, i) {
            if(stu.CardID !== data.CardID) return;
            classinfo.StudentsList.splice(i, 1, data);
            flag = true;
        });
        if(!flag) classinfo.StudentsList.push(data);
        return classinfo;
    }

    /**
     * 修改学生信息
     * @param {*} studentData 学生信息
     */
    function addStudent(studentData) {
        if(!studentsStatus.querySelector('[data-cardid="' + studentData.CardID + '"]')) {
            if(!parseInt(studentData.AnswerStatus)) {
                noLinkStu[studentData.CardID] = studentData;
            } else {
                linkStu[studentData.CardID] = studentData;
            }
        } else {
            if(!parseInt(studentData.AnswerStatus)) {
                noLinkStu[studentData.CardID] = studentData;
                delete linkStu[studentData.CardID]
            } else {
                linkStu[studentData.CardID] = studentData;
                delete noLinkStu[studentData.CardID];
            }
        }
        linkStatus();        
    }
    
    /**
     * 修改班级信息
     * @param {*} data 班级信息
     */
    function addClass(data) {
        linkClass.innerHTML = '当前班级: … 已连接: …';
        noLink.innerHTML = '未连接: …';
        studentsStatus.innerHTML = '…';
    
        data['StudentsList'].forEach(function(stu) {
            addStudent(stu);
        });
        linkClass.innerHTML = '当前班级: ' + data.ClassName + ' 已连接: ' + linkNum + '/' + (linkNum + noLinkNum);
    }

    /**
     * 创建学生状态卡片
     * @param {*} studentData 学生信息
     * studentData.CardID 答题器id，取后四位
     * studentData.StudentName 学生姓名
     * studentData.AnswerStatus 链接状态，"0"或"1"
     */
    function createStudentsCard(studentData) {
        var html = '<dd>'
        + '<div>'
        + '<div class="student-pic"></div>'
        + '<div class="student-cardid">' + studentData.CardID.substr(-4) + '</div>'
        + '</div>'
        + '</dd>'
        + '<dt>' + studentData.StudentName + '</dt>';
        var dl = document.createElement('dl');
        dl.innerHTML = html;
        dl.setAttribute('data-cardid', studentData.CardID);
        if(!!parseInt(studentData.AnswerStatus)) dl.classList.add('linkOk');
        return dl;
    }

    /**
     * 学生链接状态
     */
    function linkStatus() {
        var noLinkStuName = [];
        for(key in noLinkStu) {
            noLinkStuName.push(noLinkStu[key].StudentName);
        }
     
        if (noLinkStuName.length > 0) {
            noLink.innerHTML = '未连接: ' + noLinkStuName.join(' ');
        }
        else {
            noLink.innerHTML = '<div style="display:block;width:10px;height:20px"></div>';
        }

        studentsStatus.innerHTML = '';
        linkNum = 0;
        noLinkNum = 0;
        for(key in noLinkStu) {
            noLinkNum++
            studentsStatus.appendChild(createStudentsCard(noLinkStu[key]));
        }
        for(key in linkStu) {
            linkNum++;
            studentsStatus.appendChild(createStudentsCard(linkStu[key]));
        }
        console.log('linkNum:', linkNum);
    }

}


