RingCentral released RingCentral Video in April, a new solution built from the ground up to provide fast, encrypted, high-quality meetings through voice, video, and screen sharing.

RingCentral Video comes with several ready to use, prebuilt integrations available in our App Gallery.

RingCentral embeddable also provides built-in support for RingCentral Video, you can try it right now with online demo.

In RingCentral embeddable, we have provided most of the features of RingCentral Video as v.ringcentral.com:

• Schedule, start, and join meetings
• Check meeting and meeting recording list

RingCentral embeddable also provides an API to create meetings with RingCentral Video: docs: schedule-a-meeting, which can be used in third party apps.

Schedule a meeting

// meeting info
const meetingBody = {
  topic: "Embbnux Ji's Meeting",
  meetingType: "Scheduled",
  password: "",
  schedule: {
    startTime: 1583312400368,
    durationInMinutes: 60,
    timeZone: {
      id: "1"
    }
  },
  allowJoinBeforeHost: false,
  startHostVideo: false,
  startParticipantsVideo: false,
  audioOptions: [
    "Phone",
    "ComputerAudio"
  ]
};

// send a request to schedule meeting
const requestId = Date.now().toString();
document.querySelector("#rc-widget-adapter-frame").contentWindow.postMessage({
  type: 'rc-adapter-message-request',
  requestId: requestId,
  path: '/schedule-meeting',
  body: meetingBody,
}, '*');

Listen schedule meeting result

// listen response
window.addEventListener('message', function (e) {
  var data = e.data;
  if (data && data.type === 'rc-adapter-message-response') {
    if (data.responseId === requestId) {
      console.log(data.response);
    }
  }
});

It is already used in the RingCentral for HubSpot Chrome extension, check our video preview:

To learn even more about other features we have make sure to visit our developer site and if you’re ever stuck make sure to go to our developer forum.

Want to stay up to date and in the know about new APIs and features? Join our Game Changer Program and earn great rewards for building your skills and learning more about RingCentral!

Introduction of RingCentral Video in RingCentral embeddable was originally published in RingCentral Developers on Medium, where people are continuing the conversation by highlighting and responding to this story.

With RingCentral Engage Digital, your company can connect all their different customer service channels, including email, twitter, facebook, instagram, youtube, SMS, and many other built-in social media accounts.

What if your preferred social media account or channel was not on this list? Then don’t worry, because RingCentral Engage Digital also has a common custom solution called an SDK source, with the SDK source, you can connect any source to RingCentral Engage Digital. We have detailed documentation to help you create a SDK source, which could take some time to test and understand the whole process, but this allows you to customize your workflow making it even better for yourself in the long run and increasing the efficiency of your omni-digital customer service.

Because we know that it can take a while and be a bit difficult to build your own SDK, we have created this framework: engage-digital-source-sdk-js, in order to simplify the process for creating a SDK source. Now let’s get started.

Prerequisites

• Nodejs 8.10+/npm, we recommend using nvm to install nodejs/npm.
• RingCentral Engage Digital account, if you don’t already have an account make sure to request a demo.

Quick start

Let’s start a simple RingCentral Engage source server .

# get the code
git clone git@github.com:ringcentral/engage-digital-source-sdk-js.git
cd engage-digital-source-sdk-js

# install dependecies
npm i

# start proxy server, this will make it so your local bot server can be accessed by the RingCentral service
npm run ngrok

# will show
Forwarding                    https://xxxx.ap.ngrok.io -> localhost:6066
# Remember the https://xxxx.ap.ngrok.io, we will use it later

Follow the Step by step guide to create a Engage DigitalSDK source in your Admin console to prepare the source.

# create env file
cp .env.sample .env
# then edit .env, set proper setting according to the tip in .env

# run local dev server
npm start

Test source server

Save your source, your server will get the request, you will then check the request log from your console.

Write SDK source server config file

Now you have some ideas about how it will work, so you can start writing your own SDK source logic, it just requires a config file, then you can start your server with the code listed below:

npx ringcentral-engage-source path-to-your-source-server-config.js

But how do you write a config file? Just check demo-config.js as an example, and then write your own onRequest method, you can see the example below as well:

/**
 * handle all request
 * @param {object} body, request body
 * @param {object} req, express request
 */
