OLD | NEW |
(Empty) | |
| 1 /* |
| 2 * Copyright 2017 The Chromium Authors. All rights reserved. |
| 3 * Use of this source code is governed by a BSD-style license that can be |
| 4 * found in the LICENSE file. |
| 5 */ |
| 6 'use strict'; |
| 7 |
| 8 var dimensions = document.querySelector('#dimensions'); |
| 9 var video = document.querySelector('video'); |
| 10 var stream; |
| 11 |
| 12 var vgaButton = document.querySelector('#vga'); |
| 13 var qvgaButton = document.querySelector('#qvga'); |
| 14 var hdButton = document.querySelector('#hd'); |
| 15 var fullHdButton = document.querySelector('#full-hd'); |
| 16 |
| 17 vgaButton.onclick = function() { |
| 18 getMedia(vgaConstraints); |
| 19 }; |
| 20 |
| 21 qvgaButton.onclick = function() { |
| 22 getMedia(qvgaConstraints); |
| 23 }; |
| 24 |
| 25 hdButton.onclick = function() { |
| 26 getMedia(hdConstraints); |
| 27 }; |
| 28 |
| 29 fullHdButton.onclick = function() { |
| 30 getMedia(fullHdConstraints); |
| 31 }; |
| 32 |
| 33 var qvgaConstraints = { |
| 34 video: {width: {exact: 320}, height: {exact: 240}} |
| 35 }; |
| 36 |
| 37 var vgaConstraints = { |
| 38 video: {width: {exact: 640}, height: {exact: 480}} |
| 39 }; |
| 40 |
| 41 var hdConstraints = { |
| 42 video: {width: {exact: 1280}, height: {exact: 720}} |
| 43 }; |
| 44 |
| 45 var fullHdConstraints = { |
| 46 video: {width: {exact: 1920}, height: {exact: 1080}} |
| 47 }; |
| 48 |
| 49 function gotStream(mediaStream) { |
| 50 window.stream = mediaStream; // stream available to console |
| 51 video.srcObject = mediaStream; |
| 52 } |
| 53 |
| 54 function displayVideoDimensions() { |
| 55 if (!video.videoWidth) { |
| 56 setTimeout(displayVideoDimensions, 500); |
| 57 } |
| 58 dimensions.innerHTML = 'Actual video dimensions: ' + video.videoWidth + |
| 59 'x' + video.videoHeight + 'px.'; |
| 60 } |
| 61 |
| 62 video.onloadedmetadata = displayVideoDimensions; |
| 63 |
| 64 function getMedia(constraints) { |
| 65 if (stream) { |
| 66 stream.getTracks().forEach(function(track) { |
| 67 track.stop(); |
| 68 }); |
| 69 } |
| 70 |
| 71 navigator.mediaDevices.getUserMedia(constraints) |
| 72 .then(gotStream) |
| 73 .catch(function(e) { |
| 74 var message = 'getUserMedia error: ' + e.name; |
| 75 alert(message); |
| 76 console.log(message); |
| 77 }); |
| 78 } |
OLD | NEW |