@{
    ViewBag.Title = "StartCamera";
}

<script src="~/ligerUI/js/ligerui.all.js"></script>
<script src="~/ligerUI/js/ligerui.min.js"></script>

@*<iframe allow="microphone;camera;midi;encrypted-media;">
</iframe>*@

<div style="width:900px;height:200px">

    <video id="video"  autoplay playsinline  style="width:300px;height:200px;border:groove;display:inline-block"></video>

    <button id="startbutton" autoplay playsinline style="width:50px;height:50px;border:groove;display:inline-block" onclick="takePhoto()">拍照</button>

    <canvas id="canvas" autoplay playsinline style="width: 300px; height: 200px; border: groove; display: inline-block"></canvas>

    <button id="queding" autoplay playsinline style="width:50px;height:50px;border:groove;display:inline-block" onclick="shangchuan()">确定</button>

</div>

<script type="text/javascript">

    //$('iframe').attr({ 'allow': 'microphone;camera' });


    //$("#iframe").allow = "microphone;camera";

    //var a = $("#iframe").allow;

    //console.log(a);

    //var iframe = document.querySelector('#player-iframe')
    //if (iframe) {
    //    console.log(iframe, '获得iframe标签')
    //    iframe.allow = 'microphone *;camera *'
    //}

    //var test = $("#iframe");

    ////console.log(test.allow);

    //test.allow = 'microphone;camera';

    //console.log(test.allow);


    //var a = $("#iframe").val();
    //console.log($("#iframe").allow);

    //$("#iframe").allow = 'microphone;camera';

    //console.log($("#iframe").allow);

    //var iframeEl = this.$refs.iframes
    //if (iframeEl) {
    //    console.log(iframeEl, '获得iframe标签');
    //    iframeEl.allow = 'microphone;camera'
    //}

  // 获取视频和画布元素

  const video = document.querySelector('#video');
  const canvas = document.querySelector('#canvas');
  const startButton = document.querySelector('#startbutton');

  // 启动摄像头
  async function startCamera() {
    const stream = await navigator.mediaDevices.getUserMedia({
      video: true
    });
    video.srcObject = stream;
    video.play();
  }

  // 拍照
  function takePhoto() {
    canvas.width = video.videoWidth;
    canvas.height = video.videoHeight;
    canvas.getContext('2d').drawImage(video, 0, 0);
  }
    try {
        // 启动摄像头
        startCamera();
    } catch (e) {
        alert(e);
    }


  // 在按钮上绑定拍照事件
    //startButton.addEventListener('click', takePhoto);

    function shangchuan() {
        var a = document.getElementById('canvas').toDataURL();
        $.ajax({
                 url:"@Url.Action("Xin_savePhoto", "Common")",
                 data: { base64img:a },
                 type: 'post',
                 cache: false,
                 dataType: 'json',
                 success: function (data1)
                 {
                     if (data1 != null)
                     {
                         hqsj(data1);
                         window.close();
                     }
                 }
                 });
        /*dataURL = canvas.toDataURL('image/jpeg');*/
    }

    //给父组件传值
    function hqsj(jdmc) {
        var dialog = frameElement.dialog; //调用页面的dialog对象(ligerui对象)
        $.ligerDialog.success("成功!", '提示信息', function () {
            dialog.close();     //关闭窗口
            dialog.get("sucCall")(jdmc); //向父页面返回数据v
        });
    }
</script>