Stringee Web Phone is built 100% based on Stringee JavaScript SDK (https://developer.stringee.com/download#contentSdkWebsite) and equipped with a user interface, which means it can be easily embedded into your website:

Stringee Web Phone

Register Stringee API account HERE

Demo 1 (listen/call without opening a new Popup): https://demo.stringee.com/stringee-web-phone/web1.html

Demo 2 (listen/call to open a new Popup): https://demo.stringee.com/stringee-web-phone/web2_open_popup.html

Stringee Web Phone source code is provided here

The ource code for the above 2 demos here

1. Embed Stringee Web Phone into your Website To embed into your website, put the following script right after the body element

the variables in the configuration are listed below:

Field Type Require Default Description showMode String NO full Display mode: 'full': full size 'min': small 'none': hidden top Int NO undefined Similar to 'top' from CSS left Int NO undefined Similar to 'left' from CSS right Int NO undefined Similar to 'right' from CSS bottom Int NO undefined Similar to 'bottom' from CSS

2. Change settings anytime Let’s config(params) function with variable be the new setting, E.g:

StringeeSoftPhone.config({arrowLeft: 155}); Or hiding iframe:

StringeeSoftPhone.config({showMode: 'none'});

3. Make, take, or disconnect a call from your outside code. Make call:

StringeeSoftPhone.makeCall(FROM_NUMBER, TO_NUMBER, function (res) { console.log('res: ', res); }); Disconnect Call:

StringeeSoftPhone.hangupCall(); Take call:

StringeeSoftPhone.answerCall();

4. Connect and disconnect from StringeeServer Connect:

StringeeSoftPhone.connect(access_token2); Disconnect:

StringeeSoftPhone.disconnect();

5. Events a. Change of display mode StringeeSoftPhone.on('displayModeChange', function (event) { console.log('displayModeChange', event); if (event === 'min') { StringeeSoftPhone.config({arrowLeft: 75}); } else if (event === 'full') { StringeeSoftPhone.config({arrowLeft: 155}); } }); b. The access token expired, request a new Access token StringeeSoftPhone.on('requestNewToken', function () { console.log('requestNewToken+++++++'); StringeeSoftPhone.connect(access_token2); }); c. Events happen before makeCall You can change some information about the call before makeCall

StringeeSoftPhone.on('beforeMakeCall', function (call, callType) { console.log('beforeMakeCall: ' + callType); return true; }); d. Video call To make a video call, you need 2 following events and tag streams into a respective video element

StringeeSoftPhone.on('addlocalstream', function (stream) { //console.log('addlocalstream: ', stream); localVideo.srcObject = null; localVideo.srcObject = stream; }); StringeeSoftPhone.on('addremotestream', function (stream) { //console.log('addremotestream: ', stream); remoteVideo.srcObject = null; remoteVideo.srcObject = stream; }); e. Complete authentication StringeeSoftPhone.on('authen', function (res) { console.log('authen: ', res); }); e. Disconnection StringeeSoftPhone.on('disconnect', function () { console.log('disconnected'); }); f. Status of the call signal StringeeSoftPhone.on('signalingstate', function (state) { console.log('signalingstate', state); }); g. Call button clicked event StringeeSoftPhone.on('makeOutgoingCallBtnClick', function (fromNumber, toNumber, callType) { console.log('makeOutgoingCallBtnClick: fromNumber=' + fromNumber + ', toNumber=' + toNumber + ',callType=' + callType); }); h. The pick-up button clicked the event StringeeSoftPhone.on('answerIncomingCallBtnClick', function () { console.log('answerIncomingCallBtnClick'); }); i. Incoming call event StringeeSoftPhone.on('incomingCall', function (incomingcall) { console.log('incomingCall: ', incomingcall); }); j. Hangup button clicked event StringeeSoftPhone.on('endCallBtnClick', function () { console.log('endCallBtnClick'); }); k. Hidden “call” screen event StringeeSoftPhone.on('callingScreenHide', function () { console.log('callingScreenHide'); }); l. Incoming call rejection event StringeeSoftPhone.on('declineIncomingCallBtnClick', function () { console.log('declineIncomingCallBtnClick'); }); m. Hidden Incoming call event StringeeSoftPhone.on('incomingScreenHide', function () { console.log('incomingScreenHide'); });

Stringee API provides features such as phone calls, video calling, instant messaging, SMS, or customer service hotline that can be quickly embedded directly into business applications/websites. It helps save up to 80% of time and costs for businesses. Developing these features yourself could take 1 - 3 years.