|
|
@@ -33,7 +33,7 @@
|
|
|
</div>
|
|
|
@endif
|
|
|
<div class="main-view mx-auto" <?= !$guest ? 'v-show="!!client"' : '' ?>>
|
|
|
- <div id="self-view" class="<?= $guest ? 'full-view' : 'disconnected-view' ?>"></div>
|
|
|
+ <div id="self-view" class="full-view"></div>
|
|
|
<div class="thumbs">
|
|
|
<div id="remote-view-1" class="remote-view disconnected-view"
|
|
|
data-stream="" data-from=""></div>
|
|
|
@@ -42,9 +42,16 @@
|
|
|
</div>
|
|
|
<button class="btn btn-danger rounded-circle hang-up"
|
|
|
v-if="started"
|
|
|
+ title="Leave Call"
|
|
|
v-on:click.prevent="hangUp()">
|
|
|
<i class="fa fa-phone"></i>
|
|
|
</button>
|
|
|
+ <button class="btn btn-success rounded-circle call-mcp"
|
|
|
+ v-if="selfUserType === 'ASSISTANT'"
|
|
|
+ title="Call MCP Pro"
|
|
|
+ v-on:click.prevent="callMCPPro()">
|
|
|
+ <i class="fa fa-user-md"></i>
|
|
|
+ </button>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -78,6 +85,8 @@
|
|
|
@endif
|
|
|
|
|
|
otSession: false,
|
|
|
+
|
|
|
+ selfUserType: false,
|
|
|
},
|
|
|
methods: {
|
|
|
nextPatient: function() {
|
|
|
@@ -133,6 +142,45 @@
|
|
|
@endif
|
|
|
}
|
|
|
},
|
|
|
+ callMCPPro: function() {
|
|
|
+
|
|
|
+ // put client in mcp queue
|
|
|
+ $.ajax({
|
|
|
+ type: 'post',
|
|
|
+ url: '/api/clientVideoVisit/PutVideoVisitInMcpQueue',
|
|
|
+ headers: {
|
|
|
+ 'sessionKey': localStorage.sessionKey
|
|
|
+ },
|
|
|
+ data: {uid: this.clientUid},
|
|
|
+ dataType: 'json'
|
|
|
+ })
|
|
|
+ .done(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ if(_data.success) {
|
|
|
+ new Noty({
|
|
|
+ theme: 'mint',
|
|
|
+ type: 'success',
|
|
|
+ text: 'Client added to MCP call queue',
|
|
|
+ progressBar: false,
|
|
|
+ timeout: 1500,
|
|
|
+ }).show();
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ new Noty({
|
|
|
+ theme: 'mint',
|
|
|
+ type: 'alert',
|
|
|
+ text: _data.message,
|
|
|
+ progressBar: false,
|
|
|
+ timeout: 3000,
|
|
|
+ }).show();
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .fail(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ // alert(_data.message);
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
|
|
|
// OT methods
|
|
|
initOpenTok: function() {
|
|
|
@@ -169,6 +217,7 @@
|
|
|
|
|
|
self.otSession = OT.initSession(apiKey, sessionId);
|
|
|
|
|
|
+ // peer connected
|
|
|
self.otSession.on('streamCreated', function streamCreated(event) {
|
|
|
var subscriberOptions = {
|
|
|
insertMode: 'append',
|
|
|
@@ -213,6 +262,7 @@
|
|
|
}
|
|
|
});
|
|
|
|
|
|
+ // peer disconnected
|
|
|
self.otSession.on("streamDestroyed", function(event) {
|
|
|
@if($guest)
|
|
|
var remoteViewElem = $('[data-stream="' + event.stream.id + '"]');
|
|
|
@@ -249,6 +299,16 @@
|
|
|
}
|
|
|
});
|
|
|
|
|
|
+ // self connected
|
|
|
+ self.otSession.on("sessionConnected", function(event) {
|
|
|
+ console.log(event);
|
|
|
+
|
|
|
+ // call join as assistant/pro here
|
|
|
+ self.selfUserType = event.target.connection.data.split('|')[1];
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+ // self disconnected
|
|
|
self.otSession.on('sessionDisconnected', function sessionDisconnected(event) {
|
|
|
console.log('You were disconnected from the session.', event.reason);
|
|
|
});
|
|
|
@@ -297,20 +357,20 @@
|
|
|
data: {checkInToken: this.checkInToken},
|
|
|
dataType: 'json'
|
|
|
})
|
|
|
- .done(function (_data) {
|
|
|
- console.log(_data);
|
|
|
- if(_data.success) {
|
|
|
- self.otSessionId = _data.data;
|
|
|
- _done();
|
|
|
- }
|
|
|
- else {
|
|
|
- alert(_data.message);
|
|
|
- }
|
|
|
- })
|
|
|
- .fail(function (_data) {
|
|
|
- console.log(_data);
|
|
|
+ .done(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ if(_data.success) {
|
|
|
+ self.otSessionId = _data.data;
|
|
|
+ _done();
|
|
|
+ }
|
|
|
+ else {
|
|
|
alert(_data.message);
|
|
|
- });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .fail(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ alert(_data.message);
|
|
|
+ });
|
|
|
@else
|
|
|
$.get('/pro/get-opentok-session-key/' + self.clientUid, function(_data) {
|
|
|
self.otSessionId = _data.data;
|
|
|
@@ -329,13 +389,13 @@
|
|
|
data: {uid: self.clientUid},
|
|
|
dataType: 'json'
|
|
|
})
|
|
|
- .done(function (_data) {
|
|
|
- console.log(_data);
|
|
|
- })
|
|
|
- .fail(function (_data) {
|
|
|
- console.warn(_data);
|
|
|
- alert(_data.message);
|
|
|
- });
|
|
|
+ .done(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
+ })
|
|
|
+ .fail(function (_data) {
|
|
|
+ console.warn(_data);
|
|
|
+ alert(_data.message);
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
mounted: function() {
|
|
|
@@ -351,13 +411,28 @@
|
|
|
if (localStorage.clientFirstName) name.push(localStorage.clientFirstName);
|
|
|
if (localStorage.clientLastName) name.push(localStorage.clientLastName);
|
|
|
this.selfName = name.join(' ');
|
|
|
- $.post('/api/openTok/getClientToken', {
|
|
|
- opentokSessionId: self.otSessionId,
|
|
|
- name: name.join(' ')
|
|
|
- }, function (_data) {
|
|
|
+ $.ajax({
|
|
|
+ type: 'post',
|
|
|
+ url: '/api/openTok/getClientToken',
|
|
|
+ headers: {
|
|
|
+ 'sessionKey': localStorage.sessionKey
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ opentokSessionId: self.otSessionId,
|
|
|
+ name: name.join(' ')
|
|
|
+ },
|
|
|
+ dataType: 'json'
|
|
|
+ })
|
|
|
+ .done(function (_data) {
|
|
|
+ console.log(_data);
|
|
|
self.selfToken = _data.data;
|
|
|
self.initOpenTok();
|
|
|
+ })
|
|
|
+ .fail(function (_data) {
|
|
|
+ console.warn(_data);
|
|
|
+ alert(_data.message);
|
|
|
});
|
|
|
+
|
|
|
});
|
|
|
});
|
|
|
@endif
|