exports.onRequest = async (body, req) => {
  console.log('body:', body)
  const { action, params } = body
  console.log('param', params)
  let result
  // check https://github.com/ringcentral/engage-digital-source-sdk/wiki for more info
  switch (action) {
    case 'implementation.info':
      result = {
        objects:
        {
          messages: ['create', 'show', 'list'],
          private_messages: ['create', 'show', 'list'],
          threads: ['create', 'show', 'list']
        },
        options: []
      }
      break

    case 'threads.list':
    case 'private_messages.list':
    case 'messages.list':
      result = []
      break
    case 'threads.show':
    case 'private_messages.show':
    case 'messages.show':
      result = ''
      break
    default:
      result = {}
  }
  return result
}

// extends or override express app as you need
exports.appExtend = (app) => {
  // app.get('/some-route', (req, res) => res.end('some'))
}

And we also have some real world examples you can check out:

• Glip SDK source app: https://github.com/ringcentral/engage-digital-sdk-source-glip
• Reddit SDK source app: https://github.com/ringcentral/engage-digital-sdk-source-reddit

Use it as a module

If you want to fully customize your server, you can certainly use it just as a common npm module, check the guide here for more information about how to make this happen at docs/direct-use.md

Init a source server project with factory CLI tool

Now maybe you want to create an app to test it, so we have a built-in CLI command to init a empty project from template: https://github.com/ringcentral/engage-digital-source-server-template-js.

npm i -g ringcentral-engage-source
ringcentral-engage-source-create my-app

We hope you enjoy creating your very own SDK source with it and that you’ll share all the cool things you’ve created with us.

To learn even more about other tools/SDKs/documents we have, make sure to visit our developer site and if you’re ever stuck, make sure to go to our developer forum or submit an issue in one of the github repos.

Want to stay up to date and in the know about new APIs and features? Join our Game Changer Program and earn great rewards for building your skills and learning more about RingCentral!

Learn How to Create Your Own SDK Source for RingCentral Engage Digital was originally published in RingCentral Developers on Medium, where people are continuing the conversation by highlighting and responding to this story.

We have released the chatbot framework for javascript created by Tyler. Tyler also published a blog post about it RingCentral chatbot framework for JavaScript, make sure to read it to find out even more details about what he created.

We wanted to to push it further — to make the bot creation even simpler and faster, so we created the CLI tool: ringcentral-chatbot-factory.

We simplified it to the point that you simply run the command npx ringcentral-chatbot-factory my-chatbot

# make sure you have npm@5.2+ installed
# use nvm to install nodejs/npm is recommended

npx ringcentral-chatbot-factory my-bot

# or install it first
# npm i -g ringcentral-chatbot-factory && rcf my-chatbot

# then carefully answer all questions, then the my-chatbot folder will be created

cd my-chatbot

# follow the instruction of my-chatbot/README.md to dev/run/test the bot

The screenshot below shows what it looks like when you’re inputing all that:

Still think there are too many steps? OK, we also have a one line script to create a chatbot project, no need to input or select anything, that is it:

# use wget
wget -qO- https://raw.githubusercontent.com/zxdong262/ringcentral-chatbot-factory/master/bin/init.sh | bash

# use curl
curl -o- https://raw.githubusercontent.com/zxdong262/ringcentral-chatbot-factory/master/bin/init.sh | bash

Below we also included a video you can check out to see the whole process — we hope you find it to be quite simple and short:

That is it. It is just like this introduction article, simple and quick. The project README will provide detailed step to run and test the bot in local development env, and script to deploy to AWS Lambda.

We hope you enjoy creating chatbots with it and that you’ll share all the cool things you’ve created using it with us.

To learn even more about other features we have make sure to visit our developer site and if you’re ever stuck make sure to go to our developer forum.

Want to stay up to date and in the know about new APIs and features? Join our Game Changer Program and earn great rewards for building your skills and learning more about RingCentral!

Create RingCentral glip chatbot with chatbot factory (CLI tool) was originally published in RingCentral Developers on Medium, where people are continuing the conversation by highlighting and responding to this story.

We recently released version 1.00 for the RingCentral for HubSpot browser extension(community).

If you’re using RingCentral and HubSpot, then make sure to enhance your experience for both of these tools by utilizing this extension to make your communication experience even better.

This extension will provide you with the following feature enhancements:

