Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

To analyze the example source code, take the file player.js version with hash 7bd8412 availablehere, which can be downloaded with build 1.0.41

1. Local variables

Local variables declaration to work with constants, SFU SDK, to display video and to work with client configuration

code

Code Block
languagejs
themeRDark
const constants = SFU.constants;
const sfu = SFU;
let mainConfig;
let remoteDisplay;
let playState;
const PLAY = "play";
const STOP = "stop";
const PRELOADER_URL="../commons/media/silence.mp3"

...

Default room configuration to use if there is no config.json file found

code

Code Block
languagejs
themeRDark
const defaultConfig = {
    room: {
        url: "ws://127.0.0.1:8080",
        name: "ROOM1",
        pin: "1234",
        nickName: "User1"
    }
};

...

The object should keep Websocket session data, WebRTC connection data and room data, and shoukd form HTML tags ids to access them from code.

code

Code Block
languagejs
themeRDark
const CurrentState = function(prefix) {
    let state = {
        prefix: prefix,
        pc: null,
        session: null,
        room: null,
        set: function(pc, session, room) {
            state.pc = pc;
            state.session = session;
            state.room = room;
        },
        clear: function() {
            state.room = null;
            state.session = null;
            state.pc = null;
        },
        buttonId: function() {
            return state.prefix + "Btn";
        },
        buttonText: function() {
            return (state.prefix.charAt(0).toUpperCase() + state.prefix.slice(1));
        },
        inputId: function() {
            return state.prefix + "Name";
        },
        statusId: function() {
            return state.prefix + "Status";
        },
        formId: function() {
            return state.prefix + "Form";
        },
        errInfoId: function() {
            return state.prefix + "ErrorInfo";
        },
        is: function(value) {
            return (prefix === value);
        }
    };
    return state;
}

4. Initialization

init() code

The init() function is called on page load and:

...

connect(), SFU.createRoom() code

The connect() function is called by Publish or Play click:

...

6. Playback start after session establishing

onConnected() code

The onConnected() function:

...

playStreams(), SFURoom.join() code

The playStreams() function:

...

stopStreams(), remoteDisplay.stop() code

Code Block
languagejs
themeRDark
const stopStreams = function(state) {
    if (remoteDisplay) {
        remoteDisplay.stop();
    }
}

...

onStartClick(), playFirstSound(), connect() code

  • validates input fields
  • in Safari browser, calls playFirstSound() before playback to automatically play incoming audio
  • calls connect() function

...

onStopClick(), Session.disconnect() code

The onStopClick() function:

...

11. Websocket session disconnection actions

onDisconnected() code

The onDisconnected() functions:

...