var time;
var splitWin = 1;  //分屏数，默认4分屏
var deptCur = null; //当前库区
var cameraList = null;  //监控列表
var cameraIndex = -1;  //监控下标
var cameraTimer;     // 库区定时
var selectTag = 0; //播放标签：0-自动轮播，1-手动选择
var windowsNum = 1; //播放窗口下标，手动选择模式下使用
var handCameraIndex = null;  //手动选择监控的下标
var gundongTimer;     //监控列表滚动定时器

var playUrl1 = null;
var videoId1 = null;
let webrtc1;
let mediaStream1;
var playUrl2 = null;
var videoId2 = null;
let webrtc2;
let mediaStream2;
var playUrl3 = null;
var videoId3 = null;
let webrtc3;
let mediaStream3;
var playUrl4 = null;
var videoId4 = null;
let webrtc4;
let mediaStream4;
var playUrl5 = null;
var videoId5 = null;
let webrtc5;
let mediaStream5;
var playUrl6 = null;
var videoId6 = null;
let webrtc6;
let mediaStream6;
var playUrl7 = null;
var videoId7 = null;
let webrtc7;
let mediaStream7;
var playUrl8 = null;
var videoId8 = null;
let webrtc8;
let mediaStream8;
var playUrl9 = null;
var videoId9 = null;
let webrtc9;
let mediaStream9;
var playUrl10 = null;
var videoId10 = null;
let webrtc10;
let mediaStream10;
var playUrl11 = null;
var videoId11 = null;
let webrtc11;
let mediaStream11;
var playUrl12 = null;
var videoId12 = null;
let webrtc12;
let mediaStream12;
var playUrl13 = null;
var videoId13 = null;
let webrtc13;
let mediaStream13;
var playUrl14 = null;
var videoId14 = null;
let webrtc14;
let mediaStream14;
var playUrl15 = null;
var videoId15 = null;
let webrtc15;
let mediaStream15;
var playUrl16 = null;
var videoId16 = null;
let webrtc16;
let mediaStream16;

$(function () {
    // 初始化页面
    initHtml();
});

// 初始化页面
function initHtml() {
    // 时间
    initTime();

    //监控点信息适应滚动
    initScrollbar(60);
    //库区信息
    // renderDeptArea();
    //
    // renderCamera();
}


// 渲染库区信息
function renderDeptArea() {
    if (deptCur) {
        $("#deptName").html(deptCur.deptName);
        $("#deptAddress").html(deptCur.addr == null ? "---" : deptCur.addr);
        $("#cameraSum").html(deptCur.cameraSum == null ? "---" : deptCur.cameraSum);
        $("#cameraCn").html(deptCur.cameraCn == null ? "---" : deptCur.cameraCn);
        $("#cameraYw").html(deptCur.cameraYw == null ? "---" : deptCur.cameraYw);
        $("#cameraAf").html(deptCur.cameraAf == null ? "---" : deptCur.cameraAf);
    }
}

// 渲染监控列表
function renderCamera() {
    var html = '';
    if (cameraList != null && cameraList.length > 0) {
        var divcameraIndex = "";
        $.each(cameraList, function (index, item) {
            divcameraIndex = "divCamera" + index;
            html += '<div class="panel-content-body-tr" id="' + divcameraIndex + '" ondblclick="selectHand(' + index + ')">';
            html += '<span class="body-item" style="flex: 1.4">';
            html += item.name;
            html += '</span>';
            html += '<span class="body-item" style="flex: 0.6">';
            if (item.spjklx == "02") {
                html += '球机';
            } else {
                html += '枪机';
            }
            html += '</span></div>';
        })
    } else {
        html += '<div class="panel-content-body-tr">';
        html += '<span class="body-item" style="flex: 1.4">暂无数据</span>';
        html += '<span class="body-item" style="flex: 0.6"></span>';
        html += '</div>';
    }
    $("#inventoryInfo").html(html);
    if (selectTag == 0) {
        cameraSwitch1();
    }
}

/* ---------- 监控切换 ---------- */
function cameraSwitch1() {
    clearInterval(cameraTimer);
    cameraSwitch2()
    //5分钟切换视频
    cameraTimer = setInterval(function () {
        cameraSwitch2()
    }, 60000);
}

function cameraSwitch2() {
    for (var i = 1; i <= splitWin; i++) {
        cameraIndex++;
        //播放视频
        startPlay(i);
    }
}

//视频播放-请求摄像头信息
/**
 *
 * @param cameraNum   摄像头列表下标
 * @param windowsNum 播放窗口下标
 */