• Click to call button
• Popup caller info panel when receiving an inbound call
• Auto/manual sync call log/voicemail/sms to HubSpot, about auto call log sync feature.
• Check HubSpot activities from the RingCentral contact panel
• Custom X-USER-AGENT header for api request
• Active call control
• Sync call log to deal
• Call log with call recording link
• Call customer from the deal page

If all of that sounds interesting to you and you want to get easily started then make sure to watch the video below:

Give it a try!

• Download the zip from the release page: https://github.com/ringcentral/hubspot-embeddable-ringcentral-phone/releases
• Unpack it, get a dist folder, open your Chrome extension page(chrome://extensions/), click load unpacked, select the dist folder. To do this for Firefox see the steps in the note below:

NOTE: For a Firefox extension, choose Addon -> Enable add-on debugging -> Load Temporary Add-on -> Choose dist-firefox/manifest.json.

• Go to https://app.hubspot.com to check

Community support

If you have any feedback or feature requests — feel free to submit an issue on our github repo, user feedback is what’s continued to help us grow this project as far as it’s gone for now and we want to continue to grow it with your help.

Other extensions for CRMs

If you happen to use other CRMs — then check out the list below for other extensions we have available that you can use as well:

• Pipedrive
• Insightly
• RedtailCRM

If your preferred CRM is not on this list, don’t worry! Find out how you can easily build one yourself by reading this article on our blog: Build Chrome extension for CRMs with RingCentral Embeddable widgets

To learn even more about other features we have make sure to visit our developer site and if you’re ever stuck make sure to go to our developer forum.

Want to stay up to date and in the know about new APIs and features? Join our Game Changer Program and earn great rewards for building your skills and learning more about RingCentral!

Introduction of RingCentral for Hubspot Browser extension was originally published in RingCentral Developers on Medium, where people are continuing the conversation by highlighting and responding to this story.

About RingCentral Embeddable widgets

RingCentral Embeddable widgets is a powerful tool for CRMs, its core power is add click-to-call function, around this core function, it can extend and enhance CRM’s communication workflow. It can be integrated into CRM sites, even without official support, developer can still do the integration through building chrome extension.

Advanced Features of these extensions could provide

My colleague Embbnux Ji has a tuturial: Building Chrome Extension Integrations with RingCentral Embeddable, with this tutorial, we could create basic Chrome extension for any site with RingCentral Embeddable.

For CRM sites, we may want to add more advanced features, like click-to-call buttons/links and all the third party features of our ringcentral-embeddable supported:

• For CRM contact list, extension could add hover-to-show tooltip to show click-to-call button.

• For CRM contact info page, extension could add click-to-call button in proper positions.

• For CRM contact phone number text, extension could convert them to click-to-call link.

• Sync CRM contacts to our widgets after user authorization.

• Sync call log to CRM automatically or manually.

• Check CRM contact activities from our widgets.

• Show CRM contact info panel when inbound/outbound call with CRM contact.

We have a video to show how the extension for hubspot works.

Create extension with CLI tool

To minimize the effort to create these extensions, we created the CLI tool: ringcentral-embeddable-extension-factory

Use CLI tool to init a extension project will be like this:

# make sure you have npm@5.2+ installed
npx ringcentral-embeddable-extension-factory my-app

Then just follow the instruction inmy-app/README.md to build, test and develop the extension.

We have a demo video to show this process.

As you can see, before setting proper config/functions, it will work as a Embeddable widgets only, if you are satisfied with this, it is already done! If you want the extension to do the listed features above, you need more work to get there. Our tutorial and examples would be a good place to start.

The Tutorial

We have a detailed tutorial to walk through the process of creating Chrome for CRM with RingCentral Embeddable widgets.

Build Chrome RingCentral widgets extension for CRM- RingCentral Developer Tutorials

Realworld examples

You may get some ideas from these codes.

• pipedrive-embeddable-ringcentral-phone (spa)
• hubspot-embeddable-ringcentral-phone (spa)
• insightly-embeddable-ringcentral-phone (spa)
• redtail-embeddable-ringcentral-phone (non spa)

That is it. We would like to see RingCentral Embeddable widgets extension + CRM to give some “super power” to CRM communication with contacts.

Build Chrome extension for CRMs with RingCentral Embeddable widgets was originally published in RingCentral Developers on Medium, where people are continuing the conversation by highlighting and responding to this story.