temasys/adapterjs

AdapterJS Javascript Polyfill and Tools for WebRTC - Skylink WebRTC

Creating a common API for WebRTC in the browser

Find the most recent version hosted on our CDN.

• Minified version: //cdn.temasys.io/adapterjs/0.15.x/adapter.min.js
• Debug version //cdn.temasys.io/adapterjs/0.15.x/adapter.debug.js
• Minified version (with screensharing changes): //cdn.temasys.io/adapterjs/0.15.x/adapter.screenshare.min.js
• Debug version (with screensharing changes)//cdn.temasys.io/adapterjs/0.15.x/adapter.screenshare.js

Part of the Skylink WebRTC toolkit.

Compatibility

AdapterJS provides polyfills and cross-browser helpers for WebRTC. It wraps around the native APIs in Chrome, Opera and Firefox and provides support for WebRTC in Internet Explorer and Safari on Mac and Windows through the available Temasys Browser Plugins.

Supported Browsers & Platform functionality

Browsers	Min. Version	OS Platform	Screensharing
Chrome \ Chromium	38	MacOS / Win / Ubuntu / Android	Yes (w Extension)
Firefox	33	MacOS / Win / Ubuntu / Android	Yes (w Extension for 51 and below)
Opera	26	MacOS / Win / Ubuntu / Android	Yes (if configured with extension)
Edge	13.10547^	Win	-
Bowser	0.6.1	iOS 9.x only**	-
Safari (Native)	11	MacOS 10.13.x and iOS 11	No. Use Safari with the Temasys plugin***
Safari (Plugin)	7	MacOS	Yes (custom build Plugin)
IE (Plugin)	9	Win	Yes (custom build Plugin)

*Note that currently Edge doesn't support RTCDataChannel API.

**There seems to be issues for Bowser version 0.6.1 working with iOS 10.x version.

*** To use the Temasys plugin on Safari 11 and above, set the flag AdapterJS.options.forceSafariPlugin = true BEFORE including AdapterJS.

How it looks like if WebRTC is not supported by browser

In versions of IE and Safari that don't support WebRTC natively, AdapterJS will suggest to the user to install the Temasys WebRTC plugin for Mac or Windows when you try to access the getUserMedia or RTCPeerConnection API.

Using and setting up the AdapterJS dependency

Required initialization

In order to execute any WebRTC related code, you have to wait for the AdapterJS.webRTCReady function to trigger the callback parameter as it is triggered when the WebRTC interfaces is ready to be used by the browser.

Note that AdapterJS.onwebrtcready is deprecated.

AdapterJS.webRTCReady(function(isUsingPlugin) {
    // The WebRTC API is ready.
    //isUsingPlugin: true is the WebRTC plugin is being used, false otherwise
    getUserMedia(constraints, successCb, failCb);
});

To find more information about how to optimize your application for the Temasys WebRTC Plugin, read it more in the Temasys WebRTC Plugin Documentation.

---

Functionality

Polyfills

• RTCPeerConnection
• RTCIceCandidate
• RTCSessionDescription
• MediaStreamTrack
• navigator.getUserMedia
• navigator.mediaDevices.getUserMedia
• navigator.mediaDevices.enumerateDevices

Helper functions

attachMediaStream(element, stream) : None

  getUserMedia({ audio: true, video: true }, function (stream) {
    attachMediaStream(videoElm, stream);
  }, ...);

This is taken over for compatibility with the original adapter.js from Google. Feeds a MediaStream object into video and audio tags. Calling attachMediaStream(element, null) will detach any existing stream from the element. The stream will still be running and available to be attached to any rendering element.

• Parameters:

  • element: (DOM Element) The <video> or <audio> DOM element.
  • stream: (DOM Element) The MediaStream object.

• Returns: None

reattachMediaStream(elementFrom, elementTo) : None

  reattachMediaStream(videoWithStreamElm, videoElm);

This is taken over for compatibility with adapter.js from Google. Feeds a MediaStream from one video or audio tag into another.

• Parameters:

  • elementFrom: (DOM Element) The <video> or <audio> DOM element that has been attached with an existing MediaStream from attachMediaStream() API.
  • elementTo: (DOM Element) The <video> or <audio> DOM element to copy the MediaStream from the elementFrom DOM element parameter.

• Returns: None

---

Helper variables

webrtcDetectedBrowser : String

This displays the browser WebRTC browser agent name. Defined as null when it's an unknown WebRTC supported browser.

• Expected values:

  • "chrome": Chrome or Chromium implemented browser.
  • "firefox": Firefox browser.
  • "safari": Safari browser.
  • "edge": Edge browser.
  • "opera": Opera browser.
  • "IE": IE browser.
  • "bowser": Bowser browser.

