react-webcam-capture
Version:
react-webcam-capture is Multimedia capturing module via React, using HTML5 MediaDevice and MediaRecorder API
1 lines • 12.6 kB
JavaScript
!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("react"));else if("function"==typeof define&&define.amd)define(["react"],t);else{var r=t("object"==typeof exports?require("react"):e.React);for(var o in r)("object"==typeof exports?exports:e)[o]=r[o]}}(this,function(e){return function(e){function t(o){if(r[o])return r[o].exports;var n=r[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,t),n.l=!0,n.exports}var r={};return t.m=e,t.c=r,t.d=function(e,r,o){t.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(r,"a",r),r},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,r){r(1),e.exports=r(2)},function(e,t){!function(e){"use strict";function t(e){if("string"!=typeof e&&(e+=""),/[^a-z0-9\-#$%&'*+.\^_`|~]/i.test(e))throw new TypeError("Invalid character in header field name");return e.toLowerCase()}function r(e){return"string"!=typeof e&&(e+=""),e}function o(e){var t={next:function(){var t=e.shift();return{done:void 0===t,value:t}}};return m.iterable&&(t[Symbol.iterator]=function(){return t}),t}function n(e){this.map={},e instanceof n?e.forEach(function(e,t){this.append(t,e)},this):Array.isArray(e)?e.forEach(function(e){this.append(e[0],e[1])},this):e&&Object.getOwnPropertyNames(e).forEach(function(t){this.append(t,e[t])},this)}function i(e){if(e.bodyUsed)return Promise.reject(new TypeError("Already read"));e.bodyUsed=!0}function a(e){return new Promise(function(t,r){e.onload=function(){t(e.result)},e.onerror=function(){r(e.error)}})}function s(e){var t=new FileReader,r=a(t);return t.readAsArrayBuffer(e),r}function u(e){var t=new FileReader,r=a(t);return t.readAsText(e),r}function c(e){for(var t=new Uint8Array(e),r=Array(t.length),o=0;t.length>o;o++)r[o]=String.fromCharCode(t[o]);return r.join("")}function d(e){if(e.slice)return e.slice(0);var t=new Uint8Array(e.byteLength);return t.set(new Uint8Array(e)),t.buffer}function f(){return this.bodyUsed=!1,this._initBody=function(e){if(this._bodyInit=e,e)if("string"==typeof e)this._bodyText=e;else if(m.blob&&Blob.prototype.isPrototypeOf(e))this._bodyBlob=e;else if(m.formData&&FormData.prototype.isPrototypeOf(e))this._bodyFormData=e;else if(m.searchParams&&URLSearchParams.prototype.isPrototypeOf(e))this._bodyText=""+e;else if(m.arrayBuffer&&m.blob&&w(e))this._bodyArrayBuffer=d(e.buffer),this._bodyInit=new Blob([this._bodyArrayBuffer]);else{if(!m.arrayBuffer||!ArrayBuffer.prototype.isPrototypeOf(e)&&!g(e))throw Error("unsupported BodyInit type");this._bodyArrayBuffer=d(e)}else this._bodyText="";this.headers.get("content-type")||("string"==typeof e?this.headers.set("content-type","text/plain;charset=UTF-8"):this._bodyBlob&&this._bodyBlob.type?this.headers.set("content-type",this._bodyBlob.type):m.searchParams&&URLSearchParams.prototype.isPrototypeOf(e)&&this.headers.set("content-type","application/x-www-form-urlencoded;charset=UTF-8"))},m.blob&&(this.blob=function(){var e=i(this);if(e)return e;if(this._bodyBlob)return Promise.resolve(this._bodyBlob);if(this._bodyArrayBuffer)return Promise.resolve(new Blob([this._bodyArrayBuffer]));if(this._bodyFormData)throw Error("could not read FormData body as blob");return Promise.resolve(new Blob([this._bodyText]))},this.arrayBuffer=function(){return this._bodyArrayBuffer?i(this)||Promise.resolve(this._bodyArrayBuffer):this.blob().then(s)}),this.text=function(){var e=i(this);if(e)return e;if(this._bodyBlob)return u(this._bodyBlob);if(this._bodyArrayBuffer)return Promise.resolve(c(this._bodyArrayBuffer));if(this._bodyFormData)throw Error("could not read FormData body as text");return Promise.resolve(this._bodyText)},m.formData&&(this.formData=function(){return this.text().then(h)}),this.json=function(){return this.text().then(JSON.parse)},this}function p(e){var t=e.toUpperCase();return _.indexOf(t)>-1?t:e}function l(e,t){t=t||{};var r=t.body;if(e instanceof l){if(e.bodyUsed)throw new TypeError("Already read");this.url=e.url,this.credentials=e.credentials,t.headers||(this.headers=new n(e.headers)),this.method=e.method,this.mode=e.mode,r||null==e._bodyInit||(r=e._bodyInit,e.bodyUsed=!0)}else this.url=e+"";if(this.credentials=t.credentials||this.credentials||"omit",!t.headers&&this.headers||(this.headers=new n(t.headers)),this.method=p(t.method||this.method||"GET"),this.mode=t.mode||this.mode||null,this.referrer=null,("GET"===this.method||"HEAD"===this.method)&&r)throw new TypeError("Body not allowed for GET or HEAD requests");this._initBody(r)}function h(e){var t=new FormData;return e.trim().split("&").forEach(function(e){if(e){var r=e.split("="),o=r.shift().replace(/\+/g," "),n=r.join("=").replace(/\+/g," ");t.append(decodeURIComponent(o),decodeURIComponent(n))}}),t}function y(e){var t=new n;return e.split(/\r?\n/).forEach(function(e){var r=e.split(":"),o=r.shift().trim();if(o){var n=r.join(":").trim();t.append(o,n)}}),t}function b(e,t){t||(t={}),this.type="default",this.status="status"in t?t.status:200,this.ok=this.status>=200&&300>this.status,this.statusText="statusText"in t?t.statusText:"OK",this.headers=new n(t.headers),this.url=t.url||"",this._initBody(e)}if(!e.fetch){var m={searchParams:"URLSearchParams"in e,iterable:"Symbol"in e&&"iterator"in Symbol,blob:"FileReader"in e&&"Blob"in e&&function(){try{return new Blob,!0}catch(e){return!1}}(),formData:"FormData"in e,arrayBuffer:"ArrayBuffer"in e};if(m.arrayBuffer)var v=["[object Int8Array]","[object Uint8Array]","[object Uint8ClampedArray]","[object Int16Array]","[object Uint16Array]","[object Int32Array]","[object Uint32Array]","[object Float32Array]","[object Float64Array]"],w=function(e){return e&&DataView.prototype.isPrototypeOf(e)},g=ArrayBuffer.isView||function(e){return e&&v.indexOf(Object.prototype.toString.call(e))>-1};n.prototype.append=function(e,o){e=t(e),o=r(o);var n=this.map[e];this.map[e]=n?n+","+o:o},n.prototype.delete=function(e){delete this.map[t(e)]},n.prototype.get=function(e){return e=t(e),this.has(e)?this.map[e]:null},n.prototype.has=function(e){return this.map.hasOwnProperty(t(e))},n.prototype.set=function(e,o){this.map[t(e)]=r(o)},n.prototype.forEach=function(e,t){for(var r in this.map)this.map.hasOwnProperty(r)&&e.call(t,this.map[r],r,this)},n.prototype.keys=function(){var e=[];return this.forEach(function(t,r){e.push(r)}),o(e)},n.prototype.values=function(){var e=[];return this.forEach(function(t){e.push(t)}),o(e)},n.prototype.entries=function(){var e=[];return this.forEach(function(t,r){e.push([r,t])}),o(e)},m.iterable&&(n.prototype[Symbol.iterator]=n.prototype.entries);var _=["DELETE","GET","HEAD","OPTIONS","POST","PUT"];l.prototype.clone=function(){return new l(this,{body:this._bodyInit})},f.call(l.prototype),f.call(b.prototype),b.prototype.clone=function(){return new b(this._bodyInit,{status:this.status,statusText:this.statusText,headers:new n(this.headers),url:this.url})},b.error=function(){var e=new b(null,{status:0,statusText:""});return e.type="error",e};var T=[301,302,303,307,308];b.redirect=function(e,t){if(-1===T.indexOf(t))throw new RangeError("Invalid status code");return new b(null,{status:t,headers:{location:e}})},e.Headers=n,e.Request=l,e.Response=b,e.fetch=function(e,t){return new Promise(function(r,o){var n=new l(e,t),i=new XMLHttpRequest;i.onload=function(){var e={status:i.status,statusText:i.statusText,headers:y(i.getAllResponseHeaders()||"")};e.url="responseURL"in i?i.responseURL:e.headers.get("X-Request-URL"),r(new b("response"in i?i.response:i.responseText,e))},i.onerror=function(){o(new TypeError("Network request failed"))},i.ontimeout=function(){o(new TypeError("Network request failed"))},i.open(n.method,n.url,!0),"include"===n.credentials&&(i.withCredentials=!0),"responseType"in i&&m.blob&&(i.responseType="blob"),n.headers.forEach(function(e,t){i.setRequestHeader(t,e)}),i.send(void 0===n._bodyInit?null:n._bodyInit)})},e.fetch.polyfill=!0}}("undefined"!=typeof self?self:this)},function(e,t,r){"use strict";function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function n(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var r=0;t.length>r;r++){var o=t[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}return function(t,r,o){return r&&e(t.prototype,r),o&&e(t,o),t}}(),s=r(3),u=function(e){return e&&e.__esModule?e:{default:e}}(s);"https:"!==location.protocol&&"localhost"!==location.hostname&&console.warn("getUserMedia() must be run from a secure origin: https or localhost.\nChanging protocol to https."),navigator.mediaDevices||navigator.getUserMedia||console.warn("Your browser doesn't support navigator.mediaDevices.getUserMedia and navigator.getUserMedia."),navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;var c=window.MediaStream||window.webkitMediaStream;void 0===c||"stop"in c.prototype||(c.prototype.stop=function(){(void 0).getAudioTracks().forEach(function(e){e.stop()}),(void 0).getVideoTracks().forEach(function(e){e.stop()})});var d=function(e){function t(){var e,r,i,a;o(this,t);for(var s=arguments.length,u=Array(s),c=0;s>c;c++)u[c]=arguments[c];return r=i=n(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(u))),i.state={asked:!1,permission:!1,available:!1,recording:!1,paused:!1},i.stream=null,i.mediaRecorder=null,i.mediaChunk=[],i.handleSuccess=function(e){i.props.autoPlay&&i.props.setStreamToVideo(e),i.stream=e,i.mediaChunk=[],i.setState({permission:!0,asked:!0,recording:!1}),i.props.onGranted(),i.initMediaRecorder()},i.handleFailed=function(e){i.setState({asked:!1}),i.props.onDenied(e)},i.getUserMedia=function(){var e=i.props.constraints;if(navigator.mediaDevices)navigator.mediaDevices.getUserMedia(e).then(i.handleSuccess).catch(i.handleFailed);else if(navigator.getUserMedia)navigator.getUserMedia(e,i.handleSuccess,i.handleFailed);else{var t="Browser doesn't support UserMedia API. Please try with another browser.";console.warn(t),i.props.onError(Error(t))}},i.initMediaRecorder=function(){try{var e={},t=["video/webmcodecs=vp8","video/webm",""];i.props.mimeType&&t.unshift(i.props.mimeType);for(var r=0;t.length>r;r++){var o=t[r];if(MediaRecorder.isTypeSupported(o)){e.mimeType=o;break}console.warn(o+" is not supported on your browser.")}var n=new MediaRecorder(i.stream,e);n.ondataavailable=function(e){e.data&&e.data.size>0&&i.mediaChunk.push(event.data)},i.mediaRecorder=n,i.setState({available:!0})}catch(e){console.log(e),console.error("Failed to initialize MediaRecorder.",e),i.setState({available:!1})}},i.start=function(){i.state.available&&(i.mediaChunk=[],i.mediaRecorder.start(i.props.timeSlice),i.setState({recording:!0}),i.props.onStart(i.stream))},i.pause=function(){i.state.recording&&(i.mediaRecorder.stop(),i.setState({paused:!0}),i.props.onPause())},i.resume=function(){i.state.recording&&(i.initMediaRecorder(),i.mediaRecorder.start(i.props.timeSlice),i.setState({paused:!1}),i.props.onResume(i.stream))},i.stop=function(){if(i.state.available){i.mediaRecorder.stop(),i.setState({recording:!1});var e=new Blob(i.mediaChunk,{type:"video/webm"});i.props.onStop(e),i.getUserMedia()}},a=r,n(i,a)}return i(t,e),a(t,[{key:"componentDidMount",value:function(){this.getUserMedia()}},{key:"componentWillUnmount",value:function(){this.mediaRecorder=null,this.mediaChunk=[],this.stream.stop(),this.stream=null}},{key:"render",value:function(){return u.default.createElement("div",{className:this.props.className},this.props.render({start:this.start,stop:this.stop,pause:this.pause,resume:this.resume}))}}]),t}(s.Component);d.defaultProps={constraints:{audio:!0,video:!0},autoPlay:!0,className:"",timeSlice:0,mimeType:"",setStreamToVideo:function(){},render:function(){},onGranted:function(){},onDenied:function(){},onStart:function(){},onStop:function(){},onPause:function(){},onResume:function(){},onError:function(){}},t.default=d},function(t,r){t.exports=e}])});