cobrowsing / message360-webrtc

WebRTC source code.

Overview

Pre-Release

WebRTC is currently in pre-release testing. All this means is that there might be one or two more steps that are required to get the service set up.

This repository holds and contains the source code for the Message360 WebRTC Project. WebRTC is a service that enables our customers to utilize Real-Time Communications capabilities in their own applications. Using our V2 Helper Libraries and this developer's version of our WebRTC platform, developer's can tweak and customize the platform and add features of their own.

• You can read more about WebRTC here: https://webrtc.org/.

The platform exists now as a simple HTML5/AngularJS application that depends on Helper Library methods to communicate with Message360. The following section explains how to set up and install the WebRTC Platform.

Installation

The WebRTC client has two main components, the source code itself and the PHP Helper Library. Both components each have their own dependencies in order to work properly. The WebRTC client requires NPM and Bower for package dependency and the PHP Helper Library requires Composer to be installed as well.

Things to install

• Composer
• Bower
• Node.js/NPM

Setup/Configuration

1. Download the WebRTC client source code and the PHP Helper Library V2

1. Navigate to the directory you want to install and copy/paste the command below into the terminal. git clone https://github.com/danielpark-ytel/message360-webrtc.git webrtc
2. This will download the WebRTC client source code into a folder named 'webrtc'
3. Navigate into the 'webrtc' folder and copy/paste the command below. git clone https://github.com/mgrofsky/message360-API-V2-PHP.git m360phpv2

2. Configure PHP Helper Library for usage

1. We need to configure the Helper Libraries for use, navigate into the directory the Helper Library was downloaded to: cd m360phpv2
2. The PHP Helper Library has dependencies over external libraries and are defined in the composer.json file. To resolve these dependencies we need to install Composer package manager (requires PHP greater than 5.3.2 installed on your system).
3. Instructions and documentation on how to install Composer can be found on their webpage: [https://getcomposer.org/doc/00-intro.md](Composer Install)
4. Once composer is installed (global install is recommended), we run a composer install in the m360phpv2 directory. This will resolve all the dependencies the Helper Library requires.
5. The next step is to create the three PHP files that will be making the API calls for WebRTC, so let's create a folder called webrtc in the current directory: mkdir webrtc
6. Create the necessary PHP files in the webrtc folder: cd webrtc && touch createToken.php checkFunds.php authenticateNumber.php
7. Let's write the PHP code that for these files:

createToken.php:

<?php
//Require the autolaod.php file generated by Composer
require_once '../vendor/autoload.php';

//Create an instance of the Message360Client
$client = new Message360Lib\Message360Client();

//Create an instance of the Message360Client's WebRTC controller
$wrtc = $client->getWebRTC();

//Store required data for API call in an array
$collect['accountSid'] = 'your_acct_sid';
$collect['authToken'] = 'your_auth_token';

//Make the API call, passing the data we stored in the array
$res = $wrtc->createToken($collect);

//Send response as JSON back to client
echo json_encode($res);

checkFunds.php:

<?php
require_once '../vendor/autoload.php';

$client = new Message360Lib\Message360Client();
$wrtc = $client->getWebRTC();

//Store data for API call in array
$collect['accountSid'] = 'your_account_sid';
$collect['authToken'] = 'your_auth_token';

//Get response from Message360
$res = $wrtc->createCheckFunds($collect);

//Return response to client
echo json_encode($res);

authenticateNumber.php:

<?php
require_once '../vendor/autoload.php';

$client = new Message360Lib\Message360Client();
$wrtc = $client->getWebRTC();

//Get form input from client
$input = file_get_contents('php://input');
$request = json_decode($input);

//Store the input in a variable
$phone_number = $request->phone_number;

//Store data for API call in array
$collect['accountSid'] = 'your_account_sid';
$collect['authToken'] = 'your_auth_token';
$collect['phoneNumber'] = $phone_number;

//Make API call to authenticate Caller ID number
$res = $wrtc->createAuthenticateNumber($collect);
echo json_encode($res);

3. Configure Helper Library for Pre-Release

1. In the PHP Helper Library folder, we need to edit the Configuration.php file in the src folder.

// We need to set some config variables in the Configuration class
public static $environment = Environments:PREPRODUCTION;
public static $basicAuthUserName = 'your_account_sid';
public static $basicAuthPassword = 'your_auth_token';

4. WebRTC Client Configuration

1. Navigate out of the PHP Helper Library folder and into the WebRTC client folder.
2. Navigate to vertoService.js in the WebRTC source folder, it is located in: webrtc/src/js/verto-service/vertoService.js
3. Edit the WebSocket URL in the data variable. It should be pre-configured but let's make sure that the following fields are identical to the ones below:

var data = {
    //Only edit these two fields.
    hostname: "message360.com",
    wsURL: "wss://id1246ab.message360.com:8082"
};

4. Edit the verto.module.js that is located in: webrtc/src/js/verto.module.js
5. We need to set the three variables for our WebRTC client to hit for our Message360 API calls.

//verto.module.js
app.run(function ($rootScope) {
    //TODO: Set the URL's for the helper library scripts that we wrote earlier
    $rootScope.tokenUrl = 'path/to/createToken.php';
    $rootScope.fundUrl = 'path/to/checkFunds.php';
    $rootScope.numberUrl = 'path/to/authenticateNumber.php';
});

6. The WebRTC client has dependencies that need to be resolved by Bower and NPM.
7. If you have both of these installed, that's great you can move on. If not then go to the following links and follow instructions for install: [https://nodejs.org/en/](Node.js Install) Comes with NPM
8. Once NPM is installed, run an npm install to resolve the package.json dependencies.
9. We also need to install Bower, go to the link below for install instructions: [https://bower.io/#install-bower](Bower Install) Requires Node.js/NPM
10. Resolve our bower.json dependencies by doing a bower install. You may be asked to enter a number to specify a version of a package being installed. Chose the choice that is resolved to the webrtc_client.
11. Our package.json file should have installed the Grunt Task Manager. To finish setting up, run a grunt. This will concat and minify files in our src directory. The index.html is written to load these minified files already.
12. If you did your install on a local machine, get tyour configured WebRTC folder onto a Github repository and onto a web server. Once you navigate to the WebRTC domain, you should be able to make calls straight from the browser.