var loginName = "admin";
var password = "bns@Admin1";
var webSocket;
var tokens;
var token = localStorage.getItem("token");
$(function () {
    //键盘监听事件——本地截屏
    document.onkeydown = function (event) {
        let e = event || window.event || arguments.callee.caller.arguments[0];
        if (e && e.code === "KeyB") { // Ctrl_B
            if (playBallList.length === 0) {
                layer.msg("请先播放视频", {icon: 2});
            } else {
                screenshot(selectedScreen);
            }

        }
    };
    //初始化菜单
    $.contextMenu({
        selector: '.flv_video',
        build: function ($trigger, e) {
            let remoteVideo = "开启云录像";
            let threeD = "开启3D云平台";
            let localVideo = "开启本地录像";
            let id = $trigger.closest("div").attr("id");
            ballScreen(id);
            $.each(playBallList, function (index, item) {
                if (!isEmpty(item)) {
                    if (id === item.selectedScreen) {
                        if (!isEmpty(item.id)) {
                            remoteVideo = "关闭云录像";
                        } else {
                            remoteVideo = "开启云录像";
                        }
                    }
                }
            })
            $.each(playBallList, function (index, item) {
                if (!isEmpty(item)) {
                    if (id === item.selectedScreen)
                        if (!isEmpty(item.recordVideo)) {
                            if (item.recordVideo) {
                                localVideo = "开启本地录像";
                            } else {
                                localVideo = "关闭本地录像";
                            }
                        }
                }
            })
            let threeDState = localStorage.getItem(id + "_3d")
            if (threeDState === "true") {
                threeD = "关闭3D云平台";
                threeDState = false;
            } else {
                threeD = "开启3D云平台";
                threeDState = true;
            }
            return {
                callback: function (key, options) {
                    let videoId = $(this).closest("div").attr("id");
                    $.each(playBallList, function (index, item) {
                        if (!isEmpty(item)) {
                            if (videoId === item.selectedScreen) {
                                switch (key) {
                                    case "stop":
                                        H5Live.DestoryWindows(item.selectedScreen);
                                        if (item.flvJs) {
                                            destoryVideo(item.flvJs);
                                            item.flvJs = null;
                                        } else {
                                            H5Live.DestoryWindows(item.selectedScreen);
                                        }
                                        $.each(videoList, function (index, item) {
                                            if (videoId === item.selectedScreen) {
                                                item.playState = false;
                                            }
                                        });
                                        playBallList.splice(index, 1);
                                        $("#" + videoId).html("");
                                        break;
                                    case "details":
                                        let height = getDefaultHeight().toFixed(0) + 'px';
                                        let width = getDefaultWidth().toFixed(0) + 'px';
                                        layer.open({
                                            title: false,
                                            type: 2,
                                            content: '../video/videoDetails.html?puid=' + item.puid,
                                            skin: 'my-skin detail-skin',
                                            area: [width, height],
                                            maxmin: false,
                                            move: false,
                                            offset: ['8%', '25%'],
                                            shadeClose: true,
                                            shade: 0.5,
                                            success: function (layero, index) {
                                                $(window).resize(function () {
                                                    if (autoResizeWidth) {
                                                        autoResizeWidth(index);
                                                    }
                                                    if (autoResizeHeight) {
                                                        autoResizeHeight(index);
                                                    }
                                                })
                                            }
                                        });
                                        break;
                                    case "localCapture":
                                        screenshot(videoId);
                                        break;
                                    case "3D":
                                        localStorage.setItem(selectedScreen + "_3d", threeDState);//默认开启
                                        break;
                                    case "localVideo":
                                        document.getElementById("localVideoBtn").click();
                                        break;
                                    case "remoteCapture":
                                        document.getElementById("remoteSnapBtn").click();
                                        break;
                                    case "remoteVideo":
                                        document.getElementById("remoteVideoBtn").click();
                                        break;

                                }
                            }
                        }

                    });

                },
                items: {
                    "stop": {
                        name: "停止播放"
                    },
                    "stopAll": {
                        name: "停止所有播放",
                        callback: function (key, options) {
                            $.each(playBallList, function (indexs, item) {
                                if (!isEmpty(item)) {
                                    if (item.flvJs) {
                                        destoryVideo(item.flvJs);
                                        item.flvJs = null;
                                    } else {
                                        H5Live.DestoryWindows(item.selectedScreen);
                                    }
                                }
                                $("#" + item.selectedScreen).html("");
                            });
                            playBallList = [];
                            $.each(videoList, function (index, item) {
                                if (index < num) {
                                    item.playState = false;
                                }
                            });
                        }
                    },
                    "details": {
                        name: "球机详情"
                    },
                    "3D": {
                        name: threeD
                    },
                    "localCapture": {
                        name: "本地抓拍"
                    },
                    "localVideo": {
                        name: localVideo
                    },
                    "remoteCapture": {
                        name: "云抓拍"
                    },
                    "remoteVideo": {
                        name: remoteVideo
                    }
                }
            };
        },


    });
});


