roman-yerin / vertojs

Typescript FreeSWITCH verto interface

vertojs

Verto (VER-to) RTC is a FreeSWITCH endpoint that implements a subset of a JSON-RPC connection designed for use over secure websockets. The initial target is WebRTC to simplify coding and implementing calls from web browsers and devices to FreeSWITCH. This allows a web browser or other WebRTC client to originate a call using Verto into a FreeSWITCH installation and then out to the PSTN using SIP, SS7, or other supported protocol.

This is a zero-dependency implementation that is no need to include jquery as in an original one. It doesn't contain any html stuff inside or media handlers as well. You should take care of fetch media tracks yourself (I think it is better not to hide useful features of you, browser provides a great API to handle media)

Status

This is a work in progress code. However, it is stable enough to use basic functions (calls).

Pull requests are welcomed.

Get started

Package directory content

/dist — contains a minified bundle exporting Verto symbol to a global namespace

/src — contains source Typescript files

To use this package you can either include dist/verto.js as a html <script> tag or import it using webpack like that

import { Verto } from 'vertojs'

Check index.html in the package directory to find out how to use this code with a html <script> tag

Create a client instance

let verto = new Verto(options: VertoOptions)

interface VertoOptions {
  transportConfig : JsonRpcClientParams 
  // Verto transport configuration, check below
  
  rtcConfig?      : RTCConfiguration    
  // RTCConfiguration object, as described here 
  // https://developer.mozilla.org/en-US/docs/Web/API/RTCConfiguration
  // The most important thing is iceServers item that should be set to go over NAT
  
  debug?          : boolean
  // Set true to get some useful debug info in browser console 
  
  ice_timeout?    : number
  // Milliseconds to stop waiting for ice candidates, default to 3000ms
}

interface JsonRpcClientParams {
  socketUrl       : string
  // The URL where the verto interface lives
  // wss://server.example.com:8082

  login           : string
  passwd          : string
}

Receive calls

You should register to verto to receive calls.

The following code is a simplified example of using the handler function to auto answer the first incoming call and add first received audio track to some <video> element.

try {
  let data = await verto.login()
} catch (error) {
  alert("Access denied")
  return
}

let local_stream = await navigator.mediaDevices.getUserMedia({audio:true})

verto.subscribeEvent('invite', call => {

  call.subscribeEvent('track', (track) => {
    if(track.kind!='audio') return
    
    let stream = new MediaStream()
    stream.addTrack(track)
    
    let el = document.getElementById('video')
    el.srcObject = stream
  })

  call.answer(local_stream.getTracks())
})

Place calls

let local_stream = await navigator.mediaDevices.getUserMedia({audio:true})

let call = verto.call(local_stream.getTracks(), "9664")

call.subscribeEvent('track', (track) => {
  if(track.kind!='audio') return
  
  let stream = new MediaStream()
  stream.addTrack(track)

  let el = document.getElementById('video')
  el.srcObject = stream
})

API description

There's a number (pretty small number) of Classes and Interfaces provided.

Verto

Methods

constructor

let verto = new Verto(options: VertoOptions)

interface VertoOptions {
  transportConfig : JsonRpcClientParams 
  // Verto transport configuration, check below
  
  rtcConfig?      : RTCConfiguration    
  // RTCConfiguration object, as described here 
  // https://developer.mozilla.org/en-US/docs/Web/API/RTCConfiguration
  // The most important thing is iceServers item that should be set to go over NAT
  
  debug?          : boolean
  // Set true to get some useful debug info in browser console 
  
  ice_timeout?    : number
  // Milliseconds to stop waiting for ice candidates, default to 3000ms
}

interface JsonRpcClientParams {
  socketUrl       : string
  // The URL where the verto interface lives
  // wss://server.example.com:8082

  login           : string
  passwd          : string
}

login

Parameters

• None

Returns

Promise, that will be resolved if the login process succeed or threw an exception otherwise.

verto.login()

call

Parameters

• tracks: Array<MediaStreamTrack>
  represents tracks to be sent to the remote call side
• destination: string
  an extension to be dialed
• options?: VertoCallOptions
  call options

Returns

• VertoCall instance

let call = verto.call(tracks, destination, options)

isLogged

Parameters

• None

Returns

• Boolean

let isLogged = verto.isLogged()

logout

Parameters

• None

Returns

• Void

verto.logout()

Events

invite

Fires on incoming call. As a parameter handler will receive a VertoCall instance.

verto.subscribeEvent('invite', call => {

  call.subscribeEvent('track', (track) => {
    if(track.kind!='audio') return
    
    let stream = new MediaStream()
    stream.addTrack(track)
    
    let el = document.getElementById('video')
    el.srcObject = stream
  })

  call.answer(local_stream.getTracks())
})

VertoCall

This class instances should never be built manually, but using verto.call or incoming call handler.

Methods

answer

Parameters

• tracks: Array<MediaStreamTrack>
  represents tracks to be sent to the remote call side

Returns

• None

call.answer(tracks)

hangup

Parameters

• None

Returns

• None

call.hangup()

dtmf

Parameters

• String

Returns

• None

call.dtmf('5')

hold

Parameters

• None

Returns

• None

call.hold()

unhold

Parameters

• None

Returns

• None

call.unhold()

toggleHold

Parameters

• None

Returns

• None

call.toggleHold()

getStats

Parameters

• None

Returns

https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/getStats

Instance variables

id

• String — the call id

options

• VertoCallOptions

direction

• CallDirection

Events

answer

Fires when the call is answered.

call.subscribeEvent('answer', () => {
// Do something on answer
})

track

Fires when a MediaStreamTrack is received

verto.subscribeEvent('invite', call => {

  call.subscribeEvent('track', (track) => {
    if(track.kind!='audio') return
    
    let stream = new MediaStream()
    stream.addTrack(track)
    
    let el = document.getElementById('video')
    el.srcObject = stream
  })

  call.answer(local_stream.getTracks())
})

bye

Fires when the call is ended.

call.subscribeEvent('bye', cause => {
// Do something on call end
})

Interfaces

VertoCallOptions

interface VertoCallOptions {
  caller_id_number?   : string
  caller_id_name?     : string
  callee_id_number?   : string
  callee_id_name?     : string
}

VertoOptions

interface VertoOptions {
  transportConfig : JsonRpcClientParams 
  // Verto transport configuration, check below
  
  rtcConfig?      : RTCConfiguration
  // RTCConfiguration object, as described here 
  // https://developer.mozilla.org/en-US/docs/Web/API/RTCConfiguration
  // The most important thing is iceServers item that should be set to go over NAT
  
  debug?          : boolean
  // Set true to get some useful debug info in browser console 
  
  ice_timeout?    : number
  // Milliseconds to stop waiting for ice candidates, default to 3000ms
}

JsonRpcClientParams

interface JsonRpcClientParams {
  socketUrl       : string
  // The URL where the verto interface lives
  // wss://server.example.com:8082

  login           : string
  passwd          : string
}

CallDirection

enum CallDirection {
  Incoming,
  Outgoing
}

Event handling

Both Verto and VertoCall classes uses the same event handling system.

subscribeEvent

Parameters

• name : string
• handler : {(data:any):void}

Returns

• String identifies the handler

let handler_id = verto.subscribeEvent(name, handler)

unsubscribeEvent

Parameters

• name : string
• handler_id? : string
  if ommited, all the handlers for name event will be deleted

Returns

• None

verto.unsubscribeEvent(name, handler_id)

License

Copyright (c) 2019–2022 Roman Yerin <[email protected]>

Licensed under the 3-clause BSD license.