Merge branch 'master' into flash-redirect

This commit is contained in:
Anton Georgiev 2015-03-10 15:19:11 +00:00
commit 743a213ece
7 changed files with 236 additions and 58 deletions

View File

@ -57,10 +57,6 @@
@getTimeOfJoining = ->
Meteor.Users.findOne(userId: getInSession "userId")?.user?.time_of_joining
@getPresentationFilename = ->
currentPresentation = Meteor.Presentations.findOne({"presentation.current": true})
currentPresentation?.presentation?.name
Handlebars.registerHelper "colourToHex", (value) =>
@window.colourToHex(value)
@ -104,10 +100,10 @@ Handlebars.registerHelper "getUsersInMeeting", ->
raised.concat lowered
Handlebars.registerHelper "getWhiteboardTitle", ->
"Whiteboard: " + (getPresentationFilename() or "Loading...")
"Presentation"
Handlebars.registerHelper "isCurrentUser", (userId) ->
userId is BBB.getCurrentUser()?.userId
userId is null or userId is BBB.getCurrentUser()?.userId
Handlebars.registerHelper "isCurrentUserMuted", ->
BBB.amIMuted()
@ -270,14 +266,16 @@ Handlebars.registerHelper "visibility", (section) ->
@toggleSlidingMenu = ->
if $('#sliding-menu').hasClass('sliding-menu-opened')
DestroyFixedView()
setInSession 'display_slidingMenu', false
$('#sliding-menu').removeClass('sliding-menu-opened')
$('#darkened-screen').css('display', 'none')
$('#shield').css('display', 'none')
$(document).unbind('scroll')
else
CreateFixedView()
setInSession 'display_slidingMenu', true
$('#sliding-menu').addClass('sliding-menu-opened')
$('#darkened-screen').css('display', 'block')
$('#shield').css('display', 'block')
$(document).bind 'scroll', () ->
window.scrollTo(0, 0)
@ -364,6 +362,15 @@ Handlebars.registerHelper "visibility", (section) ->
@listSessionVars = ->
console.log SessionAmplify.keys
# Detects a mobile device
@isMobile = ->
navigator.userAgent.match(/Android/i) or
navigator.userAgent.match(/iPad/i) or
navigator.userAgent.match(/iPhone/i) or
navigator.userAgent.match(/iPod/i) or
navigator.userAgent.match(/Windows Phone/i) or
navigator.userAgent.match(/BlackBerry/i) or
navigator.userAgent.match(/webOS/i)
# Checks if the view is portrait and a mobile device is being used
@isPortraitMobile = () ->
@ -392,3 +399,105 @@ Handlebars.registerHelper "visibility", (section) ->
@isOnlyOnePanelOpen = () ->
#(getInSession "display_usersList" ? 1 : 0) + (getInSession "display_whiteboard" ? 1 : 0) + (getInSession "display_chatbar" ? 1 : 0) is 1
getInSession("display_usersList") + getInSession("display_whiteboard") + getInSession("display_chatbar") is 1
# Reverts all the changes to userlist, whiteboard and chat made by the push menu
@DestroyFixedView = () ->
$('#chat').css('position', '')
$('#chat').css('top', '')
$('#chat').css('left', '')
$('#users').css('position', '')
$('#users').css('top', '')
$('#users').css('left', '')
$('#whiteboard').css('position', '')
$('#whiteboard').css('top', '')
$('#whiteboard').css('left', '')
$('#footer').css('position', '')
$('#footer').css('top', '')
$('#footer').css('left', '')
$('#chat').css('height', '')
$('#users').css('height', '')
$('#users').css('width', '')
$('#whiteboard').css('height', '')
$('#footer').css('height', '')
$('#footer').css('width', '')
# pushing the view back
$('#main').css('position', 'relative')
$('#main').css('top', '0')
$('#main').css('left', '0')
# Makes the position of userlist, whiteboard and chat fixed (to disable scrolling) and
# positions each element correctly
@CreateFixedView = () ->
# positioning the whiteboard
if getInSession 'display_whiteboard'
whiteboardHeight = $('#whiteboard').height()
$('#whiteboard').css('position', 'fixed')
$('#whiteboard').css('left', '15%')
$('#whiteboard').css('height', whiteboardHeight + 5 + 'px')
$('#whiteboard').css('top', '100px')
# positioning the chatbar
if getInSession 'display_chatbar'
chatHeight = $('#chat').height()
$('#chat').css('position', 'fixed')
$('#chat').css('left', '15%')
$('#chat').css('height', chatHeight)
if getInSession 'display_whiteboard'
$('#chat').css('top', 110 + $('#whiteboard').height() + 'px')
else
$('#chat').css('top', '100px')
# positioning the userlist
if getInSession 'display_usersList'
chatHeight = $('#chat').height()
usersHeight = $('#users').height()
usersWidth = $('#users').width()
$('#users').css('position', 'fixed')
$('#users').css('left', '15%')
$('#users').css('width', usersWidth) # prevents from shrinking
$('#users').css('height', usersHeight)
top = 100 # minimum margin for the userlist (height of the navbar)
if getInSession 'display_whiteboard'
top += $('#whiteboard').height() + 10
if getInSession 'display_chatbar'
top += chatHeight + 15
$('#users').css('top', top + 'px')
# positioning the footer
chatHeight = $('#chat').height()
usersHeight = $('#users').height()
footerHeight = $('#footer').height()
footerWidth = $('#footer').width()
$('#footer').css('position', 'fixed')
$('#footer').css('left', '15%')
$('#footer').css('height', footerHeight)
$('#footer').css('width', footerWidth) # prevents from shrinking
top = 100
if getInSession 'display_whiteboard'
top += $('#whiteboard').height() + 10
if getInSession 'display_chatbar'
top += chatHeight + 15
if getInSession 'display_usersList'
top += usersHeight + 30
$('#footer').css('top', top + 'px')
# pusing the rest of the page right
$('#main').css('position', 'fixed')
$('#main').css('top', '50px')
$('#main').css('left', '15%')

