Verto UI, listen only

This commit is contained in:
perroned 2015-09-15 09:34:59 -07:00
parent 95bbe10ca7
commit ee49bf9e0f
10 changed files with 202 additions and 50 deletions

View File

@ -52,11 +52,11 @@
# Always fail the first time. Retry on failure.
#
if !!navigator.mozGetUserMedia and message.errorcode is 1001
callIntoConference_verto(extension, conferenceUsername, conferenceIdNumber, ((m) -> console.log("CALLBACK: "+JSON.stringify(m))), "webcam")
callIntoConference_verto(extension, conferenceUsername, conferenceIdNumber, ((m) -> console.log("CALLBACK: "+JSON.stringify(m))), "webcam", isListenOnly)
#
# End of hacky method
#
callIntoConference_verto(extension, conferenceUsername, conferenceIdNumber, debuggerCallback, "webcam");
callIntoConference_verto(extension, conferenceUsername, conferenceIdNumber, debuggerCallback, "webcam", isListenOnly);
return
else
# create voice call params

View File

@ -40,7 +40,7 @@ $.verto.prototype.hangup = function(callID, userCallback) {
}
// main entry point to making a verto call
this.callIntoConference_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback, videoTag) {
this.callIntoConference_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback, videoTag, isListenOnly) {
window.videoTag = videoTag;
// stores the user's callback in the global scope
if (userCallback) {
@ -72,7 +72,7 @@ this.callIntoConference_verto = function(voiceBridge, conferenceUsername, confer
console.log("starting call");
toDisplayDisconnectCallback = true; // yes, display an error if the socket closes
wasCallSuccessful = true; // yes, a call was successfully established through the websocket
webrtc_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback);
webrtc_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback, isListenOnly);
} else {
callback({'status':'failed', 'errorcode': '10XX'}); // eror logging verto into freeswitch
}
@ -81,7 +81,7 @@ this.callIntoConference_verto = function(voiceBridge, conferenceUsername, confer
$.verto.init({}, init(videoTag));
} else {
console.log("already logged into verto, going straight to making a call");
webrtc_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback);
webrtc_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback, isListenOnly);
}
}
@ -108,6 +108,11 @@ this.configStuns = function(callbacks, callback, videoTag) {
}).done(function(data) {
console.log("ajax request done");
console.log(data);
if(data['response'] && data.response.returncode == "FAILED") {
console.error(data.response.message);
callback({'status':'failed', 'errorcode': data.response.message});
return;
}
stunsConfig['stunServers'] = ( data['stunServers'] ? data['stunServers'].map(function(data) {
return {'url': data['url']};
}) : [] );
@ -128,7 +133,7 @@ this.configStuns = function(callbacks, callback, videoTag) {
});
}
this.docall_verto = function(extension, conferenceUsername, conferenceIdNumber, callbacks) {
this.docall_verto = function(extension, conferenceUsername, conferenceIdNumber, callbacks, isListenOnly) {
console.log(extension + ", " + conferenceUsername + ", " + conferenceIdNumber);
if (cur_call) { // only allow for one call
@ -140,6 +145,7 @@ this.docall_verto = function(extension, conferenceUsername, conferenceIdNumber,
outgoingBandwidth = "default";
incomingBandwidth = "default";
console.log("Making a call isListenOnly: "+isListenOnly);
cur_call = verto.newCall({
destination_number: extension,
caller_id_name: conferenceUsername,
@ -149,7 +155,7 @@ this.docall_verto = function(extension, conferenceUsername, conferenceIdNumber,
useVideo: true,
useStereo: true,
useCamera: true,
useMic: true,
useMic: isListenOnly,
dedEnc: false,
mirrorInput: false
});
@ -224,7 +230,7 @@ this.leaveWebRTCVoiceConference_verto = function() {
webrtc_hangup_verto();
}
this.make_call_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback, server, recall) {
this.make_call_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback, server, recall, isListenOnly) {
if (userCallback) {
callback = userCallback;
}
@ -288,7 +294,7 @@ this.make_call_verto = function(voiceBridge, conferenceUsername, conferenceIdNum
console.log("Verto is logged into FreeSWITCH, socket is available, making call");
callICEConnected = false;
docall_verto(voiceBridge, conferenceUsername, conferenceIdNumber, myRTCCallbacks);
docall_verto(voiceBridge, conferenceUsername, conferenceIdNumber, myRTCCallbacks, isListenOnly);
if(recall === false) {
console.log('call connecting');
@ -392,7 +398,7 @@ var RTCPeerConnectionCallbacks = {
};
this.RTCPeerConnectionCallbacks = RTCPeerConnectionCallbacks;
this.webrtc_call_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback) {
this.webrtc_call_verto = function(voiceBridge, conferenceUsername, conferenceIdNumber, userCallback, isListenOnly) {
if (userCallback) {
callback = userCallback;
}
@ -406,7 +412,7 @@ this.webrtc_call_verto = function(voiceBridge, conferenceUsername, conferenceIdN
var server = window.document.location.hostname;
console.log("user " + conferenceUsername + " calling to " + voiceBridge);
if (isLoggedIntoVerto()) {
make_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback, "", false);
make_call_verto(voiceBridge, conferenceUsername, conferenceIdNumber, callback, "", false, isListenOnly);
}
}

View File

@ -79,6 +79,12 @@
<div id="logoutModal" class="reveal-modal tiny" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-options="close_on_background_click:false">
{{> logoutModal}}
</div>
<div id="deskshareModal" class="reveal-modal tiny" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-options="close_on_background_click:false">
{{> deskshareModal}}
</div>
<div id="webcamModal" class="reveal-modal tiny" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-options="close_on_background_click:false">
{{> webcamModal}}
</div>
<audio id="remote-media" autoplay="autoplay"></audio>
</template>

View File

@ -6,11 +6,35 @@
padding: 5px;
}
.screenshareShow {
color: lime;
font-size: 30px;
}
.screenshareHide {
color: red;
display: none;
font-size: 30px;
}
.screenshareStart {
color: lime;
font-size: 30px;
}
.screenshareStop {
color: red;
display: none;
font-size: 30px;
}
.webcamStart {
color: lime;
font-size: 30px;
}
.webcamStop {
color: red;
display: none;
font-size: 30px;
}

View File

@ -1,27 +1,52 @@
Template.vertoDeskshare.events
Template.vertoDeskshareMenu.events
"click .vertoButton": (event) ->
$("#settingsModal").foundation('reveal', 'close')
"click #desksharePreview": (event) ->
doDesksharePreview((->), (->), "webcam");
"click #getAdjustedResolutions": (event) ->
getAdjustedResolutions (result) ->
for i of result
$("#adjustedResolutions").append(i + ": " + result[i].width + "x" + result[i].height + "<br/>")
"click .screenshareShow": (event) ->
$("#deskshareModal").foundation('reveal', 'open');
$("#screenshareShow").hide()
$("#screenshareHide").show()
"click .screenshareHide": (event) ->
$("#screenshareShow").show()
$("#screenshareHide").hide()
Template.deskshareModal.events
"click .screenshareStart": (event) ->
$("#screenshareStart").css('display', 'none')
$("#screenshareStop").css('display', 'block')
$("#deskshareModal").foundation('reveal', 'close')
$("#screenshareStart").hide()
$("#screenshareStaop").show()
screenStart(true, (->), "webcam")
"click .screenshareStop": (event) ->
$("#screenshareStop").css('display', 'none')
$("#screenshareStart").css('display', 'block')
$("#deskshareModal").foundation('reveal', 'close')
$("#screenshareStart").show()
$("#screenshareStop").hide()
screenStart(false, (->))
"click #webcamPreview": (event) ->
doWebcamPreview((->), (->), "webcam");
"click #desksharePreview": (event) ->
doDesksharePreview((->), (->), "webcam");
Template.vertoWebcam.events
"click .vertoButton": (event) ->
$("#settingsModal").foundation('reveal', 'close')
"click .webcamStart": (event) ->
$("#webcamModal").foundation('reveal', 'open');
$("#webcamStart").hide()
$("#webcamStop").show()
"click .webcamStop": (event) ->
$("#webcamStart").show()
$("#webcamStop").hide()
# "click #webcamPreview": (event) ->
# doWebcamPreview((->), (->), "webcam");
@toggleWhiteboardVideo = (display) ->
if display is "whiteboard"

View File

@ -1,30 +1,9 @@
<template name="vertoDeskshare">
<!-- <div style="position: absolute; left: 0; top: 0; z-index:5000; background-color: aqua"> -->
<div>
<table id="conf_list" style="display: none;"></table>
<div>
<fieldset>
<legend><b>Webcam Video Quality</b>:</legend>
<div id="webcamResolutions"></div>
</fieldset>
</div><br>
<div>
<fieldset>
<legend><b>Deskshare Video Quality</b>:</legend>
<div id="deskshareResolutions"></div>
</fieldset>
</div><br>
<!-- <button id='joinAudio' class="vertoButton">joinAudio</button> -->
<!-- <button id='hangUp' class="vertoButton">hangUp</button> -->
<!-- <button id='shareScreen' class="vertoButton">shareScreen</button> -->
<!-- <button id='stopScreen' class="vertoButton">stopScreen</button> -->
{{> makeButton id="screenshareStart" btn_class="screenshareStart vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Share your screen"}}
{{> makeButton id="screenshareStop" btn_class="screenshareStop vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Stop sharing your screen"}}
<button id='desksharePreview' class="vertoButton">desksharePreview</button>
<button id="webcamPreview" class="vertoButton">Preview Webcam</button>
<br/>
<button id="getAdjustedResolutions" class="vertoButton">getAdjustedResolutions</button>
<p id="adjustedResolutions"></p>
</div>
<template name="vertoDeskshareMenu">
{{> makeButton id="screenshareShow" btn_class="screenshareShow vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Share your screen"}}
{{> makeButton id="screenshareHide" btn_class="screenshareHide vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Stop sharing your screen"}}
</template>
<template name="vertoWebcam">
{{> makeButton id="webcamStart" btn_class="webcamStart vertoButton settingsButton" i_class="fi-camera" rel="tooltip" data_placement="bottom" title="Share your webcam"}}
{{> makeButton id="webcamStop" btn_class="webcamStop vertoButton settingsButton" i_class="fi-camera" rel="tooltip" data_placement="bottom" title="Stop sharing your webcam"}}
</template>

View File

@ -0,0 +1,14 @@
<template name="deskshareModal">
<div>
<table id="conf_list" style="display: none;"></table>
<div>
<fieldset>
<legend><b>Deskshare Video Quality</b>:</legend>
<div id="deskshareResolutions"></div>
</fieldset>
</div><br>
{{> makeButton id="screenshareStart" btn_class="screenshareStart vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Share your screen"}}
{{> makeButton id="screenshareStop" btn_class="screenshareStop vertoButton settingsButton" i_class="fi-monitor" rel="tooltip" data_placement="bottom" title="Stop sharing your screen"}}
<button id='desksharePreview' class="vertoButton">desksharePreview</button>
</div>
</template>

View File

@ -0,0 +1,24 @@
Template.settingsModal.helpers
getBBBSettingsInfo: ->
info = getBuildInformation()
result = "(c) #{info.copyrightYear} BigBlueButton Inc. [build #{info.html5ClientBuild}] - For more information visit #{info.link}"
Template.logoutModal.events
"click #yes": -> userLogout(getInSession("meetingId"), getInSession("userId"))
"click #no": -> $("#logoutModal").foundation('reveal', 'close')
"click .logoutButton": -> $(".tooltip").hide()
Template.settingsAudio.events
"click #exitAudio": -> exitVoiceCall()
"click .joinAudioButton": (event) -> $("#settingsModal").foundation('reveal', 'close')
"click #joinListenOnly": (event) -> joinVoiceCall @, isListenOnly: true
"click #joinMicrophone": (event) -> joinVoiceCall @, isListenOnly: false
"click #hangupVerto": (event) -> exitVoiceCall()
Template.settingsModal.events
"click .closeSettings": -> setInSession "messageFontSize", getInSession("tempFontSize")
"click #saveSettings": -> $("#settingsModal").foundation('reveal', 'close');

View File

@ -0,0 +1,62 @@
<!-- listen only | microphone -->
<template name="settingsAudio">
<fieldset class="desktopSettingsFieldset">
<legend>Audio Options</legend>
{{#if amIInAudio}}
{{#if amIListenOnlyAudio}}
<!-- display microphone with join -->
{{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton joinAudioButton" i_class="fi-microphone" rel="tooltip"
data_placement="bottom" title="Join Microphone"}}
<!-- display listen only with exit -->
{{> makeButton id="exitAudio" btn_class="exitAudio settingsButton joinAudioButton" i_class="ion-volume-mute" rel="tooltip"
data_placement="bottom" title="Leave Audio Call"}}
{{else}}
<!-- display microphone with exit -->
{{> makeButton id="exitAudio" btn_class="exitAudio settingsButton joinAudioButton" i_class="ion-volume-mute" rel="tooltip"
data_placement="bottom" title="exit"}}
<!-- display join listen only -->
{{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton joinAudioButton" i_class="fi-volume" rel="tooltip"
data_placement="bottom" title="Join Listen only"}}
{{/if}}
{{else}}
<!-- display both with join -->
{{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton joinAudioButton" i_class="fi-microphone"
rel="tooltip" data_placement="bottom" title="Join Microphone"}}
{{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton joinAudioButton" i_class="fi-volume"
rel="tooltip" data_placement="bottom" title="Join Listen only"}}
{{/if}}
{{> makeButton id="hangupVerto" btn_class="settingsButton" i_class="ion-volume-mute" rel="tooltip" data_placement="bottom" title="exit"}}
</fieldset>
</template>
<template name="settingsModal">
<div class="bar topBar">
<p>
<span class="modalTitle">BigBlueButton Settings</span>
</p>
<p>
<a href="#" class="closeSettings close-reveal-modal">&#215;</a>
</p>
</div>
<div class="settingsBody">
{{> settingsAudio}}
{{> optionsFontSize}}
<br/>
{{> vertoDeskshareMenu}}
{{> vertoWebcam}}
<br/>
{{{getBBBSettingsInfo}}}
</div>
<div class="bar bottomBar">
<a href="#" class="closeSettings close-reveal-modal"><u>Cancel</u></a>
{{> makeButton id="saveSettings" btn_class="settingsButton" rel="tooltip" title="Save Changes" label="Save"}}
</div>
</template>
<template name="logoutModal">
<p>Are you sure you want to logout?</p>
{{> makeButton id="yes" btn_class="logoutButton" label="Yes"}}
{{> makeButton id="no" btn_class="logoutButton" label="No"}}
</template>

View File

@ -0,0 +1,12 @@
<template name="webcamModal">
<div>
<fieldset>
<legend><b>Webcam Video Quality</b>:</legend>
<div id="webcamResolutions"></div>
</fieldset>
</div><br>
<button id="webcamPreview" class="vertoButton">Preview Webcam</button>
<br/>
<button id="getAdjustedResolutions" class="vertoButton">getAdjustedResolutions</button>
<p id="adjustedResolutions"></p>
</template>