+// Find your Account Sid and Auth Token at twilio.com/console
+// DANGER! This is insecure. See http://twil.io/secure
+$sid = "ACcc67c045cffaea7653952cf73b7443a5";
+$token = "4a48ef16988eca378188b06fd8d433e0";
+$twilio = new Client($sid, $token);
-
-
-
- Star
-
-
- 0
-
+$message = $twilio->messages
+ ->create("++41765203630", // to
+ [
+ "body" => "This will be the body of the new message!",
+ "from" => "+17708008448"
+ ]
+ );
-
+// Find your Account Sid and Auth Token at twilio.com/console
+// DANGER! This is insecure. See http://twil.io/secure
+$sid = "ACcc67c045cffaea7653952cf73b7443a5";
+$token = "4a48ef16988eca378188b06fd8d433e0";
+$twilio = new Client($sid, $token);
-
-
-
+class TwilioRequestValidator
+{
+ /**
+ * Handle an incoming request.
+ *
+ * @param \Illuminate\Http\Request $request
+ * @param \Closure $next
+ * @return mixed
+ */
+ public function handle($request, Closure $next)
+ {
+ // Be sure TWILIO_AUTH_TOKEN is set in your .env file.
+ // You can get your authentication token in your twilio console https://www.twilio.com/console
+ $requestValidator = new RequestValidator(env('TWILIO_AUTH_TOKEN'));
+ $requestData = $request->toArray();
-
-
+ // Switch to the body content if this is a JSON request.
+ if (array_key_exists('bodySHA256', $requestData)) {
+ $requestData = $request->getContent();
+ }
-
-
+ $isValid = $requestValidator->validate(
+ $request->header('X-Twilio-Signature'),
+ $request->fullUrl(),
+ $requestData
+ );
-
-
-
+ if ($isValid) {
+ return $next($request);
+ } else {
+ return new Response('You are not Twilio :(', 403);
+ }
+ }
+}
+
-
-
-
-
Join GitHub today
-
GitHub is home to over 50 million developers working together to host and review code, manage projects, and build software together.
-
+// Your Account SID and Auth Token from twilio.com/console
+$account_sid = 'ACXXXXXXXXXXXXXXXXXXXXXXXXXXXX';
+$auth_token = '4a48ef16988eca378188b06fd8d433e0';
+// In production, these should be environment variables. E.g.:
+// $auth_token = $_ENV["TWILIO_ACCOUNT_SID"]
+// A Twilio number you own with Voice capabilities
+$twilio_number = "+15017122661";
+// Where to make a voice call (your cell phone?)
+$to_number = "+15558675310";
-
+$client = new Client($account_sid, $auth_token);
+$client->account->calls->create(
+ $to_number,
+ $twilio_number,
+ array(
+ "url" => "http://demo.twilio.com/docs/voice.xml"
+ )
+);
+
-
+// Start our TwiML response
+$response = new VoiceResponse;
+// Read a message aloud to the caller
+$response->say(
+ "Thank you for calling! Have a great day.",
+ array("voice" => "alice")
+);
+echo $response;
+say(
+ "Thank you for calling! Have a great day.",
+ array("voice" => "alice")
+);
-
-
-
-
-
-
- master
-
-
+echo $response;
+
-
-
-
-
-
-
-
+namespace App\Http\Controllers;
-
+use App\Http\Requests;
+use Illuminate\Http\Request;
+use Twilio\Twiml;
+class IvrController extends Controller
+{
+ public function __construct()
+ {
+ $this->_thankYouMessage = 'Thank you for calling the ET Phone Home' .
+ ' Service - the adventurous alien\'s first choice' .
+ ' in intergalactic travel.';
-
- Use Git or checkout with SVN using the web URL.
-
-
+ }
-
-
-
-
-
-
-
+ /**
+ * Responds with instructions to mothership
+ * @return Services_Twilio_Twiml
+ */
+ private function _getReturnInstructions()
+ {
+ $response = new Twiml();
+ $response->say(
+ 'To get to your extraction point, get on your bike and go down the' .
+ ' street. Then Left down an alley. Avoid the police cars. Turn left' .
+ ' into an unfinished housing development. Fly over the roadblock. Go' .
+ ' passed the moon. Soon after you will see your mother ship.',
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
+ $response->say(
+ $this->_thankYouMessage,
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
-
- Work fast with our official CLI.
- Learn more.
-
+ /**
+ * Responds with instructions to choose a planet
+ * @return Services_Twilio_Twiml
+ */
+ private function _getPlanetsMenu()
+ {
+ $response = new Twiml();
+ $gather = $response->gather(
+ ['numDigits' => '1', 'action' => route('planet-connection', [], false)]
+ );
+ $gather->say(
+ 'To call the planet Brodo Asogi, press 2. To call the planet' .
+ ' Dugobah, press 3. To call an Oober asteroid to your location,' .
+ ' press 4. To go back to the main menu, press the star key',
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
-
-
-
- You can’t perform that action at this time.
-
-
-
-
-
- You signed in with another tab or window. Reload to refresh your session.
- You signed out in another tab or window. Reload to refresh your session.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
- Learn more.
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
-
- You can always update your selection by clicking Cookie Preferences at the bottom of the page.
- For more information, see our Privacy Statement.
-
-
-
-
-
-
Essential cookies
-
We use essential cookies to perform essential website functions, e.g. they're used to log you in.
- Learn more
-
-
-
-
Always active
-
-
-
-
-
-
Analytics cookies
-
We use analytics cookies to understand how you use our websites so we can make them better, e.g. they're used to gather information about the pages you visit and how many clicks you need to accomplish a task.
- Learn more
-
-
-
- You can’t perform that action at this time.
-
-
-
-
-
- You signed in with another tab or window. Reload to refresh your session.
- You signed out in another tab or window. Reload to refresh your session.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
- Learn more.
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
-
- You can always update your selection by clicking Cookie Preferences at the bottom of the page.
- For more information, see our Privacy Statement.
-
-
-
-
-
-
Essential cookies
-
We use essential cookies to perform essential website functions, e.g. they're used to log you in.
- Learn more
-
-
-
-
Always active
-
-
-
-
-
-
Analytics cookies
-
We use analytics cookies to understand how you use our websites so we can make them better, e.g. they're used to gather information about the pages you visit and how many clicks you need to accomplish a task.
- Learn more
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- # Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-phone_number = client.lookups \
- .phone_numbers('+16502530000') \
- .fetch(add_ons=['payfone_tcpa_compliance'], add_ons_data={
- 'payfone_tcpa_compliance.RightPartyContactedDate': '20160101'
- }, type=['carrier'])
-
-print(phone_number.add_ons)
-{
- "caller_name": null,
- "country_code": "US",
- "phone_number": "+16502530000",
- "national_format": "(650) 253-0000",
- "carrier": {
- "mobile_country_code": null,
- "mobile_network_code": null,
- "name": "Level 3 Communications, LLC",
- "type": "landline",
- "error_code": null
- },
- "add_ons": {
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "payfone_tcpa_compliance": {
- "status": "successful",
- "request_sid": "XRd3a2991c9108bde3ca9589ed84d31463",
- "message": null,
- "code": null,
- "result": {
- "Status": 0,
- "Response": {
- "MSISDNType": "NonFixedVoIP",
- "NumberMatch": "I",
- "VerifyNumberTransactionId": "2019459819"
- },
- "RequestId": "XRd3a2991c9108bde3ca9589ed84d31463",
- "Description": "Success."
- }
- }
- }
- },
- "url": "https://lookups.twilio.com/v1/PhoneNumbers/+16502530000?Type=carrier"
-var appConfig = {
- serviceBaseUrl: "https://dancing-owl-1234.twil.io/",
- sso: {
- accountSid: "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
- },
- sdkOptions: {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
- },
- logLevel: "debug",
- colorTheme: {
- baseName: "GreyDark",
- colors: {},
- light: false,
- overrides: {}
- },
- componentProps: {
- CRMContainer: {
- uriCallback: (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com"
- }
- },
- router: {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
- }
-};
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-
-appConfig.sso = {
- accountSid: string; // AccountSid of your Twilio Project
- loginPopup: boolean; // whether to launch IdP login in new window
- loginPopupFeatures: string; // standard window.open() features param to be applied to popup window
-};
- flex.CRMContainer
- .defaultProps
- .uriCallback = (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com/";
- {
- yourDefaultName?: string;
- theirDefaultName?: string;
- yourFriendlyNameOverride?: boolean;
- theirFriendlyNameOverride?: boolean;
- const mediaId = Flex.AudioPlayerManager.play(
-{
- url: "sound-url",
- repeatable: true
-},
-(error: AudioPlayerError) => {
- // handle error
-}
-);
- Flex.Manager.getInstance().chatClient.on("messageAdded", () => {
- const mediaId = Flex.AudioPlayerManager.play({
- url: "sound-url",
- repeatable: true
- });
-})
-
-}
- export interface MediaData {
- url: string;
- repeatable: boolean;
-}
- Flex.TeamsView.defaultProps.filters = [
- Flex.TeamsView.activitiesFilter,
- // ... custom filters here
-];
- // Install the Flex Plugin Builder and create a plugin to get this code on your own machine
-// https://www.twilio.com/docs/flex/plugin-builder
-
-const ACTION_DISMISS_BAR = 'DISMISS_BAR';
-
-const initialState = {
- isOpen: true,
-};
-
-// Define plugin actions
-export class Actions {
- static dismissBar = () => ({ type: ACTION_DISMISS_BAR });
-}
-
-// Define how actions influence state
-export function reduce(state = initialState, action) {
- switch (action.type) {
- case ACTION_DISMISS_BAR: {
- return {
- ...state,
- isOpen: false,
- };
- }
-
- default:
- return state;
- }
-}
- const initialState = {
- isOpen: true,
-};
- import React from 'react';
-import { VERSION } from '@twilio/flex-ui';
-import { FlexPlugin } from 'flex-plugin';
-
-import CustomTaskListContainer from './components/CustomTaskList/CustomTaskList.Container';
-import reducers, { namespace } from './states';
-
-const PLUGIN_NAME = 'SamplePlugin';
-
-export default class SamplePlugin extends FlexPlugin {
- constructor() {
- super(PLUGIN_NAME);
- }
-
- /**
- * This code is run when your plugin is being started
- * Use this to modify any UI components or attach to the actions framework
- *
- * @param flex { typeof import('@twilio/flex-ui') }
- * @param manager { import('@twilio/flex-ui').Manager }
- */
- init(flex, manager) {
- this.registerReducers(manager);
-
- const options = { sortOrder: -1 };
- flex.AgentDesktopView
- .Panel1
- .Content
- .add(, options);
- }
-
- /**
- * Registers the plugin reducers
- *
- * @param manager { Flex.Manager }
- */
- registerReducers(manager) {
- if (!manager.store.addReducer) {
- // eslint: disable-next-line
- console.error(`You need FlexUI > 1.9.0 to use built-in redux; you are currently on ${VERSION}`);
- return;
- }
-
- manager.store.addReducer(namespace, reducers);
- }
-}
-
- const ACTION_DISMISS_BAR = 'DISMISS_BAR';
- export function reduce(state = initialState, action) {...}
- curl -X GET 'https://flex-api.twilio.com/v1/Configuration' \
--u $TWILIO_ACCOUNT_SID:$TWILIO_AUTH_TOKEN
- curl -X POST 'https://flex-api.twilio.com/v1/Configuration' \
- -u AC86dafd9acccab6c0d346ed89a1202b2f:your_auth_token
- -H 'Content-Type: application/json' \
- -d '{
- ...old properties
- "ui_attributes": {
- "logLevel": "debug"
- ...old properties continued
- }
- }'
-var appConfig = {
- serviceBaseUrl: "https://dancing-owl-1234.twil.io/",
- sso: {
- accountSid: "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
- },
- sdkOptions: {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
- },
- logLevel: "debug",
- colorTheme: {
- baseName: "GreyDark",
- colors: {},
- light: false,
- overrides: {}
- },
- componentProps: {
- CRMContainer: {
- uriCallback: (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com"
- }
- },
- router: {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
- }
-};
-appConfig.colorTheme = {
- baseName: "GreyDark",
- colors: { base2: "red"},
- light: true,
- overrides: {
- MainHeader: {
- Container: {
- background: "Grey"
- }
- }
- }
-};
-appConfig.disableTransfers = false;
-appConfig.logLevel = 'info';
-appConfig.pluginService = {
- enabled: true,
- url: "https://www.webtechnicom.net/plugins-list.json"
-};
-appConfig.router = {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
-};
-appConfig.sdkOptions = {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
-};
-appConfig.sso = {
- accountSid: "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3" // AccountSid of your Twilio project
-};
-# Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-call = client.calls.create(
- url='http://webtechnicom.net/docs/voice.xml',
- to='+41765203630',
- from_='+17708008448'
- )
-
-print(call.sid)
-{
- "account_sid": "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "annotation": null,
- "answered_by": null,
- "api_version": "2010-04-01",
- "caller_name": null,
- "date_created": "Tue, 31 Aug 2010 20:36:28 +0000",
- "date_updated": "Tue, 31 Aug 2010 20:36:44 +0000",
- "direction": "inbound",
- "duration": "15",
- "end_time": "Tue, 31 Aug 2010 20:36:44 +0000",
- "forwarded_from": "+141586753093",
- "from": "+15017122661",
- "from_formatted": "(501) 712-2661",
- "group_sid": null,
- "parent_call_sid": null,
- "phone_number_sid": "PNXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "price": "-0.03000",
- "price_unit": "USD",
- "sid": "CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "start_time": "Tue, 31 Aug 2010 20:36:29 +0000",
- "status": "completed",
- "subresource_uris": {
- "notifications": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Notifications.json",
- "recordings": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Recordings.json",
- "feedback": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Feedback.json",
- "feedback_summaries": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/FeedbackSummary.json",
- "payments": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Payments.json"
- },
- "to": "+15558675310",
- "to_formatted": "(555) 867-5310",
- "trunk_sid": null,
- "uri": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.json",
- "queue_time": "1000"
-}
-from flask import Flask
-app = Flask(__name__)
-
-@app.route("/")
-def hello():
- return "Hello World!"
-
-if __name__ == "__main__":
- app.run()
-from flask import Flask
-from twilio.twiml.voice_response import VoiceResponse
-
-app = Flask(__name__)
-
-
-@app.route("/answer", methods=['GET', 'POST'])
-def answer_call():
- """Respond to incoming phone calls with a brief message."""
- # Start our TwiML response
- resp = VoiceResponse()
-
- # Read a message aloud to the caller
- resp.say("Thank you for calling! Have a great day.", voice='alice')
-
- return str(resp)
-
-if __name__ == "__main__":
- app.run(debug=True)
-# Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-call = client.calls.create(
- url='http://demo.twilio.com/docs/voice.xml',
- to='+15558675310',
- from_='+15017122661'
- )
-
-print(call.sid)
-{
- "account_sid": "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "annotation": null,
- "answered_by": null,
- "api_version": "2010-04-01",
- "caller_name": null,
- "date_created": "Tue, 31 Aug 2010 20:36:28 +0000",
- "date_updated": "Tue, 31 Aug 2010 20:36:44 +0000",
- "direction": "inbound",
- "duration": "15",
- "end_time": "Tue, 31 Aug 2010 20:36:44 +0000",
- "forwarded_from": "+141586753093",
- "from": "+15017122661",
- "from_formatted": "(501) 712-2661",
- "group_sid": null,
- "parent_call_sid": null,
- "phone_number_sid": "PNXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "price": "-0.03000",
- "price_unit": "USD",
- "sid": "CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "start_time": "Tue, 31 Aug 2010 20:36:29 +0000",
- "status": "completed",
- "subresource_uris": {
- "notifications": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Notifications.json",
- "recordings": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Recordings.json",
- "feedback": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Feedback.json",
- "feedback_summaries": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/FeedbackSummary.json",
- "payments": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Payments.json"
- },
- "to": "+41765203630",
- "to_formatted": "+1(770)800 8448",
- "trunk_sid": null,
- "uri": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.json",
- "queue_time": "1000"
-}
-from flask import Flask
-app = Flask(__name__)
-
-@app.route("/")
-def hello():
- return "Hello World!"
-
-if __name__ == "__main__":
- app.run()
-from flask import Flask
-from twilio.twiml.voice_response import VoiceResponse
-
-app = Flask(__name__)
-
-
-@app.route("/answer", methods=['GET', 'POST'])
-def answer_call():
- """Respond to incoming phone calls with a brief message."""
- # Start our TwiML response
- resp = VoiceResponse()
-
- # Read a message aloud to the caller
- resp.say("Thank you for calling! Have a great day.", voice='alice')
-
- return str(resp)
-
-if __name__ == "__main__":
- app.run(debug=True)
-require 'twilio-ruby'
-
-# Get your Account Sid and Auth Token from twilio.com/console
-account_sid = 'AC86dafd9acccab6c0d346ed89a1202b2f'
-auth_token = 'your_auth_token'
-
-# set up a client to talk to the Twilio REST API
-@client = Twilio::REST::Client.new(account_sid, auth_token)
-
-call = @client.calls.create(
- to: "+15558675310",
- from: "+15017122661",
- url: "http://demo.twilio.com/docs/voice.xml")
-puts call.to
-
-npm install @twilio/flex-ui@1.18.0
-const defaultConfiguration: Config = {
- disableLocalStorage: false,
- available: true,
- colorTheme: {
- baseName: "BlueMediumTheme"
- },
- componentProps: {
- MessagingCanvas: {
- avatarCallback: (identity: string) => SessionActions.getAgentAvatar(identity),
- showTrayOnInactive: true
- },
- MessageCanvasTray: {
- onButtonClick: () => Actions.invokeAction("RestartEngagement")
- }
- },
- tokenServerUrl: "https://iam.twilio.com/v1/Accounts/{accountSid}/Tokens",
- flexWebChannelsUrl: "https://flex-api.twilio.com/v1/WebChannels",
- context: {
- friendlyName: "Anonymous"
- },
- startEngagementOnInit: true,
- sdkOptions: {
- chat: {}
- }
-};
- FlexWebChat.MainHeader.defaultProps.showImage = true;
-
-
-{
-
- yourDefaultName: 'You',
-
- theirDefaultName: 'Agent',
-
- yourFriendlyNameOverride: false,
-
- theirFriendlyNameOverride: false
-
-}
-const brandColor1 = "#1976d2";
-const brandColor2 = "#233659";
-const brandTextColor = "#ffffff";
-
-
-const personalizedColors = {
- darkBlueBackground: "#3C425C",
- whiteText: "#FFFFFF",
- entryPointBackground: "#3C425C",
- lighterBackground: "#ecedf1",
- primaryButtonBackground: "#1976d2",
- primaryButtonColor: "#FFFFFF",
- secondaryButtonBackground: "#6e7180",
- secondaryButtonColor: "#FFFFFF"
-};
-
-// assign
-const brandMessageBubbleColors = (bgColor) => ({
- Bubble: {
- background: bgColor,
- color: brandTextColor
- },
- Avatar: {
- background: bgColor,
- color: brandTextColor
- },
- Header: {
- color: brandTextColor
- }
-});
-
-const brandedColors = {
- Chat: {
- MessageListItem: {
- FromOthers: brandMessageBubbleColors(brandColor2),
- FromMe: brandMessageBubbleColors(brandColor1),
- },
- MessageInput: {
- Container:{
- Button: {
- background: brandColor1,
- color: brandTextColor
- }
- }
- },
- MessageCanvasTray: {
- Container: {
- background: personalizedColors.darkBlueBackground,
- color: personalizedColors.whiteText
- }
- },
- },
-
- MainHeader: {
- Container: {
- background: personalizedColors.darkBlueBackground,
- color: personalizedColors.whiteText
- },
- Logo: {
- fill: brandTextColor
- }
- },
-
- EntryPoint: {
- Container: {
- background: personalizedColors.entryPointBackground,
- color: personalizedColors.whiteText
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- background: personalizedColors.lighterBackground
- },
-
- Form: {
- SubmitButton: {
- background: personalizedColors.primaryButtonBackground,
- color: personalizedColors.whiteText
- }
- }
- }
-};
-var appConfig = {
- colorTheme: {
- overrides: brandedColors
- }
-}
- MainContainer: {
- background: colors.base1
- },
-
- EntryPoint: {
- Container: {
- backgroundImage: `linear-gradient(to top, ${colors.defaultButtonColor}, ${colors.defaultButtonColor})`,
- backgroundColor: "rgba(0,0,0,0)",
- color: "#ffffff",
- "&:hover": {
- backgroundColor: colors.buttonHoverColor,
- backgroundBlendMode: "color",
- }
- }
- },
-
- MainHeader: {
- Container: {
- color: textColor
- },
- Logo: {
- fill: lightTheme ? "#000000" : "#ffffff"
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Footer: {
- color: textColor
- },
- Form: {
- SubmitButton: {
- "background-image":
- `linear-gradient(to top,${colors.defaultButtonColor},${colors.defaultButtonColor})`,
- color: "#ffffff"
- },
- Label: {}
- }
- },
-
- InvalidPreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Button: {
- background: colors.defaultButtonColor,
- color: colors.lightTextColor
- }
- },
-
- Modal: {
- Container: {
- background: colors.base2,
- color: textColor,
- },
- Title: {
- color: textColor
- },
- PrimaryButton: {
- background: colors.base2,
- color: textColor,
- },
- SecondaryButton: {
- background: colors.base2,
- color: textColor,
- }
- },
-
- Chat: {
- MessagingCanvas: {
- Container: {
- background: colors.base1
- }
- },
-
- MessageList: {
- DateSeparatorLine: {
- borderColor: colors.base4
- },
- DateSeparatorText: {
- color: textColor
- },
- TypingIndicator: {
- color: textColor
- }
- },
-
- MessageInput: {
- Container: {
- background: colors.base2,
- color: textColor,
- "::placeholder": {
- color: textColor
- },
- Button: {
- color: "#ffffff",
- background: "#1976D2"
- }
- }
- },
-
- MessageListItem: {
- FromMe: {
- Avatar: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Bubble: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Header: {
- color: "#ffffff",
- }
- },
- FromOthers: {
- Avatar: {
- color: colors.base11,
- background: colors.base2
- },
- Bubble: {
- color: textColor,
- background: colors.base2
- },
- Header: {
- color: textColor
- }
- },
- ReadStatus: {
- color: textColor
- }
- },
-
- MessageCanvasTray: {
- Container: {
- background: colors.base2,
- color: textColor
- },
- Button: {
- color: colors.lightTextColor,
- background: colors.defaultButtonColor,
- lightHover: false,
- }
- },
-
- WelcomeMessage: {
- Container: {
- color: textColor
- },
- Icon: {
- color: colors.base11
- }
- }
- },
-
- Progress: {
- Circular: {
- staticBackgroundBorderColor: colors.lightTextColor,
- animatingBackgroundBorderColor: colors.base4,
- animatingForegroundBorderColor: colors.defaultButtonColor,
- }
- },
-
- FormComponents: {
- TextArea: {
- borderColor: colors.base4,
- color: textColor,
- background: "transparent",
-
- "&:focus": {
- background: colors.base1,
- boxShadow: `0px 0px 0px 2px ${colors.focusGlow}`,
- border: `1px solid ${colors.focusColor}`
- }
- },
- Input: {
- color: textColor
- }
- },
- MainContainer: {
- background: colors.base1
- },
-
- EntryPoint: {
- Container: {
- backgroundImage: `linear-gradient(to top, ${colors.defaultButtonColor}, ${colors.defaultButtonColor})`,
- backgroundColor: "rgba(0,0,0,0)",
- color: "#ffffff",
- "&:hover": {
- backgroundColor: colors.buttonHoverColor,
- backgroundBlendMode: "color",
- }
- }
- },
-
- MainHeader: {
- Container: {
- color: textColor
- },
- Logo: {
- fill: lightTheme ? "#000000" : "#ffffff"
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Footer: {
- color: textColor
- },
- Form: {
- SubmitButton: {
- "background-image":
- `linear-gradient(to top,${colors.defaultButtonColor},${colors.defaultButtonColor})`,
- color: "#ffffff"
- },
- Label: {}
- }
- },
-
- InvalidPreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Button: {
- background: colors.defaultButtonColor,
- color: colors.lightTextColor
- }
- },
-
- Modal: {
- Container: {
- background: colors.base2,
- color: textColor,
- },
- Title: {
- color: textColor
- },
- PrimaryButton: {
- background: colors.base2,
- color: textColor,
- },
- SecondaryButton: {
- background: colors.base2,
- color: textColor,
- }
- },
-
- Chat: {
- MessagingCanvas: {
- Container: {
- background: colors.base1
- }
- },
-
- MessageList: {
- DateSeparatorLine: {
- borderColor: colors.base4
- },
- DateSeparatorText: {
- color: textColor
- },
- TypingIndicator: {
- color: textColor
- }
- },
-
- MessageInput: {
- Container: {
- background: colors.base2,
- color: textColor,
- "::placeholder": {
- color: textColor
- },
- Button: {
- color: "#ffffff",
- background: "#1976D2"
- }
- }
- },
-
- MessageListItem: {
- FromMe: {
- Avatar: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Bubble: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Header: {
- color: "#ffffff",
- }
- },
- FromOthers: {
- Avatar: {
- color: colors.base11,
- background: colors.base2
- },
- Bubble: {
- color: textColor,
- background: colors.base2
- },
- Header: {
- color: textColor
- }
- },
- ReadStatus: {
- color: textColor
- }
- },
-
- MessageCanvasTray: {
- Container: {
- background: colors.base2,
- color: textColor
- },
- Button: {
- color: colors.lightTextColor,
- background: colors.defaultButtonColor,
- lightHover: false,
- }
- },
-
- WelcomeMessage: {
- Container: {
- color: textColor
- },
- Icon: {
- color: colors.base11
- }
- }
- },
-
- Progress: {
- Circular: {
- staticBackgroundBorderColor: colors.lightTextColor,
- animatingBackgroundBorderColor: colors.base4,
- animatingFoatingForegroundBorderColor: colors.defaultButtonColor,
- }
- },
-
- FormComponents: {
- TextArea: {
- borderColor: colors.base4,
- color: textColor,
- background: "transparent",
-
- "&:focus": {
- background: colors.base1,
- boxShadow: `0px 0px 0px 2px ${colors.focusGlow}`,
- border: `1px solid ${colors.focusColor}`
- }
- },
- Input: {
- color: textColor
- }
- },
- FlexWebChat.Manager.create(configuration)
- .then(manager => {
-
- manager.strings.WelcomeMessage = "I am a new Welcome Message";
-
- ReactDOM.render(
-
-
- ,
- document.getElementById("root")
- );
- });
- EntryPointTagline: "Chat with us",
- MessageCanvasTrayContent: `
-
Thanks for chatting with us!
-
If you have any more questions please reach out to us again.
`,
- MessageCanvasTrayButton: "START NEW CHAT",
- InvalidPreEngagementMessage: "Pre-engagement forms have not been set and are required to initiate the web-chat. " + "Please configure these now in setup.",
- InvalidPreEngagementButton: "Learn more",
- PredefinedChatMessageAuthorName: "Bot",
- PredefinedChatMessageBody: "Hi there! How can we help you today?",
- InputPlaceHolder: "Type message",
- TypingIndicator: "{{name}} is typing ... ",
- Read: "Read",
- MessageSendingDisabled: "Message sending has been disabled",
- Today: "TODAY",
- Yesterday: "YESTERDAY",
- MessageCanvasTrayButton: "START NEW CHAT",
- WelcomeMessage: "Welcome to customer service",
- Save: "SAVE",
- Reset: "RESET",
- MessageCharacterCountStatus: "{{currentCharCount}} / {{maxCharCount}}",
- SendMessageTooltip: "Send Message",
- FieldValidationRequiredField: "Field required",
- FieldValidationInvalidEmail: "Please provide a valid email address"
- FlexWebChat.Actions.on("afterStartEngagement", (payload) => {
-
- const { channelSid } = manager.store.getState().flex.session;
- manager.chatClient.getChannelBySid(channelSid)
- .then(channel => {
- channel.sendMessage("My awesome message");
- });
- });
- // WebchatConfig.js
-
-const defaultConfiguration: Config = {
- disableLocalStorage: false,
- available: true,
- colorTheme: {
- baseName: "BlueMediumTheme"
- },
- componentProps: {
- MessagingCanvas: {
- avatarCallback: (identity: string) => SessionActions.getAgentAvatar(identity),
- showTrayOnInactive: true
- },
- MessageCanvasTray: {
- onButtonClick: () => Actions.invokeAction("RestartEngagement")
- }
- PreEngagementCanvas: {
- ....
- },
-
- tokenServerUrl: "https://iam.twilio.com/v1/Accounts/{accountSid}/Tokens",
- flexWebChannelsUrl: "https://flex-api.twilio.com/v1/WebChannels",
- context: {
- friendlyName: "Anonymous"
- },
- startEngagementOnInit: false,
- preEngagementConfig: {
- ...
- }
-};
-const defaultConfiguration: Config = {
-...
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- required: true
- }
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5
- }
- },
- ],
- submitLabel: "Ok Let's Go!"
-}
-};
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- placeholder: "Enter your name",
- required: true,
- value: "Bob",
- readOnly: false
- }
- },
- {
- label: "What is your email?",
- type: "InputItem",
- attributes: {
- name: "email",
- type: "email",
- placeholder: "Enter yout email",
- required: true,
- value: "Bob@bobson.com",
- readOnly: false
- }
- },
- {
- label: "My awesome dropdown",
- type: "SelectItem",
- attributes: {
- name: "My awesome dropdown",
- required: true,
- readOnly: false
-
- },
- options: [
- {
- value: "value1",
- label: "label1",
- selected: false
- },
- {
- value: "value2",
- label: "label2",
- selected: true
- }
- ]
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5,
- value: "My awesome question",
- readOnly: false
- }
- }
- ],
- footerLabel: "I am a footer",
- submitLabel: "Ok Let's Go!",
-}
-// post question from pre-engagement into chat
-
- FlexWebChat.Actions.on("afterStartEngagement", (payload) => {
- const { question } = payload.formData;
- if (!question) return;
-
- const { channelSid } = manager.store.getState().flex.session;
- manager.chatClient.getChannelBySid(channelSid)
- .then(channel => {
- channel.sendMessage(question);
- });
- });
- FlexWebChat.MessagingCanvas.defaultProps.predefinedMessage = false;
- const defaultConfiguration: Config = {
- ...
- context: {
- locationOrigin: window.location.origin,
- someContextProp: "ContextProp1",
- }
-}
- // context set in the WebChat
-
- context: {
- friendlyName: "Anonymous",
- locationOrigin: "http://someOriginUrl.com",
- someContextProp: "ContextProp1",
- },
-
-// pre-engagement config set in WebChat
-
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- required: true
- }
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5
- }
- },
- ],
- submitLabel: "Ok Let's Go!"
-}
-
-// Chat channel attributes saved on chat initiation
-
-"attributes": "{\"status\":\"ACTIVE\",\"long_lived\":false,\"pre_engagement_data\":{\"friendlyName\":\"Anonymous\",\"question\":\"Can you help me with my invoice?\",\"location\":\"http://localhost:8081/\",\"locationOrigin\":\"http://someOriginUrl.com\",\"someContextProp\":\"ContextProp1\"},\"from\":\"Bob\",\"channel_type\":\"web\"}"
- "{{trigger.message.ChannelAttributes.pre_engagement_data.question}}"
- {"initial_question": "{{trigger.message.ChannelAttributes.pre_engagement_data.question}}"}
- fileAttachment: {
- enabled: true
- }
- fileAttachment: {
-readOnly: true
-}
- // Max file size = 10 mb = 10 x 1024 x 1024 = 10,485,760
-
-interface Config {
- fileAttachment?: {
- enabled?: boolean;
- maxFileSize?: number;
- };
-}
- // Accepted extensions = .png, .txt, .pdf = ["png", "txt", "pdf"]
-
-interface Config {
- fileAttachment?: {
- enabled?: boolean;
- acceptedExtensions?: Array;
- };
-}
- fileAttachment: {
- enabled: true,
- maxFileSize: 26214400,
- acceptedExtensions: ["png", "txt", "pdf"]
-}
- Actions.invokeAction("SendMediaMessage", { file: file, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("AttachFile", { file: File, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("DetachFile", { file: File, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("DownloadMedia", { message: message, channelSid: "unique_channel_identifier" });
- // Add a delete button. to every MessageListItem
-
-const DeleteMessage = ({ message }) => (
- // message is the default prop passed through by the MessageListItem
-
-);
-
-Flex.MessageListItem.Content.add(, { sortOrder: -1 });
- // Implement personal storage
-
-const uploadFileToMyStorage = async (file) => {
- const formData = new FormData();
- formData.append("image", file);
-
- // Upload the file to private storage
- const res = await fetch("https://api.imgur.com/3/image", {
- method: "POST",
- headers: new Headers({
- Authorization: "Client-ID 546c25a59c58ad7"
- }),
- body: formData
- });
- return res.json();
-};
-
-// Replace the action
-Flex.Actions.replaceAction("SendMediaMessage", async (payload: Flex.ActionPayload) => {
- const { file, messageAttributes, channelSid } = payload;
-
- // Retrieve the uploaded file location
- const res = await uploadFileToMyStorage(file);
-
- // Include the new media file when sending the message
- return Flex.Actions.invokeAction("SendMessage", {
- messageAttributes: {
- ...messageAttributes,
- media: {
- url: res.data.link,
- filename: file.name,
- contentType: file.type,
- size: file.size
- }
- },
- body: file.name,
- channelSid
- });
-});
-
-// Now you need to render your uploaded file. First, delete the body of the MessageBubble. Then, add a new body, including appropriate HTML that points to your uploaded file (in this example, an image tag is sufficient for rendering the image. Don’t forget your alt text!)
-
-// Create new message bubble content
-const PersonalStorageContent = ({ message }) => (
-
-
-
-);
-
-Flex.MessageBubble.Content.remove("body", {
- if: (props) => !!props.message.source.attributes.media
-});
-
-Flex.MessageBubble.Content.add(, {
- if: (props) => !!props.message.source.attributes.media
-});// Implement personal storage
-
-const uploadFileToMyStorage = async (file) => {
- const formData = new FormData();
- formData.append("image", file);
-
- // Upload the file to private storage
- const res = await fetch("https://api.imgur.com/3/image", {
- method: "POST",
- headers: new Headers({
- Authorization: "Client-ID 546c25a59c58ad7"
- }),
- body: formData
- });
- return res.json();
-};
-
-// Replace the action
-Flex.Actions.replaceAction("SendMediaMessage", async (payload: Flex.ActionPayload) => {
- const { file, messageAttributes, channelSid } = payload;
-
- // Retrieve the uploaded file location
- const res = await uploadFileToMyStorage(file);
-
- // Include the new media file when sending the message
- return Flex.Actions.invokeAction("SendMessage", {
- messageAttributes: {
- ...messageAttributes,
- media: {
- url: res.data.link,
- filename: file.name,
- contentType: file.type,
- size: file.size
- }
- },
- body: file.name,
- channelSid
- });
-});
-
-// Now you need to render your uploaded file. First, delete the body of the MessageBubble. Then, add a new body, including appropriate HTML that points to your uploaded file (in this example, an image tag is sufficient for rendering the image. Don’t forget your alt text!)
-
-// Create new message bubble content
-const PersonalStorageContent = ({ message }) => (
-
+// Find your Account Sid and Auth Token at twilio.com/console
+// DANGER! This is insecure. See http://twil.io/secure
+$sid = "ACcc67c045cffaea7653952cf73b7443a5";
+$token = "4a48ef16988eca378188b06fd8d433e0";
+$twilio = new Client($sid, $token);
-
-
-
- Star
-
-
- 0
-
+$message = $twilio->messages
+ ->create("+15558675310", // to
+ [
+ "body" => "This will be the body of the new message!",
+ "from" => "+15017122661"
+ ]
+ );
-
+// Find your Account Sid and Auth Token at twilio.com/console
+// DANGER! This is insecure. See http://twil.io/secure
+$sid = "ACcc67c045cffaea7653952cf73b7443a5";
+$token = "4a48ef16988eca378188b06fd8d433e0";
+$twilio = new Client($sid, $token);
-
-
-
+class TwilioRequestValidator
+{
+ /**
+ * Handle an incoming request.
+ *
+ * @param \Illuminate\Http\Request $request
+ * @param \Closure $next
+ * @return mixed
+ */
+ public function handle($request, Closure $next)
+ {
+ // Be sure TWILIO_AUTH_TOKEN is set in your .env file.
+ // You can get your authentication token in your twilio console https://www.twilio.com/console
+ $requestValidator = new RequestValidator(env('TWILIO_AUTH_TOKEN'));
+ $requestData = $request->toArray();
-
-
+ // Switch to the body content if this is a JSON request.
+ if (array_key_exists('bodySHA256', $requestData)) {
+ $requestData = $request->getContent();
+ }
-
-
+ $isValid = $requestValidator->validate(
+ $request->header('X-Twilio-Signature'),
+ $request->fullUrl(),
+ $requestData
+ );
-
-
-
+ if ($isValid) {
+ return $next($request);
+ } else {
+ return new Response('You are not Twilio :(', 403);
+ }
+ }
+}
+
-
-
-
-
Join GitHub today
-
GitHub is home to over 50 million developers working together to host and review code, manage projects, and build software together.
-
+// Your Account SID and Auth Token from twilio.com/console
+$account_sid = 'ACXXXXXXXXXXXXXXXXXXXXXXXXXXXX';
+$auth_token = '4a48ef16988eca378188b06fd8d433e0';
+// In production, these should be environment variables. E.g.:
+// $auth_token = $_ENV["TWILIO_ACCOUNT_SID"]
+// A Twilio number you own with Voice capabilities
+$twilio_number = "+15017122661";
+// Where to make a voice call (your cell phone?)
+$to_number = "+15558675310";
-
+$client = new Client($account_sid, $auth_token);
+$client->account->calls->create(
+ $to_number,
+ $twilio_number,
+ array(
+ "url" => "http://demo.twilio.com/docs/voice.xml"
+ )
+);
+
-
+// Start our TwiML response
+$response = new VoiceResponse;
+// Read a message aloud to the caller
+$response->say(
+ "Thank you for calling! Have a great day.",
+ array("voice" => "alice")
+);
+echo $response;
+say(
+ "Thank you for calling! Have a great day.",
+ array("voice" => "alice")
+);
-
-
-
-
-
-
- master
-
-
+echo $response;
+
-
-
-
-
-
-
-
+namespace App\Http\Controllers;
-
+use App\Http\Requests;
+use Illuminate\Http\Request;
+use Twilio\Twiml;
+class IvrController extends Controller
+{
+ public function __construct()
+ {
+ $this->_thankYouMessage = 'Thank you for calling the ET Phone Home' .
+ ' Service - the adventurous alien\'s first choice' .
+ ' in intergalactic travel.';
-
- Use Git or checkout with SVN using the web URL.
-
-
+ }
-
-
-
-
-
-
-
+ /**
+ * Responds with instructions to mothership
+ * @return Services_Twilio_Twiml
+ */
+ private function _getReturnInstructions()
+ {
+ $response = new Twiml();
+ $response->say(
+ 'To get to your extraction point, get on your bike and go down the' .
+ ' street. Then Left down an alley. Avoid the police cars. Turn left' .
+ ' into an unfinished housing development. Fly over the roadblock. Go' .
+ ' passed the moon. Soon after you will see your mother ship.',
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
+ $response->say(
+ $this->_thankYouMessage,
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
-
- Work fast with our official CLI.
- Learn more.
-
+ /**
+ * Responds with instructions to choose a planet
+ * @return Services_Twilio_Twiml
+ */
+ private function _getPlanetsMenu()
+ {
+ $response = new Twiml();
+ $gather = $response->gather(
+ ['numDigits' => '1', 'action' => route('planet-connection', [], false)]
+ );
+ $gather->say(
+ 'To call the planet Brodo Asogi, press 2. To call the planet' .
+ ' Dugobah, press 3. To call an Oober asteroid to your location,' .
+ ' press 4. To go back to the main menu, press the star key',
+ ['voice' => 'Alice', 'language' => 'en-GB']
+ );
-
-
-
- You can’t perform that action at this time.
-
-
-
-
-
- You signed in with another tab or window. Reload to refresh your session.
- You signed out in another tab or window. Reload to refresh your session.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
- Learn more.
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
-
- You can always update your selection by clicking Cookie Preferences at the bottom of the page.
- For more information, see our Privacy Statement.
-
-
-
-
-
-
Essential cookies
-
We use essential cookies to perform essential website functions, e.g. they're used to log you in.
- Learn more
-
-
-
-
Always active
-
-
-
-
-
-
Analytics cookies
-
We use analytics cookies to understand how you use our websites so we can make them better, e.g. they're used to gather information about the pages you visit and how many clicks you need to accomplish a task.
- Learn more
-
-
-
- You can’t perform that action at this time.
-
-
-
-
-
- You signed in with another tab or window. Reload to refresh your session.
- You signed out in another tab or window. Reload to refresh your session.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
- Learn more.
-
-
-
-
-
-
-
-
-
-
-
-
- We use optional third-party analytics cookies to understand how you use GitHub.com so we can build better products.
-
-
- You can always update your selection by clicking Cookie Preferences at the bottom of the page.
- For more information, see our Privacy Statement.
-
-
-
-
-
-
Essential cookies
-
We use essential cookies to perform essential website functions, e.g. they're used to log you in.
- Learn more
-
-
-
-
Always active
-
-
-
-
-
-
Analytics cookies
-
We use analytics cookies to understand how you use our websites so we can make them better, e.g. they're used to gather information about the pages you visit and how many clicks you need to accomplish a task.
- Learn more
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- # Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-phone_number = client.lookups \
- .phone_numbers('+16502530000') \
- .fetch(add_ons=['payfone_tcpa_compliance'], add_ons_data={
- 'payfone_tcpa_compliance.RightPartyContactedDate': '20160101'
- }, type=['carrier'])
-
-print(phone_number.add_ons)
-{
- "caller_name": null,
- "country_code": "US",
- "phone_number": "+16502530000",
- "national_format": "(650) 253-0000",
- "carrier": {
- "mobile_country_code": null,
- "mobile_network_code": null,
- "name": "Level 3 Communications, LLC",
- "type": "landline",
- "error_code": null
- },
- "add_ons": {
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "payfone_tcpa_compliance": {
- "status": "successful",
- "request_sid": "XRd3a2991c9108bde3ca9589ed84d31463",
- "message": null,
- "code": null,
- "result": {
- "Status": 0,
- "Response": {
- "MSISDNType": "NonFixedVoIP",
- "NumberMatch": "I",
- "VerifyNumberTransactionId": "2019459819"
- },
- "RequestId": "XRd3a2991c9108bde3ca9589ed84d31463",
- "Description": "Success."
- }
- }
- }
- },
- "url": "https://lookups.twilio.com/v1/PhoneNumbers/+16502530000?Type=carrier"
-var appConfig = {
- serviceBaseUrl: "https://dancing-owl-1234.twil.io/",
- sso: {
- accountSid: "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
- },
- sdkOptions: {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
- },
- logLevel: "debug",
- colorTheme: {
- baseName: "GreyDark",
- colors: {},
- light: false,
- overrides: {}
- },
- componentProps: {
- CRMContainer: {
- uriCallback: (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com"
- }
- },
- router: {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
- }
-};
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-{
- "status": "successful",
- "message": null,
- "code": null,
- "results": {
- "whitepages_pro_caller_id": {
- "code": null,
- "message": null,
- "request_sid": "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3",
- "result": {
- "alternate_phones": [
- "8003361327"
- ],
- "associated_people": [],
- "belongs_to": [
- {
- "age_range": null,
- "firstname": null,
- "gender": null,
- "id": "Business.7e29cf66-8bf2-4812-829d-356654b5b3d3.Durable",
- "lastname": null,
- "link_to_phone_start_date": null,
- "middlename": null,
- "name": "Twilio Inc",
- "type": "Business"
- }
- ],
- "carrier": "Twilio",
- "country_calling_code": "1",
- "current_addresses": [
- {
- "city": "San Francisco",
- "country_code": "US",
- "delivery_point": "MultiUnit",
- "id": "Location.88e44955-805c-455a-99da-d7444ca5c484.Durable",
- "is_active": true,
- "lat_long": {
- "latitude": 37.783382,
- "longitude": -122.395714,
- "accuracy": "RoofTop"
- },
- "link_to_person_start_date": null,
- "location_type": "Address",
- "postal_code": "94107",
- "state_code": "CA",
- "street_line_1": "Address",
- "street_line_2": null,
- "zip4": "3624"
- }
- ],
- "error": null,
- "historical_addresses": [],
- "id": "Phone.4d796fef-a2df-4b08-cfe3-bc7128b6f6bb.Durable",
- "is_commercial": true,
- "is_prepaid": false,
- "is_valid": true,
- "line_type": "NonFixedVOIP",
- "phone_number": "5558675310",
- "warnings": []
- },
- "status": "successful"
- }
- }
-}
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-from flask import Flask, request
-from twilio import twiml
-
-import json
-
-
-app = Flask(__name__)
-
-@app.route("/voice", methods=['GET', 'POST'])
-def call():
- """Responds to incoming calls using Twilio Add-ons"""
- # Start our TwiML response
- response = twiml.Response()
-
- # Decode the JSON included in the 'AddOns' field
- add_ons = json.loads(request.values['AddOns'])
-
- # If the Whitepages add-on found nothing, return immediately
- if 'whitepages_pro_caller_id' not in add_ons['results']:
- response.say('Sorry, I could not learn anything about you.')
- response.hangup()
-
- return str(response)
-
- # Otherwise, extract the Whitepages data
- whitepages = add_ons['results']['whitepages_pro_caller_id']
-
- # Grab the result Whitepages gave us
- # (see the "Documentation" tab on the Whitepages add-on for more details)
- caller_id = whitepages['result']
-
- # See if we can get the caller's name
- try:
- first_name = caller_id['belongs_to'][0]['firstname']
- except (IndexError, KeyError):
- first_name = 'a mystery'
-
- # And what city the caller lives in
- try:
- city = caller_id['current_addresses'][0]['city']
- except (IndexError, KeyError):
- city = 'a mystery'
-
- # Tell the caller what we think their name and city are
- response.say('Hello. Your name is {}.'.format(first_name))
- response.say('And I think you live in {}.'.format(city))
-
- # Then end the call
- response.hangup()
-
- return str(response)
-
-if __name__ == "__main__":
- app.run(debug=True)
-
-appConfig.sso = {
- accountSid: string; // AccountSid of your Twilio Project
- loginPopup: boolean; // whether to launch IdP login in new window
- loginPopupFeatures: string; // standard window.open() features param to be applied to popup window
-};
- flex.CRMContainer
- .defaultProps
- .uriCallback = (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com/";
- {
- yourDefaultName?: string;
- theirDefaultName?: string;
- yourFriendlyNameOverride?: boolean;
- theirFriendlyNameOverride?: boolean;
- const mediaId = Flex.AudioPlayerManager.play(
-{
- url: "sound-url",
- repeatable: true
-},
-(error: AudioPlayerError) => {
- // handle error
-}
-);
- Flex.Manager.getInstance().chatClient.on("messageAdded", () => {
- const mediaId = Flex.AudioPlayerManager.play({
- url: "sound-url",
- repeatable: true
- });
-})
-
-}
- export interface MediaData {
- url: string;
- repeatable: boolean;
-}
- Flex.TeamsView.defaultProps.filters = [
- Flex.TeamsView.activitiesFilter,
- // ... custom filters here
-];
- // Install the Flex Plugin Builder and create a plugin to get this code on your own machine
-// https://www.twilio.com/docs/flex/plugin-builder
-
-const ACTION_DISMISS_BAR = 'DISMISS_BAR';
-
-const initialState = {
- isOpen: true,
-};
-
-// Define plugin actions
-export class Actions {
- static dismissBar = () => ({ type: ACTION_DISMISS_BAR });
-}
-
-// Define how actions influence state
-export function reduce(state = initialState, action) {
- switch (action.type) {
- case ACTION_DISMISS_BAR: {
- return {
- ...state,
- isOpen: false,
- };
- }
-
- default:
- return state;
- }
-}
- const initialState = {
- isOpen: true,
-};
- import React from 'react';
-import { VERSION } from '@twilio/flex-ui';
-import { FlexPlugin } from 'flex-plugin';
-
-import CustomTaskListContainer from './components/CustomTaskList/CustomTaskList.Container';
-import reducers, { namespace } from './states';
-
-const PLUGIN_NAME = 'SamplePlugin';
-
-export default class SamplePlugin extends FlexPlugin {
- constructor() {
- super(PLUGIN_NAME);
- }
-
- /**
- * This code is run when your plugin is being started
- * Use this to modify any UI components or attach to the actions framework
- *
- * @param flex { typeof import('@twilio/flex-ui') }
- * @param manager { import('@twilio/flex-ui').Manager }
- */
- init(flex, manager) {
- this.registerReducers(manager);
-
- const options = { sortOrder: -1 };
- flex.AgentDesktopView
- .Panel1
- .Content
- .add(, options);
- }
-
- /**
- * Registers the plugin reducers
- *
- * @param manager { Flex.Manager }
- */
- registerReducers(manager) {
- if (!manager.store.addReducer) {
- // eslint: disable-next-line
- console.error(`You need FlexUI > 1.9.0 to use built-in redux; you are currently on ${VERSION}`);
- return;
- }
-
- manager.store.addReducer(namespace, reducers);
- }
-}
-
- const ACTION_DISMISS_BAR = 'DISMISS_BAR';
- export function reduce(state = initialState, action) {...}
- curl -X GET 'https://flex-api.twilio.com/v1/Configuration' \
--u $TWILIO_ACCOUNT_SID:$TWILIO_AUTH_TOKEN
- curl -X POST 'https://flex-api.twilio.com/v1/Configuration' \
- -u AC86dafd9acccab6c0d346ed89a1202b2f:your_auth_token
- -H 'Content-Type: application/json' \
- -d '{
- ...old properties
- "ui_attributes": {
- "logLevel": "debug"
- ...old properties continued
- }
- }'
-var appConfig = {
- serviceBaseUrl: "https://dancing-owl-1234.twil.io/",
- sso: {
- accountSid: "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
- },
- sdkOptions: {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
- },
- logLevel: "debug",
- colorTheme: {
- baseName: "GreyDark",
- colors: {},
- light: false,
- overrides: {}
- },
- componentProps: {
- CRMContainer: {
- uriCallback: (task) => task
- ? `https://www.bing.com/search?q=${task.attributes.name}`
- : "http://bing.com"
- }
- },
- router: {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
- }
-};
-appConfig.colorTheme = {
- baseName: "GreyDark",
- colors: { base2: "red"},
- light: true,
- overrides: {
- MainHeader: {
- Container: {
- background: "Grey"
- }
- }
- }
-};
-appConfig.disableTransfers = false;
-appConfig.logLevel = 'info';
-appConfig.pluginService = {
- enabled: true,
- url: "https://www.webtechnicom.net/plugins-list.json"
-};
-appConfig.router = {
- type: "memory",
- history: {
- initialEntries: [ "/agent-desktop" ]
- }
-};
-appConfig.sdkOptions = {
- chat: {},
- insights: {},
- voice: {},
- worker: {}
-};
-appConfig.sso = {
- accountSid: "XRb57cab3a3c0cfe0bb50f093d9bd3b0a3" // AccountSid of your Twilio project
-};
-# Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-call = client.calls.create(
- url='http://webtechnicom.net/docs/voice.xml',
- to='+41765203630',
- from_='+17708008448'
- )
-
-print(call.sid)
-{
- "account_sid": "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "annotation": null,
- "answered_by": null,
- "api_version": "2010-04-01",
- "caller_name": null,
- "date_created": "Tue, 31 Aug 2010 20:36:28 +0000",
- "date_updated": "Tue, 31 Aug 2010 20:36:44 +0000",
- "direction": "inbound",
- "duration": "15",
- "end_time": "Tue, 31 Aug 2010 20:36:44 +0000",
- "forwarded_from": "+141586753093",
- "from": "+15017122661",
- "from_formatted": "(501) 712-2661",
- "group_sid": null,
- "parent_call_sid": null,
- "phone_number_sid": "PNXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "price": "-0.03000",
- "price_unit": "USD",
- "sid": "CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "start_time": "Tue, 31 Aug 2010 20:36:29 +0000",
- "status": "completed",
- "subresource_uris": {
- "notifications": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Notifications.json",
- "recordings": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Recordings.json",
- "feedback": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Feedback.json",
- "feedback_summaries": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/FeedbackSummary.json",
- "payments": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Payments.json"
- },
- "to": "+15558675310",
- "to_formatted": "(555) 867-5310",
- "trunk_sid": null,
- "uri": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.json",
- "queue_time": "1000"
-}
-from flask import Flask
-app = Flask(__name__)
-
-@app.route("/")
-def hello():
- return "Hello World!"
-
-if __name__ == "__main__":
- app.run()
-from flask import Flask
-from twilio.twiml.voice_response import VoiceResponse
-
-app = Flask(__name__)
-
-
-@app.route("/answer", methods=['GET', 'POST'])
-def answer_call():
- """Respond to incoming phone calls with a brief message."""
- # Start our TwiML response
- resp = VoiceResponse()
-
- # Read a message aloud to the caller
- resp.say("Thank you for calling! Have a great day.", voice='alice')
-
- return str(resp)
-
-if __name__ == "__main__":
- app.run(debug=True)
-# Download the helper library from https://www.twilio.com/docs/python/install
-import os
-from twilio.rest import Client
-
-
-# Your Account Sid and Auth Token from twilio.com/console
-# and set the environment variables. See http://twil.io/secure
-account_sid = os.environ['TWILIO_ACCOUNT_SID']
-auth_token = os.environ['TWILIO_AUTH_TOKEN']
-client = Client(account_sid, auth_token)
-
-call = client.calls.create(
- url='http://demo.twilio.com/docs/voice.xml',
- to='+15558675310',
- from_='+15017122661'
- )
-
-print(call.sid)
-{
- "account_sid": "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "annotation": null,
- "answered_by": null,
- "api_version": "2010-04-01",
- "caller_name": null,
- "date_created": "Tue, 31 Aug 2010 20:36:28 +0000",
- "date_updated": "Tue, 31 Aug 2010 20:36:44 +0000",
- "direction": "inbound",
- "duration": "15",
- "end_time": "Tue, 31 Aug 2010 20:36:44 +0000",
- "forwarded_from": "+141586753093",
- "from": "+15017122661",
- "from_formatted": "(501) 712-2661",
- "group_sid": null,
- "parent_call_sid": null,
- "phone_number_sid": "PNXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "price": "-0.03000",
- "price_unit": "USD",
- "sid": "CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
- "start_time": "Tue, 31 Aug 2010 20:36:29 +0000",
- "status": "completed",
- "subresource_uris": {
- "notifications": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Notifications.json",
- "recordings": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Recordings.json",
- "feedback": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Feedback.json",
- "feedback_summaries": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/FeedbackSummary.json",
- "payments": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Payments.json"
- },
- "to": "+41765203630",
- "to_formatted": "+1(770)800 8448",
- "trunk_sid": null,
- "uri": "/2010-04-01/Accounts/ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/Calls/CAXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.json",
- "queue_time": "1000"
-}
-from flask import Flask
-app = Flask(__name__)
-
-@app.route("/")
-def hello():
- return "Hello World!"
-
-if __name__ == "__main__":
- app.run()
-from flask import Flask
-from twilio.twiml.voice_response import VoiceResponse
-
-app = Flask(__name__)
-
-
-@app.route("/answer", methods=['GET', 'POST'])
-def answer_call():
- """Respond to incoming phone calls with a brief message."""
- # Start our TwiML response
- resp = VoiceResponse()
-
- # Read a message aloud to the caller
- resp.say("Thank you for calling! Have a great day.", voice='alice')
-
- return str(resp)
-
-if __name__ == "__main__":
- app.run(debug=True)
-require 'twilio-ruby'
-
-# Get your Account Sid and Auth Token from twilio.com/console
-account_sid = 'AC86dafd9acccab6c0d346ed89a1202b2f'
-auth_token = 'your_auth_token'
-
-# set up a client to talk to the Twilio REST API
-@client = Twilio::REST::Client.new(account_sid, auth_token)
-
-call = @client.calls.create(
- to: "+15558675310",
- from: "+15017122661",
- url: "http://demo.twilio.com/docs/voice.xml")
-puts call.to
-
-npm install @twilio/flex-ui@1.18.0
-const defaultConfiguration: Config = {
- disableLocalStorage: false,
- available: true,
- colorTheme: {
- baseName: "BlueMediumTheme"
- },
- componentProps: {
- MessagingCanvas: {
- avatarCallback: (identity: string) => SessionActions.getAgentAvatar(identity),
- showTrayOnInactive: true
- },
- MessageCanvasTray: {
- onButtonClick: () => Actions.invokeAction("RestartEngagement")
- }
- },
- tokenServerUrl: "https://iam.twilio.com/v1/Accounts/{accountSid}/Tokens",
- flexWebChannelsUrl: "https://flex-api.twilio.com/v1/WebChannels",
- context: {
- friendlyName: "Anonymous"
- },
- startEngagementOnInit: true,
- sdkOptions: {
- chat: {}
- }
-};
- FlexWebChat.MainHeader.defaultProps.showImage = true;
-
-
-{
-
- yourDefaultName: 'You',
-
- theirDefaultName: 'Agent',
-
- yourFriendlyNameOverride: false,
-
- theirFriendlyNameOverride: false
-
-}
-const brandColor1 = "#1976d2";
-const brandColor2 = "#233659";
-const brandTextColor = "#ffffff";
-
-
-const personalizedColors = {
- darkBlueBackground: "#3C425C",
- whiteText: "#FFFFFF",
- entryPointBackground: "#3C425C",
- lighterBackground: "#ecedf1",
- primaryButtonBackground: "#1976d2",
- primaryButtonColor: "#FFFFFF",
- secondaryButtonBackground: "#6e7180",
- secondaryButtonColor: "#FFFFFF"
-};
-
-// assign
-const brandMessageBubbleColors = (bgColor) => ({
- Bubble: {
- background: bgColor,
- color: brandTextColor
- },
- Avatar: {
- background: bgColor,
- color: brandTextColor
- },
- Header: {
- color: brandTextColor
- }
-});
-
-const brandedColors = {
- Chat: {
- MessageListItem: {
- FromOthers: brandMessageBubbleColors(brandColor2),
- FromMe: brandMessageBubbleColors(brandColor1),
- },
- MessageInput: {
- Container:{
- Button: {
- background: brandColor1,
- color: brandTextColor
- }
- }
- },
- MessageCanvasTray: {
- Container: {
- background: personalizedColors.darkBlueBackground,
- color: personalizedColors.whiteText
- }
- },
- },
-
- MainHeader: {
- Container: {
- background: personalizedColors.darkBlueBackground,
- color: personalizedColors.whiteText
- },
- Logo: {
- fill: brandTextColor
- }
- },
-
- EntryPoint: {
- Container: {
- background: personalizedColors.entryPointBackground,
- color: personalizedColors.whiteText
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- background: personalizedColors.lighterBackground
- },
-
- Form: {
- SubmitButton: {
- background: personalizedColors.primaryButtonBackground,
- color: personalizedColors.whiteText
- }
- }
- }
-};
-var appConfig = {
- colorTheme: {
- overrides: brandedColors
- }
-}
- MainContainer: {
- background: colors.base1
- },
-
- EntryPoint: {
- Container: {
- backgroundImage: `linear-gradient(to top, ${colors.defaultButtonColor}, ${colors.defaultButtonColor})`,
- backgroundColor: "rgba(0,0,0,0)",
- color: "#ffffff",
- "&:hover": {
- backgroundColor: colors.buttonHoverColor,
- backgroundBlendMode: "color",
- }
- }
- },
-
- MainHeader: {
- Container: {
- color: textColor
- },
- Logo: {
- fill: lightTheme ? "#000000" : "#ffffff"
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Footer: {
- color: textColor
- },
- Form: {
- SubmitButton: {
- "background-image":
- `linear-gradient(to top,${colors.defaultButtonColor},${colors.defaultButtonColor})`,
- color: "#ffffff"
- },
- Label: {}
- }
- },
-
- InvalidPreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Button: {
- background: colors.defaultButtonColor,
- color: colors.lightTextColor
- }
- },
-
- Modal: {
- Container: {
- background: colors.base2,
- color: textColor,
- },
- Title: {
- color: textColor
- },
- PrimaryButton: {
- background: colors.base2,
- color: textColor,
- },
- SecondaryButton: {
- background: colors.base2,
- color: textColor,
- }
- },
-
- Chat: {
- MessagingCanvas: {
- Container: {
- background: colors.base1
- }
- },
-
- MessageList: {
- DateSeparatorLine: {
- borderColor: colors.base4
- },
- DateSeparatorText: {
- color: textColor
- },
- TypingIndicator: {
- color: textColor
- }
- },
-
- MessageInput: {
- Container: {
- background: colors.base2,
- color: textColor,
- "::placeholder": {
- color: textColor
- },
- Button: {
- color: "#ffffff",
- background: "#1976D2"
- }
- }
- },
-
- MessageListItem: {
- FromMe: {
- Avatar: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Bubble: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Header: {
- color: "#ffffff",
- }
- },
- FromOthers: {
- Avatar: {
- color: colors.base11,
- background: colors.base2
- },
- Bubble: {
- color: textColor,
- background: colors.base2
- },
- Header: {
- color: textColor
- }
- },
- ReadStatus: {
- color: textColor
- }
- },
-
- MessageCanvasTray: {
- Container: {
- background: colors.base2,
- color: textColor
- },
- Button: {
- color: colors.lightTextColor,
- background: colors.defaultButtonColor,
- lightHover: false,
- }
- },
-
- WelcomeMessage: {
- Container: {
- color: textColor
- },
- Icon: {
- color: colors.base11
- }
- }
- },
-
- Progress: {
- Circular: {
- staticBackgroundBorderColor: colors.lightTextColor,
- animatingBackgroundBorderColor: colors.base4,
- animatingForegroundBorderColor: colors.defaultButtonColor,
- }
- },
-
- FormComponents: {
- TextArea: {
- borderColor: colors.base4,
- color: textColor,
- background: "transparent",
-
- "&:focus": {
- background: colors.base1,
- boxShadow: `0px 0px 0px 2px ${colors.focusGlow}`,
- border: `1px solid ${colors.focusColor}`
- }
- },
- Input: {
- color: textColor
- }
- },
- MainContainer: {
- background: colors.base1
- },
-
- EntryPoint: {
- Container: {
- backgroundImage: `linear-gradient(to top, ${colors.defaultButtonColor}, ${colors.defaultButtonColor})`,
- backgroundColor: "rgba(0,0,0,0)",
- color: "#ffffff",
- "&:hover": {
- backgroundColor: colors.buttonHoverColor,
- backgroundBlendMode: "color",
- }
- }
- },
-
- MainHeader: {
- Container: {
- color: textColor
- },
- Logo: {
- fill: lightTheme ? "#000000" : "#ffffff"
- }
- },
-
- PreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Footer: {
- color: textColor
- },
- Form: {
- SubmitButton: {
- "background-image":
- `linear-gradient(to top,${colors.defaultButtonColor},${colors.defaultButtonColor})`,
- color: "#ffffff"
- },
- Label: {}
- }
- },
-
- InvalidPreEngagementCanvas: {
- Container: {
- color: textColor
- },
- Button: {
- background: colors.defaultButtonColor,
- color: colors.lightTextColor
- }
- },
-
- Modal: {
- Container: {
- background: colors.base2,
- color: textColor,
- },
- Title: {
- color: textColor
- },
- PrimaryButton: {
- background: colors.base2,
- color: textColor,
- },
- SecondaryButton: {
- background: colors.base2,
- color: textColor,
- }
- },
-
- Chat: {
- MessagingCanvas: {
- Container: {
- background: colors.base1
- }
- },
-
- MessageList: {
- DateSeparatorLine: {
- borderColor: colors.base4
- },
- DateSeparatorText: {
- color: textColor
- },
- TypingIndicator: {
- color: textColor
- }
- },
-
- MessageInput: {
- Container: {
- background: colors.base2,
- color: textColor,
- "::placeholder": {
- color: textColor
- },
- Button: {
- color: "#ffffff",
- background: "#1976D2"
- }
- }
- },
-
- MessageListItem: {
- FromMe: {
- Avatar: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Bubble: {
- color: "#ffffff",
- background: "#1976D2"
- },
- Header: {
- color: "#ffffff",
- }
- },
- FromOthers: {
- Avatar: {
- color: colors.base11,
- background: colors.base2
- },
- Bubble: {
- color: textColor,
- background: colors.base2
- },
- Header: {
- color: textColor
- }
- },
- ReadStatus: {
- color: textColor
- }
- },
-
- MessageCanvasTray: {
- Container: {
- background: colors.base2,
- color: textColor
- },
- Button: {
- color: colors.lightTextColor,
- background: colors.defaultButtonColor,
- lightHover: false,
- }
- },
-
- WelcomeMessage: {
- Container: {
- color: textColor
- },
- Icon: {
- color: colors.base11
- }
- }
- },
-
- Progress: {
- Circular: {
- staticBackgroundBorderColor: colors.lightTextColor,
- animatingBackgroundBorderColor: colors.base4,
- animatingFoatingForegroundBorderColor: colors.defaultButtonColor,
- }
- },
-
- FormComponents: {
- TextArea: {
- borderColor: colors.base4,
- color: textColor,
- background: "transparent",
-
- "&:focus": {
- background: colors.base1,
- boxShadow: `0px 0px 0px 2px ${colors.focusGlow}`,
- border: `1px solid ${colors.focusColor}`
- }
- },
- Input: {
- color: textColor
- }
- },
- FlexWebChat.Manager.create(configuration)
- .then(manager => {
-
- manager.strings.WelcomeMessage = "I am a new Welcome Message";
-
- ReactDOM.render(
-
-
- ,
- document.getElementById("root")
- );
- });
- EntryPointTagline: "Chat with us",
- MessageCanvasTrayContent: `
-
Thanks for chatting with us!
-
If you have any more questions please reach out to us again.
`,
- MessageCanvasTrayButton: "START NEW CHAT",
- InvalidPreEngagementMessage: "Pre-engagement forms have not been set and are required to initiate the web-chat. " + "Please configure these now in setup.",
- InvalidPreEngagementButton: "Learn more",
- PredefinedChatMessageAuthorName: "Bot",
- PredefinedChatMessageBody: "Hi there! How can we help you today?",
- InputPlaceHolder: "Type message",
- TypingIndicator: "{{name}} is typing ... ",
- Read: "Read",
- MessageSendingDisabled: "Message sending has been disabled",
- Today: "TODAY",
- Yesterday: "YESTERDAY",
- MessageCanvasTrayButton: "START NEW CHAT",
- WelcomeMessage: "Welcome to customer service",
- Save: "SAVE",
- Reset: "RESET",
- MessageCharacterCountStatus: "{{currentCharCount}} / {{maxCharCount}}",
- SendMessageTooltip: "Send Message",
- FieldValidationRequiredField: "Field required",
- FieldValidationInvalidEmail: "Please provide a valid email address"
- FlexWebChat.Actions.on("afterStartEngagement", (payload) => {
-
- const { channelSid } = manager.store.getState().flex.session;
- manager.chatClient.getChannelBySid(channelSid)
- .then(channel => {
- channel.sendMessage("My awesome message");
- });
- });
- // WebchatConfig.js
-
-const defaultConfiguration: Config = {
- disableLocalStorage: false,
- available: true,
- colorTheme: {
- baseName: "BlueMediumTheme"
- },
- componentProps: {
- MessagingCanvas: {
- avatarCallback: (identity: string) => SessionActions.getAgentAvatar(identity),
- showTrayOnInactive: true
- },
- MessageCanvasTray: {
- onButtonClick: () => Actions.invokeAction("RestartEngagement")
- }
- PreEngagementCanvas: {
- ....
- },
-
- tokenServerUrl: "https://iam.twilio.com/v1/Accounts/{accountSid}/Tokens",
- flexWebChannelsUrl: "https://flex-api.twilio.com/v1/WebChannels",
- context: {
- friendlyName: "Anonymous"
- },
- startEngagementOnInit: false,
- preEngagementConfig: {
- ...
- }
-};
-const defaultConfiguration: Config = {
-...
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- required: true
- }
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5
- }
- },
- ],
- submitLabel: "Ok Let's Go!"
-}
-};
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- placeholder: "Enter your name",
- required: true,
- value: "Bob",
- readOnly: false
- }
- },
- {
- label: "What is your email?",
- type: "InputItem",
- attributes: {
- name: "email",
- type: "email",
- placeholder: "Enter yout email",
- required: true,
- value: "Bob@bobson.com",
- readOnly: false
- }
- },
- {
- label: "My awesome dropdown",
- type: "SelectItem",
- attributes: {
- name: "My awesome dropdown",
- required: true,
- readOnly: false
-
- },
- options: [
- {
- value: "value1",
- label: "label1",
- selected: false
- },
- {
- value: "value2",
- label: "label2",
- selected: true
- }
- ]
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5,
- value: "My awesome question",
- readOnly: false
- }
- }
- ],
- footerLabel: "I am a footer",
- submitLabel: "Ok Let's Go!",
-}
-// post question from pre-engagement into chat
-
- FlexWebChat.Actions.on("afterStartEngagement", (payload) => {
- const { question } = payload.formData;
- if (!question) return;
-
- const { channelSid } = manager.store.getState().flex.session;
- manager.chatClient.getChannelBySid(channelSid)
- .then(channel => {
- channel.sendMessage(question);
- });
- });
- FlexWebChat.MessagingCanvas.defaultProps.predefinedMessage = false;
- const defaultConfiguration: Config = {
- ...
- context: {
- locationOrigin: window.location.origin,
- someContextProp: "ContextProp1",
- }
-}
- // context set in the WebChat
-
- context: {
- friendlyName: "Anonymous",
- locationOrigin: "http://someOriginUrl.com",
- someContextProp: "ContextProp1",
- },
-
-// pre-engagement config set in WebChat
-
-preEngagementConfig: {
-
- description: "Please provide some information",
- fields: [
- {
- label: "What is your name?",
- type: "InputItem",
- attributes: {
- name: "friendlyName",
- type: "text",
- required: true
- }
- },
- {
- label: "What is your question?",
- type: "TextareaItem",
- attributes: {
- name: "question",
- type: "text",
- placeholder: "Type your question here",
- required: false,
- rows: 5
- }
- },
- ],
- submitLabel: "Ok Let's Go!"
-}
-
-// Chat channel attributes saved on chat initiation
-
-"attributes": "{\"status\":\"ACTIVE\",\"long_lived\":false,\"pre_engagement_data\":{\"friendlyName\":\"Anonymous\",\"question\":\"Can you help me with my invoice?\",\"location\":\"http://localhost:8081/\",\"locationOrigin\":\"http://someOriginUrl.com\",\"someContextProp\":\"ContextProp1\"},\"from\":\"Bob\",\"channel_type\":\"web\"}"
- "{{trigger.message.ChannelAttributes.pre_engagement_data.question}}"
- {"initial_question": "{{trigger.message.ChannelAttributes.pre_engagement_data.question}}"}
- fileAttachment: {
- enabled: true
- }
- fileAttachment: {
-readOnly: true
-}
- // Max file size = 10 mb = 10 x 1024 x 1024 = 10,485,760
-
-interface Config {
- fileAttachment?: {
- enabled?: boolean;
- maxFileSize?: number;
- };
-}
- // Accepted extensions = .png, .txt, .pdf = ["png", "txt", "pdf"]
-
-interface Config {
- fileAttachment?: {
- enabled?: boolean;
- acceptedExtensions?: Array;
- };
-}
- fileAttachment: {
- enabled: true,
- maxFileSize: 26214400,
- acceptedExtensions: ["png", "txt", "pdf"]
-}
- Actions.invokeAction("SendMediaMessage", { file: file, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("AttachFile", { file: File, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("DetachFile", { file: File, channelSid: "unique_channel_identifier" });
- Actions.invokeAction("DownloadMedia", { message: message, channelSid: "unique_channel_identifier" });
- // Add a delete button. to every MessageListItem
-
-const DeleteMessage = ({ message }) => (
- // message is the default prop passed through by the MessageListItem
-
-);
-
-Flex.MessageListItem.Content.add(, { sortOrder: -1 });
- // Implement personal storage
-
-const uploadFileToMyStorage = async (file) => {
- const formData = new FormData();
- formData.append("image", file);
-
- // Upload the file to private storage
- const res = await fetch("https://api.imgur.com/3/image", {
- method: "POST",
- headers: new Headers({
- Authorization: "Client-ID 546c25a59c58ad7"
- }),
- body: formData
- });
- return res.json();
-};
-
-// Replace the action
-Flex.Actions.replaceAction("SendMediaMessage", async (payload: Flex.ActionPayload) => {
- const { file, messageAttributes, channelSid } = payload;
-
- // Retrieve the uploaded file location
- const res = await uploadFileToMyStorage(file);
-
- // Include the new media file when sending the message
- return Flex.Actions.invokeAction("SendMessage", {
- messageAttributes: {
- ...messageAttributes,
- media: {
- url: res.data.link,
- filename: file.name,
- contentType: file.type,
- size: file.size
- }
- },
- body: file.name,
- channelSid
- });
-});
-
-// Now you need to render your uploaded file. First, delete the body of the MessageBubble. Then, add a new body, including appropriate HTML that points to your uploaded file (in this example, an image tag is sufficient for rendering the image. Don’t forget your alt text!)
-
-// Create new message bubble content
-const PersonalStorageContent = ({ message }) => (
-
-
-
-);
-
-Flex.MessageBubble.Content.remove("body", {
- if: (props) => !!props.message.source.attributes.media
-});
-
-Flex.MessageBubble.Content.add(, {
- if: (props) => !!props.message.source.attributes.media
-});// Implement personal storage
-
-const uploadFileToMyStorage = async (file) => {
- const formData = new FormData();
- formData.append("image", file);
-
- // Upload the file to private storage
- const res = await fetch("https://api.imgur.com/3/image", {
- method: "POST",
- headers: new Headers({
- Authorization: "Client-ID 546c25a59c58ad7"
- }),
- body: formData
- });
- return res.json();
-};
-
-// Replace the action
-Flex.Actions.replaceAction("SendMediaMessage", async (payload: Flex.ActionPayload) => {
- const { file, messageAttributes, channelSid } = payload;
-
- // Retrieve the uploaded file location
- const res = await uploadFileToMyStorage(file);
-
- // Include the new media file when sending the message
- return Flex.Actions.invokeAction("SendMessage", {
- messageAttributes: {
- ...messageAttributes,
- media: {
- url: res.data.link,
- filename: file.name,
- contentType: file.type,
- size: file.size
- }
- },
- body: file.name,
- channelSid
- });
-});
-
-// Now you need to render your uploaded file. First, delete the body of the MessageBubble. Then, add a new body, including appropriate HTML that points to your uploaded file (in this example, an image tag is sufficient for rendering the image. Don’t forget your alt text!)
-
-// Create new message bubble content
-const PersonalStorageContent = ({ message }) => (
-