Added RecordRTC v5.2.8 - Merged & closed #94

muaz-khan · Feb 22, 2016 · 0edbb86 · 0edbb86
1 parent deec475
commit 0edbb86
Show file tree

Hide file tree

Showing 10 changed files with 141 additions and 228 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -7,7 +7,7 @@ module.exports = function(grunt) {
         scope: 'devDependencies'
     });
 
-    var banner = '// Last time updated: <%= grunt.template.today("UTC:yyyy-mm-dd h:MM:ss TT Z") %>\n\n';
+    var banner = '\'use strict\';\n\n// Last time updated: <%= grunt.template.today("UTC:yyyy-mm-dd h:MM:ss TT Z") %>\n\n';
 
     // configure project
     grunt.initConfig({

diff --git a/README.md b/README.md
@@ -24,13 +24,13 @@ Please check [dev](https://github.com/muaz-khan/RecordRTC/tree/master/dev) direc
 
 ## Browsers Support:
 
-| Browser        | Support           |
-| ------------- |-------------|
-| Firefox | [Stable](http://www.mozilla.org/en-US/firefox/new/) / [Aurora](http://www.mozilla.org/en-US/firefox/aurora/) / [Nightly](http://nightly.mozilla.org/) |
-| Google Chrome | [Stable](https://www.google.com/intl/en_uk/chrome/browser/) / [Canary](https://www.google.com/intl/en/chrome/browser/canary.html) / [Beta](https://www.google.com/intl/en/chrome/browser/beta.html) / [Dev](https://www.google.com/intl/en/chrome/browser/index.html?extra=devchannel#eula) |
-| Opera | [Stable](http://www.opera.com/) / [NEXT](http://www.opera.com/computer/next)  |
-| Android | [Chrome](https://play.google.com/store/apps/details?id=com.chrome.beta&hl=en) / [Firefox](https://play.google.com/store/apps/details?id=org.mozilla.firefox) / [Opera](https://play.google.com/store/apps/details?id=com.opera.browser) |
-| Microsoft Edge | [Normal Build](https://www.microsoft.com/en-us/windows/microsoft-edge) |
+| Browser        | Support           | Features |
+| ------------- |-------------|-------------|
+| Firefox | [Stable](http://www.mozilla.org/en-US/firefox/new/) / [Aurora](http://www.mozilla.org/en-US/firefox/aurora/) / [Nightly](http://nightly.mozilla.org/) | Audio+Video (Both local/remote) |
+| Google Chrome | [Stable](https://www.google.com/intl/en_uk/chrome/browser/) / [Canary](https://www.google.com/intl/en/chrome/browser/canary.html) / [Beta](https://www.google.com/intl/en/chrome/browser/beta.html) / [Dev](https://www.google.com/intl/en/chrome/browser/index.html?extra=devchannel#eula) | Audio+Video (Both local/remote) |
+| Opera | [Stable](http://www.opera.com/) / [NEXT](http://www.opera.com/computer/next)  | Audio/Vidoe Separately |
+| Android | [Chrome](https://play.google.com/store/apps/details?id=com.chrome.beta&hl=en) / [Firefox](https://play.google.com/store/apps/details?id=org.mozilla.firefox) / [Opera](https://play.google.com/store/apps/details?id=com.opera.browser) | Audio/Vidoe Separately |
+| Microsoft Edge | [Normal Build](https://www.microsoft.com/en-us/windows/microsoft-edge) | Only Audio |
 
 ## How RecordRTC encodes wav/webm?
 
@@ -41,18 +41,18 @@ Please check [dev](https://github.com/muaz-khan/RecordRTC/tree/master/dev) direc
 
 ## RecordRTC Demos
 
-1. [RecordRTC to Node.js](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/RecordRTC-to-Nodejs)
-2. [RecordRTC to PHP](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/RecordRTC-to-PHP)
-3. [RecordRTC to ASP.NET MVC](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/RecordRTC-to-ASPNETMVC)
-4. [RecordRTC & HTML-2-Canvas i.e. Canvas/HTML Recording!](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/Canvas-Recording)
-5. [MRecordRTC i.e. Multi-RecordRTC!](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/MRecordRTC)
+1. [RecordRTC to Node.js](https://github.com/muaz-khan/RecordRTC/tree/master/RecordRTC-to-Nodejs)
+2. [RecordRTC to PHP](https://github.com/muaz-khan/RecordRTC/tree/master/RecordRTC-to-PHP)
+3. [RecordRTC to ASP.NET MVC](https://github.com/muaz-khan/RecordRTC/tree/master/RecordRTC-to-ASPNETMVC)
+4. [RecordRTC & HTML-2-Canvas i.e. Canvas/HTML Recording!](https://github.com/muaz-khan/RecordRTC/tree/master/Canvas-Recording)
+5. [MRecordRTC i.e. Multi-RecordRTC!](https://github.com/muaz-khan/RecordRTC/tree/master/MRecordRTC)
 6. [RecordRTC on Ruby!](https://github.com/cbetta/record-rtc-experiment)
-7. [RecordRTC over Socket.io](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/RecordRTC-over-Socketio)
+7. [RecordRTC over Socket.io](https://github.com/muaz-khan/RecordRTC/tree/master/RecordRTC-over-Socketio)
 8. [ffmpeg-asm.js and RecordRTC! Audio/Video Merging & Transcoding!](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/ffmpeg)
-9. [RecordRTC / PHP / FFmpeg](https://github.com/muaz-khan/WebRTC-Experiment/tree/master/RecordRTC/PHP-and-FFmpeg)
+9. [RecordRTC / PHP / FFmpeg](https://github.com/muaz-khan/RecordRTC/tree/master/PHP-and-FFmpeg)
 10. [Record Audio and upload to Nodejs server](https://www.npmjs.org/package/record-audio)
 11. [ConcatenateBlobs.js](https://github.com/muaz-khan/ConcatenateBlobs) - Concatenate multiple recordings in single Blob!
-12. [Remote stream recording](https://www.webrtc-experiment.com/demos/remote-stream-recording.html)
+12. [Remote audio-stream recording](https://www.webrtc-experiment.com/demos/remote-stream-recording.html) or [a real p2p demo](https://www.webrtc-experiment.com/RTCMultiConnection/RecordRTC-and-RTCMultiConnection.html)
 13. [Mp3 or Wav Recording](https://www.webrtc-experiment.com/RecordRTC/Record-Mp3-or-Wav.html)
 
 ## How to link?
@@ -91,7 +91,7 @@ E.g.
 
 ```html
 <!-- use 5.2.6 or any other version -->
-<script src="https://github.com/muaz-khan/RecordRTC/releases/download/5.2.6/RecordRTC.js"></script>
+<script src="https://github.com/muaz-khan/RecordRTC/releases/download/5.2.8/RecordRTC.js"></script>
 ```
 
 There are some other NPM packages regarding RecordRTC:
@@ -395,6 +395,8 @@ It means that ALL_BROWSERS will be using [StereoAudioRecorder](http://RecordRTC.
 
 This feature brings remote audio recording support in Firefox, and local audio recording support in Microsoft Edge.
 
+Note: Chrome `>=50` supports remote audio+video recording.
+
 You can even force `WhammyRecorder` on Firefox however webp format isn't yet supported in standard Firefox builds. It simply means that, you're skipping MediaRecorder API in Firefox.
 
 ## `type`
@@ -712,51 +714,6 @@ recordRTC.getFromDisk(function(dataURL) {
 
 In the above example; you can see that `recordRTC` instance object is used instead of global `RecordRTC` object.
 
-# Clarifications
-
-## Is WinXP supported?
-
-No WinXP SP2 based "Chrome" support. However, RecordRTC works on WinXP Service Pack 3.
-
-## Is Chrome on Android supported?
-
-RecordRTC uses WebAudio API for stereo-audio recording. AFAIK, WebAudio is not supported on android chrome releases, yet.
-
-Firefox merely supports audio-recording on Android devices.
-
-## Stereo or Mono?
-
-Audio recording fails for `mono` audio. So, try `stereo` audio only.
-
-MediaRecorder API (in Firefox) seems using mono-audio-recording instead.
-
-## Possible issues/failures:
-
-**This section applies only to StereoAudioRecorder:**
-
-Do you know "RecordRTC" fails recording audio because following conditions fails:
-
-1. Sample rate and channel configuration must be the same for input and output sides on Windows i.e. audio input/output devices mismatch
-2. Only the Default microphone device can be used for capturing.
-3. The requesting scheme is none of the following: http, https, chrome, extension's, or file (only works with `--allow-file-access-from-files`)
-4. The browser cannot create/initialize the metadata database for the API under the profile directory
-
-If you see this error message: `Uncaught Error: SecurityError: DOM Exception 18`; it means that you're using `HTTP`; whilst your webpage is loading worker file (i.e. `audio-recorder.js`) from `HTTPS`. Both files's (i.e. `RecordRTC.js` and `audio-recorder.js`) scheme MUST be same!
-
-## Web Audio APIs requirements
-
-1. If you're on Windows, you have to be running WinXP SP3, Windows Vista or better (will not work on Windows XP SP2 or earlier).
-2. On Windows, audio input hardware must be set to the same sample rate as audio output hardware.
-3. On Mac and Windows, the audio input device must be at least stereo (i.e. a mono/single-channel USB microphone WILL NOT work).
-
-## Why stereo?
-
-If you explorer chromium code; you'll see that some APIs can only be successfully called for `WAV` files with `stereo` audio.
-
-Stereo audio is only supported for WAV files.
-
-RecordRTC is unable to record "mono" audio on chrome; however it seems that we can covert channels from "stereo" to "mono" using WebAudio API, though. MediaRecorder API's encoder only support 48k/16k mono audio channel (on Firefox Nightly).
-
 ## Credits
 
 1. [Recorderjs](https://github.com/mattdiamond/Recorderjs) for audio recording

diff --git a/RecordRTC.js b/RecordRTC.js
@@ -1,71 +1,13 @@
-// Last time updated: 2016-01-27 12:46:28 PM UTC
+'use strict';
+
+// Last time updated: 2016-02-22 11:28:21 AM UTC
 
-// links:
 // Open-Sourced: https://github.com/muaz-khan/RecordRTC
-// https://cdn.WebRTC-Experiment.com/RecordRTC.js
-// https://www.WebRTC-Experiment.com/RecordRTC.js
-// npm install recordrtc
-// http://recordrtc.org/
 
-// updates?
-/*
--. Added support for MediaRecorder API in Chrome. Currently requires: RecordRTC(stream, {recorderType: MediaStreamRecorder})
--. mimeType, bitsPerSecond, audioBitsPerSecond, videoBitsPerSecond added.
--. CanvasRecorder.js updated to support Firefox. (experimental)
--. Now you can reuse single RecordRTC object i.e. stop/start/stop/start/ and so on.
--. GifRecorder.js can now record HTMLCanvasElement|CanvasRenderingContext2D as well.
--. added: frameInterval:20 for WhammyRecorder.js
--. chrome issue  audio plus 720p-video recording can be fixed by setting bufferSize:16384
--. fixed Firefox save-as dialog i.e. recordRTC.save('filen-name')
--. "indexedDB" bug fixed for Firefox.
--. numberOfAudioChannels:1 can be passed to reduce WAV size in Chrome.
--. StereoRecorder.js is removed. It was redundant. Now RecordRTC is directly using: StereoAudioRecorder.js
--. mergeProps is removed. It was redundant.
--. reformatProps is removed. Now plz pass exact frameRate/sampleRate instead of frame-rate/sample-rate
--. Firefox supports remote-audio-recording since v28 - RecordRTC(remoteStream, { recorderType: StereoAudioRecorder });
--. added 3 methods: initRecorder, setRecordingDuration and clearRecordedData
--. Microsoft Edge support added (only-audio-yet).
--. You can pass "recorderType" - RecordRTC(stream, { recorderType: StereoAudioRecorder });
--. If MediaStream is suddenly stopped in Firefox.
--. Added "disableLogs"         - RecordRTC(stream, { disableLogs: true });
--. You can pass "bufferSize:0" - RecordRTC(stream, { bufferSize: 0 });
--. You can set "leftChannel"   - RecordRTC(stream, { leftChannel: true });
--. Added functionality for analyse black frames and cut them - pull#293
--. if you're recording GIF, you must link: https://cdn.webrtc-experiment.com/gif-recorder.js
--. You can set "frameInterval" for video - RecordRTC(stream, { type: 'video', frameInterval: 100 });
-*/
-
-//------------------------------------
-
-// Browsers Support::
-// Chrome (all versions) [ audio/video separately ]
-// Firefox ( >= 29 ) [ audio/video in single webm/mp4 container or only audio in ogg ]
-// Opera (all versions) [ same as chrome ]
-// Android (Chrome) [ only video ]
-// Android (Opera) [ only video ]
-// Android (Firefox) [ only video ]
-// Microsoft Edge (Only Audio & Gif)
-
-//------------------------------------
+//--------------------------------------------------
 // Muaz Khan     - www.MuazKhan.com
 // MIT License   - www.WebRTC-Experiment.com/licence
-//------------------------------------
-// Note: RecordRTC.js is using 3 other libraries; you need to accept their licences as well.
-//------------------------------------
-// 1. RecordRTC.js
-// 2. MRecordRTC.js
-// 3. Cross-Browser-Declarations.js
-// 4. Storage.js
-// 5. MediaStreamRecorder.js
-// 6. StereoAudioRecorder.js
-// 7. CanvasRecorder.js
-// 8. WhammyRecorder.js
-// 9. Whammy.js
-// 10. DiskStorage.js
-// 11. GifRecorder.js
-//------------------------------------
-
-'use strict';
+//--------------------------------------------------
 
 // ____________
 // RecordRTC.js
@@ -889,7 +831,7 @@ function MRecordRTC(mediaStream) {
      * recorder.startRecording();
      */
     this.startRecording = function() {
-        if (!isChrome && mediaStream && mediaStream.getAudioTracks && mediaStream.getAudioTracks().length && mediaStream.getVideoTracks().length) {
+        if (isMediaRecorderCompatible() && mediaStream && mediaStream.getAudioTracks && mediaStream.getAudioTracks().length && mediaStream.getVideoTracks().length) {
             // Firefox is supporting both audio/video in single blob
             this.mediaType.audio = false;
         }
@@ -1237,6 +1179,30 @@ if (typeof MediaStream === 'undefined' && typeof webkitMediaStream !== 'undefine
 /*global MediaStream:true */
 if (typeof MediaStream !== 'undefined' && !('stop' in MediaStream.prototype)) {
     MediaStream.prototype.stop = function() {
+        if (!this.getAudioTracks && !!this.getTracks) {
+            this.getAudioTracks = function() {
+                var array = [];
+                this.getTracks.forEach(function(track) {
+                    if (track.kind.toString().indexOf('audio') !== -1) {
+                        array.push(track);
+                    }
+                });
+                return array;
+            };
+        }
+
+        if (!this.getVideoTracks && !!this.getTracks) {
+            this.getVideoTracks = function() {
+                var array = [];
+                this.getTracks.forEach(function(track) {
+                    if (track.kind.toString().indexOf('video') !== -1) {
+                        array.push(track);
+                    }
+                });
+                return array;
+            };
+        }
+
         this.getAudioTracks().forEach(function(track) {
             track.stop();
         });
@@ -1419,9 +1385,9 @@ function isMediaRecorderCompatible() {
  * @example
  * var options = {
  *     mimeType: 'video/mp4', // audio/ogg or video/webm
- *     audioBitsPerSecond : 128000,
- *     videoBitsPerSecond : 2500000,
- *     bitsPerSecond: 2500000  // if this is provided, skip above two
+ *     audioBitsPerSecond : 256 * 8 * 1024,
+ *     videoBitsPerSecond : 256 * 8 * 1024,
+ *     bitsPerSecond: 256 * 8 * 1024  // if this is provided, skip above two
  * }
  * var recorder = new MediaStreamRecorder(MediaStream, options);
  * recorder.record();
@@ -1437,8 +1403,10 @@ function isMediaRecorderCompatible() {
  */
 
 function MediaStreamRecorder(mediaStream, config) {
+    var self = this;
+
     config = config || {
-        // bitsPerSecond: 128000,
+        // bitsPerSecond: 256 * 8 * 1024,
         mimeType: 'video/webm'
     };
 
@@ -1482,6 +1450,11 @@ function MediaStreamRecorder(mediaStream, config) {
             mediaRecorder = null;
         }
 
+        if (isChrome && !isMediaRecorderCompatible()) {
+            // to support video-only recording on stable
+            recorderHints = 'video/vp8';
+        }
+
         // http://dxr.mozilla.org/mozilla-central/source/content/media/MediaRecorder.cpp
         // https://wiki.mozilla.org/Gecko:MediaRecorder
         // https://dvcs.w3.org/hg/dap/raw-file/default/media-stream-capture/MediaRecorder.html
@@ -1502,11 +1475,11 @@ function MediaStreamRecorder(mediaStream, config) {
 
         // Dispatching OnDataAvailable Handler
         mediaRecorder.ondataavailable = function(e) {
-            if (this.dontFireOnDataAvailableEvent) {
+            if (self.dontFireOnDataAvailableEvent) {
                 return;
             }
 
-            if (!e.data) {
+            if (!e.data || !e.data.size) {
                 return;
             }
 
@@ -1623,20 +1596,19 @@ function MediaStreamRecorder(mediaStream, config) {
     };
 
     this.onRecordingFinished = function() {
-        /**
-         * @property {Blob} blob - Recorded frames in video/webm blob.
-         * @memberof MediaStreamRecorder
-         * @example
-         * recorder.stop(function() {
-         *     var blob = recorder.blob;
-         * });
-         */
-
         var that = this;
 
         bufferToDataUrl(recordedBuffers, function(dataURL) {
             var file = dataUrlToFile(dataURL);
 
+            /**
+             * @property {Blob} blob - Recorded frames in video/webm blob.
+             * @memberof MediaStreamRecorder
+             * @example
+             * recorder.stop(function() {
+             *     var blob = recorder.blob;
+             * });
+             */
             that.blob = new Blob(recordedBuffers, {
                 type: config.mimeType || 'video/webm'
             });
@@ -2301,7 +2273,7 @@ function CanvasRecorder(htmlElement, config) {
         }
     });
 
-    if(!!window.webkitRTCPeerConnection || !!window.webkitGetUserMedia) {
+    if (!!window.webkitRTCPeerConnection || !!window.webkitGetUserMedia) {
         isCanvasSupportsStreamCapturing = false;
     }
 

diff --git a/RecordRTC.min.js b/RecordRTC.min.js
diff --git a/dev/Cross-Browser-Declarations.js b/dev/Cross-Browser-Declarations.js
@@ -81,6 +81,30 @@ if (typeof MediaStream === 'undefined' && typeof webkitMediaStream !== 'undefine
 /*global MediaStream:true */
 if (typeof MediaStream !== 'undefined' && !('stop' in MediaStream.prototype)) {
     MediaStream.prototype.stop = function() {
+        if (!this.getAudioTracks && !!this.getTracks) {
+            this.getAudioTracks = function() {
+                var array = [];
+                this.getTracks.forEach(function(track) {
+                    if (track.kind.toString().indexOf('audio') !== -1) {
+                        array.push(track);
+                    }
+                });
+                return array;
+            };
+        }
+
+        if (!this.getVideoTracks && !!this.getTracks) {
+            this.getVideoTracks = function() {
+                var array = [];
+                this.getTracks.forEach(function(track) {
+                    if (track.kind.toString().indexOf('video') !== -1) {
+                        array.push(track);
+                    }
+                });
+                return array;
+            };
+        }
+
         this.getAudioTracks().forEach(function(track) {
             track.stop();
         });

diff --git a/dev/MRecordRTC.js b/dev/MRecordRTC.js
@@ -63,7 +63,7 @@ function MRecordRTC(mediaStream) {
      * recorder.startRecording();
      */
     this.startRecording = function() {
-        if (!isChrome && mediaStream && mediaStream.getAudioTracks && mediaStream.getAudioTracks().length && mediaStream.getVideoTracks().length) {
+        if (isMediaRecorderCompatible() && mediaStream && mediaStream.getAudioTracks && mediaStream.getAudioTracks().length && mediaStream.getVideoTracks().length) {
             // Firefox is supporting both audio/video in single blob
             this.mediaType.audio = false;
         }