Custom LocalMedia in JavaScript

The JavaScript SDK supports limited customization of LocalMedia via the parameters you pass in. The simplest use case is to simply pass in boolean parameters:

var audio = true;
var video = true;
var localMedia = new fm.icelink.LocalMedia(audio, video);

For more control, the video parameter can be an instance of fm.icelink.VideoConfig, letting you specify a desired width, height, and frame-rate:

var audio = true;
var video = new fm.icelink.VideoConfig(width, height, frameRate);
var localMedia = new fm.icelink.LocalMedia(audio, video);

For more advanced or experimental use cases, the audio and/or video parameters can be HTML5-compliant MediaTrackConstraints definitions:

var audio = {
    sampleSize: 16,
    channelCount: 2,
    echoCancellation: false
};
var video = {
    width: 320,
    height: 240,
    frameRate: 30
};
var localMedia = new fm.icelink.LocalMedia(audio, video);


MediaTrack Constraint Support

Note that IceLink simply passes constraints through to the browser's getUserMedia API. Browser support for particular constraints may vary, and may change from version to version.


For ultimate flexibility, the audio and/or video parameters will also accept an actual HTML5 media stream:

var canvas = document.getElementById('localCanvasSource');
var canvasFrameRate = 3;
if (!canvas) {
    // Create the canvas if it doesn't exist yet.
    canvas = document.createElement('canvas');
    canvas.id = 'localCanvasSource';
    canvas.style.position = 'absolute';
    document.body.appendChild(canvas);
    // Load a static image.
    var image = new Image();
    image.onload = function() {
        // Resize the canvas to match the image size.
        canvas.width = image.width;
        canvas.height = image.height;
        canvas.style.left = '-' + image.width + 'px';
        canvas.style.top = '-' + image.height + 'px';
        // Draw the initial image.
        var context = canvas.getContext('2d');
        context.drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
        // Refresh the image on a regular interval.
        window.setInterval(function() {
            context.clearRect(0, 0, canvas.width, canvas.height);
            context.drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
        }, 1000.0 / canvasFrameRate);
    };
    image.src = 'https://v3.icelink.fm/images/static.jpg';
}
var audio = false;
var video = canvas.captureStream(canvasFrameRate);
var localMedia = new fm.icelink.LocalMedia(audio, video);