/**
 * 获取创世websocket地址
 */
function getCSWebSocket() {
    $.ajax({
        url: dataUrl + "video/getCSWebSocket?token=" + token,
        type: "POST",
        data: {name: loginName, passwd: password, token: token},
        success: function (data) {
            if (data.resMsg === 'success') {
                var jsons = JSON.parse(data.obj);
                webSocket = jsons.content.Addr;
                if (webSocket.indexOf("127.0.0.1") != -1) {
                    webSocket = webSocket.replace("127.0.0.1", "112.30.98.105");
                }
            }
        }, error: function (error) {
        }
    })
}

/**
 * 创建清新平台连接
 */
function getQXConnect() {
    let params = {
        "address": _cf.connParams.address,
        "port": _cf.connParams.port,
        "user": _cf.connParams.user,
        "password": _cf.connParams.password,
        "epid": _cf.connParams.epid,
        "fixaddr": _cf.connParams.bfix
    }
    requestPost('login', params, function (rv) {
        let result = {
            errcode: -1,
            token: ''
        }
        let respJSON = JSON.parse(rv.responseText);
        if (respJSON.hasOwnProperty('errcode')) {
            result.errcode = respJSON.errcode;
        }
        if (respJSON.hasOwnProperty('token')) {
            result.token = respJSON.token;
            result.errcode = 0;
            tokens = result.token;
        }
    });
}

/**
 * post 请求
 * @param router
 * @param params
 * @param callback
 */
function requestPost(router, params, callback) {
    $.ajax({
        type: 'post',
        url: _cf.q2http_url + router,
        data: params,
        traditional: true,
        dataType: 'json',
        async: true,
        complete: function (rv) {
            if (typeof callback == 'function') callback(rv)
        }
    })
}

/**
 * 创世云台控制
 * @param puid
 * @param {Object} type
 */
/*function csBallPTZ(puid, type) {
    $.ajax({
        url: ctxPath + "/base/getCSBallPTZControl",
        type: "POST",
        data: {
            puid: puid,
            type: type,
            token: token
        },
        success: function (data) {
        },
        error: function (error) {
        }
    });
}*/

/**
 *操作记录
 */
function record(puid, details, module) {
    $.ajax({
        url: ctxPath + "/logs/addBallLogs?token=" + token,
        type: "GET",
        data: {
            puid: puid,
            details: details,
            module: module,
            token: token
        },
        success: function (data) {
        },
        error: function (error) {
        }
    });

}

/**
 * 远程录像/抓拍
 * @param puid 球机puid
 * @param type 操作类型
 * @param typeBall 平台类型
 */
function remote(puid, type, typeBall) {
    if (typeBall === 0) {
        //创世
        type = type === 0 ? "REALTIME" : "PICTURE";
        $.ajax({
            url: ctxPath + "/base/remote",
            type: "POST",
            data: {
                puid: puid,
                type: type,
                action: "ManualStartPlateformStorage",
                token: token
            },
            success: function (data) {
                if (type === "REALTIME") {
                    layer.msg("开始录像成功", {icon: 1});
                    $.each(playBallList, function (index, item) {
                        if (selectedScreen === item.selectedScreen) {
                            item.id = true;
                        }
                    });
                    record(puid, document.title, "远程11录像")
                } else {
                    layer.msg("抓拍成功", {icon: 1});
                    setTimeout("stopRemote(\"" + puid + "\",null, 1,0)", 2000);
                    record(puid, document.title, "远程抓拍")
                }
            },
            error: function (error) {
            }
        });

    } else {
        //清晰
        let params = {
            idx: 0,
            puid: puid,
            type: type,
            duration: 5
        }
        requestPost("CSS/C_CSS_StartManualStorage" + "?token=" + tokens, params, function (data) {
                if (data.responseJSON.Error === '0') {
                    if (type === 0) {
                        layer.msg("开始录像成功", {icon: 1});
                        record(puid, document.title, "远程录像")
                        $.each(playBallList, function (index, item) {
                            if (selectedScreen === item.selectedScreen) {
                                item.id = data.responseJSON.Param.ID;
                            }
                        });
                    } else {
                        layer.msg("抓拍成功", {icon: 1});
                        setTimeout("stopRemote(null,\"" + data.responseJSON.Param.ID + "\", 1,1);", 2000);
                        record(puid, document.title, "远程抓拍")
                    }

                }
            }
        )
    }

}

