<template>
  <div>
    <div class="aaa">
<!--      <el-button @click="aaaa" type="primary">主要按钮</el-button>-->
    </div>
    <div id="divPlugin" class="plugin"></div>
  </div>
</template>

<script>


var g_iWndIndex = 0;
export default {
  data() {
    return {}
  },
  props: ['iChannelID', 'monitorId'],
  async mounted() {
    const vw = (window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth) / 100
    const vh = (window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight) / 100
    await this.$nextTick()
    const _this = this
    $(function () {
      // 检查插件是否已经安装过
      var iRet = WebVideoCtrl.I_CheckPluginInstall();
      if (-1 == iRet) {
        alert("未安装插件");
        return;
      }

      // 初始化插件参数及插入插件
      WebVideoCtrl.I_InitPlugin(27.3 * vw, 23.5 * vh, {
        bWndFull: true,     //是否支持单窗口双击全屏，默认支持 true:支持 false:不支持
        iPackageType: 2,
        iWndowType: 1,
        bNoPlugin: true,
        cbSelWnd: function (xmlDoc) {
          g_iWndIndex = parseInt($(xmlDoc).find("SelectWnd").eq(0).text(), 10);
        },
        cbDoubleClickWnd: function (iWndIndex, bFullScreen) {
          console.log(iWndIndex, bFullScreen)
        },
        cbEvent: function (iEventType, iParam1, iParam2) {
        },
        cbRemoteConfig: function () {
          console.log("关闭远程配置库！");
        },
        cbInitPluginComplete: function () {
          WebVideoCtrl.I_InsertOBJECTPlugin('divPlugin');
          // 检查插件是否最新
          if (-1 == WebVideoCtrl.I_CheckPluginVersion()) {
            alert("检测到新的插件版本");
            return;
          }
        }
      });


    });

// 登录
    function clickLogin() {
      var szIP = '192.168.2.64',
        szPort = '80',
        szUsername = 'admin',
        szPassword = 'haiwei@2024';

      if ("" == szIP || "" == szPort) {
        return;
      }


      let iRet = WebVideoCtrl.I_Login(szIP, 1, szPort, szUsername, szPassword, {
        success: function (xmlDoc) {
          setTimeout(function () {
            getChannelInfo();
            getDevicePort();
            setTimeout(() => {
              clickStartRealPlay()
            }, 500)
            setTimeout(() => {
              clickStartRealPlay1()
            }, 5000)
          }, 10);
        },
        error: function (status, xmlDoc) {
        }
      });

      if (-1 == iRet) {
        console.log(" 已登录过！");
      }
    }

// 获取端口
    function getDevicePort() {
      var szDeviceIdentify = '192.168.2.64';


      var oPort = WebVideoCtrl.I_GetDevicePort(szDeviceIdentify);
      if (oPort != null) {

        console.log(szDeviceIdentify + " 获取端口成功！");
      } else {
        console.log(szDeviceIdentify + " 获取端口失败！");
      }
    }

    function getChannelInfo() {
      var szDeviceIdentify = '192.168.2.64'


      // 模拟通道
      WebVideoCtrl.I_GetAnalogChannelInfo(szDeviceIdentify, {
        async: false,
        success: function (xmlDoc) {
        },
        error: function (status, xmlDoc) {
        }
      });
    }


// 开始预览
    function clickStartRealPlay(iStreamType) {
      var oWndInfo = WebVideoCtrl.I_GetWindowStatus(0),
        szDeviceIdentify = '192.168.2.64',
        iRtspPort = 554,
        iChannelID = 1,
        bZeroChannel = false,
        szInfo = "";

      iStreamType = 1;

      var startRealPlay = function () {
        WebVideoCtrl.I_StartRealPlay(szDeviceIdentify, {
          iRtspPort: iRtspPort,
          iStreamType: iStreamType,
          iChannelID: iChannelID,
          bZeroChannel: bZeroChannel,
          success: function () {
            szInfo = "开始预览成功1！";
            console.log(szDeviceIdentify + " " + szInfo);

          },
          error: function (status, xmlDoc) {
            if (403 === status) {
              szInfo = "设备不支持Websocket取流！";
            } else {
              szInfo = "开始预览失败！";
            }
            console.log(szDeviceIdentify + " " + szInfo);
          }
        });
      };

      if (oWndInfo != null) {// 已经在播放了，先停止
        WebVideoCtrl.I_Stop({
          success: function () {
            startRealPlay();
          }
        });
      } else {
        startRealPlay();
      }
    }

    function clickStartRealPlay1(iStreamType) {
      var oWndInfo = WebVideoCtrl.I_GetWindowStatus(1),
        szDeviceIdentify = '192.168.2.64',
        iRtspPort = 554,
        iChannelID = 2,
        bZeroChannel = false,
        szInfo = "";

      iStreamType = 1;

      var startRealPlay = function () {
        WebVideoCtrl.I_StartRealPlay(szDeviceIdentify, {
          iRtspPort: iRtspPort,
          iStreamType: iStreamType,
          iChannelID: iChannelID,
          bZeroChannel: bZeroChannel,
          success: function () {
            szInfo = "开始预览成功2！";
            console.log(szDeviceIdentify + " " + szInfo);

          },
          error: function (status, xmlDoc) {
            if (403 === status) {
              szInfo = "设备不支持Websocket取流！";
            } else {
              szInfo = "开始预览失败！";
            }
            console.log(szDeviceIdentify + " " + szInfo);
          }
        });
      };

      if (oWndInfo != null) {// 已经在播放了，先停止
        WebVideoCtrl.I_Stop({
          success: function () {
            startRealPlay();
          }
        });
      } else {
        startRealPlay();
      }
    }

    setTimeout(() => {
      clickLogin()
    }, 1000)
  },
  methods: {
    aaaa() {
      var oWndInfo = WebVideoCtrl.I_GetWindowStatus(g_iWndIndex),
        szDeviceIdentify = '192.168.2.64',
        iRtspPort = 554,
        iChannelID = Math.random() > 0.5 ? 1 : 2,
        bZeroChannel = false,
        szInfo = "";

      let iStreamType = 1;

      var startRealPlay = function () {
        WebVideoCtrl.I_StartRealPlay(szDeviceIdentify, {
          iRtspPort: iRtspPort,
          iStreamType: iStreamType,
          iChannelID: iChannelID,
          bZeroChannel: bZeroChannel,
          success: function () {
            szInfo = "开始预览成功1！";
            console.log(szDeviceIdentify + " " + szInfo);

          },
          error: function (status, xmlDoc) {
            if (403 === status) {
              szInfo = "设备不支持Websocket取流！";
            } else {
              szInfo = "开始预览失败！";
            }
            console.log(szDeviceIdentify + " " + szInfo);
          }
        });
      };

      if (oWndInfo != null) {// 已经在播放了，先停止
        WebVideoCtrl.I_Stop({
          success: function () {
            startRealPlay();
          }
        });
      } else {
        startRealPlay();
      }

    }
  }
}
</script>
<style scoped>
.plugin {
  width: 27.3vw;
  height: 23.5vh;
}

.aaa {
  position: absolute;
  top: -20%;
  left: 10%;
}
/deep/ .parent-wnd{
  overflow: unset !important;
  overflow-y: clip !important;
}
</style>