function startPlay(windowsNum) {
    if (cameraIndex === cameraList.length) {
        cameraIndex = 0;
    }

    var data = cameraList[cameraIndex];
    if (!data) {
        $("#f" + splitWin + "_d" + windowsNum).html("未获取到摄像头播放信息！！");
        return;
    }
    if (data.urlIn) {
        if (windowsNum === 1) {
            playUrl1 = null;
            mediaStream1 = null;
            playUrl1 = cameraList[cameraIndex].urlIn;
            videoId1 = cameraList[cameraIndex].id;
            webRtcToPlay1();
        }else if (windowsNum === 2) {
            playUrl2 = null;
            mediaStream2 = null;
            playUrl2 = cameraList[cameraIndex].urlIn;
            videoId2 = cameraList[cameraIndex].id;
            webRtcToPlay2();
        }else if (windowsNum === 3) {
            playUrl3 = null;
            mediaStream3 = null;
            playUrl3 = cameraList[cameraIndex].urlIn;
            videoId3 = cameraList[cameraIndex].id;
            webRtcToPlay3();
        }else if (windowsNum === 4) {
            playUrl4 = null;
            mediaStream4 = null;
            playUrl4 = cameraList[cameraIndex].urlIn;
            videoId4 = cameraList[cameraIndex].id;
            webRtcToPlay4();
        }else if (windowsNum === 5) {
            playUrl5 = null;
            mediaStream5 = null;
            playUrl5 = cameraList[cameraIndex].urlIn;
            videoId5 = cameraList[cameraIndex].id;
            webRtcToPlay5();
        }else if (windowsNum === 6) {
            playUrl6 = null;
            mediaStream6 = null;
            playUrl6 = cameraList[cameraIndex].urlIn;
            videoId6 = cameraList[cameraIndex].id;
            webRtcToPlay6();
        }else if (windowsNum === 7) {
            playUrl7 = null;
            mediaStream7 = null;
            playUrl7 = cameraList[cameraIndex].urlIn;
            videoId7 = cameraList[cameraIndex].id;
            webRtcToPlay7();
        }else if (windowsNum === 8) {
            playUrl8 = null;
            mediaStream8 = null;
            playUrl8 = cameraList[cameraIndex].urlIn;
            videoId8 = cameraList[cameraIndex].id;
            webRtcToPlay8();
        }else if (windowsNum === 9) {
            playUr9 = null;
            mediaStream9 = null;
            playUrl9 = cameraList[cameraIndex].urlIn;
            videoId9 = cameraList[cameraIndex].id;
            webRtcToPlay9();
        }else if (windowsNum === 10) {
            playUrl10 = null;
            mediaStream10 = null;
            playUrl10 = cameraList[cameraIndex].urlIn;
            videoId10 = cameraList[cameraIndex].id;
            webRtcToPlay10();
        }else if (windowsNum === 11) {
            playUrl11 = null;
            mediaStream11 = null;
            playUrl11 = cameraList[cameraIndex].urlIn;
            videoId11 = cameraList[cameraIndex].id;
            webRtcToPlay11();
        }else if (windowsNum === 12) {
            playUrl12 = null;
            mediaStream12 = null;
            playUrl12 = cameraList[cameraIndex].urlIn;
            videoId12 = cameraList[cameraIndex].id;
            webRtcToPlay12();
        }else if (windowsNum === 13) {
            playUrl13 = null;
            mediaStream13 = null;
            playUrl13 = cameraList[cameraIndex].urlIn;
            videoId13 = cameraList[cameraIndex].id;
            webRtcToPlay13();
        }else if (windowsNum === 14) {
            playUrl14 = null;
            mediaStream14 = null;
            playUrl14 = cameraList[cameraIndex].urlIn;
            videoId14 = cameraList[cameraIndex].id;
            webRtcToPlay14();
        }else if (windowsNum === 15) {
            playUrl15 = null;
            mediaStream15 = null;
            playUrl15 = cameraList[cameraIndex].urlIn;
            videoId15 = cameraList[cameraIndex].id;
            webRtcToPlay15();
        }else if (windowsNum === 16) {
            playUrl16 = null;
            mediaStream16 = null;
            playUrl16 = cameraList[cameraIndex].urlIn;
            videoId16 = cameraList[cameraIndex].id;
            webRtcToPlay16();
        }
    } else {
        $("#f" + splitWin + "_d" + windowsNum).html("未获取到摄像头(" + data.name + ")播放信息！！");
    }
}

/**
 * 分屏切换
 * @param tagNum  分屏数
 */
