top of page

CVR-RUI

CVR-RUI is a pre-baked react ui for CVR(Centedge Video Rooms). This can be integrated to any react application to provide the power of video conferencing with a pre-built ui / ux along with the flexibility to configure according to your own wish / desires. We aim to make it highly flexible without compromising on  video conferencing capabilities as well as development speed. The ultimate goal is to help people build a production grade video conferencing application for their need in React in couple of minutes.

Currently Available features

  • Mic / Camera check before room join

  • Supports 2 joining modes(moderator / participant )

  • In room mute/un-mute, camera on / off and change camera if more than 1 camera available 

  • In room Single screen share / multiple simultaneous Screen shares

  • In room Currently Active speaker detection

  • In room Real time individual bandwidth monitoring and display

  • In room, moderator controls to mute/un-mute, camera off and force remove other participants

  • Fully browser based with support for desktop / mobile browsers( Chrome and Safari )

  • Graceful fallback for non supporting browsers. Room won't start in a unsupported browser!

The link to download and install the npm package is here.

Here you can find a detailed blog post about building a production grade cutting-edge video conferencing app from scratch within 1 hour with the help of this package.

Note: CVR-RUI is running with the help of a small scale video back-end infrastructure sponsored by Centedge along with some generosity from AWS. That's why you don't need a Credit card OR an API key / secret combo OR even a Signup at Centedge to run this app! As this is a small scale setup, we don't advise anybody to build production grade video applications using this npm package which internally depends on infrastructure from Centedge. The back-end setup currently can handle 6 participants in one room including moderator and can handle 5 such rooms simultaneously! Please feel free to play around and tinker around using this package. If you want to build something serious using this and need more number of rooms or more number of participants in each room, feel free to drop us an email at hello@centedge.io and we will be happy to create a production grade infrastructure setup for you.

How to use?

This npm package can be used to build a cutting edge standalone video conferencing app or it can be integrated to an existing react application to enable video conferencing capabilities on the fly without much effort.

Here is a detailed post on how to use this package to build a cutting edge production grade video conferencing app from scratch within 1 hour !

​

undraw_Video_call_re_4p26.png

Browser support

The current version of the package supports the last 3 versions of Google Chrome and Apple Safari. It currently doesn't support any other browser other than mentioned below due to compatibility issues. We will be adding support for more browsers and versions in the future releases.

Here is a detailed list of browsers and devices it supports.

  • Chrome 85 or above on Windows

  • Chrome 85 or above on Linux

  • Chrome 85 or above and Safari 14 or above on macOS

  • Safari 14 or above in iOS

  • Chrome 85 or above in Android 

undraw_mobile_browsers_lib5.png

Description of currently available configuration options in CVR-RUI

CVR-RUI currently supports a good number of configuration options which one can use to provide the desired options to an admin participant or a regular participant while joining the room.

Basic Options

  • theme : It currently accepts light or dark as a value and changes the theme of the video conferencing. By default it is dark.

  • joinButtonColor : It currently accepts any of these values primary, secondary or disabled. By default it is set to the default button color. 

  • roomName : This is the room name which all the participants of the conference will join. Keeping this as the same value will allow multiple participant to join the same room else it will create a new room for each participant! It accepts alphabets, numbers and alphanumeric values as valid room names. If no room name is provided, by default it will stat a room named "demo-room".

  • userName : The unique user name of the user who is going to join a room. By default, it will be "no-name-found" if no name is provided in the config.

  • participantType: It currently accepts values as "moderator" or "". A user joining a room can be of either a moderator or a regular participant. The moderator will have meeting control features like mute/un-mute other participants, switch off camera of other participants and log other user out of the meeting when needed. By default participant type is "".

  •  adminApprovalRequiredToJoinRoom : It currently accepts value either true or false. It enabled, the moderator needs to approve regular users for joining the room.The moderator can choose to deny if he/she doesn't recognise a regular user. This option is valid for the moderator user only.

  • screenSharing: It currently accepts a value true or false. If true the user will be able to share his/her screen with everybody else with all other users inside the room. This option is valid for both type of users.

  • chatOption: It currently accepts value as true or false. If enabled, the room users will be able to chat among themselves either in a public chats which all users can see or private one to one chats.

  • callStartFunction: It currently accepts a function which will be called when the user joins the room. It is useful to implement other business logics based on the successful joining of the room by the user.

  • callEndFunction: It currently accepts a function which will be called when the user leaves the room. It is useful to implement other business logics based on the successful leaving of the room by the user.

 

Advanced Options

​

These options are primarily useful for customers who are looking forward to build video applications for domains like Banking and Financial services, Insurance etc.

​

  • screenShot: It currently accepts true or false as values. If this is true, the moderator will get an option to take the screenshot of a pinned participant video at any point of time in the meeting. This is highly useful for enterprises / startups building vKYC (video Know Your Customer) applications for the banking and financial services institutions where a participant can show a  government issued id as asked by the moderator  for capturing a screenshot and upload to cloud for storage and retrieval.

  • screenShotUploadURL: If the above option is enabled, then provide REST API endpoint here to upload the screenshot to cloud for storage and retrieval.

  • docUpload: It currently accepts true or false as values. If this is true, the moderator will get an option to ask the pinned participant to upload a specific document. The participant will get an notification about the moderator request and a modal will be displayed at the participant end to upload the required document.Once uploaded, the moderator will get a notification along with a link to the uploaded document to verify the document.

  • documentUploadURL: If the above option is enabled, then provide REST API endpoint here to upload document to cloud for storage and retrieval.

  • apiAccessAuthToken : Here you need to provide the api access auth token to access the above mentioned REST API endpoints. 

  • chatPushAPI: Here you can provide a REST API endpoint to upload all the chat messages exchanged between all participants at the end of the meeting. This option is currently under development. 

  • recordingPushAPI: Here you can provide a REST API endpoint to share the recording of the meeting at the end of it.This option is currently under development. 

​

undraw_features_overview_jg7a.png
bottom of page