ulvis.paste.net

Paste Search Dynamic
Recent pastes
html5
  1. <html>
  2. <head>
  3.     <meta charset="utf-8">
  4.     <style>
  5.         /* video {
  6.             position: absolute;
  7.             top: -10000;
  8.             left: -10000;
  9.         }
  10.  
  11.         canvas {
  12.             position: absolute;
  13.             top: -10000;
  14.             left: -10000;
  15.         }*/
  16.     </style>
  17. </head>
  18. <body>
  19.     <video></video>
  20.     <canvas id="canvas"></canvas>
  21.     <img>
  22.     <button class='record'>Поехали!</button>
  23.     <script>
  24.  
  25.         const video = document.querySelector('video');
  26.         const image = document.querySelector('img');
  27.         const canvas = document.getElementById('canvas');
  28.         const ctx = canvas.getContext('2d');
  29.  
  30.         document.querySelector('button').onclick = () => {
  31.             window.navigator.mediaDevices.getUserMedia({
  32.                 audio: false,
  33.                 video: true
  34.             }).then((stream) => {
  35.                 video.srcObject = stream;
  36.                 video.onloadedmetadata = function(e) {
  37.                     video.play();
  38.                 };
  39.             }).catch(() => {
  40.                 console.error('oh noes');
  41.             });
  42.         };
  43.     </script>
  44. </body>
  45. </html>
Parsed in 0.000 seconds