Merge branch 'foundation-notifications' of https://github.com/perroned/bigbluebutton into meteor-client-new-ui
This commit is contained in:
Maxim Khlobystov
commit
7008d2eb14
92
bigbluebutton-html5/app/client/NotificationControl.coffee
Executable file
92
bigbluebutton-html5/app/client/NotificationControl.coffee
Executable file
@ -0,0 +1,92 @@
|
||||
# Methods return a reference to itself to allow chaining
|
||||
class @NotificationControl
|
||||
container = '' # holds where the alerts will go
|
||||
notifications = {}
|
||||
|
||||
constructor: (c) ->
|
||||
container = if c[0] is '#' then c.substr(1) else c # prepend '#' to the identifier
|
||||
$("body").prepend( # create container for notifications
|
||||
'<!-- Drawing area for notifications. Must have "data-alert" atrribute, I do not know why, typically only for actual notifications -->' +
|
||||
"<div id=\"#{container}\" data-alert></div>")
|
||||
|
||||
# id: name of the notification
|
||||
# type: optional style classes
|
||||
# content: the notification's message
|
||||
# nDuration: how many milliseconds the notification will stay (less than 1 implies permanent)
|
||||
# nFadeTime: how many milliseconds it takes the notification to be removed
|
||||
create: (id, type, content, nDuration, nFadeTime) ->
|
||||
elementId = if id[0] is '#' then id.substr(1) else id # remove prepended '#' from the identifier
|
||||
notifications[elementId] = {}
|
||||
notifications[elementId].element = ''
|
||||
notifications[elementId].element += "<div id=\"#{elementId}\" data-alert class='bbbNotification alert-box #{type}' tabindex='0' aria-live='assertive' role='dialogalert'>"
|
||||
notifications[elementId].element += "#{content}"
|
||||
notifications[elementId].element += '<button href="#" tabindex="0" class="close" aria-label="Close Alert">×</button>'
|
||||
notifications[elementId].element += '</div>'
|
||||
notifications[elementId].duration = nDuration or -1 # if no time is specified, it must be dismissed by the user
|
||||
notifications[elementId].fadeTime = nFadeTime or 1000
|
||||
@
|
||||
|
||||
registerShow: (elementId, nShowNotification) -> # register the method to be called when showing the notification
|
||||
notifications[elementId].showNotification = nShowNotification
|
||||
@
|
||||
|
||||
registerHide: (elementId, nHideNotification) -> # register the method called when hiding the notification
|
||||
notifications[elementId].hideNotification = nHideNotification
|
||||
@
|
||||
|
||||
display: (elementId) -> # called the registered methods
|
||||
$('#'+container).append(notifications[elementId].element) # display the notification
|
||||
notifications[elementId].showNotification?()
|
||||
|
||||
setTimeout () =>
|
||||
# remove the notification if the user selected to
|
||||
@hideANotification(elementId) if notifications[elementId].duration > 0
|
||||
notifications[elementId].hideNotification?()
|
||||
notifications[elementId] = {} # delete all notification data
|
||||
, notifications[elementId].duration
|
||||
@
|
||||
|
||||
# hides a notification that may have been left over
|
||||
hideANotification: (elementId) ->
|
||||
($('#'+elementId).fadeOut notifications[elementId].fadeTime, -> $('#'+elementId).remove())
|
||||
notifications[elementId].hideNotification?()
|
||||
notifications[elementId] = {}
|
||||
|
||||
# static icon members
|
||||
@icons = {
|
||||
# RaphaelJS "settings" icon
|
||||
'settings_IconPath': 'M17.41,20.395l-0.778-2.723c0.228-0.2,0.442-0.414,0.644-0.643l2.721,0.778c0.287-0.418,0.534-0.862,0.755-1.323l-2.025-1.96c0.097-0.288,0.181-0.581,0.241-0.883l2.729-0.684c0.02-0.252,0.039-0.505,0.039-0.763s-0.02-0.51-0.039-0.762l-2.729-0.684c-0.061-0.302-0.145-0.595-0.241-0.883l2.026-1.96c-0.222-0.46-0.469-0.905-0.756-1.323l-2.721,0.777c-0.201-0.228-0.416-0.442-0.644-0.643l0.778-2.722c-0.418-0.286-0.863-0.534-1.324-0.755l-1.96,2.026c-0.287-0.097-0.581-0.18-0.883-0.241l-0.683-2.73c-0.253-0.019-0.505-0.039-0.763-0.039s-0.51,0.02-0.762,0.039l-0.684,2.73c-0.302,0.061-0.595,0.144-0.883,0.241l-1.96-2.026C7.048,3.463,6.604,3.71,6.186,3.997l0.778,2.722C6.736,6.919,6.521,7.134,6.321,7.361L3.599,6.583C3.312,7.001,3.065,7.446,2.844,7.907l2.026,1.96c-0.096,0.288-0.18,0.581-0.241,0.883l-2.73,0.684c-0.019,0.252-0.039,0.505-0.039,0.762s0.02,0.51,0.039,0.763l2.73,0.684c0.061,0.302,0.145,0.595,0.241,0.883l-2.026,1.96c0.221,0.46,0.468,0.905,0.755,1.323l2.722-0.778c0.2,0.229,0.415,0.442,0.643,0.643l-0.778,2.723c0.418,0.286,0.863,0.533,1.323,0.755l1.96-2.026c0.288,0.097,0.581,0.181,0.883,0.241l0.684,2.729c0.252,0.02,0.505,0.039,0.763,0.039s0.51-0.02,0.763-0.039l0.683-2.729c0.302-0.061,0.596-0.145,0.883-0.241l1.96,2.026C16.547,20.928,16.992,20.681,17.41,20.395zM11.798,15.594c-1.877,0-3.399-1.522-3.399-3.399s1.522-3.398,3.399-3.398s3.398,1.521,3.398,3.398S13.675,15.594,11.798,15.594zM27.29,22.699c0.019-0.547-0.06-1.104-0.23-1.654l1.244-1.773c-0.188-0.35-0.4-0.682-0.641-0.984l-2.122,0.445c-0.428-0.364-0.915-0.648-1.436-0.851l-0.611-2.079c-0.386-0.068-0.777-0.105-1.173-0.106l-0.974,1.936c-0.279,0.054-0.558,0.128-0.832,0.233c-0.257,0.098-0.497,0.22-0.727,0.353L17.782,17.4c-0.297,0.262-0.568,0.545-0.813,0.852l0.907,1.968c-0.259,0.495-0.437,1.028-0.519,1.585l-1.891,1.06c0.019,0.388,0.076,0.776,0.164,1.165l2.104,0.519c0.231,0.524,0.541,0.993,0.916,1.393l-0.352,2.138c0.32,0.23,0.66,0.428,1.013,0.6l1.715-1.32c0.536,0.141,1.097,0.195,1.662,0.15l1.452,1.607c0.2-0.057,0.399-0.118,0.596-0.193c0.175-0.066,0.34-0.144,0.505-0.223l0.037-2.165c0.455-0.339,0.843-0.747,1.152-1.206l2.161-0.134c0.152-0.359,0.279-0.732,0.368-1.115L27.29,22.699zM23.127,24.706c-1.201,0.458-2.545-0.144-3.004-1.345s0.143-2.546,1.344-3.005c1.201-0.458,2.547,0.144,3.006,1.345C24.931,22.902,24.328,24.247,23.127,24.706z'
|
||||
# RaphaelJS "Safari" icon
|
||||
'Safari_IconPath':'M16.154,5.135c-0.504,0-1,0.031-1.488,0.089l-0.036-0.18c-0.021-0.104-0.06-0.198-0.112-0.283c0.381-0.308,0.625-0.778,0.625-1.306c0-0.927-0.751-1.678-1.678-1.678s-1.678,0.751-1.678,1.678c0,0.745,0.485,1.376,1.157,1.595c-0.021,0.105-0.021,0.216,0,0.328l0.033,0.167C7.645,6.95,3.712,11.804,3.712,17.578c0,6.871,5.571,12.441,12.442,12.441c6.871,0,12.441-5.57,12.441-12.441C28.596,10.706,23.025,5.135,16.154,5.135zM16.369,8.1c4.455,0,8.183,3.116,9.123,7.287l-0.576,0.234c-0.148-0.681-0.755-1.191-1.48-1.191c-0.837,0-1.516,0.679-1.516,1.516c0,0.075,0.008,0.148,0.018,0.221l-2.771-0.028c-0.054-0.115-0.114-0.226-0.182-0.333l3.399-5.11l0.055-0.083l-4.766,4.059c-0.352-0.157-0.74-0.248-1.148-0.256l0.086-0.018l-1.177-2.585c0.64-0.177,1.111-0.763,1.111-1.459c0-0.837-0.678-1.515-1.516-1.515c-0.075,0-0.147,0.007-0.219,0.018l0.058-0.634C15.357,8.141,15.858,8.1,16.369,8.1zM12.146,3.455c0-0.727,0.591-1.318,1.318-1.318c0.727,0,1.318,0.591,1.318,1.318c0,0.425-0.203,0.802-0.516,1.043c-0.183-0.123-0.413-0.176-0.647-0.13c-0.226,0.045-0.413,0.174-0.535,0.349C12.542,4.553,12.146,4.049,12.146,3.455zM7.017,17.452c0-4.443,3.098-8.163,7.252-9.116l0.297,0.573c-0.61,0.196-1.051,0.768-1.051,1.442c0,0.837,0.678,1.516,1.515,1.516c0.068,0,0.135-0.006,0.2-0.015l-0.058,2.845l0.052-0.011c-0.442,0.204-0.824,0.513-1.116,0.895l0.093-0.147l-1.574-0.603l1.172,1.239l0.026-0.042c-0.19,0.371-0.306,0.788-0.324,1.229l-0.003-0.016l-2.623,1.209c-0.199-0.604-0.767-1.041-1.438-1.041c-0.837,0-1.516,0.678-1.516,1.516c0,0.064,0.005,0.128,0.013,0.191l-0.783-0.076C7.063,18.524,7.017,17.994,7.017,17.452zM16.369,26.805c-4.429,0-8.138-3.078-9.106-7.211l0.691-0.353c0.146,0.686,0.753,1.2,1.482,1.2c0.837,0,1.515-0.679,1.515-1.516c0-0.105-0.011-0.207-0.031-0.307l2.858,0.03c0.045,0.095,0.096,0.187,0.15,0.276l-3.45,5.277l0.227-0.195l4.529-3.92c0.336,0.153,0.705,0.248,1.094,0.266l-0.019,0.004l1.226,2.627c-0.655,0.166-1.142,0.76-1.142,1.468c0,0.837,0.678,1.515,1.516,1.515c0.076,0,0.151-0.007,0.225-0.018l0.004,0.688C17.566,26.746,16.975,26.805,16.369,26.805zM18.662,26.521l-0.389-0.6c0.661-0.164,1.152-0.759,1.152-1.47c0-0.837-0.68-1.516-1.516-1.516c-0.066,0-0.13,0.005-0.193,0.014v-2.86l-0.025,0.004c0.409-0.185,0.77-0.459,1.055-0.798l1.516,0.659l-1.104-1.304c0.158-0.335,0.256-0.704,0.278-1.095l2.552-1.164c0.19,0.618,0.766,1.068,1.447,1.068c0.838,0,1.516-0.679,1.516-1.516c0-0.069-0.006-0.137-0.016-0.204l0.65,0.12c0.089,0.517,0.136,1.049,0.136,1.591C25.722,21.826,22.719,25.499,18.662,26.521z'
|
||||
# RaphaelJS "Internet Explorer" icon
|
||||
'IE_IconPath': 'M27.998,2.266c-2.12-1.91-6.925,0.382-9.575,1.93c-0.76-0.12-1.557-0.185-2.388-0.185c-3.349,0-6.052,0.985-8.106,2.843c-2.336,2.139-3.631,4.94-3.631,8.177c0,0.028,0.001,0.056,0.001,0.084c3.287-5.15,8.342-7.79,9.682-8.487c0.212-0.099,0.338,0.155,0.141,0.253c-0.015,0.042-0.015,0,0,0c-2.254,1.35-6.434,5.259-9.146,10.886l-0.003-0.007c-1.717,3.547-3.167,8.529-0.267,10.358c2.197,1.382,6.13-0.248,9.295-2.318c0.764,0.108,1.567,0.165,2.415,0.165c5.84,0,9.937-3.223,11.399-7.924l-8.022-0.014c-0.337,1.661-1.464,2.548-3.223,2.548c-2.21,0-3.729-1.211-3.828-4.012l15.228-0.014c0.028-0.578-0.042-0.985-0.042-1.436c0-5.251-3.143-9.355-8.255-10.663c2.081-1.294,5.974-3.209,7.848-1.681c1.407,1.14,0.633,3.533,0.295,4.518c-0.056,0.254,0.24,0.296,0.296,0.057C28.814,5.573,29.026,3.194,27.998,2.266zM13.272,25.676c-2.469,1.475-5.873,2.539-7.539,1.289c-1.243-0.935-0.696-3.468,0.398-5.938c0.664,0.992,1.495,1.886,2.473,2.63C9.926,24.651,11.479,25.324,13.272,25.676zM12.714,13.046c0.042-2.435,1.787-3.49,3.617-3.49c1.928,0,3.49,1.112,3.49,3.49H12.714z'
|
||||
}
|
||||
|
||||
@notification_WebRTCAudioExited = -> # used when the user can join audio
|
||||
Meteor.NotificationControl.create("webRTC_AudioExited", ' ', 'You have exited audio', 2500).display("webRTC_AudioExited")
|
||||
|
||||
@notification_WebRTCAudioJoining = -> # used when the user can join audio
|
||||
# display joining notification
|
||||
Meteor.NotificationControl.create("webRTC_AudioJoining", '', 'Connecting to the audio call...', -1)
|
||||
.registerShow("webRTC_AudioJoining", ->
|
||||
).display("webRTC_AudioJoining")
|
||||
# joined. Displayed joined notification and hide the joining notification
|
||||
if !BBB.amIInAudio()
|
||||
Tracker.autorun (comp) -> # wait until user is in
|
||||
if BBB.amIInAudio() # display notification when you are in audio
|
||||
comp.stop() # prevents computation from running twice (which can happen occassionally)
|
||||
Meteor.NotificationControl.create("webRTC_AudioJoined", 'success ', '', 2500)
|
||||
.registerShow("webRTC_AudioJoined", ->
|
||||
Meteor.NotificationControl.hideANotification('webRTC_AudioJoining')
|
||||
$("#webRTC_AudioJoined").prepend("You've joined the #{if BBB.amIListenOnlyAudio() then 'Listen Only' else ''} audio")
|
||||
).display("webRTC_AudioJoined")
|
||||
|
||||
@notification_WebRTCNotSupported = -> # shown when the user's browser does not support WebRTC
|
||||
# create a new notification at the audio button they clicked to trigger the event
|
||||
Meteor.NotificationControl.create("webRTC_NotSupported", 'alert', '', -1)
|
||||
.registerShow("webRTC_NotSupported", ->
|
||||
if ((browserName=getBrowserName()) in ['Safari', 'IE']) or browserName="settings" # show either the browser icon or cog gears
|
||||
$("#webRTC_NotSupported").prepend('<div id="browser-icon-container"></div>' +
|
||||
"Sorry,<br/>#{if browserName isnt 'settings' then browserName else 'your browser'} doesn't support WebRTC")
|
||||
(new Raphael('browser-icon-container', 35, 35)).path(NotificationControl.icons["#{browserName}_IconPath"]).attr({fill: "#FFF", stroke: "none"})
|
||||
).display("webRTC_NotSupported")
|
||||
@ -159,11 +159,6 @@ Handlebars.registerHelper "visibility", (section) ->
|
||||
str = str.replace http, "<a href='event:$1'><u>$1</u></a>"
|
||||
str = str.replace www, "$1<a href='event:http://$2'><u>$2</u></a>"
|
||||
|
||||
@introToAudio = (event, {isListenOnly} = {}) ->
|
||||
isListenOnly ?= true
|
||||
joinVoiceCall event, isListenOnly: isListenOnly
|
||||
displayWebRTCNotification()
|
||||
|
||||
# check the chat history of the user and add tabs for the private chats
|
||||
@populateChatTabs = (msg) ->
|
||||
myUserId = getInSession "userId"
|
||||
@ -262,6 +257,7 @@ Handlebars.registerHelper "visibility", (section) ->
|
||||
Meteor.call('listenOnlyRequestToggle', BBB.getMeetingId(), getInSession("userId"), getInSession("authToken"), false)
|
||||
BBB.leaveVoiceConference hangupCallback
|
||||
getInSession("triedHangup", true) # we have hung up, prevent retries
|
||||
notification_WebRTCAudioExited()
|
||||
else
|
||||
console.log "RETRYING hangup on WebRTC call in #{Meteor.config.app.WebRTCHangupRetryInterval} ms"
|
||||
setTimeout checkToHangupCall, Meteor.config.app.WebRTCHangupRetryInterval # try again periodically
|
||||
@ -270,13 +266,17 @@ Handlebars.registerHelper "visibility", (section) ->
|
||||
|
||||
# close the daudio UI, then join the conference. If listen only send the request to the server
|
||||
@joinVoiceCall = (event, {isListenOnly} = {}) ->
|
||||
$('#joinAudioDialog').dialog('close')
|
||||
if !isWebRTCAvailable()
|
||||
notification_WebRTCNotSupported()
|
||||
return
|
||||
|
||||
isListenOnly ?= true
|
||||
|
||||
# create voice call params
|
||||
joinCallback = (message) ->
|
||||
console.log "Beginning WebRTC Conference Call"
|
||||
|
||||
notification_WebRTCAudioJoining()
|
||||
if isListenOnly
|
||||
Meteor.call('listenOnlyRequestToggle', BBB.getMeetingId(), getInSession("userId"), getInSession("authToken"), true)
|
||||
BBB.joinVoiceConference joinCallback, isListenOnly # make the call #TODO should we apply role permissions to this action?
|
||||
|
||||
@ -1,91 +1,4 @@
|
||||
# RaphaelJS "settings" icon
|
||||
settingsIconPath = 'M17.41,20.395l-0.778-2.723c0.228-0.2,0.442-0.414,0.644-0.643l2.721,0.778c0.287-0.418,0.534-0.862,0.755-1.323l-2.025-1.96c0.097-0.288,0.181-0.581,0.241-0.883l2.729-0.684c0.02-0.252,0.039-0.505,0.039-0.763s-0.02-0.51-0.039-0.762l-2.729-0.684c-0.061-0.302-0.145-0.595-0.241-0.883l2.026-1.96c-0.222-0.46-0.469-0.905-0.756-1.323l-2.721,0.777c-0.201-0.228-0.416-0.442-0.644-0.643l0.778-2.722c-0.418-0.286-0.863-0.534-1.324-0.755l-1.96,2.026c-0.287-0.097-0.581-0.18-0.883-0.241l-0.683-2.73c-0.253-0.019-0.505-0.039-0.763-0.039s-0.51,0.02-0.762,0.039l-0.684,2.73c-0.302,0.061-0.595,0.144-0.883,0.241l-1.96-2.026C7.048,3.463,6.604,3.71,6.186,3.997l0.778,2.722C6.736,6.919,6.521,7.134,6.321,7.361L3.599,6.583C3.312,7.001,3.065,7.446,2.844,7.907l2.026,1.96c-0.096,0.288-0.18,0.581-0.241,0.883l-2.73,0.684c-0.019,0.252-0.039,0.505-0.039,0.762s0.02,0.51,0.039,0.763l2.73,0.684c0.061,0.302,0.145,0.595,0.241,0.883l-2.026,1.96c0.221,0.46,0.468,0.905,0.755,1.323l2.722-0.778c0.2,0.229,0.415,0.442,0.643,0.643l-0.778,2.723c0.418,0.286,0.863,0.533,1.323,0.755l1.96-2.026c0.288,0.097,0.581,0.181,0.883,0.241l0.684,2.729c0.252,0.02,0.505,0.039,0.763,0.039s0.51-0.02,0.763-0.039l0.683-2.729c0.302-0.061,0.596-0.145,0.883-0.241l1.96,2.026C16.547,20.928,16.992,20.681,17.41,20.395zM11.798,15.594c-1.877,0-3.399-1.522-3.399-3.399s1.522-3.398,3.399-3.398s3.398,1.521,3.398,3.398S13.675,15.594,11.798,15.594zM27.29,22.699c0.019-0.547-0.06-1.104-0.23-1.654l1.244-1.773c-0.188-0.35-0.4-0.682-0.641-0.984l-2.122,0.445c-0.428-0.364-0.915-0.648-1.436-0.851l-0.611-2.079c-0.386-0.068-0.777-0.105-1.173-0.106l-0.974,1.936c-0.279,0.054-0.558,0.128-0.832,0.233c-0.257,0.098-0.497,0.22-0.727,0.353L17.782,17.4c-0.297,0.262-0.568,0.545-0.813,0.852l0.907,1.968c-0.259,0.495-0.437,1.028-0.519,1.585l-1.891,1.06c0.019,0.388,0.076,0.776,0.164,1.165l2.104,0.519c0.231,0.524,0.541,0.993,0.916,1.393l-0.352,2.138c0.32,0.23,0.66,0.428,1.013,0.6l1.715-1.32c0.536,0.141,1.097,0.195,1.662,0.15l1.452,1.607c0.2-0.057,0.399-0.118,0.596-0.193c0.175-0.066,0.34-0.144,0.505-0.223l0.037-2.165c0.455-0.339,0.843-0.747,1.152-1.206l2.161-0.134c0.152-0.359,0.279-0.732,0.368-1.115L27.29,22.699zM23.127,24.706c-1.201,0.458-2.545-0.144-3.004-1.345s0.143-2.546,1.344-3.005c1.201-0.458,2.547,0.144,3.006,1.345C24.931,22.902,24.328,24.247,23.127,24.706z'
|
||||
|
||||
# RaphaelJS "Safari" icon
|
||||
safariIconPath = 'M16.154,5.135c-0.504,0-1,0.031-1.488,0.089l-0.036-0.18c-0.021-0.104-0.06-0.198-0.112-0.283c0.381-0.308,0.625-0.778,0.625-1.306c0-0.927-0.751-1.678-1.678-1.678s-1.678,0.751-1.678,1.678c0,0.745,0.485,1.376,1.157,1.595c-0.021,0.105-0.021,0.216,0,0.328l0.033,0.167C7.645,6.95,3.712,11.804,3.712,17.578c0,6.871,5.571,12.441,12.442,12.441c6.871,0,12.441-5.57,12.441-12.441C28.596,10.706,23.025,5.135,16.154,5.135zM16.369,8.1c4.455,0,8.183,3.116,9.123,7.287l-0.576,0.234c-0.148-0.681-0.755-1.191-1.48-1.191c-0.837,0-1.516,0.679-1.516,1.516c0,0.075,0.008,0.148,0.018,0.221l-2.771-0.028c-0.054-0.115-0.114-0.226-0.182-0.333l3.399-5.11l0.055-0.083l-4.766,4.059c-0.352-0.157-0.74-0.248-1.148-0.256l0.086-0.018l-1.177-2.585c0.64-0.177,1.111-0.763,1.111-1.459c0-0.837-0.678-1.515-1.516-1.515c-0.075,0-0.147,0.007-0.219,0.018l0.058-0.634C15.357,8.141,15.858,8.1,16.369,8.1zM12.146,3.455c0-0.727,0.591-1.318,1.318-1.318c0.727,0,1.318,0.591,1.318,1.318c0,0.425-0.203,0.802-0.516,1.043c-0.183-0.123-0.413-0.176-0.647-0.13c-0.226,0.045-0.413,0.174-0.535,0.349C12.542,4.553,12.146,4.049,12.146,3.455zM7.017,17.452c0-4.443,3.098-8.163,7.252-9.116l0.297,0.573c-0.61,0.196-1.051,0.768-1.051,1.442c0,0.837,0.678,1.516,1.515,1.516c0.068,0,0.135-0.006,0.2-0.015l-0.058,2.845l0.052-0.011c-0.442,0.204-0.824,0.513-1.116,0.895l0.093-0.147l-1.574-0.603l1.172,1.239l0.026-0.042c-0.19,0.371-0.306,0.788-0.324,1.229l-0.003-0.016l-2.623,1.209c-0.199-0.604-0.767-1.041-1.438-1.041c-0.837,0-1.516,0.678-1.516,1.516c0,0.064,0.005,0.128,0.013,0.191l-0.783-0.076C7.063,18.524,7.017,17.994,7.017,17.452zM16.369,26.805c-4.429,0-8.138-3.078-9.106-7.211l0.691-0.353c0.146,0.686,0.753,1.2,1.482,1.2c0.837,0,1.515-0.679,1.515-1.516c0-0.105-0.011-0.207-0.031-0.307l2.858,0.03c0.045,0.095,0.096,0.187,0.15,0.276l-3.45,5.277l0.227-0.195l4.529-3.92c0.336,0.153,0.705,0.248,1.094,0.266l-0.019,0.004l1.226,2.627c-0.655,0.166-1.142,0.76-1.142,1.468c0,0.837,0.678,1.515,1.516,1.515c0.076,0,0.151-0.007,0.225-0.018l0.004,0.688C17.566,26.746,16.975,26.805,16.369,26.805zM18.662,26.521l-0.389-0.6c0.661-0.164,1.152-0.759,1.152-1.47c0-0.837-0.68-1.516-1.516-1.516c-0.066,0-0.13,0.005-0.193,0.014v-2.86l-0.025,0.004c0.409-0.185,0.77-0.459,1.055-0.798l1.516,0.659l-1.104-1.304c0.158-0.335,0.256-0.704,0.278-1.095l2.552-1.164c0.19,0.618,0.766,1.068,1.447,1.068c0.838,0,1.516-0.679,1.516-1.516c0-0.069-0.006-0.137-0.016-0.204l0.65,0.12c0.089,0.517,0.136,1.049,0.136,1.591C25.722,21.826,22.719,25.499,18.662,26.521z'
|
||||
|
||||
# RaphaelJS "Internet Explorer" icon
|
||||
ieIconPath = 'M27.998,2.266c-2.12-1.91-6.925,0.382-9.575,1.93c-0.76-0.12-1.557-0.185-2.388-0.185c-3.349,0-6.052,0.985-8.106,2.843c-2.336,2.139-3.631,4.94-3.631,8.177c0,0.028,0.001,0.056,0.001,0.084c3.287-5.15,8.342-7.79,9.682-8.487c0.212-0.099,0.338,0.155,0.141,0.253c-0.015,0.042-0.015,0,0,0c-2.254,1.35-6.434,5.259-9.146,10.886l-0.003-0.007c-1.717,3.547-3.167,8.529-0.267,10.358c2.197,1.382,6.13-0.248,9.295-2.318c0.764,0.108,1.567,0.165,2.415,0.165c5.84,0,9.937-3.223,11.399-7.924l-8.022-0.014c-0.337,1.661-1.464,2.548-3.223,2.548c-2.21,0-3.729-1.211-3.828-4.012l15.228-0.014c0.028-0.578-0.042-0.985-0.042-1.436c0-5.251-3.143-9.355-8.255-10.663c2.081-1.294,5.974-3.209,7.848-1.681c1.407,1.14,0.633,3.533,0.295,4.518c-0.056,0.254,0.24,0.296,0.296,0.057C28.814,5.573,29.026,3.194,27.998,2.266zM13.272,25.676c-2.469,1.475-5.873,2.539-7.539,1.289c-1.243-0.935-0.696-3.468,0.398-5.938c0.664,0.992,1.495,1.886,2.473,2.63C9.926,24.651,11.479,25.324,13.272,25.676zM12.714,13.046c0.042-2.435,1.787-3.49,3.617-3.49c1.928,0,3.49,1.112,3.49,3.49H12.714z'
|
||||
|
||||
@displayWebRTCNotification = ->
|
||||
if getInSession('webrtc_notification_is_displayed') is false # prevents the notification from displaying until the previous one is hidden
|
||||
if !isWebRTCAvailable() # verifies if the browser supports WebRTC
|
||||
$('.notification').addClass('webrtc-support-notification')
|
||||
setInSession 'webrtc_notification_is_displayed', true
|
||||
pp = new Raphael('browser-icon-container', 35, 35)
|
||||
if getBrowserName() is 'Safari'
|
||||
pp.path(safariIconPath).attr({fill: "#000", stroke: "none"})
|
||||
$('#notification-text').html("Sorry,<br/>Safari doesn't support WebRTC")
|
||||
else if getBrowserName() is 'IE'
|
||||
pp.path(ieIconPath).attr({fill: "#000", stroke: "none"})
|
||||
$('#notification-text').html("Sorry,<br/>IE doesn't support WebRTC")
|
||||
else
|
||||
pp.path(settingsIconPath).attr({fill: "#000", stroke: "none"})
|
||||
$('.notification.ui-widget-content p').css('font-size', '11px') # to make sure the text fits the dialog box
|
||||
$('#notification-text').html("Sorry,<br/>your browser doesn't support WebRTC")
|
||||
$('#notification').dialog('open')
|
||||
setTimeout () -> # waits 2 sec, then hides the notification
|
||||
$('#notification').dialog('close')
|
||||
$('.joinAudioButton').blur()
|
||||
setTimeout () -> # waits 0.5 sec (time to hide the notification), then removes the icons
|
||||
pp.remove()
|
||||
$('.notification').removeClass('webrtc-support-notification')
|
||||
setInSession 'webrtc_notification_is_displayed', false
|
||||
, 500
|
||||
, 2000
|
||||
else
|
||||
if !BBB.amIInAudio()
|
||||
Tracker.autorun (comp) ->
|
||||
if BBB.amIInAudio() # display notification when you are in audio
|
||||
$('#notification').addClass('joined-audio-notification')
|
||||
$("#browser-icon-container").remove() # remove the space taken up by the unused icon
|
||||
setInSession 'webrtc_notification_is_displayed', true
|
||||
|
||||
if BBB.amIListenOnlyAudio() # notify the type of audio joined
|
||||
$('#notification-text').html("You've joined the Listen Only Audio")
|
||||
else
|
||||
$('#notification-text').html("You've joined the audio")
|
||||
|
||||
$('#notification').dialog('open')
|
||||
setTimeout () ->
|
||||
$('#notification').dialog('close') # close the entire notification
|
||||
$('.joinAudioButton').blur()
|
||||
setTimeout () ->
|
||||
setInSession 'webrtc_notification_is_displayed', false
|
||||
, 500
|
||||
, 3000
|
||||
comp.stop()
|
||||
|
||||
# this method gets called from either mobile or desktop UI
|
||||
# this method will adjust the UI to compensate for the new audio button
|
||||
displayAudioSelectionMenu = ({isMobile} = {}) ->
|
||||
isMobile ?= false
|
||||
$('.joinAudioButton').blur()
|
||||
|
||||
if isMobile
|
||||
toggleSlidingMenu()
|
||||
$('.navbarTitle').css('width', '55%')
|
||||
|
||||
# pop open the dialog allowing users to choose the audio options
|
||||
if isLandscapeMobile()
|
||||
$('.joinAudio-dialog').addClass('landscape-mobile-joinAudio-dialog')
|
||||
else
|
||||
$('.joinAudio-dialog').addClass('desktop-joinAudio-dialog')
|
||||
|
||||
$("#joinAudioDialog").dialog("open")
|
||||
|
||||
|
||||
# helper function to reuse some code for the handling of audio join
|
||||
onAudioJoinHelper = () ->
|
||||
# if the microphone is locked (lock settings), the viewer is only
|
||||
# allowed to join the audio as listenOnly.
|
||||
if BBB.isMyMicLocked()
|
||||
introToAudio(null, isListenOnly: true)
|
||||
else
|
||||
displayAudioSelectionMenu(isMobile: isMobile())
|
||||
|
||||
|
||||
# Helper to load javascript libraries from the BBB server
|
||||
# Helper to load javascript libraries from the BBB server
|
||||
loadLib = (libname) ->
|
||||
successCallback = ->
|
||||
|
||||
@ -116,9 +29,6 @@ Meteor.startup ->
|
||||
)
|
||||
#
|
||||
Template.header.events
|
||||
"click .joinAudioButton": (event) ->
|
||||
onAudioJoinHelper()
|
||||
|
||||
"click .chatBarIcon": (event) ->
|
||||
$(".tooltip").hide()
|
||||
toggleChatbar()
|
||||
@ -159,11 +69,7 @@ Template.header.events
|
||||
|
||||
"click .signOutIcon": (event) ->
|
||||
$('.signOutIcon').blur()
|
||||
if isLandscapeMobile()
|
||||
$('.logout-dialog').addClass('landscape-mobile-logout-dialog')
|
||||
else
|
||||
$('.logout-dialog').addClass('desktop-logout-dialog')
|
||||
$("#dialog").dialog("open")
|
||||
$("#logoutModal").foundation('reveal', 'open');
|
||||
|
||||
"click .hideNavbarIcon": (event) ->
|
||||
$(".tooltip").hide()
|
||||
@ -181,14 +87,6 @@ Template.header.events
|
||||
$(".tooltip").hide()
|
||||
toggleWhiteBoard()
|
||||
|
||||
"mouseout #navbarMinimizedButton": (event) ->
|
||||
$("#navbarMinimizedButton").removeClass("navbarMinimizedButtonLarge")
|
||||
$("#navbarMinimizedButton").addClass("navbarMinimizedButtonSmall")
|
||||
|
||||
"mouseover #navbarMinimizedButton": (event) ->
|
||||
$("#navbarMinimizedButton").removeClass("navbarMinimizedButtonSmall")
|
||||
$("#navbarMinimizedButton").addClass("navbarMinimizedButtonLarge")
|
||||
|
||||
"click .toggleUserlist": (event) ->
|
||||
if isLandscape()
|
||||
toggleUsersList()
|
||||
@ -203,9 +101,6 @@ Template.menu.events
|
||||
toggleRightHandSlidingMenu()
|
||||
|
||||
Template.slidingMenu.events
|
||||
'click .joinAudioButton': (event) ->
|
||||
onAudioJoinHelper()
|
||||
|
||||
'click .chatBarIcon': (event) ->
|
||||
$('.tooltip').hide()
|
||||
toggleSlidingMenu()
|
||||
@ -241,37 +136,6 @@ Template.slidingMenu.events
|
||||
toggleSlidingMenu()
|
||||
|
||||
Template.main.rendered = ->
|
||||
# the initialization code for the dialog presenting the user with microphone+listen only options
|
||||
$("#joinAudioDialog").dialog(
|
||||
modal: true
|
||||
draggable: false
|
||||
resizable: false
|
||||
autoOpen: false
|
||||
dialogClass: 'no-close logout-dialog joinAudioDialog'
|
||||
buttons: [
|
||||
{
|
||||
text: 'Cancel'
|
||||
click: () ->
|
||||
$(this).dialog("close")
|
||||
$(".tooltip").hide()
|
||||
class: 'btn btn-xs btn-default joinAudioDialogButton'
|
||||
}
|
||||
]
|
||||
open: (event, ui) ->
|
||||
$('.ui-widget-overlay').bind 'click', () ->
|
||||
if isMobile()
|
||||
$("#joinAudioDialog").dialog('close')
|
||||
position: { my: "center", at: "center", of: window }
|
||||
)
|
||||
|
||||
# jQuery click events are handled here. Meteor click handlers don't get called.
|
||||
# we pass in a named boolean parameter the whether we wish to join audio as listen only or not
|
||||
# $("#microphone").click ->
|
||||
# introToAudio @, isListenOnly: false
|
||||
|
||||
# $("#listen_only").click ->
|
||||
# introToAudio @, isListenOnly: true
|
||||
|
||||
$("#dialog").dialog(
|
||||
modal: true
|
||||
draggable: false
|
||||
@ -304,28 +168,11 @@ Template.main.rendered = ->
|
||||
of: '.signOutIcon'
|
||||
)
|
||||
|
||||
$("#notification").dialog(
|
||||
modal: false
|
||||
draggable: false
|
||||
resizable: false
|
||||
autoOpen: false
|
||||
dialogClass: 'no-close no-titlebar notification'
|
||||
show:
|
||||
effect: "blind"
|
||||
duration: 500
|
||||
,
|
||||
hide:
|
||||
effect: "blind"
|
||||
duration: 500
|
||||
position:
|
||||
my: 'left top'
|
||||
at: 'left bottom'
|
||||
of: '.joinAudioButton'
|
||||
)
|
||||
Meteor.NotificationControl = new NotificationControl('notificationArea')
|
||||
$(document).foundation() # initialize foundation javascript
|
||||
|
||||
$(window).resize( ->
|
||||
$('#dialog').dialog('close')
|
||||
$('#joinAudioDialog').dialog('close')
|
||||
)
|
||||
|
||||
$('#shield').click () ->
|
||||
|
||||
@ -5,6 +5,26 @@
|
||||
{{else}}
|
||||
{{> makeButton btn_class="toggleUserlist navbarButton" i_class="ion-navicon-round" rel="tooltip" data_placement="bottom" title="Open Userlist"}}
|
||||
{{/if}}
|
||||
|
||||
{{#if amIInAudio}}
|
||||
{{#if amIListenOnlyAudio}}
|
||||
{{> makeButton btn_class="navbarButton leaveAudioButton" i_class="icon fi-volume" rel="tooltip" title="Exit Audio"}}
|
||||
{{else}}
|
||||
{{#if isCurrentUserMuted}}
|
||||
<!-- if you are muted the button representing your status will show volume off -->
|
||||
{{> makeButton btn_class="navbarButton muteIcon" i_class="ion-ios-mic-off" rel="tooltip" title="Unmute"}}
|
||||
{{else}}
|
||||
{{#if isCurrentUserTalking}}
|
||||
<!-- you are talking. Display a high volume/volume up representing voice activity -->
|
||||
{{> makeButton btn_class="navbarButton muteIcon" i_class="ion-ios-mic" rel="tooltip" title="Mute"}}
|
||||
{{else}}
|
||||
<!-- you are not talking. Display low volume/volume down representing no voice activity -->
|
||||
{{> makeButton btn_class="navbarButton muteIcon" i_class="ion-ios-mic-outline" rel="tooltip" title="Mute"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
<span class="navbarTitle">
|
||||
{{getWhiteboardTitle}}
|
||||
</span>
|
||||
@ -21,9 +41,6 @@
|
||||
</template>
|
||||
|
||||
<template name="main">
|
||||
<div id="dialog" title="Confirm Logout">
|
||||
<p>Are you sure you want to log out?</p>
|
||||
</div>
|
||||
<div id="container">
|
||||
{{#if isDisconnected}}
|
||||
{{>status}}
|
||||
@ -43,16 +60,13 @@
|
||||
</template>
|
||||
|
||||
<template name="modals">
|
||||
{{> settingsModal}}
|
||||
<!-- <div id="dialog" title="Confirm Logout">
|
||||
<p>Are you sure you want to log out?</p>
|
||||
<div id="settingsModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-options="close_on_background_click:false">
|
||||
{{> settingsModal}}
|
||||
</div>
|
||||
<div id="notification">
|
||||
<div id="browser-icon-container"></div>
|
||||
<p id="notification-text"></p>
|
||||
<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>
|
||||
<audio id="remote-media" autoplay="autoplay"></audio>
|
||||
<div id='shield'></div> -->
|
||||
</template>
|
||||
|
||||
<template name="recordingStatus">
|
||||
|
||||
@ -41,7 +41,7 @@
|
||||
@media @landscape {
|
||||
height: calc(~'100% - 70px');
|
||||
}
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
@media @desktop-portrait, @mobile-portrait {
|
||||
@ -81,21 +81,6 @@
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.close:hover {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
.closeTab {
|
||||
float:left;
|
||||
width:10%;
|
||||
@media @desktop-portrait, @mobile-portrait, @mobile-portrait-with-keyboard {
|
||||
font-size: 4vw;
|
||||
}
|
||||
@media @landscape {
|
||||
font-size: 1vw;
|
||||
}
|
||||
}
|
||||
|
||||
.chat-input-wrapper {
|
||||
padding-top:10px;
|
||||
padding-left:10px;
|
||||
@ -128,20 +113,22 @@
|
||||
}
|
||||
|
||||
#fontSizeTable {
|
||||
/* Static font sizes are used everywhere in this control. This is the maximum amount of space required */
|
||||
border: 1px solid white;
|
||||
height: 80px;
|
||||
width: 379px;
|
||||
margin-bottom: 0px;
|
||||
overflow: hidden;
|
||||
/* Static font sizes are used everywhere in this control. This is the maximum amount of space required */
|
||||
width: 379px;
|
||||
.displayButtons {
|
||||
height: 35px;
|
||||
margin: 0px;
|
||||
padding:0px;
|
||||
text-align:center;
|
||||
width:84px;
|
||||
margin: 0px;
|
||||
height: 35px;
|
||||
padding:0px;
|
||||
}
|
||||
#displayLabel {
|
||||
width: 169px;
|
||||
text-align: center;
|
||||
width: 169px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -169,6 +156,8 @@
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-right-radius: 0px;
|
||||
border-top-right-radius: 0px;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 0px;
|
||||
|
||||
border:1px solid extract(@lightGrey, 3);
|
||||
margin: 0px;
|
||||
|
||||
@ -11,6 +11,14 @@
|
||||
margin-left: 20px;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.joinAudioButton {
|
||||
width: 80px;
|
||||
height: 70px;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
.desktopSettingsFieldset {
|
||||
margin: auto;
|
||||
|
||||
@ -24,6 +24,7 @@ body {
|
||||
|
||||
.btn {
|
||||
// background-color: extract(@white, 2);
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.component {
|
||||
@ -450,8 +451,26 @@ body {
|
||||
}
|
||||
|
||||
/* Notifications */
|
||||
#browser-icon-container {
|
||||
float: left;
|
||||
max-height: 35px !important;
|
||||
max-width: 35px !important;
|
||||
path {
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
#notification {
|
||||
height: 100% !important;
|
||||
margin: 0;
|
||||
min-height: 0px !important;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.notification {
|
||||
background: grey;
|
||||
/* sets the opacity of the background */
|
||||
filter:alpha(opacity=85);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
|
||||
@ -459,49 +478,26 @@ body {
|
||||
-khtml-opacity: 0.85;
|
||||
opacity: 0.85;
|
||||
|
||||
background: grey;
|
||||
&.webrtc-support-notification {
|
||||
width: 500px !important;
|
||||
height: 50px !important;
|
||||
}
|
||||
&.joined-audio-notification {
|
||||
width: 500px !important;
|
||||
#browser-icon-container {
|
||||
display: none;
|
||||
}
|
||||
#notification-text {
|
||||
height: 100% !important;
|
||||
}
|
||||
width: 500px !important;
|
||||
}
|
||||
min-height: 0px !important;
|
||||
font-weight: 900;
|
||||
&.ui-widget-content p {
|
||||
color: black;
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
padding: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
#notification {
|
||||
min-height: 0px !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#browser-icon-container {
|
||||
width: 35px !important;
|
||||
height: 35px !important;
|
||||
float: left;
|
||||
path {
|
||||
margin: auto;
|
||||
&.webrtc-support-notification {
|
||||
height: 50px !important;
|
||||
width: 500px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#notification-text {
|
||||
float: left;
|
||||
font-weight: 900;
|
||||
min-height: 0px !important;
|
||||
}
|
||||
|
||||
.invisible {
|
||||
@ -533,51 +529,6 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
/* Logout menu's properties on desktop */
|
||||
.desktop-logout-dialog {
|
||||
@media @desktop-portrait, @landscape {
|
||||
.ui-dialog-content {
|
||||
height: 36px !important; /* overriding "height: auto;" */
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.no-close .ui-dialog-titlebar-close {
|
||||
display: none; /* no close button */
|
||||
}
|
||||
|
||||
.logout-dialog.ui-dialog {
|
||||
.ui-widget-header {
|
||||
color: extract(@white, 1);
|
||||
font-weight: bold;
|
||||
background: extract(@darkGrey, 3);
|
||||
@media @desktop-portrait, @landscape {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.ui-dialog-content {
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
@media @desktop-portrait, @landscape {
|
||||
min-height: 0px !important; /* overriding "min-height: 47px;"*/
|
||||
}
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.logout-dialog.ui-widget-content {
|
||||
background: extract(@white, 3);
|
||||
border: 5px solid extract(@darkGrey, 3);
|
||||
@media @desktop-portrait, @landscape {
|
||||
font-size: 11px;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
font-size: 280%;
|
||||
}
|
||||
}
|
||||
|
||||
.joinAudioDialog {
|
||||
min-width: 500px;
|
||||
width: 25% !important;
|
||||
@ -614,7 +565,7 @@ body {
|
||||
-moz-flex: 4 4 80%;
|
||||
-ms-flex: 4 4 80%;
|
||||
flex: 4 4 80%;
|
||||
height: 99%;
|
||||
height: 100%;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
height: 100%;
|
||||
@ -636,7 +587,7 @@ body {
|
||||
flex-flow: column;
|
||||
}
|
||||
width: 100%;
|
||||
height: calc(~'100% - 55px');
|
||||
height: calc(~'100% - 50px'); // 50px for narbar height
|
||||
}
|
||||
|
||||
.signOutIcon {
|
||||
@ -678,3 +629,70 @@ body {
|
||||
right: 0;
|
||||
z-index: -1000;
|
||||
}
|
||||
|
||||
#notificationArea {
|
||||
bottom:0;
|
||||
left:0;
|
||||
margin: auto;
|
||||
@media @landscape {
|
||||
width: 50%;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
width: 90%;
|
||||
}
|
||||
@media @landscape, @desktop-portrait {
|
||||
top: 57px; // height of navbar (50px), 2 pixels for navbar margin, 5 pixels for neat whitespace
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
top: 130px; // height of navbar (130px), 20 pixels for neat whitespace
|
||||
}
|
||||
overflow-y: hidden;
|
||||
position: fixed;
|
||||
right:0;
|
||||
text-align: center;
|
||||
z-index: 1; // in front of the whiteboard
|
||||
}
|
||||
|
||||
.bbbNotification {
|
||||
margin-bottom: 5px;
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
font-size: 50px;
|
||||
}
|
||||
.close {
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
font-size: 100px;
|
||||
top: 20%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#logoutModal {
|
||||
margin-top: 0px;
|
||||
margin-right: 0px;
|
||||
top: 5% !important;
|
||||
right: 5%;
|
||||
position: fixed;
|
||||
text-align: center;
|
||||
width: 20%;
|
||||
|
||||
.logoutButton {
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
background-color: rgb(229, 229, 229);
|
||||
color: rgb(121, 121, 121);
|
||||
font-weight: bold;
|
||||
border-radius: 10px;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
#yes {
|
||||
border: 2px solid rgb(71, 164, 255);
|
||||
}
|
||||
#no {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
@ -107,17 +107,17 @@
|
||||
|
||||
<template name="optionsFontSize">
|
||||
<fieldset class="desktopSettingsFieldset">
|
||||
<legend><span class="chatOptionsText" >Chat Message Font Size: </span><br/></legend>
|
||||
<table id="fontSizeTable" align="center" style="border: 1px solid white;">
|
||||
<legend><span class="chatOptionsText" >Chat Message Font Size</span><br/></legend>
|
||||
<table id="fontSizeTable" align="center">
|
||||
<tr>
|
||||
<td>
|
||||
{{> makeButton id="decreaseFontSize" btn_class="displayButtons"
|
||||
i_class="minus" rel="tooltip" title="Decrease Font Size"}}
|
||||
i_class="fi-minus" rel="tooltip" title="Decrease Font Size"}}
|
||||
</td>
|
||||
<td id="displayLabel"><label class="fontSizeLabel" {{messageFontSize}} >Size({{getInSession "messageFontSize"}})</label></td>
|
||||
<td>
|
||||
{{> makeButton id="increaseFontSize" btn_class="displayButtons"
|
||||
i_class="plus" rel="tooltip" title="Increase Font Size"}}
|
||||
i_class="fi-plus" rel="tooltip" title="Increase Font Size"}}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
@ -1,21 +1,21 @@
|
||||
Template.bbbSettingsInfo.helpers
|
||||
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');
|
||||
|
||||
Template.settingsAudio.events
|
||||
"click #joinMicrophone": (event) ->
|
||||
introToAudio @, isListenOnly: false
|
||||
"click #exitAudio": -> exitVoiceCall()
|
||||
|
||||
"click #joinListenOnly": (event) ->
|
||||
introToAudio @, isListenOnly: true
|
||||
"click .joinAudioButton": (event) -> $("#settingsModal").foundation('reveal', 'close')
|
||||
|
||||
"click #exitAudio": ->
|
||||
exitVoiceCall()
|
||||
"click #joinListenOnly": (event) -> joinVoiceCall @, isListenOnly: true
|
||||
|
||||
Template.settingsCloseButton.events
|
||||
"click #closeSettings": ->
|
||||
setInSession "messageFontSize", getInSession("tempFontSize")
|
||||
"click #joinMicrophone": (event) -> joinVoiceCall @, isListenOnly: false
|
||||
|
||||
"click #saveSettings": ->
|
||||
$("#settingsModal").foundation('reveal', 'close');
|
||||
Template.settingsModal.events
|
||||
"click .closeSettings": -> setInSession "messageFontSize", getInSession("tempFontSize")
|
||||
"click #saveSettings": -> $("#settingsModal").foundation('reveal', 'close');
|
||||
|
||||
@ -1,83 +1,59 @@
|
||||
<template name="bbbSettingsInfo">
|
||||
{{{getBBBSettingsInfo}}}
|
||||
</template>
|
||||
|
||||
<!-- listen only | microphone -->
|
||||
<template name="settingsAudio">
|
||||
<fieldset class="desktopSettingsFieldset">
|
||||
<legend>Audio Options</legend>
|
||||
<div class='audioControllersSection'>
|
||||
{{#if amIInAudio}}
|
||||
{{#if amIListenOnlyAudio}}
|
||||
<!-- display listen only with exit -->
|
||||
{{> makeButton id="exitAudio" btn_class="exitAudio settingsButton" i_class="prohibited" rel="tooltip"
|
||||
data_placement="bottom" title="Leave Audio Call"}}
|
||||
<!-- display microphone with join -->
|
||||
{{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton" i_class="microphone" rel="tooltip"
|
||||
data_placement="bottom" title="Join Microphone"}}
|
||||
{{else}}
|
||||
<!-- display join listen only -->
|
||||
{{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton" i_class="megaphone" rel="tooltip"
|
||||
data_placement="bottom" title="Join Listen only"}}
|
||||
<!-- display microphone with exit -->
|
||||
{{> makeButton id="exitAudio" btn_class="exitAudio settingsButton" i_class="prohibited" rel="tooltip"
|
||||
data_placement="bottom" title="exit"}}
|
||||
|
||||
<!-- to be inserted back into the navbar -->
|
||||
<!-- different icons for speaking -->
|
||||
<!-- {{#if isCurrentUserMuted}} -->
|
||||
<!-- if you are muted the button representing your status will show volume off -->
|
||||
<!-- {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-off" sharingAudio=true rel="tooltip" data_placement="bottom" title="Unmute"}} -->
|
||||
<!-- {{else}} -->
|
||||
<!-- {{#if isCurrentUserTalking}} -->
|
||||
<!-- you are talking. Display a high volume/volume up representing voice activity -->
|
||||
<!-- {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-up" sharingAudio=true rel="tooltip" data_placement="bottom" title="Mute"}} -->
|
||||
<!-- {{else}} -->
|
||||
<!-- you are not talking. Display low volume/volume down representing no voice activity -->
|
||||
<!-- {{> makeButton btn_class="muteIcon" i_class="glyphicon glyphicon-volume-down" sharingAudio=true rel="tooltip" data_placement="bottom" title="Mute"}} -->
|
||||
<!-- {{/if}} -->
|
||||
<!-- {{/if}} -->
|
||||
{{/if}}
|
||||
{{#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="fi-prohibited" rel="tooltip"
|
||||
data_placement="bottom" title="Leave Audio Call"}}
|
||||
{{else}}
|
||||
<!-- display both with join -->
|
||||
{{> makeButton id="joinListenOnly" btn_class="joinListenOnly settingsButton" i_class="megaphone"
|
||||
rel="tooltip" data_placement="bottom" title="Join Listen only"}}
|
||||
{{> makeButton id="joinMicrophone" btn_class="joinMicrophone settingsButton" i_class="microphone"
|
||||
rel="tooltip" data_placement="bottom" title="Join Microphone"}}
|
||||
<!-- display microphone with exit -->
|
||||
{{> makeButton id="exitAudio" btn_class="exitAudio settingsButton joinAudioButton" i_class="fi-prohibited" 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}}
|
||||
</div>
|
||||
{{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}}
|
||||
</fieldset>
|
||||
</template>
|
||||
|
||||
<template name="settingsCloseButton">
|
||||
<a href="#" id="closeSettings" class="close-reveal-modal" style="font-size: 12px; position: inherit;"><u>Cancel</u></a>
|
||||
<button type="submit" id="saveSettings" style="margin-bottom: 0px; background-color: #007095; border-radius: 15px; padding: 5px 10px 5px 10px" class="btn settingsButton" rel="tooltip" title="Save Changes">
|
||||
Save
|
||||
</button>
|
||||
</template>
|
||||
|
||||
<template name="settingsModal">
|
||||
<div id="settingsModal" class="reveal-modal medium" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
|
||||
<div class="bar" style="border-bottom:1px solid grey">
|
||||
<p style="float: left">
|
||||
<i class="icon fi-widget" style="font-size:30px">
|
||||
<span class="modalTitle">BigBlueButton Settings</span>
|
||||
</i>
|
||||
</p>
|
||||
<p style="text-align:right">
|
||||
<a href="#" class="close-reveal-modal" style="font-size: 30px; position: inherit;">×</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="bar" style="border-bottom:1px solid grey">
|
||||
<p style="float: left">
|
||||
<i class="ion-gear-b" style="font-size:30px">
|
||||
<span class="modalTitle">BigBlueButton Settings</span>
|
||||
</i>
|
||||
</p>
|
||||
<p style="text-align:right">
|
||||
<a href="#" class="closeSettings close-reveal-modal" style="font-size: 30px; position: inherit;">×</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div style="padding: 10px; text-align: center;">
|
||||
<!-- <p>Share Camera</p> -->
|
||||
{{> settingsAudio}}
|
||||
{{> optionsFontSize}}
|
||||
{{> bbbSettingsInfo}}
|
||||
</div>
|
||||
<div style="padding: 10px; text-align: center;">
|
||||
{{> settingsAudio}}<br/>
|
||||
{{> optionsFontSize}}<br/>
|
||||
{{{getBBBSettingsInfo}}}
|
||||
</div>
|
||||
|
||||
<div class="bar" style="border-top:1px solid grey; text-align: right;">
|
||||
{{>settingsCloseButton}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bar" style="border-top:1px solid grey; text-align: right;">
|
||||
<a href="#" class="closeSettings close-reveal-modal" style="font-size: 12px; position: inherit;"><u>Cancel</u></a>
|
||||
{{> makeButton id="saveSettings" btn_class="settingsButton" rel="tooltip" title="Save Changes" style="margin-bottom: 0px; background-color: #007095; border-radius: 15px; padding: 5px 10px 5px 10px" text="Save"}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="logoutModal">
|
||||
<p>Are you sure you want to logout?</p>
|
||||
{{> makeButton id="yes" btn_class="logoutButton" rel="tooltip" title="Logout" text="Yes"}}
|
||||
{{> makeButton id="no" btn_class="logoutButton" rel="tooltip" title="Logout" text="No"}}
|
||||
</template>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<template name="makeButton">
|
||||
<!-- {{#if isMobile}}
|
||||
<button type="submit" id="{{id}}" class="{{btn_class}} btn" {{isDisabled}}>
|
||||
<i class="{{i_class}}"></i>
|
||||
<button type="submit" id="{{id}}" class="btn {{btn_class}}" {{isDisabled}} rel="{{rel}}" data-placement="{{data_placement}}" title="{{title}}" style="{{style}}">
|
||||
{{#if text}}
|
||||
<span>{{text}}</span>
|
||||
{{else}}
|
||||
{{#if i_class}}
|
||||
<i class="{{i_class}}" style="font-size:30px"></i><span>{{label}}</span>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</button>
|
||||
{{else}} -->
|
||||
<button type="submit" id="{{id}}" class="btn {{btn_class}}" {{isDisabled}} rel="{{rel}}" data-placement="{{data_placement}}" title="{{title}}">
|
||||
<i class="{{i_class}}" style="font-size:30px"></i><span>{{label}}</span>
|
||||
</button>
|
||||
<!-- {{/if}} -->
|
||||
</template>
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<!-- if the user is listen only, only display the one icon -->
|
||||
{{#if isUserListenOnlyAudio userId}}
|
||||
<span rel="tooltip" data-placement="bottom" title="{{user.name}} is only listening">
|
||||
<i class="icon fi-volume-none usericon"></i>
|
||||
<i class="icon fi-volume usericon"></i>
|
||||
</span>
|
||||
{{else}}
|
||||
{{#if isCurrentUser userId}}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user