webrtcDetectedVersion : Number

This displays the browser WebRTC browser agent version. Defined as null when it's an unknown WebRTC supported browser.

webrtcMinimumVersion : Number

This displays the browser WebRTC browser agent version. Defined as null when it's an unknown WebRTC supported browser. The values follows the Supported Browsers minimum versions section.

webrtcDetectedType : String

This displays the browser WebRTC implementation type. Defined as null when it's an unknown WebRTC supported browser.

• Expected values:

  • "webkit": Webkit implementation of webrtc.
  • "moz": Mozilla implementation of webrtc.
  • "plugin": Temasys plugin implementation of webrtc.
  • "ms": Edge implementation of webrtc (polyfilled from ORTC).

webrtcDetectedDCSupport : String

This displays the browser WebRTC Datachannel support type. Defined as null when it's an unknown WebRTC supported browser or when WebRTC supported browser does not support the Datachannel API.

• Expected values:

  • "SCTP": SCTP enabled datachannel.
  • "RTP": RTP enabled datachannel.

---

Using Screensharing functionality

Note that the Firefox add-on not installed detection will not work with window.navigator.mediaDevices on Firefox browsers to prevent errors.

AdapterJS 0.12.0+ offers cross-browser screensharing in Chrome 34+, Firefox 33+ and with a licensed copy of our Temasys WebRTC Plugin in IE 9+ and Safari 7.1+. (For plugin licensing interest please contact sales (a) temasys.com.sg)

To use the screensharing functionality, reference publish/adapter.screenshare.js and add the mediaSource: 'window' setting to the video media constraints. This requires HTTPS!

Note that the the mediaSource property takes in String, or Array in which multiple sources is supported for Chrome / Opera sources. For Firefox, if an Array is provided, it takes the first item in the Array.

Example:

window.navigator.getUserMedia({
  video: {
    mediaSource: 'window' || 'screen' || ['tab', 'audio'] || ['window' || 'screen']
  }
}, function (stream) {
  console.log('Received stream', stream);
}, function (error) {
  console.log('Failed getting stream', error);
});

List of valid screensharing (mediaSource) sources:

Sources	Description	Browsers that supports it
"window"	Fetches the list of application windows	Chrome, Opera, Firefox, IE, Safari
"screen"	Fetches the list of display screens	Chrome, Opera, Firefox, IE, Safari
"tab"	Fetches the list of browser tabs	Chrome, Opera
"browser"	Fetches the list of browser windows	Firefox (Requires to configure about:config to enable media.getusermedia.browser.enabled)
"application"	Fetches the list of applications	Firefox
"camera"	Fetches the list of cameras	Firefox
["tab", "audio"]	Fetches "tab" with its audio	Chrome, Opera (Enable constraints.audio to retrieve tab audio)
["window", "screen"]	Fetches "screen" and "window"	Chrome, Opera, IE, Safari
["window", "screen", "tab"]	Fetches "screen", "window" and "tab"	Chrome, Opera
["window", "tab"]	Fetches "window" and "tab"	Chrome, Opera
["screen", "tab"]	Fetches "screen" and "tab"	Chrome, Opera
AdapterJS.WebRTCPlugin.plugin.screensharingKeys.screenOrWindow	Same as ["window","screen"]	IE, Safari
AdapterJS.WebRTCPlugin.plugin.screensharingKeys.screensharingKey	Deprecated. Same as ["window","screen"].	IE, Safari
AdapterJS.WebRTCPlugin.plugin.screensharingKeys.screen	Same as "screen"	IE, Safari
AdapterJS.WebRTCPlugin.plugin.screensharingKeys.window	Deprecated. Same as "window".	IE, Safari

Configuring extension settings:

To configure your AdapterJS screensharing extensions, configure this before referencing the script for adapter.screenshare.js as an example:

var AdapterJS = {};

/**
 * Configure extension settings. For developers using "adapter.screenshare.js"
 */
AdapterJS.extensionInfo = {
  chrome: {
    // Configure the extension ID for Chrome
    extensionId: 'xxx',
    // Configure the extension webstore link for Chrome
    extensionLink: 'xxx',
    // Configure the extension iframe link (detectRTC) for Chrome - for older Chrome extension codebase
    iframeLink: 'xxx'
  },
  firefox: {
    // Configure the addon link (legacy if available and uploaded before restriction) for Firefox 51 and below
    extensionLink: 'xxx'
  },
  opera: {
    // Configure the extension ID for Opera
    extensionId: 'xxx',
    // Configure the extension webstore link for Opera
    extensionLink: 'xxx'
  }
};

Setup this project

