opentok/opentok-node

API Proposal: setting the layout for composed archives

jeffswartz opened this issue · 2 comments

These new methods set the layout type for an archive. See Customizing the video layout for composed archives:

  • OpenTok.setArchiveLayout()
  • Archive.setLayout()

This new method sets the layout class list for streams:

  • OpenTok.setStreamClassLists()

To set the layout type (and stylesheet) for an archive:

var archiveId = 'c0e7ca3f-b6c7-7578-9583-0d6c9617d073';
var type = 'custom';
// Set stylesheet only if you  set the type to 'custom'
var stylesheet = 'stream { float: left; ... } stream.className { ... }';

opentok.setArchiveLayout(archiveId, type, style, function(error) {
  if (error) {
    console.log(error.message);
  } else {
    console.log('success');
  }
}

Or, using an Archive object:

archive.setLayout(archiveId, type, style, function(error) {
  if (error) {
    console.log(error.message);
  } else {
    console.log('success');
  }
}

To set the class lists for streams:

const sessionId = '2_MX4xMDB-fjE1Mz...';
const classListArray = [
  { id: 'streamId1', layoutClassList: ['focus'] },
  { id: 'streamId2', layoutClassList: ['top'] },
  { id: 'streamId3', layoutClassList: ['bottom'] }
];

opentok.setStreamClassLists(sessionId, classListArray, function(error) {
  if (error) {
    console.log(error.message);
  } else {
    console.log('success');
  }
}

Or:

const classListArray = [
  { id: 'streamId1', layoutClassList: ['focus'] },
  { id: 'streamId2', layoutClassList: ['top'] },
  { id: 'streamId3', layoutClassList: ['bottom'] }
];

session.setStreamClassLists(classListArray, function(error) {
  if (error) {
    console.log(error.message);
  } else {
    console.log('success');
  }
}

When setting layout class lists for streams, you would probably want to use
the OpenTok.getStreams() or Session.getStreams() method (see
this API proposal) to get a list of
streams in a session (and their existing layout class lists):

const classListObj = {};
opentok.getStreams(sessionId, function(error, streams) {
  streams.keys.forEach((stream) => {
  classListObj[stream.id] = ['default']; 
});

classListObj['focusStreamId1'] = ['focus'];

opentok.setStreamClassLists(classListObj, function(error) {
  if (error) {
    console.log(error.message);
  } else {
    console.log('success');
  }
}

Note that an earlier version of this proposal had the setStreamClassLists() methods take an object with key-value pairs (stream ID-class list). The proposal now has the setStreamClassLists() methods take an array, similar to the way the REST API works.

This has been released with 2.7.0