|
|
@@ -11,7 +11,7 @@
|
|
|
<link href="/css/meeting.css" rel="stylesheet">
|
|
|
<link href="/css/style.css" rel="stylesheet">
|
|
|
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
|
|
|
- <script defer src=//download.agora.io/sdk/web/AgoraRTC_N-4.1.0.js></script>
|
|
|
+ <script src="https://static.opentok.com/v2/js/opentok.js"></script>
|
|
|
</head>
|
|
|
|
|
|
<body class="p-0 m-0">
|
|
|
@@ -26,6 +26,20 @@
|
|
|
</div>
|
|
|
@endif
|
|
|
|
|
|
+ {{--
|
|
|
+ <div v-show="!videoActive" class="align-items-center justify-content-center py-3 border-bottom" style="display: flex;">
|
|
|
+ <button class="btn btn-sm btn-primary px-4 font-weight-bold stag-primary-bg stag-primary-border"
|
|
|
+ v-on:click.prevent="nextPatient()"
|
|
|
+ :disabled="client || checkingForNextPatient || started || !(patientInQueue && !started)">Next Patient</button>
|
|
|
+ <span v-if="patientInQueue && !started" class="text-success text-sm ml-3 small">
|
|
|
+ <i class="fa fa-circle"></i>
|
|
|
+ </span>
|
|
|
+ <span v-if="!patientInQueue && !started" class="text-secondary text-sm ml-3 small cancelled-item">
|
|
|
+ <i class="fa fa-circle"></i>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ --}}
|
|
|
+
|
|
|
<div class="py-2 d-flex align-items-center justify-content-center border-bottom">
|
|
|
<a href="#" v-if="ringer" v-on:click.prevent="toggleRinger()"
|
|
|
class="font-weight-bold btn btn-sm btn-success">
|
|
|
@@ -39,6 +53,8 @@
|
|
|
</a>
|
|
|
</div>
|
|
|
|
|
|
+ <div v-if="!started && noNextPatient" class="bg-light rounded text-center py-1 font-weight-bold text-sm my-3 mx-3">@{{ noNextPatient }}</div>
|
|
|
+
|
|
|
<div class="" v-show="videoActive">
|
|
|
<div class="py-3 text-center" v-if="started">
|
|
|
<h6 class="text-black font-weight-bold m-0">Call in progress: @{{ timeDisplay() }}</h6>
|
|
|
@@ -49,7 +65,7 @@
|
|
|
</h6>
|
|
|
</div>
|
|
|
<div class="main-view mx-auto">
|
|
|
- <div id="self-view" class="full-view" data-stream="self" data-name="You" data-type="PRO"></div>
|
|
|
+ <div id="self-view" class="full-view" data-name="{{ $pro->name_display }}" data-type="PRO"></div>
|
|
|
<div class="thumbs">
|
|
|
|
|
|
</div>
|
|
|
@@ -62,15 +78,6 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- @if($client)
|
|
|
- <div class="" v-show="!videoActive && client">
|
|
|
- <button class="btn btn-sm btn-primary font-weight-bold mx-auto mt-4 d-block"
|
|
|
- v-on:click.prevent="connect()">
|
|
|
- Start video call with {{ $client->displayName() }}
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- @endif
|
|
|
-
|
|
|
</div>
|
|
|
|
|
|
<div class="border-top patient-queue mcp-theme-1" id="queueComponent">
|
|
|
@@ -98,12 +105,6 @@
|
|
|
el: '#proCallComponent',
|
|
|
delimiters: ['@{{', '}}'],
|
|
|
data: {
|
|
|
-
|
|
|
- agoraClient: null,
|
|
|
- appId: '{{ config('app.agora_appid') }}',
|
|
|
- channel: '{{ $client ? $client->uid : '' }}',
|
|
|
- uid: '{{ $session->id + 1000000 }}',
|
|
|
-
|
|
|
time: 0,
|
|
|
startTime: 0,
|
|
|
started: false,
|
|
|
@@ -115,7 +116,17 @@
|
|
|
|
|
|
clientUid: '',
|
|
|
|
|
|
+ otSessionId: '',
|
|
|
+
|
|
|
+ publisher: false,
|
|
|
+
|
|
|
+ checkingForNextPatient: false,
|
|
|
+ noNextPatient: false,
|
|
|
+
|
|
|
+ otSession: false,
|
|
|
+
|
|
|
selfUserType: 'PRO',
|
|
|
+ selfStreamId: '',
|
|
|
noOneElseInCall: true,
|
|
|
patientInQueue: false,
|
|
|
|
|
|
@@ -126,18 +137,6 @@
|
|
|
ringer: {{ $pro->is_ring_on ? 'true' : 'false' }},
|
|
|
},
|
|
|
methods: {
|
|
|
- resolveParticipantNames: function() {
|
|
|
- $('[data-stream]:not([data-name])').each(function() {
|
|
|
- let elem = this;
|
|
|
- $.post('/pro/meet/get-participant-info', {
|
|
|
- _token: '{{ csrf_token() }}',
|
|
|
- uid: $(elem).attr('data-stream')
|
|
|
- }, function(_data) {
|
|
|
- $(elem).attr('data-type', _data.type);
|
|
|
- $(elem).attr('data-name', _data.name);
|
|
|
- }, 'json');
|
|
|
- });
|
|
|
- },
|
|
|
toggleRinger: function () {
|
|
|
let self = this, endPoint = this.ringer ? 'turnOffRing' : 'turnOnRing';
|
|
|
$.post('/api/pro/' + endPoint, function (_data) {
|
|
|
@@ -152,15 +151,50 @@
|
|
|
}
|
|
|
}, 'json');
|
|
|
},
|
|
|
- connect: function () {
|
|
|
+ pollForNextPatient: function () {
|
|
|
+ if (!this.started) {
|
|
|
+ this.nextPatient(true);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ nextPatient: function (_pollOnly = false) {
|
|
|
var self = this;
|
|
|
- self.selfName = '{{ $pro->name_display }}';
|
|
|
- $.get('/api/agora/getClientToken', {
|
|
|
- clientUid: self.clientUid,
|
|
|
- }, function (_data) {
|
|
|
- console.log(_data);
|
|
|
- self.selfToken = _data.data;
|
|
|
- self.initAgora();
|
|
|
+ if (!_pollOnly) this.checkingForNextPatient = true;
|
|
|
+ $.post('/api/client/getNextClientForVideoVisit', {}, function (_data) {
|
|
|
+ if (_pollOnly) {
|
|
|
+ self.patientInQueue = _data.success;
|
|
|
+ } else {
|
|
|
+ self.checkingForNextPatient = false;
|
|
|
+ if (!_data.success) {
|
|
|
+ self.noNextPatient = _data.message;
|
|
|
+ window.setTimeout(function () {
|
|
|
+ self.noNextPatient = false;
|
|
|
+ }, 2000);
|
|
|
+ } else {
|
|
|
+ // get ot session key from client record
|
|
|
+ self.client = true;
|
|
|
+ self.clientUid = _data.data;
|
|
|
+ self.videoActive = true;
|
|
|
+ self.startOpenTokSession();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 'json');
|
|
|
+ },
|
|
|
+ startOpenTokSession: function () {
|
|
|
+ var self = this;
|
|
|
+ self.getOpenTokSessionId(function () {
|
|
|
+ self.selfName = '{{ $pro->name_display }}';
|
|
|
+ $.post('/api/openTok/getClientToken', {
|
|
|
+ opentokSessionId: self.otSessionId,
|
|
|
+ data: JSON.stringify({
|
|
|
+ uid: '{{ $pro->uid }}',
|
|
|
+ name: self.selfName,
|
|
|
+ type: 'PRO'
|
|
|
+ })
|
|
|
+ }, function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ self.selfToken = _data.data;
|
|
|
+ self.initOpenTok();
|
|
|
+ });
|
|
|
});
|
|
|
},
|
|
|
timeDisplay: function () {
|
|
|
@@ -171,113 +205,264 @@
|
|
|
},
|
|
|
hangUp: function () {
|
|
|
var self = this;
|
|
|
- async function _leave() {
|
|
|
- if(self.agoraClient) {
|
|
|
- await self.agoraClient.leave();
|
|
|
- window.top.hideRHS();
|
|
|
- window.location.reload();
|
|
|
+ if (this.otSession) {
|
|
|
+ try {
|
|
|
+ this.otSession.unpublish(this.publisher);
|
|
|
+ this.otSession.disconnect();
|
|
|
+ } catch (e) {
|
|
|
+ console.log('Was already disconnected.');
|
|
|
}
|
|
|
+ this.otSession = false;
|
|
|
+ this.otSessionId = '';
|
|
|
+ this.started = false;
|
|
|
+ this.startTime = false;
|
|
|
+ this.videoActive = false;
|
|
|
+ if(self.publisher){
|
|
|
+ self.publisher.destroy();
|
|
|
+ }
|
|
|
+ window.top.hideRHS();
|
|
|
+ // this.client = false;
|
|
|
}
|
|
|
- _leave();
|
|
|
},
|
|
|
- initAgora: function () {
|
|
|
+ initOpenTok: function () {
|
|
|
+
|
|
|
+ /* fake video feed (temp) */
|
|
|
+ const randomColour = () => {
|
|
|
+ return Math.round(Math.random() * 255);
|
|
|
+ };
|
|
|
+
|
|
|
+ const canvas = document.createElement('canvas');
|
|
|
+ canvas.width = 640;
|
|
|
+ canvas.height = 480;
|
|
|
+ const ctx = canvas.getContext('2d');
|
|
|
+ var pos = 100;
|
|
|
+ window.setInterval(function () {
|
|
|
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
|
+ ctx.font = "20px Georgia";
|
|
|
+ ctx.fillStyle = `rgb(220, 220, 220)`;
|
|
|
+ ctx.fillText("Video feed from {{ $pro->name_display }}", 20, pos);
|
|
|
+ pos += 5;
|
|
|
+ if (pos > canvas.height) pos = 100;
|
|
|
+ }, 1000);
|
|
|
|
|
|
- let self = this;
|
|
|
+ var self = this;
|
|
|
+
|
|
|
+ var apiKey = '<?= env('TOKBOX_API_KEY', '46678902') ?>';
|
|
|
+ var sessionId = this.otSessionId;
|
|
|
+ var token = this.selfToken;
|
|
|
+
|
|
|
+ // destroy if existing
|
|
|
+ // self.hangUp();
|
|
|
+
|
|
|
+ self.otSession = OT.initSession(apiKey, sessionId);
|
|
|
+
|
|
|
+ // peer connected
|
|
|
+ self.otSession.on('streamCreated', function streamCreated(event) {
|
|
|
+ console.log('streamCreated', arguments);
|
|
|
+ var subscriberOptions = {
|
|
|
+ insertMode: 'append',
|
|
|
+ width: '100%',
|
|
|
+ height: '100%'
|
|
|
+ };
|
|
|
+
|
|
|
+ var connectionData = JSON.parse(event.stream.connection.data);
|
|
|
|
|
|
- async function _initAgora(){
|
|
|
+ // add a div for remove view
|
|
|
+ var remoteViewID = 'remote-view-' + event.stream.id;
|
|
|
+ var remoteElem = $('<div id="' + remoteViewID + '" class="remote-view thumb-view" ' +
|
|
|
+ 'data-stream="' + event.stream.id + '" ' +
|
|
|
+ 'data-connection-data="' + event.stream.connection.data + '" ' +
|
|
|
+ 'data-name="' + connectionData.name + '" ' +
|
|
|
+ 'data-type="' + connectionData.type + '"></div>');
|
|
|
+ remoteElem.appendTo('.thumbs');
|
|
|
|
|
|
- self.agoraClient = AgoraRTC.createClient({mode:'rtc', codec:'h264'})
|
|
|
- let camera, mic
|
|
|
- try { mic = await AgoraRTC.createMicrophoneAudioTrack() } catch {
|
|
|
- console.log('ALIX: error in getting mic');
|
|
|
+ self.otSession.subscribe(event.stream, remoteViewID, subscriberOptions, self.handleOpenTokError);
|
|
|
+
|
|
|
+ if (connectionData.type === 'CLIENT') {
|
|
|
+ self.client = true;
|
|
|
}
|
|
|
- try { camera = await AgoraRTC.createCameraVideoTrack() } catch {
|
|
|
- console.log('ALIX: error in getting camera');
|
|
|
+
|
|
|
+ if (!self.startTime) {
|
|
|
+ self.startTime = new Date().getTime();
|
|
|
+ window.setInterval(function () {
|
|
|
+ self.time = new Date().getTime() - self.startTime;
|
|
|
+ }, 1000);
|
|
|
+ self.started = true;
|
|
|
}
|
|
|
|
|
|
- // testing
|
|
|
- @if(config('app.agora_mode') === 'screen')
|
|
|
- try { camera = await AgoraRTC.createScreenVideoTrack() } catch { }
|
|
|
- @endif
|
|
|
+ self.activateParty(event.stream.id);
|
|
|
+
|
|
|
+ self.noOneElseInCall = false;
|
|
|
+ });
|
|
|
|
|
|
- if (!mic && !camera){
|
|
|
- alert('Do you have camera/mic? Unable to hear or see you.')
|
|
|
- return
|
|
|
+ // peer disconnected
|
|
|
+ self.otSession.on("streamDestroyed", function (event) {
|
|
|
+ onPeerDisconnection(event, event.stream.connection.data);
|
|
|
+ });
|
|
|
+ // self.otSession.on("connectionDestroyed", function(event) {
|
|
|
+ // debugger;
|
|
|
+ // console.log('connectionDestroyed from ' + event.connection.data);
|
|
|
+ // onPeerDisconnection(event, event.connection.data);
|
|
|
+ // });
|
|
|
+
|
|
|
+ self.otSession.on("connectionCreated", function (event) {
|
|
|
+ console.log('connectionCreated');
|
|
|
+ console.log(event);
|
|
|
+ });
|
|
|
+
|
|
|
+ function onPeerDisconnection(event, data) {
|
|
|
+
|
|
|
+ if (event.stream && $('.full-view[data-stream="' + event.stream.id + '"]').length) {
|
|
|
+ var allThumbs = $('.thumbs [data-stream]:not([data-stream=""]):not(.disconnected-view):visible');
|
|
|
+ if (allThumbs.length) {
|
|
|
+ $('.thumbs [data-stream]:not([data-stream=""])').each(function () {
|
|
|
+ if ($(this).attr('data-stream') !== event.stream.id) {
|
|
|
+ self.activateParty($(this).attr('data-stream'));
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ self.noOneElseInCall = true;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- // Add myself to the page.
|
|
|
- if(camera) {
|
|
|
- camera.play($('#self-view')[0]);
|
|
|
+ if (event.stream) {
|
|
|
+ var remoteViewElem = $('[data-stream="' + event.stream.id + '"]');
|
|
|
+ remoteViewElem.remove();
|
|
|
+ // if(remoteViewElem.length) {
|
|
|
+ // remoteViewElem.attr('data-stream', '');
|
|
|
+ // remoteViewElem.attr('data-connection-data', '');
|
|
|
+ // remoteViewElem.attr('data-type', '');
|
|
|
+ // remoteViewElem.attr('data-name', '');
|
|
|
+ // }
|
|
|
+ // remoteViewElem.addClass('disconnected-view')
|
|
|
}
|
|
|
|
|
|
- // events
|
|
|
- self.agoraClient.on('user-joined', user => {
|
|
|
-
|
|
|
- // add a div for remove view
|
|
|
- $('[data-stream="' + user.uid + '"]').remove();
|
|
|
- var remoteViewID = 'remote-view-' + user.uid;
|
|
|
- var remoteElem = $('<div id="' + remoteViewID + '" class="remote-view thumb-view" data-stream="' + user.uid + '"></div>');
|
|
|
- remoteElem.appendTo('.thumbs');
|
|
|
-
|
|
|
- if (!self.startTime) {
|
|
|
- self.startTime = new Date().getTime();
|
|
|
- window.setInterval(function () {
|
|
|
- self.time = new Date().getTime() - self.startTime;
|
|
|
- }, 1000);
|
|
|
- self.started = true;
|
|
|
+ var connectionData = JSON.parse(data);
|
|
|
+ if (connectionData.type === 'CLIENT') {
|
|
|
+ self.client = false;
|
|
|
+ }
|
|
|
+
|
|
|
+ // if no other parties in call, hang up
|
|
|
+ if (!$('[data-stream]:not([data-stream="' + self.selfStreamId + '"])').length) {
|
|
|
+ console.warn('No other parties in the call!');
|
|
|
+ self.startTime = 0;
|
|
|
+ self.started = false;
|
|
|
+ self.noOneElseInCall = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // self connected
|
|
|
+ self.otSession.on("sessionConnected", function (event) {
|
|
|
+ self.joinMeetingAsPro(self.selfUserType);
|
|
|
+ });
|
|
|
+
|
|
|
+ // self disconnected
|
|
|
+ self.otSession.on('sessionDisconnected', function sessionDisconnected(event) {
|
|
|
+ console.log('You were disconnected from the session.', event.reason);
|
|
|
+
|
|
|
+ // turn pro video off
|
|
|
+ $.post('/api/clientVideoVisit/turnProVideoOff', {}, function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+
|
|
|
+ // stop heart beat
|
|
|
+ if (self.heartbeatTimer) {
|
|
|
+ window.clearInterval(self.heartbeatTimer);
|
|
|
+ self.heartbeatTimer = false;
|
|
|
}
|
|
|
- self.activateParty(user.uid);
|
|
|
- self.noOneElseInCall = false;
|
|
|
- self.resolveParticipantNames();
|
|
|
- })
|
|
|
- self.agoraClient.on('user-left', user => {
|
|
|
-
|
|
|
- if ($('.full-view[data-stream="' + user.uid + '"]').length) {
|
|
|
- var allThumbs = $('.thumbs [data-stream]:not([data-stream=""]):not(.disconnected-view):visible');
|
|
|
- if (allThumbs.length) {
|
|
|
- $('.thumbs [data-stream]:not([data-stream=""])').each(function () {
|
|
|
- if ($(this).attr('data-stream') !== user.uid) {
|
|
|
- self.activateParty($(this).attr('data-stream'));
|
|
|
- return false;
|
|
|
- }
|
|
|
- });
|
|
|
- } else {
|
|
|
- self.noOneElseInCall = true;
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // initialize the publisher
|
|
|
+ var publisherOptions = {
|
|
|
+ // videoSource: canvas.captureStream(1).getVideoTracks()[0], // TODO: Comment this line to use webcam
|
|
|
+ insertMode: 'append',
|
|
|
+ width: '100%',
|
|
|
+ height: '100%',
|
|
|
+ };
|
|
|
+ var publisher = OT.initPublisher('self-view', publisherOptions, self.handleOpenTokError);
|
|
|
+
|
|
|
+ publisher.on('streamCreated', function (event) {
|
|
|
+ var selfView = $('#self-view');
|
|
|
+ selfView.attr('data-stream', event.stream.id);
|
|
|
+ selfView.attr('data-connection-data', event.stream.connection.data);
|
|
|
+ self.selfStreamId = event.stream.id;
|
|
|
+ });
|
|
|
+
|
|
|
+ publisher.on('streamCreated', function (event) {
|
|
|
+ console.log('publisher->streamCreated');
|
|
|
+ var selfView = $('#self-view');
|
|
|
+ selfView.attr('data-stream', event.stream.id);
|
|
|
+ selfView.attr('data-connection-data', event.stream.connection.data);
|
|
|
+ selfView.attr('data-type', 'PRO');
|
|
|
+ self.activateParty('self');
|
|
|
+ $('#self-view').show();
|
|
|
+
|
|
|
+ // turn pro video on
|
|
|
+ $.post('/api/clientVideoVisit/turnProVideoOn', {}, function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+
|
|
|
+ // start heart beat
|
|
|
+ self.heartbeatTimer = window.setInterval(function () {
|
|
|
+ $.post('/api/clientVideoVisit/registerProMeetingHeartbeat', {}, function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ });
|
|
|
+ }, 5000);
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ publisher.on('streamDestroyed', function (event) {
|
|
|
+ event.preventDefault();
|
|
|
+ console.log('publisher->streamDestroyed');
|
|
|
+ $('#self-view').hide();
|
|
|
+ var allThumbs = $('.thumbs [data-stream]:not([data-stream=""]):not(.disconnected-view):visible');
|
|
|
+ if (allThumbs.length) {
|
|
|
+ $('.thumbs [data-stream]:not([data-stream=""])').each(function () {
|
|
|
+ if ($(this).attr('data-stream') !== $('#self-view').attr('data-stream')) {
|
|
|
+ self.activateParty($(this).attr('data-stream'));
|
|
|
+ return false;
|
|
|
}
|
|
|
- }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ self.hangUp();
|
|
|
+ }
|
|
|
|
|
|
- $('[data-stream="' + user.uid + '"]').remove();
|
|
|
+ // turn pro video off
|
|
|
+ $.post('/api/clientVideoVisit/turnProVideoOff', {}, function (_data) {
|
|
|
+ console.log(_data);
|
|
|
|
|
|
- // if no other parties in call, hang up
|
|
|
- if (!$('[data-stream]:not([data-stream="' + {{ $session->id }} + '"])').length) {
|
|
|
- console.warn('No other parties in the call!');
|
|
|
- self.startTime = 0;
|
|
|
- self.started = false;
|
|
|
- self.noOneElseInCall = true;
|
|
|
+ // stop heart beat
|
|
|
+ if (self.heartbeatTimer) {
|
|
|
+ window.clearInterval(self.heartbeatTimer);
|
|
|
+ self.heartbeatTimer = false;
|
|
|
}
|
|
|
- })
|
|
|
- self.agoraClient.on('user-published', async function(user, mediaType){
|
|
|
- await self.agoraClient.subscribe(user, mediaType)
|
|
|
- mediaType === 'audio'
|
|
|
- ? user.audioTrack.play()
|
|
|
- : user.videoTrack.play($('[data-stream="' + user.uid + '"]')[0]);
|
|
|
- })
|
|
|
-
|
|
|
- await self.agoraClient.join(self.appId, self.channel, self.selfToken, self.uid)
|
|
|
- await self.agoraClient.publish([mic, camera].filter(Boolean))
|
|
|
+ });
|
|
|
+ });
|
|
|
+ self.publisher = publisher;
|
|
|
|
|
|
- // assume connected by this point, notify backend & show self video
|
|
|
- if (mic || camera) {
|
|
|
- self.joinMeetingAsPro(self.selfUserType);
|
|
|
- $('#self-view').attr('data-type', 'PRO').show();
|
|
|
- self.activateParty('self');
|
|
|
- self.videoActive = true;
|
|
|
+ // Connect to the session
|
|
|
+ self.otSession.connect(token, function callback(error) {
|
|
|
+ if (error) {
|
|
|
+ self.handleOpenTokError(error);
|
|
|
+ } else {
|
|
|
+ // If the connection is successful, publish the publisher to the session
|
|
|
+ self.otSession.publish(publisher, self.handleOpenTokError);
|
|
|
}
|
|
|
- }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleOpenTokError: function (e) {
|
|
|
|
|
|
- _initAgora();
|
|
|
+ },
|
|
|
|
|
|
+ getOpenTokSessionId: function (_done) {
|
|
|
+ var self = this;
|
|
|
+ $.get('/pro/get-opentok-session-key/' + self.clientUid, function (_data) {
|
|
|
+ self.otSessionId = _data.data;
|
|
|
+ console.log(_data);
|
|
|
+ _done();
|
|
|
+ }, 'json');
|
|
|
},
|
|
|
+
|
|
|
joinMeetingAsPro: function (_type) {
|
|
|
var self = this;
|
|
|
$.ajax({
|
|
|
@@ -301,6 +486,7 @@
|
|
|
alert(_data.message);
|
|
|
});
|
|
|
},
|
|
|
+
|
|
|
activateParty: function (_stream = 'self') {
|
|
|
var current = $('.full-view');
|
|
|
if (current.attr('data-stream') === _stream) return;
|
|
|
@@ -324,6 +510,7 @@
|
|
|
.prependTo('.main-view');
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
},
|
|
|
mounted: function () {
|
|
|
|
|
|
@@ -334,10 +521,22 @@
|
|
|
return false;
|
|
|
});
|
|
|
|
|
|
+ // poll for new patients and alert
|
|
|
+ // window.setInterval(function () {
|
|
|
+ // self.pollForNextPatient();
|
|
|
+ // }, 5000);
|
|
|
+
|
|
|
+ window.onbeforeunload = function () {
|
|
|
+ if (self.started) {
|
|
|
+ return "A call is in progress";
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
@if(isset($client))
|
|
|
self.client = true;
|
|
|
- self.clientUid = '{{ $client->uid }}';
|
|
|
- self.videoActive = false;
|
|
|
+ self.clientUid = '{{ $client->uid }}';
|
|
|
+ self.videoActive = true;
|
|
|
+ self.startOpenTokSession();
|
|
|
@endif
|
|
|
}
|
|
|
});
|