View File

@ -47,7 +47,6 @@ Template.header.events
"click .chatBarIcon": (event) ->
$(".tooltip").hide()
toggleSlidingMenu()
toggleChatbar()
"click .collapseSlidingMenuButton": (event) ->
@ -67,7 +66,6 @@ Template.header.events
"click .lowerHand": (event) ->
$(".tooltip").hide()
toggleSlidingMenu()
Meteor.call('userLowerHand', getInSession("meetingId"), getInSession("userId"), getInSession("userId"), getInSession("authToken"))
"click .muteIcon": (event) ->
@ -78,21 +76,16 @@ Template.header.events
#Meteor.log.info "navbar raise own hand from client"
console.log "navbar raise own hand from client"
$(".tooltip").hide()
toggleSlidingMenu()
Meteor.call('userRaiseHand', getInSession("meetingId"), getInSession("userId"), getInSession("userId"), getInSession("authToken"))
# "click .settingsIcon": (event) ->
# alert "settings"
"click .signOutIcon": (event) ->
$('.signOutIcon').blur()
if window.matchMedia('(orientation: portrait)').matches and window.matchMedia('(max-device-width: 1279px)').matches
if $('#dialog').dialog('option', 'height') isnt 450
$('#dialog').dialog('option', 'width', '100%')
$('#dialog').dialog('option', 'height', 450)
if isLandscapeMobile()
$('.logout-dialog').addClass('landscape-mobile-logout-dialog')
else
if $('#dialog').dialog('option', 'height') isnt 115
$('#dialog').dialog('option', 'width', 270)
$('#dialog').dialog('option', 'height', 115)
$('.logout-dialog').addClass('desktop-logout-dialog')
$("#dialog").dialog("open")
"click .hideNavbarIcon": (event) ->
$(".tooltip").hide()
@ -102,7 +95,6 @@ Template.header.events
"click .usersListIcon": (event) ->
$(".tooltip").hide()
toggleSlidingMenu
toggleUsersList()
"click .videoFeedIcon": (event) ->
@ -111,7 +103,6 @@ Template.header.events
"click .whiteboardIcon": (event) ->
$(".tooltip").hide()
toggleSlidingMenu
toggleWhiteBoard()
"mouseout #navbarMinimizedButton": (event) ->
@ -190,6 +181,10 @@ Template.main.rendered = ->
class: 'btn btn-xs btn-default'
}
]
open: (event, ui) ->
$('.ui-widget-overlay').bind 'click', () ->
if isMobile()
$("#dialog").dialog('close')
position:
my: 'right top'
at: 'right bottom'
@ -200,7 +195,7 @@ Template.main.rendered = ->
$('#dialog').dialog('close')
)
$('#darkened-screen').click () ->
$('#shield').click () ->
toggleSlidingMenu()
Template.makeButton.rendered = ->

View File