/**
 *
 * @param puid
 * @param id 流播放ID
 * @param type
 * @param typeBall
 */
function stopRemote(puid, id, type, typeBall) {
    if (typeBall === 0) {
        //创世
        type = type === 0 ? "REALTIME" : "PICTURE";
        $.ajax({
            url: ctxPath + "/base/remote",
            type: "POST",
            data: {
                puid: puid,
                type: type,
                action: "ManualStopPlateformStorage",
                token: token
            },
            success: function (data) {
                if (type === "REALTIME") {
                    layer.msg("停止录像成功", {icon: 1});
                    $.each(playBallList, function (index, item) {
                        if (selectedScreen === item.selectedScreen) {
                            item.id = null;
                        }
                    })
                }
            },
            error: function (error) {
            }
        });
    } else {
        //清晰
        let params = {
            id: id
        }
        requestPost("CSS/C_CSS_StopManualStorage" + "?token=" + tokens, params, function (data) {
            if (!isEmpty(data)) {
                if (type === 0) {
                    layer.msg("停止录像成功", {icon: 1});
                    $.each(playBallList, function (index, item) {
                        if (selectedScreen === item.selectedScreen) {
                            item.id = null;
                        }
                    })
                }

            }
        });
    }
    record(puid, document.title, "停止远程录像")
}

/**
 * 云台操作
 */
function operate(ballType, puid, type) {
    if (ballType === 0) {
        csBallPTZ(puid, type);
    } else {
        switch (type) {
            case "TurnUp":
                qxBallPTZ('up', puid);
                break;
            case "TurnDown":
                qxBallPTZ('down', puid);
                break;
            case "TurnLeft":
                qxBallPTZ('left', puid);
                break;
            case "TurnRight":
                qxBallPTZ('right', puid);
                break;
            case "AugmentAperture":
                /* zoomcontrol('zoomin', puid);*/
                break;
            case "MinishAperture":
                // zoomcontrol('zoominout', puid);
                break;
            case "ZoomInPicture":
                zoomcontrol('zoomin', puid);
                break;
            case "ZoomOutPicture":
                zoomcontrol('zoominout', puid);
                break;
            case "MakeFocusFar":
                focuscontrol('faraway', puid);
                break;
            case "MakeFocusNear":
                focuscontrol('near', puid);
                break;
            case "StopFocusMove":
                focuscontrol('stop', puid);
                break;
            case "StopPictureZoom":
                focuscontrol('stop', puid);
                break;
            default:
                qxBallPTZ('stop', puid);
                break;
        }
    }
    switch (type) {
        case "TurnUp":
            record(puid, document.title, "球机移动(上)")
            break;
        case "TurnDown":
            record(puid, document.title, "球机移动(下)")
            break;
        case "TurnLeft":
            record(puid, document.title, "球机移动(左)")
            break;
        case "TurnRight":
            record(puid, document.title, "球机移动(右)")
            break;
        case "ZoomInPicture":
            record(puid, document.title, "球机操作(放大)")
            break;
        case "ZoomOutPicture":
            record(puid, document.title, "球机操作(缩小)")
            break;
        case "MakeFocusFar":
            record(puid, document.title, "球机操作(远焦)")
            break;
        case "MakeFocusNear":
            record(puid, document.title, "球机操作(近焦)")
            break;
        default:
            break;
    }
}

/**
 * 销毁断流方法
 * @param flvPlayer
 */
