Two-way video is working.

- In tab #1 join the room and then click to start sending video.
- In tab #2 join the room and then click to start sending video.

Video is received and decoded automatically, if the remote
peer sends it. However the local video is sent only on demand.

src/web_app/js/appcontroller.js

@@ -134,6 +134,8 @@ var AppController = function (loadingParams) {
       }.bind(this));
     }
 
+    console.log('Config:', this.loadingParams_);
+
     this.roomLink_ = '';
     this.roomSelection_ = null;
     this.localStream_ = null;
@@ -425,6 +427,8 @@ AppController.prototype.transitionToActive_ = function () {
       console.warn('Click somewhere to run VPX encoder.');
       document.body.addEventListener('click', () => {
         const sendFrame = () => {
+          if (dc.readyState != 'open')
+            return;
           const time = Date.now();
           localContext2d.drawImage(this.miniVideo_, 0, 0, width, height);
           const {data: rgba} = localContext2d.getImageData(0, 0, width, height);
@@ -455,7 +459,7 @@ AppController.prototype.transitionToActive_ = function () {
         if (frames.length != 1)
           console.warn(`Decoded ${frames.length} frames`);
 
-        console.log(`IVF frames decoded: ${Date.now() - time} ms, ${packets.length} bytes`);
+        console.log(`IVF frame decoded: ${Date.now() - time} ms, ${packets.length} bytes`);
       };
     }
   }
@@ -682,11 +686,13 @@ AppController.prototype.loadUrlParams_ = function () {
   this.loadingParams_.videoRecvBitrate = urlParams['vrbr'];
   this.loadingParams_.videoRecvCodec = urlParams['vrc'] || DEFAULT_VIDEO_CODEC;
   this.loadingParams_.videoFec = urlParams['videofec'];
+
   this.loadingParams_.libvpx = urlParams['libvpx'];
   this.loadingParams_.videoCodec = urlParams['codec']; // vp8, vp9, etc.
   this.loadingParams_.videoWidth = urlParams['width']; // 640
   this.loadingParams_.videoHeight = urlParams['height']; // 480
   this.loadingParams_.videoFps = urlParams['fps']; // 30
+
   /* eslint-enable dot-notation */
 };
 

src/web_app/js/libvpx.js

@@ -17,8 +17,10 @@ const Codecs = {
   VP9: 0x30395056,
 };
 
-const YUV_FILE = '/vpx-yuv';
-const IVF_FILE = '/vpx-ivf';
+const ENC_IVF_FILE = "/vpx-enc-ivf"; // vpx encoder writes here
+const ENC_YUV_FILE = "/vpx-enc-yuv"; // vpx encoder read here
+const DEC_IVF_FILE = "/vpx-dec-ivf"; // vpx decoder reads here
+const DEC_YUV_FILE = "/vpx-dec-yuv"; // vpx decoder writes here
 
 class LibVPX {
   constructor() {
@@ -27,7 +29,8 @@ class LibVPX {
     this.height = 480;
     this.fps = 10;
 
-    this._initialized = false;
+    this._encInitialized = false;
+    this._decInitialized = false;
     this._lastIvfSize = 0;
 
     this._loadWasm('/wasm/libvpx/libvpx.js');
@@ -56,10 +59,10 @@ class LibVPX {
 
     // console.log(`Encoding ${width}x${height} with ${codec} fourcc:${fourcc}`);
 
-    if (!this._initialized) {
+    if (!this._encInitialized) {
       console.warn('initializing vpx encoder');
       _vpx_js_encoder_open(fourcc, width, height, this.fps || 30);
-      this._initialized = true;
+      this._encInitialized = true;
     }
 
     // - Copy RGBA data to the WASM memory.
@@ -70,22 +73,22 @@ class LibVPX {
     HEAP8.set(rgbaData, rgbaPtr);
     _vpx_js_rgba_to_yuv420(yuvPtr, rgbaPtr, width, height);
     const yuvData = new Uint8Array(HEAP8.buffer, yuvPtr, yuvSize);
-    FS.writeFile(YUV_FILE, yuvData); // in-memory memfs emscripten file
+    FS.writeFile(ENC_YUV_FILE, yuvData); // in-memory memfs emscripten file
     _free(rgbaPtr);
     _free(yuvPtr);
 
     const forceKeyframe = 0;
     _vpx_js_encoder_run(forceKeyframe);
 
-    const ivfSize = FS.stat(IVF_FILE).size;
-    const ivfFile = FS.open(IVF_FILE, 'r');
+    const ivfSize = FS.stat(ENC_IVF_FILE).size;
+    const ivfFile = FS.open(ENC_IVF_FILE, 'r');
     const ivfData = new Uint8Array(ivfSize - this._lastIvfSize);
     FS.read(ivfFile, ivfData, 0, ivfData.length, this._lastIvfSize);
     FS.close(ivfFile);
     this._lastIvfSize = ivfSize;
 
-    // console.log(IVF_FILE, 'size:', FS.stat(IVF_FILE).size >> 10, 'KB');
-    // console.log(YUV_FILE, 'size:', FS.stat(YUV_FILE).size >> 10, 'KB');
+    // console.log(ENC_YUV_FILE, 'size:', FS.stat(ENC_YUV_FILE).size >> 10, 'KB');
+    // console.log(ENC_IVF_FILE, 'size:', FS.stat(ENC_IVF_FILE).size >> 10, 'KB');
 
     return ivfData;
   }
@@ -98,15 +101,15 @@ class LibVPX {
 
     // Append new IVF data to the /vpx-ivf file.
 
-    const ivfFile = FS.open(IVF_FILE, 'a');
-    const ivfSize = FS.stat(IVF_FILE).size;
+    const ivfFile = FS.open(DEC_IVF_FILE, 'a');
+    const ivfSize = FS.stat(DEC_IVF_FILE).size;
     FS.write(ivfFile, ivfData, 0, ivfData.length, ivfSize);
     FS.close(ivfFile);
 
-    if (!this._initialized) {
+    if (!this._decInitialized) {
       console.warn('initializing vpx decoder');
       _vpx_js_decoder_open();
-      this._initialized = true;
+      this._decInitialized = true;
     }
 
     // Run the VPX decoder.
@@ -115,7 +118,7 @@ class LibVPX {
 
     // Read the new YUV frames written by the decoder.
 
-    const yuvFrames = FS.readFile(YUV_FILE);
+    const yuvFrames = FS.readFile(DEC_YUV_FILE);
     if (yuvFrames.length % yuvSize != 0)
       console.warn('Wrong YUV size:', yuvFrames.length, '%', yuvSize, '!= 0');
 
@@ -137,8 +140,8 @@ class LibVPX {
     _free(rgbaPtr);
     _free(yuvPtr);
 
-    // console.log(IVF_FILE, 'size:', FS.stat(IVF_FILE).size >> 10, 'KB');
-    // console.log(YUV_FILE, 'size:', FS.stat(YUV_FILE).size >> 10, 'KB');
+    // console.log(DEC_IVF_FILE, 'size:', FS.stat(DEC_IVF_FILE).size >> 10, 'KB');
+    // console.log(DEC_YUV_FILE, 'size:', FS.stat(DEC_YUV_FILE).size >> 10, 'KB');
 
     return rgbaFrames;
   }