Почему в моем приложении cordova/phonegap не отображается видео подписчика opentok?

Question

Следующий код отлично работает в настольном браузере в точности так, как он есть, но не работает в моем приложении для мобильных телефонов /cordova. Мой вывод говорит, что соединение и iOS получили поток, но в теле моего приложения ничего не отображается. Это в моем файле index.js:

var app = {
initialize: function() {
    this.bindEvents();
},

bindEvents: function() {
    document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
    app.receivedEvent('deviceready');

////////////////////////////////
//////Start of my opentok code////////////

    var apiKey = '21692492';

    var sessionId = '2_MX4yMTY5MTQ5Mn5-RnJpIEZlYiAwNyAwODozMjozOSBQU1QgMjAxNH4wLjIwMzc2MDV-';

    var token = 'T1==cGFydG5lcl9pZD0yMTY5MTQ5MiZzaWc9ZWUxMTNjNjZiYjlkNWI4NTkwZTE2MDZiMjM0MzFkOWYyMzhiYzgxNjpzZXNzaW9uX2lkPTJfTVg0eU1UWTVNVFE1TW41LVJuSnBJRVpsWWlBd055QXdPRG96TWpvek9TQlFVMVFnTWpBeE5INHdMakl3TXpjMk1EVi0mY3JlYXRlX3RpbWU9MTM5MTc5MDgwNSZyb2xlPXB1Ymxpc2hlciZub25jZT0xMzkxNzkwODA1LjIzMzk0MTE4MzcyJmV4cGlyZV90aW1lPTEzOTQzODI4MDU=';


    function connectedHandler(event) {
        for (var i = 0; i < event.streams.length; i++) {
            var newDiv = $('<div />', {id:event.streams[i].streamId});
            $('body').append(newDiv);
            session.subscribe(event.streams[i], event.streams[i].streamId,{});
        }
    }


    var session = TB.initSession(sessionId);

    session.addEventListener('sessionConnected', connectedHandler);

    session.connect(apiKey, token);

//////End of my opentok code////////////
////////////////////////////////////////////////
},

receivedEvent: function(id) {
    var parentElement = document.getElementById(id);
    var listeningElement = parentElement.querySelector('.listening');
    var receivedElement = parentElement.querySelector('.received');

    listeningElement.setAttribute('style', 'display:none;');
    receivedElement.setAttribute('style', 'display:block;');

    console.log('Received Event: ' + id);
}
};

Это вывод, который я получаю:

2014-02-07 11:44:19.407 HelloCordova[2377:60b] iOS Connected to Session
2014-02-07 11:44:19.408 HelloCordova[2377:60b] object for session is {
connection =     {
    connectionId = "4B191468-46D5-4414-A46A-5C97376D6F2E";
    creationTime = 1391791459;
};
connectionCount = 0;
environment = production;
sessionConnectionStatus = OTSessionConnectionStatusConnected;
sessionId = "2_MX4yMTY5MTQ5Mn5-RnJpIEZlYiAwNyAwODozMjozOSBQU1QgMjAxNH4wLjIwMzc2MDV-";
streams =     (
);
}
2014-02-07 11:44:19.456 HelloCordova[2377:60b] iOS Received Stream

Кто-нибудь знает, почему это не работает и что мне нужно изменить?

Answer 1

Плагин Cordova создан по образцу OpenTok JS 2.2. В этой новой версии есть несколько изменений. Прежде всего, addEventListener был переименован в on. Чтобы добавить события, вы можете сделать это:

session.on({
  'sessionConnected': function(event){
    session.publish( publisher );
  },
  'streamCreated': function(event){
    var newDiv = $('<div />', {id:event.stream.streamId});
    $('body').append(newDiv);
    session.subscribe(event.stream, event.stream.streamId, {});
  }
})

Обратите внимание на следующие изменения:
* addEventListener больше не существует
* для событий sessionConnected вы больше не получаете массив существующих потоков в сеансе. Каждый поток в сеансе будет вызывать событие streamCreated.
* Параметр обратного вызова события streamCreated имеет только 1 элемент потока. Это событие будет запущено один раз для каждого потока

Вот список предстоящих изменений в v2.2: http://labs.tokbox.com/javascript-2.2

Я добавил несколько рабочих примеров кода для вас: https://github.com/songz/cordova-plugin-opentok/blob/master/README.md#sample-code