1. Install or update to at lest version 0.10.26 of node and version 1.4.6 of npm.
2. Install grunt-cli. (See: http://gruntjs.com/getting-started)
3. Run npm install to install dev dependencies.
4. Run npm install -g browserify and npm install -g testling (might require sudo) to install the necessary tools to test locally

Development

• Run grunt jshint to run jshint on its own.
• Run grunt publish to create production debug and minified copies of the source/ files with the webrtc/adapter dependency compiled in the publish/ folder.

Folders

publish/

Contains the debug version of the library and a minified copy of it.

• adapter.debug.js: Contains the compiled AdapterJS with webrtc/adapter dependency.
• adapter.min.js: Contains the minified and production ready version of adapter.debug.js.
• adapter.screenshare.js: Contains the compiled adapter.debug.js with Screensharing polyfill changes.
• adapter.screenshare.min.js: Contains the minified and production ready version of adapter.screenshare.js.

source/

Contains the AdapterJS library development files.

• adapter.js: Contains the polyfills and APIs for Temasys Plugin WebRTC interface.
• adapter.screenshare.js: Contains the polyfills for Screensharing changes.
• pluginInfo.js: Contains the Temasys Plugin information. Modify this for your custom Temasys Plugin.

tests/

Run grunt test to generate the published versions of adapter.js (same as grunt publish) and run the automated test suite on it. You can configure the browser to test in Gruntfile.js (see the karma target). You can also run grunt karma to run the test and bypass the publish step.

(Mac only) If you are testing the Temasys WebRTC Plugin, you can run osascript tests/mac.watcher.scpt to automatically validate the permission popup.

License

APACHE 2.0 - http://www.apache.org/licenses/LICENSE-2.0.html

adapterjs's Issues

Preserving granted device permissions in IE

Currently every time the getUserMedia function is called – the Temasys WebRTC Plugins asks the user for device permissions in system pop-up window.

What is the way to preserve granted permissions in order to not annoy users?

renderNotificationBar namespacing incorrect?

I have the feeling that renderNotificationBar should be namespaced Temasys.AdapterJS instead of Temasys.WebRTCPlugin.

@serrynaimo @letchoo please validate and make the associated changes if needed.

Complete support for multi-stream calls and renegotiation

Hello.

Currently plugin supports renegotiation in general, but I cannot make use of it because of these problems:

1. lack of support for PC.removeStream(), see #51
2. When I add a new stream to PC on the other side - onaddstream event is fired and I succesfilly obtain a new stream object. But when I attach it to rendering (video) element (instead of the old one) - video track from the stream is not displayed (i.e. the first stream had only audio, and the new one - audio + video). Or if the first stream had both audio and video, and the new only video - rendeding element doesn't become black, it just displays whe last frame from previous stream. So general problem is when a rendering element already has an attached stream, and I try to attach another one instead - it does not honor new or removed stream tracks.
3. When I add a new stream to the connection (also on the other side), renegotiate peers - closing peer connection causes Safari to freeze.
4. When I remove stream from the connection on the other side - onremovestream event doesn't fire.

0.10.5: In IE 9, opening the console before the page loads doesn't show any logs

It is noted that in this fix:

// IE 9 is not offering an implementation of console.log until you open a console
  if (typeof console !== 'object' || typeof console.log !== 'function') {
    /* jshint -W020 */
    console = {} || console;
    // Implemented based on console specs from MDN
    // You may override these functions
    console.log = function (arg) {};
    console.info = function (arg) {};
    console.error = function (arg) {};
    console.dir = function (arg) {};
    console.exception = function (arg) {};
    console.trace = function (arg) {};
    console.warn = function (arg) {};
    console.count = function (arg) {};
    console.debug = function (arg) {};
    console.count = function (arg) {};
    console.time = function (arg) {};
    console.timeEnd = function (arg) {};
    console.group = function (arg) {};
    console.groupCollapsed = function (arg) {};
    console.groupEnd = function (arg) {};
    /* jshint +W020 */
  }

This was to prevent the adapterjs from running into errors when console is not opened, but however when the console is opened in IE9 before the page loads, it should appear the logs, which it doesn't.

IE 9 quirks mode breaking addEventListener

IE 9 enters a "quirks mode" whenever a HTML document does not start with
When doing so, attachEvent is defined, and not addEventListener on which the adapter relies to inject the plugin.

How the reproduce:

• Access any page which does not start with

Expected:

• The plugin is injected, the WebRTC interface is available

Observed:

• IE enters quirks mode and sends an error saying that addEventListener does not exits;

Plugin i10n

What do you think about it? It would be great to allow localization of installation/GUM popups via separate javascript language files/plugin initialization settings. I could help with making a Russian language pack. Natively implemented GUM popups in Chrome/Firefox are, of course, localized :)

