Reference12r1:Concept myPBX Toolbox
Jump to navigation
Jump to search
There are also other versions of this article available:
Reference12r1 (this version) | Reference12r2 | Reference13r1
The myPBX toolkit is a set of Java Script files that can be used for integrating functionality of the innovaphone PBX into arbitrary web sites.
Supported features
- Presence monitoring
- Outgoind WebRTC calls with audio, video and application sharing
Requirements
- Web site
- The needed JavaScript files of the libraries have to be included in the web site.
- PBX
- User object with password for login and a WebRTC device
- Valid STUN/TURN configuration
- Licenses
- myPBX license
- Video license (for video telephony)
- Application Sharing license (for viewing shared applications)
- WebRTC channel license (per WebRTC call)
- Network
- The PBX service (
https://xxx/PBX0/WEBSOCKET
) must be accessible from the public internet (NAT port forwarding or reverse proxy).
Reference
innovaphone.pbxwebsocket.WebRtcEndpoint
This file contains a WebRTC endpoint implementation that can be used for adding WebRTC calls to a web page. For that the credentials of a user object on the PBX is needed. Visitors of the web page will use that user object for making phone calls.
Includes
The following files have to be included in the html file in order to use the WebRTC endpoint.
innovaphone.common.crypto.js
innovaphone.pbxwebsocket.Connection.js
innovaphone.pbxwebsocket.ToneGenerator.js
innovaphone.pbxwebsocket.WebRtcEndpoint.js
Constructor
- new WebRtcEndpoint(url, username, password, device, physicalLocation, regContext, onLog, onCall)
-
- url
- The URL of the PBX websocket service (e.g.
ws://10.0.0.1/PBX0/WEBSOCKET/websocket
) - username
- The username of the PBX user object.
- password
- The password of the PBX user object.
- device
- The device ID that shall be used for making calls.
- physicalLocation
- The physical location of the user (optional).
- regContext
- A numeric value that will be used for identifying the registration in the PBX (optional).
- logFunction
- A callback function that is called for logging debug info (optional).
- onCall
- A callback function that is called when calls are added, updated or removed. Applications that want to use call control have to specify this callback function. Applications that don't should give
null
. (optional)
Methods
- function close()
- Closes the WebRTC endpoint and disconnects from the PBX.
- function initCall(name, number, video, sharing)
- Starts a phone call. This is only possible if the application supplied an
onCall
callback to the constructor.- name
- The URI to be called (optional, supply name or number).
- number
- The phone number to be called (optional, supply name or number).
- video
- Set to
true
for starting a video call (optional). - sharing
- Set to
true
for starting an application sharing call (optional).
- function clearCall(id)
- Terminates a call.
- id
- The ID of the call (optional). If no ID is supplied, all calls are terminated.
- function attachVideo(local, remote)
- Attaches HTML video elements to the WebRTC endpoints. The endpoint will use them to playback video. Applications can both attach before or during a video call. Also attaching multiple video elements for a single call is possible. The application should mute the video elements (
muted="muted"
) in order to avoid playback of audio.- local
- The HTML video element for playback of the local webcam image (optional, may be
null
). - remote
- The HTML video element for playback of the remote video image (optional, may be
null
).
- function detachVideo(local, remote)
- Detaches HTML video elements that have previously attached. This will stop the playback on the supplied elements.
- local
- The HTML video element to be detached (optional, may be
null
). - remote
- The HTML video element to be detached (optional, may be
null
).
Callbacks
- function onLog(text)
- Should write the supplied text to the log of the application.
- function onCall(event, call)
- Is called when the state of calls of this WebRTC endpoint changes.
- event
- A string that can be
added
,updated
andremoved
. - call
- The call object containing the current info about the call.
- id
- The numeric id of the call.
- dir
- The direction of the call (
in
orout
). - state
- The state of the call (
idle
,calling
,incomplete
,complete
,alerting
,connected
,disconnecting
,disconnected
,parked
). - hold
true
, if the call is on hold (optional).- name
- The URI of the remote party (optional).
- number
- The phone number of the remote party (optional).
- video
true
, if video is active (optional).- sharing
true
, if application sharing is active (optional).- cause
- The cause code (optional).
Example
<script type="text/javascript" src="innovaphone.common.crypto.js"></script> <script type="text/javascript" src="innovaphone.pbxwebsocket.Connection.js"></script> <script type="text/javascript" src="innovaphone.pbxwebsocket.ToneGenerator.js"></script> <script type="text/javascript" src="innovaphone.pbxwebsocket.WebRtcEndpoint.js"></script> <script type="text/javascript">
// dependencies var WebRtcEndpoint = innovaphone.pbxwebsocket.WebRtc.Endpoint; var endpoint = null; var config = { url: "ws://192.168.0.1/PBX0/WEBSOCKET/websocket", username: "user", password: "password", device: "user-webrtc", physicalLocation: null, regContext: "0" }; function logFunction(text) { console.log("WebRTC demo: " + text); } function onCall(event, call) { console.log("Call " + event + ": " + JSON.stringify(call)); } function initCall(number, video) { if (endpoint) endpoint.initCall(null, number, video, false); } function clearAllCalls() { if (endpoint) endpoint.clearCall(); } function close() { if (endpoint) { endpoint.detachVideo(document.getElementById("video-lcoal"), document.getElementById("video-remote")); endpoint.close(); } endpoint = null; } function start() { if (endpoint) endpoint.close(); endpoint = new WebRtcEndpoint(config.url, config.username, config.password, config.device, config.physicalLocation, config.regContext, logFunction, onCall); endpoint.attachVideo(document.getElementById("video-lcoal"), document.getElementById("video-remote")); }
</script>