function destoryVideo(flvPlayer) {
    if (flvPlayer) {
        flvPlayer.pause();
        flvPlayer.unload();
        flvPlayer.detachMediaElement();
        flvPlayer.destroy();
    }
}

/**
 * 录制视频
 */
function recordVideo(id) {
    let video = $("#" + id + "_video")[0];
    let canvas = $("#canvas_" + id)[0];
    let width = $(video).width();
    let height = $(video).height();
    let encodeType = "video/webm;codecs=vp8";
    let chunks = [];
    let frameId = null;
//设置画布背景
    let ctx = canvas.getContext('2d');
    let H = window.innerHeight;
    let W = window.innerWidth;
    const pixelRatio = window.devicePixelRatio || 1;
    const backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
        ctx.mozBackingStorePixelRatio ||
        ctx.msBackingStorePixelRatio ||
        ctx.oBackingStorePixelRatio ||
        ctx.backingStorePixelRatio || 1;
    const ratio = pixelRatio / backingStoreRatio;
    canvas.width = width * ratio;
    canvas.height = height * ratio;
    canvas.style.width = W + 'px';
    canvas.style.height = H + 'px';
    ctx.scale(ratio, ratio);
    ctx.drawImage(video, 0, 0, width, height); // 将video中的数据绘制到canvas里
//创建MediaRecorder，设置媒体参数
    let stream = canvas.captureStream();
    let start = true;
    let recorder = new MediaRecorder(stream, {
        mimeType: encodeType
    });
//收集录制数据
    recorder.ondataavailable = e => {
        chunks.push(e.data);
    };
    $('#localVideoBtn').click(function () {
        if (playBallList.length === 0) {
            layer.msg("请先播放视频", {icon: 2});
            return;
        }
        if (selectedScreen !== $(video).closest("div").attr("id")) {
            return;
        }
        if (start) {
            layer.msg("开启本地录像", {icon: 0});
            chunks = [];
            recorder.start(10);
            drawFrame();
            $(this).css('background-image', 'url(../../img/video/no_check/local_video_no.png)')
            start = false;
            $.each(playBallList, function (index, item) {
                if (item.selectedScreen === selectedScreen) {
                    item.recordVideo = start;
                }
            })
        } else {
            layer.msg("关闭本地录像", {icon: 0});
            recorder.stop();
            cancelAnimationFrame(frameId);
            download();
            $(this).css('background-image', 'url(../../img/video/no_check/local_video.png)')
            start = true;
            $.each(playBallList, function (index, item) {
                if (item.selectedScreen === selectedScreen) {
                    item.recordVideo = start;
                }
            })
        }
    });

//播放视频
    function drawFrame() {
        ctx.drawImage(video, 0, 0, width, height);
        frameId = requestAnimationFrame(drawFrame);
    }

//下载录制内容
    function download() {
        let blob = new Blob(chunks, {type: 'video/webm'});
        let url = window.URL.createObjectURL(blob);
        let link = document.createElement("a");
        link.href = url;
        link.download = new Date().getTime() + ".mp4";
        link.style.display = "none";
        document.body.appendChild(link);
        link.click();
        link.remove();
    }
}


/**
 * 本地抓拍
 */
function screenshot(selectedScreen, type) {
    let video = $("#" + selectedScreen + "_video")[0];
    let canvas = $('#canvas_' + selectedScreen)[0];
    let ctx = canvas.getContext('2d');
    let H = window.innerHeight;
    let W = window.innerWidth;
    const pixelRatio = window.devicePixelRatio || 1;
    const backingStoreRatio = ctx.webkitBackingStorePixelRatio ||
        ctx.mozBackingStorePixelRatio ||
        ctx.msBackingStorePixelRatio ||
        ctx.oBackingStorePixelRatio ||
        ctx.backingStorePixelRatio || 1;
    const ratio = pixelRatio / backingStoreRatio;
    canvas.width = $(video).width() * ratio;
    canvas.height = $(video).height() * ratio;
    canvas.style.width = W + 'px';
    canvas.style.height = H + 'px';
    ctx.scale(ratio, ratio);
    ctx.drawImage(video, 0, 0, $(video).width(), $(video).height());  // 将video中的数据绘制到canvas里
    let image = canvas.toDataURL('image/jpg').replace('image/jpg', 'image/octet-stream');
    saveAs(image, new Date().getTime() + '.png' || new Date().getTime() + '.png');
}