getUserMedia works wrong

Hey guys,
When I path to the getUserMedia { audio: true, video: false } I still can select video in the popup window. After it I'll be able to get video stream from the stream object in the getUserMedia success callback.
Thanks!

Incorrect interface for MediaStreamTrack.getSourceInfos

The adapter is currently showing MediaStreamTrack.getSource instead of MediaStreamTrack.getSourceInfos

Keep both for compatibility purposes.

Both getUserMedia callbacks are called simultaneously

When camera is already in use (by another getUserMedia call) and next getUserMedia call prompts device selection dialog and same camera is selected (which works fine for native implementation) both success and failure callbacks are called.

Error callback gets error object containing message that constraints are not fulfilled.
Success callback gets stream object which is valid but contains no audio/video stream tracks (depends on initial constraints).

This behaviour is wrong since only one callback should be called and in this case - error callback.

Thanks.

Safari/Explorer plugin bugs/features

Using latest plugin version 0.8.826, Safari 7.1, Mac OSX 10.9 Maverics

1.It would be great to have a public documentation like MDN or MSDN, which would describe functionality implemented in your plugin.
2. These methods seem to be not implemented: MediaStream.getTracks(), RTCPeerConnection.removeStream(), at least in Safari 7.1 their type is undefined. Both of them exist in latest W3C Draft and are implemented in Chrome and Firefox.
3. Plugin causes Safari to freeze when closing connection in this order:

1. call RTCPeerConnection.close() -> call MediaStream.stop() for local stream from context of oniceconnectionstatechange (iceConnectionState=closed) callback. This sequence always freezes Safari.
2. call MediaStream.stop() for local stream -> call RTCPeerConnection.close(). This sequence freezes Safari from time to time (not always).

May be it is some how related to #23 ?

MediaStreamTrack has no prototype

In order to check how to properly close/stop a MediaStream I check whether the MediaStreamTrack.prototype.stop exists or not. However the MediaStreamTrack implementation of the plugin has no prototype (it is undefined).

Would it be easy to add it? Otherwise I'll use another approach to check the existence of the stop method.

Make AdapterJS work with EasyRTC

We had to patch AdapterJS slightly to make it work with EasyRTC, see comment here:

https://github.com/priologic/easyrtc/issues/121#issuecomment-78211330

Basically, AdapterJS' attachMediaSource replaces the video tag with an object tag. Later on, attachMediaSource fails if one passes a newly created object due to missing properties and functions.

RTCIceServer.urls now supported by firefox

Since version 38 (GA will be released in May) FF supports RTCIceServer.urls property and throws deprecation warning when using RTCIceServer.url. So FF RTCPeerConnection polyfill should be changed to:

RTCPeerConnection = function (pcConfig, pcConstraints) {
    if (webrtcDetectedVersion < 38) {
      AdapterJS.maybeFixConfiguration(pcConfig);
    }
    return new mozRTCPeerConnection(pcConfig, pcConstraints);
  };

Modifying Peer Connection object

Hi,

I have a question related to modifying objects which plugin return. For now I'm trying to delete some properties in peer connection object (which is instance of plugin) in IE and received following error:

Object doesn't support this action

Seems to be a problem because plugin return [IFBComJavascript object]. Also JSON.stringify(), if I pass to it this object, throw stack overflow error.

Do I have any possibility to manage this object like native javascript object?
Thanks in advance.

Calling PeerConnection.removeStream() leads to "undefined is not a function"

Hi,

I have a use-case when I need to remove streams from peer connection and by calling _pc.removeStream(stream) where _pc is RTCPeerConnection leading to undefined is not a function (evaluating '_pc.removeStream(stream)').

I checked RTCPeerConnection object and it's prototype and removeStream is defined in prototype but somehow not exposed properly.

Yes, I forgot to mention: I'm running Safari 8.

Is there a workaround for this?

Implementing plugin callback without touching AdapterJS file

If I want to implement theAdapterJS.WebRTCPlugin.pluginNeededButNotInstalledCb callback the source code says that it needs to be overridden but what I don't want to do is to end up using a custom AdapterJS version. Also it would be nice to be able to pass options. For example like this:

window.AdapterJS = {
    options: {
        hidePluginInstallPrompt: true
    },
    WebRTCPlugin: {
        pluginNeededButNotInstalledCb: function() {
            //Do something when the plugin is not installed
        }
    }
};

Installing Temasys plugin in IE11 on Windows 7 causes IE to crash on GUM

I have just uninstalled and re-installed Temasys in my Windows 7 VM using the following link:
http://bit.ly/1w0jWB1