@ -10,11 +10,13 @@
<div class="navbarUserButtons navbarSection">
<div id="collapseButtonSection">
{{#if isPortraitMobile}}
{{#if getInSession "display_slidingMenu"}}
{{> makeButton btn_class="navbarButton collapseSlidingMenuButton" i_class="glyphicon glyphicon-chevron-left" rel="tooltip" data_placement="bottom" title="Collapse"}}
{{else}}
{{> makeButton btn_class="navbarButton collapseSlidingMenuButton" i_class="glyphicon glyphicon-chevron-right" rel="tooltip" data_placement="bottom" title="Expand"}}
{{/if}}
<button class="navbar-toggle btn navbarButton collapseSlidingMenuButton">
<div class="push-menu-icon">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</div>
</button>
{{else}}
{{#if getInSession "display_hiddenNavbarSection"}}
{{> makeButton btn_class="navbarButton collapseNavbarButton" i_class="glyphicon glyphicon-chevron-left" rel="tooltip" data_placement="bottom" title="Collapse"}}
@ -115,11 +117,11 @@
<audio id="remote-media" autoplay="autoplay"></audio>
{{> footer}}
{{/if}}
<div id='shield'></div>
</div>
{{#if isPortraitMobile}}
{{> slidingMenu}}
{{/if}}
<div id='darkened-screen'></div>
</body>
</template>

View File

@ -35,6 +35,7 @@
list-style: none;
margin: 0px;
padding: 0px;
@media @desktop-portrait, @landscape {
li {
margin: 0px;
@ -48,6 +49,7 @@
}
}
}
}
#chatbody {
@ -63,11 +65,6 @@
}
}
.chatGreeting {
color: blue;
margin-top: 5px;
}
.chatNameSelector {
clear:right;
float:left;
@ -114,7 +111,7 @@
float: left;
@media @desktop-portrait, @mobile-portrait, @mobile-portrait-with-keyboard {
.dropdownMessage {
font-size: 2.5vw !important;
font-size: 3vw;
font-style: italic;
}
}

View File

@ -17,6 +17,9 @@ body {
position: relative;
top: 15px;
}
@media @mobile-portrait-with-keyboard, @mobile-portrait {
overflow-x: hidden;
}
}
.btn {
@ -89,6 +92,27 @@ body {
i {
color: extract(@white, 1);
}
.push-menu-icon {
.icon-bar {
margin-left: auto;
margin-right: auto;
margin-bottom: 8px;
margin-top: 8px;
display: block;
border-radius: 1px;
background-color: extract(@white, 1);
width: 50px;
height: 10px;
}
margin-top: auto;
margin-bottom: auto;
}
&.navbar-toggle {
height: 100px;
margin-bottom: 0px;
margin-top: 0px;
border: 0px;
}
}
@media @landscape {
min-width: 768px;
@ -277,6 +301,14 @@ body {
-webkit-flex-flow: row;
flex-flow: row;
height: calc(~'100% - 40px');
/**
* Making sure these properties can't be overriden in landscape orientation
* (landscape view can't be shifted by the sliding menu).
*/
position: relative !important;
top: 0 !important;
left: 0 !important;
}
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
-webkit-flex-flow: column;
@ -285,10 +317,49 @@ body {
min-height: 125%;
max-height: 125%;
}
@media @mobile-portrait-with-keyboard, @mobile-portrait {
transition: left 0.1s;
position: relative;
top: 0;
left: 0;
}
}
/* Custom alert box */
/* Logout menu's properties on mobile devices in landscape orientation */
.landscape-mobile-logout-dialog {
@media @landscape {
.ui-widget-header {
font-size: 100% !important;
}
width: 55% !important; /* overriding "width: auto;" */
font-size: 3vh !important; /* overriding "font-size: 11px;" */
.ui-dialog-content {
height: 30% !important; /* overriding "height: auto;" */
}
.ui-dialog-buttonset {
width: 100%;
font-size: 4vh;
button {
width: 40%;
margin-left: 5% !important;
margin-right: 5% !important;
}
}
height: 32% !important;
}
}
/* 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 */
}
@ -306,16 +377,19 @@ body {
font-weight: bold;
text-align: center;
@media @desktop-portrait, @landscape {
font-size: 11px;
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: 10px;
font-size: 11px;
}
@media @mobile-portrait-with-keyboard, @mobile-portrait {
font-size: 280%;
@ -429,10 +503,11 @@ body {
.sliding-menu {
@media @mobile-portrait-with-keyboard, @mobile-portrait {
transition: left 0.1s;
width: 15%;
height: 100%;
position: fixed;
top: 0;
top: 100px;
left: -15%;
z-index: 1031;
&.sliding-menu-opened {
@ -451,7 +526,7 @@ body {
.slideSection {
@media @mobile-portrait-with-keyboard, @mobile-portrait {
float: left;
margin-top: 100px;
margin-top: 0;
height: 100%;
width: 100%;
margin-bottom: 0.5%;
@ -481,11 +556,11 @@ body {
}
}
#darkened-screen {
#shield {
@media @mobile-portrait, @mobile-portrait-with-keyboard {
display: none;
background: black;
opacity: 0.7;
opacity: 0.2;
z-index: 1030;
position: fixed;
left: 0;

View File

@ -255,9 +255,9 @@ Template.optionsFontSize.events
if selectedFontSize
setInSession "messageFontSize", selectedFontSize
else if isPortraitMobile()
setInSession "messageFontSize", 20
setInSession "messageFontSize", Meteor.config.app.mobileFont
else
setInSession "messageFontSize", 12
setInSession "messageFontSize", Meteor.config.app.desktopFont
Template.optionsFontSize.helpers
getFontsizes: -> (size for size in [8..30] by 2)

View File

@ -81,11 +81,11 @@
<div class="private-chat-user-box" rel="tooltip" data-placement="top" title="Select a participant to open a private chat">
<div class="private-chat-user-list">
{{#each getUsersInMeeting}}
<div class="private-chat-user-entry">
{{#unless isCurrentUser userId}}
<div class="private-chat-user-entry">
{{user.name}}
{{/unless}}
</div>
{{/unless}}
{{/each}}
</div>
</div>
@ -100,7 +100,7 @@
<template name="optionsFontSize">
<div class="dropdown">
<span class="dropdownMessage" {{messageFontSize}}>Chat Message Font Size: </span>
<span class="dropdownMessage">Chat Message Font Size: </span>
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
Font Size ({{getInSession "messageFontSize"}})
<span class="caret"></span>