parent
10019b9509
commit
66a67cda69
@ -0,0 +1,80 @@ |
||||
/* globals LivechatVideoCall, cordova, JitsiMeetExternalAPI */ |
||||
|
||||
LivechatVideoCall = new (class LivechatVideoCall { |
||||
constructor() { |
||||
this.live = new ReactiveVar(false); |
||||
this.calling = new ReactiveVar(false); |
||||
|
||||
if (typeof JitsiMeetExternalAPI === 'undefined') { |
||||
$.getScript('/packages/rocketchat_videobridge/client/public/external_api.js'); |
||||
} |
||||
} |
||||
|
||||
askPermissions(callback) { |
||||
if (Meteor.isCordova) { |
||||
cordova.plugins.diagnostic.requestCameraAuthorization(() => { |
||||
cordova.plugins.diagnostic.requestMicrophoneAuthorization(() => { |
||||
callback(true); |
||||
}, (error) => { |
||||
console.error(error); |
||||
}); |
||||
}, (error) => { |
||||
console.error(error); |
||||
}); |
||||
} else { |
||||
return callback(true); |
||||
} |
||||
} |
||||
|
||||
request() { |
||||
this.askPermissions((granted) => { |
||||
if (granted) { |
||||
this.calling.set(true); |
||||
Meteor.call('livechat:startVideoCall', visitor.getRoom(true), (error, result) => { |
||||
if (error) { |
||||
return; |
||||
} |
||||
visitor.subscribeToRoom(result.roomId); |
||||
|
||||
// after get ok from server, start the chat
|
||||
this.start(result.domain, result.jitsiRoom); |
||||
}); |
||||
} |
||||
}); |
||||
} |
||||
|
||||
start(domain, room) { |
||||
Meteor.defer(() => { |
||||
let interfaceConfig = {}; |
||||
interfaceConfig['TOOLBAR_BUTTONS'] = '[""]'; |
||||
interfaceConfig['APP_NAME'] = '"Livechat"'; |
||||
interfaceConfig['INITIAL_TOOLBAR_TIMEOUT'] = '5000'; |
||||
interfaceConfig['MIN_WIDTH'] = '300'; |
||||
interfaceConfig['FILM_STRIP_MAX_HEIGHT'] = '50'; |
||||
|
||||
this.api = new JitsiMeetExternalAPI(domain, room, $('.video-call').width(), $('.video-call').height(), $('.video-call .container').get(0), {}, interfaceConfig); |
||||
|
||||
this.api.addEventListener('videoConferenceJoined', () => { |
||||
this.api.executeCommand('toggleFilmStrip', []); |
||||
}); |
||||
|
||||
this.live.set(true); |
||||
}); |
||||
} |
||||
|
||||
finish() { |
||||
this.live.set(false); |
||||
this.calling.set(false); |
||||
this.api.dispose(); |
||||
} |
||||
|
||||
isActive() { |
||||
return this.live.get() || this.calling.get(); |
||||
} |
||||
|
||||
isLive() { |
||||
return this.live.get(); |
||||
} |
||||
}); |
||||
|
||||
/* exported LivechatVideoCall */ |
||||
@ -0,0 +1,27 @@ |
||||
<template name="videoCall"> |
||||
<div class="video-call"> |
||||
<div class="video-overlay"> |
||||
<div class="toolbar {{visible}}"> |
||||
<button class="end-call"> |
||||
<svg viewBox="0 0 578 578" xmlns="http://www.w3.org/2000/svg"> |
||||
<path d="M577.83,456.128c1.225,9.385-1.635,17.545-8.568,24.48l-81.396,80.781 |
||||
c-3.672,4.08-8.465,7.551-14.381,10.404c-5.916,2.857-11.729,4.693-17.439,5.508c-0.408,0-1.635,0.105-3.676,0.309 |
||||
c-2.037,0.203-4.689,0.307-7.953,0.307c-7.754,0-20.301-1.326-37.641-3.979s-38.555-9.182-63.645-19.584 |
||||
c-25.096-10.404-53.553-26.012-85.376-46.818c-31.823-20.805-65.688-49.367-101.592-85.68 |
||||
c-28.56-28.152-52.224-55.08-70.992-80.783c-18.768-25.705-33.864-49.471-45.288-71.299 |
||||
c-11.425-21.828-19.993-41.616-25.705-59.364S4.59,177.362,2.55,164.51s-2.856-22.95-2.448-30.294 |
||||
c0.408-7.344,0.612-11.424,0.612-12.24c0.816-5.712,2.652-11.526,5.508-17.442s6.324-10.71,10.404-14.382L98.022,8.756 |
||||
c5.712-5.712,12.24-8.568,19.584-8.568c5.304,0,9.996,1.53,14.076,4.59s7.548,6.834,10.404,11.322l65.484,124.236 |
||||
c3.672,6.528,4.692,13.668,3.06,21.42c-1.632,7.752-5.1,14.28-10.404,19.584l-29.988,29.988c-0.816,0.816-1.53,2.142-2.142,3.978 |
||||
s-0.918,3.366-0.918,4.59c1.632,8.568,5.304,18.36,11.016,29.376c4.896,9.792,12.444,21.726,22.644,35.802 |
||||
s24.684,30.293,43.452,48.653c18.36,18.77,34.68,33.354,48.96,43.76c14.277,10.4,26.215,18.053,35.803,22.949 |
||||
c9.588,4.896,16.932,7.854,22.031,8.871l7.648,1.531c0.816,0,2.145-0.307,3.979-0.918c1.836-0.613,3.162-1.326,3.979-2.143 |
||||
l34.883-35.496c7.348-6.527,15.912-9.791,25.705-9.791c6.938,0,12.443,1.223,16.523,3.672h0.611l118.115,69.768 |
||||
C571.098,441.238,576.197,447.968,577.83,456.128z"/> |
||||
</svg> |
||||
</button> |
||||
</div> |
||||
</div> |
||||
<div class="container"></div> |
||||
</div> |
||||
</template> |
||||
@ -0,0 +1,36 @@ |
||||
/* globals LivechatVideoCall */ |
||||
|
||||
Template.videoCall.helpers({ |
||||
visible() { |
||||
if (Template.instance().showToolbar.get()) { |
||||
return 'visible'; |
||||
} |
||||
} |
||||
}); |
||||
|
||||
Template.videoCall.events({ |
||||
'click .end-call'() { |
||||
LivechatVideoCall.finish(); |
||||
}, |
||||
'click .video-overlay'(e, instance) { |
||||
if (instance.timeout) { |
||||
clearTimeout(instance.timeout); |
||||
} |
||||
instance.showToolbar.set(!instance.showToolbar.get()); |
||||
|
||||
if (instance.showToolbar.get()) { |
||||
instance.timeout = setTimeout(() => { |
||||
instance.showToolbar.set(false); |
||||
}, 3000); |
||||
} |
||||
} |
||||
}); |
||||
|
||||
Template.videoCall.onCreated(function() { |
||||
this.timeout = null; |
||||
this.showToolbar = new ReactiveVar(true); |
||||
|
||||
this.timeout = setTimeout(() => { |
||||
this.showToolbar.set(false); |
||||
}, 10000); |
||||
}); |
||||
Loading…
Reference in new issue