Merge pull request #1 from TwilioDevEd/migrate-ipmessaging-to-chat

Migrate from IP Messaging to Chat
This commit is contained in:
Jeff Linwood
2016-12-02 12:47:18 -06:00
committed by GitHub
8 changed files with 36 additions and 37 deletions

View File

@@ -6,8 +6,8 @@ TWILIO_API_SECRET=
# Required for Video # Required for Video
TWILIO_CONFIGURATION_SID= TWILIO_CONFIGURATION_SID=
# Required for IP Messaging # Required for Chat
TWILIO_IPM_SERVICE_SID= TWILIO_CHAT_SERVICE_SID=
# Required for Notify # Required for Notify
TWILIO_NOTIFICATION_SERVICE_SID= TWILIO_NOTIFICATION_SERVICE_SID=

View File

@@ -2,7 +2,7 @@
This sample project demonstrates how to use Twilio APIs in a Python web This sample project demonstrates how to use Twilio APIs in a Python web
application. Once the app is up and running, check out [the home page](http://localhost:5000) application. Once the app is up and running, check out [the home page](http://localhost:5000)
to see which demos you can run. You'll find examples for [IP Messaging](https://www.twilio.com/ip-messaging), to see which demos you can run. You'll find examples for [Chat](https://www.twilio.com/chat),
[Video](https://www.twilio.com/video), [Sync](https://www.twilio.com/sync), and more. [Video](https://www.twilio.com/video), [Sync](https://www.twilio.com/sync), and more.
Let's get started! Let's get started!
@@ -41,7 +41,7 @@ Depending on which demos you'd like to run, you'll need to configure a few more
| Config Value | Product Demo | Description | | Config Value | Product Demo | Description |
| :------------- |:------------- |:------------- | | :------------- |:------------- |:------------- |
`TWILIO_IPM_SERVICE_SID` | IP Messaging | Like a database for your IP Messaging data - [generate one in the console here](https://www.twilio.com/console/ip-messaging/services) `TWILIO_CHAT_SERVICE_SID` | Chat | Like a database for your Chat data - [generate one in the console here](https://www.twilio.com/console/chat/services)
`TWILIO_CONFIGURATION_SID` | Video | Identifier for a set of config properties for your video application - [find yours here](https://www.twilio.com/console/video/profiles) `TWILIO_CONFIGURATION_SID` | Video | Identifier for a set of config properties for your video application - [find yours here](https://www.twilio.com/console/video/profiles)
`TWILIO_SYNC_SERVICE_SID` | Sync (Preview) | Like a database for your Sync data - generate one with the curl command below. `TWILIO_SYNC_SERVICE_SID` | Sync (Preview) | Like a database for your Sync data - generate one with the curl command below.
`TWILIO_NOTIFICATION_SERVICE_SID` | Notify (Preview) | You will need to create a Notify service - [generate one here](https://www.twilio.com/console/notify/services) `TWILIO_NOTIFICATION_SERVICE_SID` | Notify (Preview) | You will need to create a Notify service - [generate one here](https://www.twilio.com/console/notify/services)

18
app.py
View File

@@ -28,9 +28,9 @@ def sync():
def notify(): def notify():
return app.send_static_file('notify/index.html') return app.send_static_file('notify/index.html')
@app.route('/ipmessaging/') @app.route('/chat/')
def ipmessaging(): def chat():
return app.send_static_file('ipmessaging/index.html') return app.send_static_file('chat/index.html')
# Basic health check - check environment variables have been configured # Basic health check - check environment variables have been configured
# correctly # correctly
@@ -43,7 +43,7 @@ def config():
TWILIO_GCM_CREDENTIAL_SID=os.environ['TWILIO_GCM_CREDENTIAL_SID'], TWILIO_GCM_CREDENTIAL_SID=os.environ['TWILIO_GCM_CREDENTIAL_SID'],
TWILIO_API_KEY=os.environ['TWILIO_API_KEY'], TWILIO_API_KEY=os.environ['TWILIO_API_KEY'],
TWILIO_API_SECRET=bool(os.environ['TWILIO_API_SECRET']), TWILIO_API_SECRET=bool(os.environ['TWILIO_API_SECRET']),
TWILIO_IPM_SERVICE_SID=os.environ['TWILIO_IPM_SERVICE_SID'], TWILIO_CHAT_SERVICE_SID=os.environ['TWILIO_CHAT_SERVICE_SID'],
TWILIO_SYNC_SERVICE_SID=os.environ['TWILIO_SYNC_SERVICE_SID'], TWILIO_SYNC_SERVICE_SID=os.environ['TWILIO_SYNC_SERVICE_SID'],
TWILIO_CONFIGURATION_SID=os.environ['TWILIO_CONFIGURATION_SID'] TWILIO_CONFIGURATION_SID=os.environ['TWILIO_CONFIGURATION_SID']
) )
@@ -56,7 +56,7 @@ def token():
api_secret = os.environ['TWILIO_API_SECRET'] api_secret = os.environ['TWILIO_API_SECRET']
sync_service_sid = os.environ['TWILIO_SYNC_SERVICE_SID'] sync_service_sid = os.environ['TWILIO_SYNC_SERVICE_SID']
configuration_profile_sid = os.environ['TWILIO_CONFIGURATION_SID'] configuration_profile_sid = os.environ['TWILIO_CONFIGURATION_SID']
ipm_service_sid = os.environ['TWILIO_IPM_SERVICE_SID'] chat_service_sid = os.environ['TWILIO_CHAT_SERVICE_SID']
# create a randomly generated username for the client # create a randomly generated username for the client
@@ -79,10 +79,10 @@ def token():
video_grant = ConversationsGrant(configuration_profile_sid=configuration_profile_sid) video_grant = ConversationsGrant(configuration_profile_sid=configuration_profile_sid)
token.add_grant(video_grant) token.add_grant(video_grant)
# Create an IP Messaging grant and add to token # Create an Chat grant and add to token
if ipm_service_sid: if chat_service_sid:
ipm_grant = IpMessagingGrant(endpoint_id=endpoint, service_sid=ipm_service_sid) chat_grant = IpMessagingGrant(endpoint_id=endpoint, service_sid=chat_service_sid)
token.add_grant(ipm_grant) token.add_grant(chat_grant)
# Return token info as JSON # Return token info as JSON
return jsonify(identity=identity, token=token.to_jwt()) return jsonify(identity=identity, token=token.to_jwt())

View File

@@ -1,14 +1,14 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>Twilio IP Messaging Quickstart</title> <title>Twilio Chat Quickstart</title>
<link rel="shortcut icon" href="//www.twilio.com/marketing/bundles/marketing/img/favicons/favicon.ico"> <link rel="shortcut icon" href="//www.twilio.com/marketing/bundles/marketing/img/favicons/favicon.ico">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="index.css"> <link rel="stylesheet" href="index.css">
</head> </head>
<body> <body>
<header> <header>
<a href="https://www.twilio.com/docs/api/ip-messaging/guides/quickstart-js" <a href="https://www.twilio.com/docs/api/chat/guides/quickstart-js"
target="_blank">Read the getting started guide target="_blank">Read the getting started guide
<i class="fa fa-fw fa-external-link"></i> <i class="fa fa-fw fa-external-link"></i>
</a> </a>
@@ -19,8 +19,7 @@
<input id="chat-input" type="text" placeholder="say anything" autofocus/> <input id="chat-input" type="text" placeholder="say anything" autofocus/>
</section> </section>
<script src="//media.twiliocdn.com/sdk/js/common/v0.1/twilio-common.min.js"></script> <script src="///media.twiliocdn.com/sdk/js/chat/releases/0.11.0/twilio-chat.min.js"></script>
<script src="//media.twiliocdn.com/sdk/js/ip-messaging/v0.10/twilio-ip-messaging.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="index.js"></script> <script src="index.js"></script>
</body> </body>

View File

@@ -2,11 +2,8 @@ $(function() {
// Get handle to the chat div // Get handle to the chat div
var $chatWindow = $('#messages'); var $chatWindow = $('#messages');
// Manages the state of our access token we got from the server // Our interface to the Chat service
var accessManager; var chatClient;
// Our interface to the IP Messaging service
var messagingClient;
// A handle to the "general" chat channel - the one and only channel we // A handle to the "general" chat channel - the one and only channel we
// will have in this sample app // will have in this sample app
@@ -54,19 +51,22 @@ $(function() {
print('You have been assigned a random username of: ' print('You have been assigned a random username of: '
+ '<span class="me">' + username + '</span>', true); + '<span class="me">' + username + '</span>', true);
// Initialize the IP messaging client // Initialize the Chat client
accessManager = new Twilio.AccessManager(data.token); chatClient = new Twilio.Chat.Client(data.token);
messagingClient = new Twilio.IPMessaging.Client(accessManager); chatClient.getUserChannels().then(createOrJoinGeneralChannel);
});
function createOrJoinGeneralChannel() {
// Get the general chat channel, which is where all the messages are // Get the general chat channel, which is where all the messages are
// sent in this simple application // sent in this simple application
print('Attempting to join "general" chat channel...'); print('Attempting to join "general" chat channel...');
var promise = messagingClient.getChannelByUniqueName('general'); var promise = chatClient.getChannelByUniqueName('general');
promise.then(function(channel) { promise.then(function(channel) {
generalChannel = channel; generalChannel = channel;
if (!generalChannel) { if (!generalChannel) {
// If it doesn't exist, let's create it // If it doesn't exist, let's create it
messagingClient.createChannel({ console.log('Creating general channel');
chatClient.createChannel({
uniqueName: 'general', uniqueName: 'general',
friendlyName: 'General Chat Channel' friendlyName: 'General Chat Channel'
}).then(function(channel) { }).then(function(channel) {
@@ -81,7 +81,7 @@ $(function() {
setupChannel(); setupChannel();
} }
}); });
}); }
// Set up channel after it has been found // Set up channel after it has been found
function setupChannel() { function setupChannel() {

View File

@@ -7,7 +7,7 @@ $(function() {
configureField(response, 'TWILIO_NOTIFICATION_SERVICE_SID','twilioNotificationServiceSID',false); configureField(response, 'TWILIO_NOTIFICATION_SERVICE_SID','twilioNotificationServiceSID',false);
configureField(response, 'TWILIO_APN_CREDENTIAL_SID','twilioAPNCredentialSID',false); configureField(response, 'TWILIO_APN_CREDENTIAL_SID','twilioAPNCredentialSID',false);
configureField(response, 'TWILIO_GCM_CREDENTIAL_SID','twilioGCMCredentialSID',false); configureField(response, 'TWILIO_GCM_CREDENTIAL_SID','twilioGCMCredentialSID',false);
configureField(response, 'TWILIO_IPM_SERVICE_SID','twilioIPMServiceSID',false); configureField(response, 'TWILIO_CHAT_SERVICE_SID','twilioChatServiceSID',false);
configureField(response, 'TWILIO_SYNC_SERVICE_SID','twilioSyncServiceSID',false); configureField(response, 'TWILIO_SYNC_SERVICE_SID','twilioSyncServiceSID',false);
//configure individual product buttons //configure individual product buttons
@@ -20,10 +20,10 @@ $(function() {
$('#videoDemoButton').addClass('btn-danger'); $('#videoDemoButton').addClass('btn-danger');
} }
if (response.TWILIO_IPM_SERVICE_SID && response.TWILIO_IPM_SERVICE_SID != '') { if (response.TWILIO_CHAT_SERVICE_SID && response.TWILIO_CHAT_SERVICE_SID != '') {
$('#ipmDemoButton').addClass('btn-success'); $('#chatDemoButton').addClass('btn-success');
} else { } else {
$('#ipmDemoButton').addClass('btn-danger'); $('#chatDemoButton').addClass('btn-danger');
} }
if (response.TWILIO_SYNC_SERVICE_SID && response.TWILIO_SYNC_SERVICE_SID != '') { if (response.TWILIO_SYNC_SERVICE_SID && response.TWILIO_SYNC_SERVICE_SID != '') {
@@ -40,7 +40,7 @@ $(function() {
} }
else { else {
$('#videoDemoButton').addClass('btn-danger'); $('#videoDemoButton').addClass('btn-danger');
$('#ipmDemoButton').addClass('btn-danger'); $('#chatDemoButton').addClass('btn-danger');
$('#syncDemoButton').addClass('btn-danger'); $('#syncDemoButton').addClass('btn-danger');
$('#notifyDemoButton').addClass('btn-danger'); $('#notifyDemoButton').addClass('btn-danger');
} }

View File

@@ -49,9 +49,9 @@
<td class="config-value" id="twilioGCMCredentialSID"></td> <td class="config-value" id="twilioGCMCredentialSID"></td>
</tr> </tr>
<tr> <tr>
<td class="config-product">IP Messaging</td> <td class="config-product">Chat</td>
<td class="config-key">TWILIO_IPM_SERVICE_SID</td> <td class="config-key">TWILIO_CHAT_SERVICE_SID</td>
<td class="config-value" id="twilioIPMServiceSID"></td> <td class="config-value" id="twilioChatServiceSID"></td>
</tr> </tr>
<tr> <tr>
<td class="config-product">Sync</td> <td class="config-product">Sync</td>
@@ -64,7 +64,7 @@
<a id="videoDemoButton" class="btn btn-lg" href="/video/">Video</a> <a id="videoDemoButton" class="btn btn-lg" href="/video/">Video</a>
<a id="syncDemoButton" class="btn btn-lg" href="/sync/">Sync</a> <a id="syncDemoButton" class="btn btn-lg" href="/sync/">Sync</a>
<a id="notifyDemoButton" class="btn btn-lg" href="/notify/">Notify</a> <a id="notifyDemoButton" class="btn btn-lg" href="/notify/">Notify</a>
<a id="ipmDemoButton" class="btn btn-lg" href="/ipmessaging/">IP Messaging</a> <a id="chatDemoButton" class="btn btn-lg" href="/chat/">Chat</a>
</div> <!-- container --> </div> <!-- container -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>