Working with the Web Plugin Class

The Plugin class lets you manage web browser plugins such as the ActiveX control or Chrome's screen capture extension.

Note that Firefox and Chrome 72+ supports screen capture without an add-on. Safari does not currently support screen capture.

Installing the Chrome Screen Capture Extension

Chrome versions prior to 72 require a browser extension to enable screen capture.  The browser extension also supports sharing audio while sharing a tab so it can be used on Chrome 72+ as well if that feature is required.

You have two options:

  1. Use the extension we have uploaded (https://chrome.google.com/webstore/detail/icelink-webrtc-screen-cap/nidjnlpklmpflfmfflalpddmadlgjckn).
  2. Upload your own copy of the extension, with any desired customizations to branding/naming.

Customizing the Extension

The extension source code can be found in the client SDK under Web/Libraries/fm.icelink.chrome. You can replace the icons with your own branding and make changes to the contact information found in manifest.json. After applying your customizations, simply create a zip archive with the folder contents and upload it to the Chrome Web Store.

Chrome also provides a way for you to test locally prior to uploading an official package:

  1. Navigate to chrome://extensions.
  2. Enable "Developer Mode" in the top right.
  3. Click the "Load Unpacked" button.
  4. Browse to the Web/Libraries/fm.icelink.chrome directory or wherever you have copied the folder contents.

Setting the Extension ID

Finally, you must set the extension ID in your web application. The extension ID is generated for you by the Chrome Web Store when registering your extension, or under chrome://extensions if testing locally with unpacked files. As a best practice, we recommend setting the extension ID immediately after the page has loaded. The extension ID must be set before creating local media.

Setting the Chrome Extension Id
// Chrome screen capture extension registration.
fm.icelink.Plugin.setChromeExtensionId('nidjnlpklmpflfmfflalpddmadlgjckn');

Additional Methods

The Plugin class has a number of functions to assist with managing the Chrome extension in your application:

  • getChromeExtensionId()
  • setChromeExtensionId(chromeExtensionId: string)
  • getChromeExtensionUrl()
  • getChromeExtensionInstalled()
  • getChromeExtensionRequiresUserGesture()
  • setChromeExtensionRequiresUserGesture(chromeExtensionRequiresUserGesture: boolean)

Installing the Internet Explorer ActiveX Control

The client SDK includes an ActiveX control that enables WebRTC features in Internet Explorer using the same JavaScript/TypeScript API you use in other web browsers.

In order to enable the ActiveX control, you must:

  1. Upload the ActiveX cab file to your web server wherever you host your JavaScript files.
  2. Set the path to this ActiveX cab file in your web application.

The ActiveX cab file can be found in the client SDK under Web/Libraries.

Setting the ActiveX Path

To configure the ActiveX plugin:

  1. Create an instance of fm.icelink.PluginConfig.
  2. Call setActiveXPath on this instance with the path to the ActiveX cab file hosted on your server.
  3. Call the static install method with your PluginConfig, which returns a promise.

When the promise resolves, the installation was successful (or an existing installation was detected), and you can proceed with using the SDK the same way you would in any other web browser.

var pluginConfig = new fm.icelink.PluginConfig();
pluginConfig.setActiveXPath("path/to/FM.IceLink.ActiveX.cab");
fm.icelink.Plugin.install(pluginConfig).then(function(result) {
    var localMedia = new fm.icelink.LocalMedia(true, true);
     
    ...
}, function(error) {
    alert('Could not install ActiveX plugin. ' + error.message);
});


These methods are safe to call in all web browsers. The install promise will resolve immediately if the current web browser is not Internet Explorer.

Conflicts with Other Libraries

It is possible for issues to arise if other WebRTC plugins (such as the one from Temasys) are installed in Internet Explorer. To help with this, there is a setPreferActiveX method in PluginConfig to indicate whether the ActiveX control is preferred. Setting the property to true will ensure that the ActiveX control is used. Setting the property to false will load the ActiveX control only if a native WebRTC API interface is not detected.

var pluginConfig = new fm.icelink.PluginConfig();
pluginConfig.setPreferActiveX(true);


Detecting WebRTC Features

The Plugin class has a number of functions to assist with detecting support for specific WebRTC features in browsers that have native RTC capabilities. (This excludes Internet Explorer.):

  • hasRtcPeerConnection()

  • hasRtcDataChannel()

  • hasGetUserMedia()

  • hasRtcIceGatherer()

  • hasRtcDtlsTransport()

  • hasRtcIceTransport()

  • hasRtcRtpSender()

  • hasRtcRtpReceiver()

Detecting Platform Support

The Plugin class also has a few high-level functions to assist with detecting platform support for WebRTC/ORTC in general. These functions are often simpler to use than the above list:

  • hasWebRtc(localMedia?: booleandataChannels?: boolean)

  • hasOrtc(localMedia?: booleandataChannels?: boolean)

  • hasNative(localMedia?: booleandataChannels?: boolean)

hasWebRtc() returns true if the following function returns true:

  • hasRtcPeerConnection()

hasOrtc() returns true if all of the following functions return true:

  • hasRtcIceGatherer()
  • hasRtcIceTransport()
  • hasRtcDtlsTransport()
  • hasRtcRtpSender()
  • hasRtcRtpReceiver()

hasNative() returns true if either of the following functions return true:

  • hasWebRtc()
  • hasOrtc()

The localMedia flag indicates whether the following function must also return true:

  • hasGetUserMedia()

The dataChannels flag indicates whether the following function must also return true:

  • hasRtcDataChannel()