function fenping(tagNum) {
    //重置切换前的分屏窗口
    reloadView(splitWin);

    //赋值当前分屏数
    splitWin = tagNum;

    //重置切换后的分屏窗口
    reloadView(splitWin);

    //切换分屏图标及页面
    if (tagNum == 1) {
        $("#f_1").attr("src", "/img/web/group/fp_1_active.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'block');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 4) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4_active.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'block');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 9) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9_active.png");
        $("#f_16").attr("src", "/img/web/group/fp_16.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'block');
        $("#video_16").css('display', 'none');
    }
    if (tagNum == 16) {
        $("#f_1").attr("src", "/img/web/group/fp_1.png");
        $("#f_4").attr("src", "/img/web/group/fp_4.png");
        $("#f_9").attr("src", "/img/web/group/fp_9.png");
        $("#f_16").attr("src", "/img/web/group/fp_16_active.png");
        $("#video_1").css('display', 'none');
        $("#video_4").css('display', 'none');
        $("#video_9").css('display', 'none');
        $("#video_16").css('display', 'block');
    }
    //当前库区重新播放，监控列表播放下标重置为0
    cameraIndex = 0;
    clearInterval(cameraTimer);
    windowsNum = 1;
    //判断播放方式
    if (selectTag == 0) {
        cameraSwitch1();
    }
}

//重置4分屏和9分屏的各个播放窗口
function reloadView(num) {
    var html;
    for (var i = 1; i <= num; i++) {
        html = '';
        html += '<video className="video" id="video' + num + '_' + i + ' autoPlay="" muted="" playsInline=""></video>';
        $("#f" + num + "_d" + i).html(html);
    }
}

/**
 * 手动选择播放
 * @param index 选择监控的监控列表下标
 */
function selectHand(index) {
    if (selectTag == 0) {

        //清除列表滚动，重新设置滚动时间
        clearInterval(gundongTimer);
        initScrollbar(1000 * 30);

        showTip("已切换手动播放模式！双击左侧列表监控进行播放！");

        windowsNum = 1;
        selectTag = 1;
        reloadView(splitWin);
    }

    if (windowsNum > splitWin) {
        windowsNum = 1;
    }
    cameraIndex = index;
    startPlay(windowsNum);
    windowsNum++;

    //清除上次选中效果，赋值新选中效果
    $("#divCamera" + handCameraIndex).removeClass("handSelect");
    $("#divCamera" + index).addClass("handSelect");
    handCameraIndex = index;
}

// 刷新时间
function initTime() {
    setInterval(function () {
        $("#navBarDate").html(formatDate('mm月dd日', new Date()));
        $("#navBarTime").html(formatDate('HH:MM:SS', new Date()));
        $("#navBarWeek").html(getWeekDate());
    }, 1000);
}

/**
 * 格式化日期
 *
 * @param fmt
 * @param date
 * @return {*}
 */
function formatDate(fmt, date) {
    var ret;
    var opt = {
        "Y+": date.getFullYear().toString(),        // 年
        "m+": (date.getMonth() + 1).toString(),     // 月
        "d+": date.getDate().toString(),            // 日
        "H+": date.getHours().toString(),           // 时
        "M+": date.getMinutes().toString(),         // 分
        "S+": date.getSeconds().toString()          // 秒
        // 有其他格式化字符需求可以继续添加，必须转化成字符串
    };
    for (var k in opt) {
        ret = new RegExp("(" + k + ")").exec(fmt);
        if (ret) {
            fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
        }
    }
    return fmt;
}

/**
 * 获取当前星期几
 */
function getWeekDate() {
    var now = new Date();
    var day = now.getDay();
    var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
    var week = weeks[day];
    return week;
}

//监控点信息滚动
function initScrollbar(num) {
    gundongTimer = setInterval(function () {
        if (!hasScrollbar()) {
            document.getElementById('inventoryInfoBox').scrollTop = 0;
        } else {
            if (document.getElementById('inventoryInfoBox').scrollTop >= (document.getElementById('inventoryInfo').clientHeight - document.getElementById('inventoryInfoBox').clientHeight)) {
                document.getElementById('inventoryInfoBox').scrollTop = 0;
            } else {
                document.getElementById('inventoryInfoBox').scrollTop++;
            }
        }
    }, num);
}

//判断底部是否出现滚动条
function hasScrollbar() {
    return document.getElementById('inventoryInfo').clientHeight > document.getElementById('inventoryInfoBox').clientHeight;
}

// 右下角提醒信息
function showTip(msg) {
    layer.msg(msg);
}


/*============= webRtc视频播放1 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay1() {
    if (playUrl1) {
        mediaStream1 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream1;
        webrtc1 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc1.onsignalingstatechange = signalingstatechange1;

        webrtc1.ontrack = ontrack1
        let offer = await webrtc1.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc1.setLocalDescription(offer);
    }
}

function ontrack1(event) {
    mediaStream1.addTrack(event.track);
}

async function signalingstatechange1() {
    switch (webrtc1.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl1 + "?uuid=" + videoId1 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc1.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc1.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc1.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放2 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay2() {
    if (playUrl2) {
        mediaStream2 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream2;
        webrtc2 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc2.onsignalingstatechange = signalingstatechange2;

        webrtc2.ontrack = ontrack2
        let offer = await webrtc2.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc2.setLocalDescription(offer);
    }
}

function ontrack2(event) {
    mediaStream2.addTrack(event.track);
}

async function signalingstatechange2() {
    switch (webrtc2.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl2 + "?uuid=" + videoId2 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc2.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc2.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc2.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放3 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay3() {
    if (playUrl3) {
        mediaStream3 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream3;
        webrtc3 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc3.onsignalingstatechange = signalingstatechange3;

        webrtc3.ontrack = ontrack3
        let offer = await webrtc3.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc3.setLocalDescription(offer);
    }
}

function ontrack3(event) {
    mediaStream3.addTrack(event.track);
}

async function signalingstatechange3() {
    switch (webrtc3.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl3 + "?uuid=" + videoId3 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc3.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc3.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc3.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放4 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay4() {
    if (playUrl4) {
        mediaStream4 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream4;
        webrtc4 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc4.onsignalingstatechange = signalingstatechange4;

        webrtc4.ontrack = ontrack4
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc4.setLocalDescription(offer);
    }
}

function ontrack4(event) {
    mediaStream4.addTrack(event.track);
}

async function signalingstatechange4() {
    switch (webrtc4.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl4 + "?uuid=" + videoId4 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc4.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc4.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc4.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/
/*============= webRtc视频播放5 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay5() {
    if (playUrl5) {
        mediaStream5 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream5;
        webrtc5 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc5.onsignalingstatechange = signalingstatechange5;

        webrtc5.ontrack = ontrack5
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc5.setLocalDescription(offer);
    }
}

function ontrack5(event) {
    mediaStream5.addTrack(event.track);
}

async function signalingstatechange5() {
    switch (webrtc5.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl5 + "?uuid=" + videoId5 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc5.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc5.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc5.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/
/*============= webRtc视频播放4 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay6() {
    if (playUrl6) {
        mediaStream6 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream6;
        webrtc6 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc6.onsignalingstatechange = signalingstatechange6;

        webrtc6.ontrack = ontrack6
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc6.setLocalDescription(offer);
    }
}

function ontrack6(event) {
    mediaStream6.addTrack(event.track);
}

async function signalingstatechange6() {
    switch (webrtc6.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl6 + "?uuid=" + videoId6 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc6.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc6.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc6.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放7 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay7() {
    if (playUrl7) {
        mediaStream7 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream7;
        webrtc7 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc7.onsignalingstatechange = signalingstatechange7;

        webrtc7.ontrack = ontrack7
        let offer = await webrtc7.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc7.setLocalDescription(offer);
    }
}

function ontrack7(event) {
    mediaStream7.addTrack(event.track);
}

async function signalingstatechange7() {
    switch (webrtc7.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl7 + "?uuid=" + videoId7 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc7.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc7.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc7.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放8 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay8() {
    if (playUrl8) {
        mediaStream8 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream8;
        webrtc8 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrt8.onsignalingstatechange = signalingstatechange8;

        webrtc8.ontrack = ontrack8
        let offer = await webrtc8.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc8.setLocalDescription(offer);
    }
}

function ontrack8(event) {
    mediaStream8.addTrack(event.track);
}

async function signalingstatechange8() {
    switch (webrtc8.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl8 + "?uuid=" + videoId8 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc8.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc8.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc8.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放9 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay9() {
    if (playUrl9) {
        mediaStream9 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream9;
        webrtc9 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc9.onsignalingstatechange = signalingstatechange9;

        webrtc9.ontrack = ontrack9
        let offer = await webrtc4.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc9.setLocalDescription(offer);
    }
}

function ontrack9(event) {
    mediaStream9.addTrack(event.track);
}

async function signalingstatechange9() {
    switch (webrtc9.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl9 + "?uuid=" + videoId9 + "&channel=0";
            $.post(url, {
                data: btoa(webrt9.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc9.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc9.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放10 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay10() {
    if (playUrl10) {
        mediaStream10 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream10;
        webrtc10 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc10.onsignalingstatechange = signalingstatechange10;

        webrtc10.ontrack = ontrack10
        let offer = await webrtc10.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc10.setLocalDescription(offer);
    }
}

function ontrack10(event) {
    mediaStream10.addTrack(event.track);
}

async function signalingstatechange10() {
    switch (webrtc10.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl10 + "?uuid=" + videoId10 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc10.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc10.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc10.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放11 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay11() {
    if (playUrl11) {
        mediaStream11 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream11;
        webrtc11 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc11.onsignalingstatechange = signalingstatechange11;

        webrtc11.ontrack = ontrack11
        let offer = await webrtc11.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc11.setLocalDescription(offer);
    }
}

function ontrack11(event) {
    mediaStream11.addTrack(event.track);
}

async function signalingstatechange11() {
    switch (webrtc11.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl11 + "?uuid=" + videoId11 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc11.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc11.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc11.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放12 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay12() {
    if (playUrl12) {
        mediaStream12 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream12;
        webrtc12 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc12.onsignalingstatechange = signalingstatechange12;

        webrtc12.ontrack = ontrack12
        let offer = await webrtc12.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc12.setLocalDescription(offer);
    }
}

function ontrack12(event) {
    mediaStream12.addTrack(event.track);
}

async function signalingstatechange12() {
    switch (webrtc12.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl12 + "?uuid=" + videoId12 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc12.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc12.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc12.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放13 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay13() {
    if (playUrl13) {
        mediaStream13 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream13;
        webrtc13 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc13.onsignalingstatechange = signalingstatechange13;

        webrtc13.ontrack = ontrack13
        let offer = await webrtc13.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc13.setLocalDescription(offer);
    }
}

function ontrack13(event) {
    mediaStream13.addTrack(event.track);
}

async function signalingstatechange13() {
    switch (webrtc13.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl13 + "?uuid=" + videoId13 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc13.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc13.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc13.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放14 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay14() {
    if (playUrl14) {
        mediaStream14 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream14;
        webrtc14 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc14.onsignalingstatechange = signalingstatechange14;

        webrtc14.ontrack = ontrack14
        let offer = await webrtc14.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc14.setLocalDescription(offer);
    }
}

function ontrack14(event) {
    mediaStream14.addTrack(event.track);
}

async function signalingstatechange14() {
    switch (webrtc14.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl14 + "?uuid=" + videoId14 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc14.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc14.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc14.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放15 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay15() {
    if (playUrl15) {
        mediaStream15 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream15;
        webrtc15 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc15.onsignalingstatechange = signalingstatechange15;

        webrtc15.ontrack = ontrack15
        let offer = await webrtc15.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc15.setLocalDescription(offer);
    }
}

function ontrack15(event) {
    mediaStream15.addTrack(event.track);
}

async function signalingstatechange15() {
    switch (webrtc15.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl15 + "?uuid=" + videoId15 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc15.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc15.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc15.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/

/*============= webRtc视频播放16 ----- 开始 ===============*/
/**
 * 开始播放
 * @param winTag  播放窗口
 * @returns {Promise<void>}
 */
async function webRtcToPlay16() {
    if (playUrl16) {
        mediaStream16 = new MediaStream();
        $("#video" + splitWin + "_" + windowsNum)[0].srcObject = mediaStream16;
        webrtc16 = new RTCPeerConnection({
            iceServers: [{
                urls: ["stun:stun.l.google.com:19302"]
            }],
            sdpSemantics: "unified-plan"
        });
        webrtc16.onsignalingstatechange = signalingstatechange16;

        webrtc16.ontrack = ontrack16
        let offer = await webrtc16.createOffer({

            offerToReceiveAudio: true,
            offerToReceiveVideo: true
        });
        await webrtc16.setLocalDescription(offer);
    }
}

function ontrack16(event) {
    mediaStream16.addTrack(event.track);
}

async function signalingstatechange16() {
    switch (webrtc16.signalingState) {
        case 'have-local-offer':
            // let uuid = $('#uuid').val();
            let url = playUrl16 + "?uuid=" + videoId16 + "&channel=0";
            $.post(url, {
                data: btoa(webrtc16.localDescription.sdp)
            }, function (data) {
                try {
                    console.log(data);
                    webrtc16.setRemoteDescription(new RTCSessionDescription({
                        type: 'answer',
                        sdp: atob(data)
                    }))
                } catch (e) {
                    console.warn(e);
                }

            });
            break;
        case 'stable':
            break;
        case 'closed':
            break;
        default:
            console.log(`unhandled signalingState is ${webrtc16.signalingState}`);
            break;
    }
}

/*============= 视频播放 ----- 结束 ===============*/