1.0.0 • Published 2 years ago

podchat-video-voice-call v1.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

Javascript component for podchat video call

With pod chat-video-voice-call you can use video/voice call from Pod platform, without any headache for configurations.

Installation:

npm install podchat-video-voice-call

Import reference:

import VideoVoiceCall from 'podchat-video-voice-call';

How to use:

import * as PodChat from 'podchat-browser';

function main(){

    var params = {
    
     ... // as usual
     
      callOptions: {
        callSocketAddress: "wss://46.32.6.187",
        callTurnIp: "46.32.6.188",
        callDivId: "call-div",
        callAudioTagClassName: "podcall-audio",
        callVideoTagClassName: "podcall-video"
      },
      ....
    };

    this.chatAgent = new PodChat(params);
  	let VideoVoiceCall= initVideoComponent();
    this.chatAgent.on("chatReady", () => {
    	VideoVoiceCall.setChatAgent(this.chatAgent);
   		VideoVoiceCall.call(
        {
          threadId: "thread id" // the thread id that use for call ,
           invitees: [
             		 {
               			 "id": 'username',
               			 "idType": "TO_BE_USER_USERNAME"
             		 }],
         type: "VIDEO"
       });

    });
      
  });
   
}

 function initVideoComponent(){
    let VideoVoiceCall = new VideoVoiceCall(
   'call-container', // HTML element ID that you want to load video  component on it.
    {
      endCallback: endCall ,// this event will raise when video call is ended
      cancelCallback: cancelCall //// this event will raise when  video call is canceled,
      userInfo: this.chatAgent.getCurrentUser(),
      waitingText: `<div style="text-align:center"> 
                      <h4 style="font-size:16px;color: rgba(255, 255, 255, 0.8);
                          font-weight: normal; font-stretch: normal;font-style: normal;
                          line-height: normal">نوع خدمت:${bankingServiceTitle}
                      </h4>
                      <span style="font-size:16px;color: rgba(255, 255, 255, 0.8);
                        font-weight: normal; font-stretch: normal;font-style: normal;line-height: normal">
                          درحال برقراری تماس...
                      </span>
                    </div>
                    `,
        receiveCallTimeout: ,//  timeout for chat SDK receive call event (millisecond)
        callStartedTimeout: ,// timeout for chat SDK call started  event (millisecond) 
        timeoutCallback: ,
        receiveCallback: ,// this will call when SDK receive call will raise
    });

   VideoVoiceCall.render();
   return VideoVoiceCall;
 }


function endCall(){

} 

Full example

Below code show full example of podchat video call that set all required parameters and functions

import * as PodChat from 'podchat-browser';

function main(){

    var params = {
      appId: "appId",
      /**
       * Sand Box
       */
      socketAddress: "wss://chat-sandbox.pod.ir/ws",
      ssoHost: "https://accounts.pod.ir",
      platformHost: "https://sandbox.pod.ir:8043/srv/basic-platform",
      fileServer: 'https://core.pod.ir',
      podSpaceFileServer: 'https://podspace.pod.ir',
      serverName: "chat-server",

      token: 'token',// pod token
      grantDeviceIdFromSSO: false,
      enableCache: false,
      fullResponseObject: true,
      typeCode: "default",
      wsConnectionWaitTime: 500,
      connectionRetryInterval: 5000,
      connectionCheckTimeout: 10000,
      messageTtl: 24 * 60 * 60,
      reconnectOnClose: true,
      httpRequestTimeout: 30000,
      httpUploadRequestTimeout: 0,
      forceWaitQueueInMemory: true,
      asyncRequestTimeout: 20000,
      callOptions: {
        callSocketAddress: "wss://46.32.6.187",
        callTurnIp: "46.32.6.188",
        callDivId: "call-div",
        callAudioTagClassName: "podcall-audio",
        callVideoTagClassName: "podcall-video"
      },
      asyncLogging: {
        onFunction: true,
        consoleLogging: true,
        onMessageReceive: false,
        onMessageSend: false,
        actualTiming: false
      }
    };

    this.chatAgent = new PodChat(params);
  	let VideoVoiceCall= initVideoComponent();
    this.chatAgent.on("chatReady", () => {
    	VideoVoiceCall.setChatAgent(this.chatAgent);
   		 var Params = {
     		 invitees: [
        	{
        	  "id": 'username',
       		  "idType": "TO_BE_USER_USERNAME"
       	 }],
   		 };

	    this.chatAgent.createThread(Params, (createThreadResult) => {
      	
     		if (!createThreadResult.hasError) {
        	
      	 	 this.threadId = createThreadResult.result.thread.id;       		 
      		 		VideoVoiceCall.call(
       		 	 	 {
          		 	 threadId: this.threadId,
           			 invitees: [
             		 {
               		 "id": 'username',
               		 "idType": "TO_BE_USER_USERNAME"
             		 }],
            		type: "VIDEO"
         		 });
     		 } else {
       			 console.log('thread creation failed!!!')
    	  	}
          
     	 	if (createThreadResult.errorCode == 21) {
     	 	 console.log('unauthenticated user!!!')
      		}

    });
      
  });

  this.chatAgent.on("error", (err) => {
     console.error(err);

    }); 
   
}

 function initVideoComponent(){
     let VideoVoiceCall = new VideoVoiceCall(
  	 'call-container', // HTML element ID that you want to load video  component on it.
      {
     	 endCallback: endCall ,// this event will raise when video call is ended
     	 cancelCallback: cancelCall //// this event will raise when  video call is canceled,
     	 userInfo: this.chatAgent.getCurrentUser(),
     	 waitingText: `<div style="text-align:center"> 
                      <h4 style="font-size:16px;color: rgba(255, 255, 255, 0.8);
                          font-weight: normal; font-stretch: normal;font-style: normal;
                          line-height: normal">نوع خدمت:${bankingServiceTitle}
                      </h4>
                      <span style="font-size:16px;color: rgba(255, 255, 255, 0.8);
                        font-weight: normal; font-stretch: normal;font-style: normal;line-height: normal">
                          درحال برقراری تماس...
                      </span>
                    </div>
                    `,
        receiveCallTimeout: ,//  timeout for chat SDK receive call event (millisecond)
        callStartedTimeout: ,// timeout for chat SDK call started  event (millisecond) 
        timeoutCallback: ,
        receiveCallback: ,// this will call when SDK receive call will raise
    });
   VideoVoiceCall.render();
   return VideoVoiceCall;
 }


function endCall(){

} 

fuction cancelCall(){
  
}
1.0.0

2 years ago