I understand this is the link to your latest version of the plugin, but once installed, it shows v0.8.801.0

Once this version is installed, restarting IE and calling GUM crashes IE.

I do not understand why the old version of your plugin is getting installed from this link? Any ideas?

Here is the log from the crash:
Podpis problému:
Název události problému: APPCRASH
Název aplikace: IEXPLORE.EXE
Verze aplikace: 11.0.9600.17207
Časové razítko aplikace: 53a20c50
Název chybného modulu: npTemWebRTCPlugin.dll
Verze chybného modulu: 0.8.801.0
Časové razítko chybného modulu: 54365535
Kód výjimky: c0000005
Posun výjimky: 0059d786
Verze operačního systému: 6.1.7601.2.1.0.768.3
ID národního prostředí: 1029
Další informace 1: 0a9e
Další informace 2: 0a9e372d3b4ad19135b953a78882e789
Další informace 3: 0a9e
Další informace 4: 0a9e372d3b4ad19135b953a78882e789

Přečtěte si prohlášení o zásadách ochrany osobních údajů online:
http://go.microsoft.com/fwlink/?linkid=104288&clcid=0x0405

Pokud není k dispozici Prohlášení o zásadách ochrany osobních údajů online, přečtěte si toto prohlášení offline:
C:\Windows\system32\cs-CZ\erofflps.txt

Take a snapshot

Hi guys,

Are you planing to add some functionality to take a snapshots from camera?
Can't draw image in canvas from object that is returned from plugin.

Thanks in advance.

Rework attachMediaStream() plugin implementation for better integration

It is general practice to hide the orignal element with style="display:none", not remove completely. Then you could restore it easily, and all of it's properties (even changed while working with plugin) would be preserved.
Currently, yes, we have such a use case: by default video tag is opaque and user sees a picture behind it. When a call starts - peer's stream it attached to this video element. When a call ends video tag should becomes opaque again (that's why we need to detach media stream from it). And between calls some video files may be played in this video tag. Of course we could just replace video tag with a new one every time, but i think it is a bad approach.
Also, this approach might be helpful in listening to video element events. For example, you hide video element and listen to it's "volumechange" event to enable/disable stream audio tracks. That would solve #34. So generally, user interracts with original video element, and you just proxy it's events to your plugin in some way. Of couse this approach needs investigation and testing, but i find it possible and perspective.

Conserning ID management:

Usually it is done this way: you leave original ID on it's place, and set ID of your inserted content to something like 'ID_plugin'. Then, when user want to manipulate original element some way - he can get it by original ID and does not get any mess. But when he uses attachMediaStream(), for example (calls one of your API methods), this method transparetly converts ID to ID_plugin and takes actions in favor of your inserted content.
General idea here is that you transparently insert some new content and user (developer) even doesn't notice that, when working with original element's or your plugin's public API.
For example, in method "attachMediaStream" it could look like this:

function attachMediaStream(element, stream) {
var object_element = document.getElementById(element.id + '_plugin');
element = object_element;
...

Temasys camera / mic selection box blank

Randomly, but quite frequently, and I think only in the latest version of the Temasys plugin, I have been noticing that in Safari Version 7.1.2 (9537.85.11.5) OSX Mavericks when calling gUM, the camera / mic selection box shows blank, with only the OK option showing (see attached screenshot - I saved the console log also but can not attach it here.

Clicking OK then does not access my camera and mic, and no video or audio.

is sent to the recipient.

reloading OSX Safari 7.1 Mavericks after a call using Temasys plugin fails

Hi there,

another one I'm afraid - it seems consistent after ending a call in Safari OSX Mavricks using your plugin, if I try to reload the page to make another call the page fails to reload. I have to kill safari and open it again to be able to reload the page and make another call.

Please let me know if you need any more details in how to reproduce this issue.

Thanks

Jamie

Redundant code (II)

    var downloadLink = AdapterJS.WebRTCPlugin.pluginInfo.downloadLink;
    if(downloadLink) {
      var popupString;
      if (AdapterJS.WebRTCPlugin.pluginInfo.downloadLink) {

browserify version doesnt actually export anything

the AdapterJS object is created but never exported via module.exports

<video muted="true"> does not work

<video autoplay muted='true'></video>

This seems not to work as there is audio (it should be muted). IMHO the following could be the reason:

 attachMediaStream = function (element, stream) {
      stream.enableSoundTracks(true);

The point is, how to mute or change the volume of the "video" / "object" element? which API is implemented?

Get raw audio data from media stream?

I'd like to pipe the microphone audio data into a Web Audio API chain. In Chrome or Firefox, I would just create a MediaStreamSource with AudioContext.createMediaStreamSource(mediaStream) (see https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaStreamSource) and pass the mediaStream I get from the onSuccess event from getUserMedia.

Anyhow the AudioContext of Safari does not provide the createMediaStreamSource() method, since it makes no sense without (native) getUserMedia. The method is also not polyfilled by AdapterJS. I wonder if I could instead access the raw audio data from the temasys mediaStream JSAPI-object and write into a BufferSourceNode. Is anyone aware if this is possible?
Or are there even any plans to polyfill the AudioContext.createMediaStreamSource() in Safari. That would be awesome!

MediaStreamTrack.getSources() and Firefox

You have a polyfill for this method in Firefox and it returns two devices - audio and video. I think it would be better to return an empy list here because:
There are three possible alternatives:

1. User has a device, and we know that because getSources() is supported, and it returned that device.
2. User does'not have a device, and we know that because getSources() is supported, but it returned no device.
3. We do not know actually - no getSources() support.
   Currently Firefox is the third case, but implemented as the first one. I think that 'unknown' is nearer to 'no' than to 'yes', because 'no' may also be considered as 'unknown' in case user has a device, but it is not plugged in or something like this.
   With the current implementation I have to add an extra "if" clause to check for Firefox to get an actually known device list.

Questions about __TemWebRTCReady0

__TemWebRTCReady0 = function () {
  arguments.callee.StaticWasInit = arguments.callee.StaticWasInit || 1;
  if (arguments.callee.StaticWasInit === 1) {
    AdapterJS.WebRTCPlugin.documentReadyInterval = setInterval(function () {
      if (document.readyState === 'complete') {
        // TODO: update comments, we wait for the document to be ready
        clearInterval(AdapterJS.WebRTCPlugin.documentReadyInterval);
        AdapterJS.WebRTCPlugin.pluginState = AdapterJS.WebRTCPlugin.PLUGIN_STATES.READY;
      }
    }, 100);
  }
  arguments.callee.StaticWasInit++;
};

Questions:

• Why isn't this function declared with var?
• Must it be a global function (I mean, should it exist in the window global namespace)? Could it be a local function not exposed in window?
• It seems to set the plugin state to READY once the DOM becomes ready, but it just does it if arguments.callee.StaticWasInit === 1. Otherwise it increments StaticWasInit and does NOT set READY state. In which case could StaticWasInit has a value != 1?
• Is this method related to loading the plugin in two different tabs of the browser?
• ECMAScript 5 forbids the use of arguments.callee in strict mode: link. Could not the same effect be implemented by using a local counter variable or a counter within the AdapterJS.WebRTCPlugin object?

newElement.attachEvent not supported in IE11

I have noticed that for IE you are assigning the onplaying event for "newElement" in a way that only supports IE9 and lower.

Can I suggest the following that covers IE10 / 11 too?

newElement.onplaying = (element.onplaying) ? element.onplaying : function (arg) {};
if (isIE) { // on IE the event needs to be plugged manually
if(newElement.addEventListener){
newElement.addEventListener('onplaying', newElement.onplaying);
}else if(newElement.attachEvent){
newElement.attachEvent('onplaying', newElement.onplaying);
}

Cheers!

Jamie

Using AdapterJS in header causes problems when no Plugin is installed in IE or Safari

document.body.appendChild is triggered before body is available.

Redundant code

      // IE will only start the plugin if it's ACTUALLY visible
      if (isIE) {
        AdapterJS.WebRTCPlugin.plugin.width = '1px';
        AdapterJS.WebRTCPlugin.plugin.height = '1px';
      }
      AdapterJS.WebRTCPlugin.plugin.width = '1px';
      AdapterJS.WebRTCPlugin.plugin.height = '1px';

width and height are set anyhow.

parentObject.insertBefore throwing an exception

Hi there,

we use the Temasys plugin within an iFrame, and have found that in IE11 and Safari 5 PC / 7 OSX the following lines throw an exception:

var rectObject = element.getBoundingClientRect();
element.parentNode.insertBefore(frag, element); //exception thrown
frag = document.getElementById(elementId);
frag.width = rectObject.width + 'px';
frag.height = rectObject.height + 'px';
element.parentNode.removeChild(element); //exception thrown

Commenting them out allows the connection to take place, but the Temasys object gets inserted into the top level page, not into the iframe, and the caller has no local or remote video.

Please let me know if you need more info.

Thanks, and keep up the great work!
Jamie

Add support for Bowser

Bowser from Ericsson supports webrtc, but it doesn't seem to work with adapter.js. Please update adapter.js to support Bowser.

Resize of a streamed video

Hey guys! I want to remind you topic about the video resize - https://groups.google.com/forum/#!topic/temasys-discuss-webrtcplugin/_laLEsuaYSo
Is it possible to have some video resize event?
Thanks!

How to get peer connections statistics

Hi.

Haven't found any info about getStats usage. Could you help me, how to correctly call getStats method in peer connection?

Thanks.

IE11 on Windows 8 listing unplugged camera

My colleague has a logitech c920 camera installed on their system, and it is plugged in when starting IE.

He later unplugs the camera, and reloads the page that uses the Temasys plugin, calling gUM.

The Temasys plugin shows the camera that has been unplugged, and trying to access it causes a gUMFailed event.

If the camera is not plugged in it should not be visible in the in the device list.

IE crashed

Hey one more again.
There were IE crashes when plugin found updates.
There was no issue before new plugin version became available and after plugin update.

Problem signature:
Problem Event Name: APPCRASH
Application Name: IEXPLORE.EXE
Application Version: 11.0.9600.17416
Application Timestamp: 5452eed9
Fault Module Name: npTemWebRTCPlugin.dll
Fault Module Version: 0.8.826.0
Fault Module Timestamp: 54d048cc
Exception Code: c0000005
Exception Offset: 005aa380
OS Version: 6.3.9600.2.0.0.256.4
Locale ID: 1033
Additional Information 1: 5861
Additional Information 2: 5861822e1919d7c014bbb064c64908b2
Additional Information 3: a10f
Additional Information 4: a10ff7d2bb2516fdc753f9c34fc3b069

Read our privacy statement online:
http://go.microsoft.com/fwlink/?linkid=280262

If the online privacy statement is not available, please read our privacy statement offline:
C:\WINDOWS\system32\en-US\erofflps.txt

iceServers .urls does not allow an Array

According to the current spec .urls should accept an URL string or a sequence of them:

dictionary RTCIceServer {
      (DOMString or sequence<DOMString>) urls;

However the plugin completely ignores the urls entries if it contains an Array. This is:

• This works and relay candidates are gathered:

iceServers: [{
    urls: 'turn:turn.example.com:1234?transport=udp',
    username: 'foo',
    credential: '1234f'
}]

• This does not work (no relay candidates are retrieved at all):

iceServers: [{
    urls: ['turn:turn.example.com:1234?transport=udp'],
    username: 'foo',
    credential: '1234f'
}]

Is this a limitation? or should it already work?

Thanks a lot.

Plugin not activating on IE 10

• run any plugin test on IE 10

Expected result:
the plugin runs

Actual result:
The plugin works as long as there is no callback in it.
It can return a value, but not make a JS callback

window.onwebrtcready is never fired

The adapter.js file says:

If you need to do something once the page/plugin is ready, override window.onwebrtcready instead.

But the fact is that setting something like window.onwebrtcready = function() { console.warn('onwebrtcready'); } does nothing.

coordinate with peerjs to support our free plugin

peers/peerjs#216

try to find a way that reuse adapter.js as much as possible to ease updates on peerjs side.

Add method createOfferOptions

It would be great to add a new polyfill to handle differences in createOffer options dict. Firefox already supports (from version 33-34) a new syntax http://www.w3.org/TR/webrtc/#idl-def-RTCOfferOptions (and throws deprecation warning when using "mandatory: {}"). Googgle Chrome still doesn't accept new syntax, I did not yet check the plugin. To fix this I use this helper function. I think it's place is in AdapterJS library :)

/**
* Create options dict for RTCPeerConnection.createOffer()
* @see http://www.w3.org/TR/webrtc/#idl-def-RTCOfferOptions for param description
* 
* @param recieveAudio
* @param recieveVideo
* @param iceRestart
* @param voiceDetection
* 
* @returns {Object}
*/
function createOfferOptions(recieveAudio, recieveVideo, iceRestart, voiceDetection) {
    var options;

    iceRestart = iceRestart || false;
    voiceDetection = voiceDetection === false ? false : true;

    // current spec: http://www.w3.org/TR/webrtc/#idl-def-RTCOfferOptions
    if (webrtcDetectedBrowser === 'firefox' && webrtcDetectedVersion >= 36) {
        options = {
            offerToReceiveAudio:    recieveAudio,
            offerToReceiveVideo:    recieveVideo,
            iceRestart:             iceRestart,
            voiceActivityDetection: voiceDetection
        };
    }

    // old spec: http://www.w3.org/TR/2013/WD-webrtc-20130910/#constraints
    else {
        options = {mandatory: {
            OfferToReceiveAudio:    (recieveAudio ? true : false),
            OfferToReceiveVideo:    (recieveVideo ? true : false),
            IceRestart:             iceRestart,
            VoiceActivityDetection: voiceDetection
        }};
    }

    return options;
}

callWhenPluginReady() is slow

  AdapterJS.WebRTCPlugin.callWhenPluginReady = function (callback) {
    var checkPluginReadyState = setInterval(function () {
      if (AdapterJS.WebRTCPlugin.pluginState === AdapterJS.WebRTCPlugin.PLUGIN_STATES.READY) {
        clearInterval(checkPluginReadyState);
        callback();
      }
    }, 100);
  };

This means that, even if the plugin state is READY (this is, the DOM is "complete") it will take 100ms for the callback to be called.

If plugin state is READY this function should immediately execute the callback.

MediaStream and getVideoTracks / getAudioTracks

Hi guys,

I try to get a real name of device and have incorrect behaviour.
When I use getUserMedia() method and call getAudioTracks() / getVideoTracks() with "stream" here, Temasys plugin returns non-readable string. Something like this: "J+fpdCSBad".

I would like to get name like as "Microphone (Logitech USB Headset)".
Also this correct information we have after calling GetSources() method.

I know about this case (some code from adapter.js):

  // Fake get{Video,Audio}Tracks
  if (!MediaStream.prototype.getVideoTracks) {
    MediaStream.prototype.getVideoTracks = function () {
      return [];
    };
  }
  if (!MediaStream.prototype.getAudioTracks) {
    MediaStream.prototype.getAudioTracks = function () {
      return [];
    };
  }

But could you clarify can I get a real name of device from "stream"?
Or I can not access to there.

Thanks.

What is hasCredentials?

iceServers[i].hasCredentials = AdapterJS.
            isDefined(iceServers[i].username) &&
            AdapterJS.isDefined(iceServers[i].credential);

Why is that hasCredentials for? is that needed for the plugin to properly connect to TURN servers?

Plugin does not launch in IE

IE 11.0.9600.xxx Windows 7 SP1 x64.

Intalled plugin, restarted IE, tried to make a call, but got "navigator.getUserMedia is undefined". window.getUserMedia is also undefined. "AdapterJS.onwebrtcready" does not fire, no errors in developer console except when trying to access WebRTC methods as described above. Extension details:

Name:                          Plugin allowing browser without native handling of WebRTC to actually use it
Vendor:                     (Not verified) Temasys
Type:                          ActiveX element
Arch:                         32-bit
Version:                       0.8.826
File date:                   ‎3 ‎february ‎2015 , ‏‎12:04
Last access date:      ‎1 ‎april ‎2015, ‏‎14:11
Class ID:                    {38CD4193-5EEE-5B7E-BA60-9AF497EE2C59}
Usage count:            7
Blocks count:            0
File:                         npTemWebRTCPlugin.dll
Directory:                        C:\Users\Дмитрий\AppData\Roaming\Tem\TemWebRTCPlugin\0.8.826

Plugin init issue

Even though I register callback for onwebrtcready and once it's called I try to create peer connection I get such kind of error Exception: TypeError: undefined is not a function (evaluating 'o.WebRTCPlugin.plugin.PeerConnection(o.WebRTCPlugin.pageId,a,i,r)').
Browser is Safari 8.

On plugin update

Guys, do you have any events for plugin as onReadyForUpdate or any other update configs? I can't find any info about it.
Thanks!

Allow attachMediaStream() to detach stream by passing null

It is often needed to not only attach, but also detach media stream from video/audio element. Detaching code looks almost like attaching one, and logically it might be a good decision to use attachMediaStream() for it like this:
attachMediaStream(element, null)

The only thing that needs to be changed in attachMediaStream() is line "element.src = URL.createObjectURL(stream);" to "element.src = (stream === null ? "" : URL.createObjectURL(stream));", and also disable video.play() in Firefox-specific attachMediaStream() version.
It may also be done via a separate function, but it will be just code duplicate.

Do not IO Block and waste million of CPU cycles

following up on this specific part of the code

There is a method named Temasys.WebRTCPlugin.WaitForPluginReady whose job is to turn JS into IO Blocking by entering in an infinite loop.

Forcibly turning an event driven language into IO Blocking is a failure to realize that this is an async operation.

You are bringing thousands of machines to their knees, wasting million of CPU cycles because you fail to grasp how this is an async operation and how to handle it. The very nature of JS, being a single threaded language, should not even allow Temasys.WebRTCPlugin.isPluginReady to ever become true, you got away with pure luck here.

Considering you are wildy distributing this code, I strongly suggest you refactor this and all the methods (they are plenty) that invoke it.

Free camera resource on MedaiStream.stop()

Calling MediaStream.stop() doesn't free camera lock since usage indicator (LED) is still on.