Conflicts
This commit is contained in:
commit
bf67593fa1
@ -383,6 +383,7 @@ Handlebars.registerHelper "visibility", (section) ->
|
||||
setInSession 'webrtc_notification_is_displayed', false
|
||||
|
||||
@onLoadComplete = ->
|
||||
document.title = "BigBlueButton #{window.getMeetingName() ? 'HTML5'}"
|
||||
setDefaultSettings()
|
||||
|
||||
Meteor.Users.find().observe({
|
||||
|
@ -114,7 +114,7 @@ Meteor.startup ->
|
||||
amplify.store key, value
|
||||
return
|
||||
)
|
||||
#
|
||||
|
||||
Template.header.events
|
||||
"click .joinAudioButton": (event) ->
|
||||
onAudioJoinHelper()
|
||||
@ -188,6 +188,9 @@ Template.header.events
|
||||
$("#navbarMinimizedButton").removeClass("navbarMinimizedButtonSmall")
|
||||
$("#navbarMinimizedButton").addClass("navbarMinimizedButtonLarge")
|
||||
|
||||
"click .toggleUserlist": (event) ->
|
||||
toggleUsersList()
|
||||
|
||||
Template.slidingMenu.events
|
||||
'click .joinAudioButton': (event) ->
|
||||
onAudioJoinHelper()
|
||||
@ -227,10 +230,6 @@ Template.slidingMenu.events
|
||||
exitVoiceCall event
|
||||
toggleSlidingMenu()
|
||||
|
||||
Template.main.helpers
|
||||
setTitle: ->
|
||||
document.title = "BigBlueButton #{window.getMeetingName() ? 'HTML5'}"
|
||||
|
||||
Template.main.rendered = ->
|
||||
# the initialization code for the dialog presenting the user with microphone+listen only options
|
||||
$("#joinAudioDialog").dialog(
|
||||
|
@ -1,204 +1,57 @@
|
||||
<template name="header">
|
||||
{{#if getInSession "display_navbar"}}
|
||||
<nav id="navbar" class="myNavbar gradientBar top-bar" role="navigation">
|
||||
<div class="navbarUserButtons navbarSection">
|
||||
<div id="collapseButtonSection">
|
||||
{{#if isPortraitMobile}}
|
||||
<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"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="navbarButton collapseNavbarButton" i_class="glyphicon glyphicon-chevron-right" rel="tooltip" data_placement="bottom" title="Expand"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="collapseNavbarSection">
|
||||
<div class='hiddenNavbarSection'>
|
||||
<!-- display/hide users list toggle -->
|
||||
{{#if getInSession "display_usersList"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive usersListIcon navbarButton collapseSectionButton" i_class="glyphicon glyphicon-user" rel="tooltip" data_placement="bottom" title="Hide List of Users"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="usersListIcon navbarButton collapseSectionButton" i_class="glyphicon glyphicon-user" rel="tooltip" data_placement="bottom" title="Show List of Users"}}
|
||||
{{/if}}
|
||||
<template name="header">
|
||||
<nav id="navbar" class="myNavbar gradientBar top-bar" role="navigation">
|
||||
{{#if getInSession "display_usersList"}}
|
||||
{{> makeButton btn_class="toggleUserlist navbarButton" i_class="ion-navicon-round" rel="tooltip" data_placement="bottom" title="Close Userlist"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="toggleUserlist navbarButton" i_class="ion-navicon-round" rel="tooltip" data_placement="bottom" title="Open Userlist"}}
|
||||
{{/if}}
|
||||
<span class="navbarTitle">
|
||||
{{getWhiteboardTitle}}
|
||||
</span>
|
||||
|
||||
<!-- display/hide whiteboard toggle -->
|
||||
{{#if getInSession "display_whiteboard"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive whiteboardIcon navbarButton collapseSectionButton" i_class="ion-easel" rel="tooltip" data_placement="bottom" title="Hide Whiteboard"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="whiteboardIcon navbarButton collapseSectionButton" i_class="ion-easel" rel="tooltip" data_placement="bottom" title="Show Whiteboard"}}
|
||||
{{/if}}
|
||||
|
||||
<!-- display/hide chat bar toggle -->
|
||||
{{#if getInSession "display_chatbar"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive chatBarIcon navbarButton collapseSectionButton" i_class="glyphicon glyphicon-comment" rel="tooltip" data_placement="bottom" title="Hide Message Pane"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="chatBarIcon navbarButton collapseSectionButton" i_class="glyphicon glyphicon-comment" rel="tooltip" data_placement="bottom" title="Show Message Pane"}}
|
||||
{{/if}}
|
||||
{{> makeButton id="settingsIcon" btn_class="settingsIcon" i_class="widget" rel="tooltip"
|
||||
title="BigBlueButton Settings"}}
|
||||
|
||||
<!-- display/hide webcam streams toggle -->
|
||||
<!-- {{#if isCurrentUserSharingVideo}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive videoFeedIcon navbarButton" i_class="glyphicon glyphicon-stop" sharingVideo=true rel="tooltip" data_placement="bottom" title="Hide Webcams"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="videoFeedIcon navbarButton" i_class="glyphicon glyphicon-facetime-video" sharingVideo=false rel="tooltip" data_placement="bottom" title="Show Webcams"}}
|
||||
{{/if}} -->
|
||||
</div>
|
||||
<div class='audioControllersSection'>
|
||||
<!-- We are in a form of audio -->
|
||||
{{#if amIInAudio}}
|
||||
<div class='hiddenNavbarSection'>
|
||||
<!-- display the button for leaving audio -->
|
||||
{{> makeButton btn_class="navbarIconToggleActive audioFeedIcon navbarButton audioButton leaveAudioButton" i_class="ion-volume-mute" sharingAudio=true rel="tooltip" data_placement="bottom" title="Leave Audio Call"}}
|
||||
</div>
|
||||
{{#unless amIListenOnlyAudio}}
|
||||
{{#if isCurrentUserMuted}}
|
||||
<!-- if you are muted the button representing your status will show volume off -->
|
||||
{{> makeButton btn_class="muteIcon navbarButton audioButton" 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="navbarIconToggleActive muteIcon navbarButton audioButton" 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="navbarIconToggleActive muteIcon navbarButton audioButton" i_class="glyphicon glyphicon-volume-down" sharingAudio=true rel="tooltip" data_placement="bottom" title="Mute"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/unless}}
|
||||
{{else}}
|
||||
<div class='hiddenNavbarSection'>
|
||||
{{> makeButton btn_class="audioFeedIcon navbarButton audioButton joinAudioButton" i_class="glyphicon glyphicon-headphones" sharingAudio=false rel="tooltip" data_placement="bottom" title="Join Audio Call"}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class='hiddenNavbarSection'>
|
||||
{{#if isCurrentUserRaisingHand}}
|
||||
{{> makeButton btn_class="lowerHand navbarIconToggleActive navbarButton collapseSectionButton" i_class="ion-android-hand" rel="tooltip" data_placement="bottom" title="Lower your hand"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="raiseHand navbarButton collapseSectionButton" i_class="ion-android-hand" rel="tooltip" data_placement="bottom" title="Raise your hand"}}
|
||||
{{/if}}
|
||||
|
||||
{{> recordingStatus}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbarTitle navbarSection"><span>{{getMeetingName}}</span></div>
|
||||
<div class="navbarSettingsButtons navbarSection">
|
||||
{{> makeButton id="userId" btn_class="settingsIcon navbarButton" i_class="glyphicon glyphicon-cog" rel="tooltip" data_placement="bottom" title="Settings"}}
|
||||
{{> makeButton btn_class="signOutIcon navbarButton" i_class="glyphicon glyphicon-log-out" rel="tooltip" data_placement="bottom" title="Logout"}}
|
||||
</div>
|
||||
</nav>
|
||||
<div class="navbarFiller"></div>
|
||||
{{else}}
|
||||
{{> makeButton id="navbarMinimizedButton" btn_class="hideNavbarIcon navbarMinimizedButtonSmall" i_class="glyphicon glyphicon-chevron-down" rel="tooltip" data_placement="bottom" title="Display Navbar"}}
|
||||
{{/if}}
|
||||
</template>
|
||||
<!-- dialog that presents user with audio options
|
||||
contains microphone and listen only with icons -->
|
||||
<template name="joinAudioDialog">
|
||||
<div id="joinAudioDialog" title="How do you want to join the audio?">
|
||||
<hr class="joinAudioDialogHr"/>
|
||||
<div style="float:left; border-right: 2px solid darkgrey; width: 50%; height: 100%">
|
||||
<i class="icon ion-mic-a joinAudioDialogIcon"></i>
|
||||
<br/>
|
||||
<button id="microphone" class="joinAudioDialogButton">Microphone</button>
|
||||
</div>
|
||||
<div style="float:left; width: 50%">
|
||||
<i class="icon ion-volume-high joinAudioDialogIcon"></i>
|
||||
<br/>
|
||||
<button id="listen_only" class="joinAudioDialogButton">Listen Only</button>
|
||||
</div>
|
||||
<br style="clear:both;"/><br/>
|
||||
<hr style="margin: 10px; border: 1px solid darkgrey;" />
|
||||
</div>
|
||||
{{> makeButton id="logout" btn_class="logoutIcon" i_class="arrow-right" rel="tooltip"
|
||||
title="Logout"}}
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<template name="main">
|
||||
{{setTitle}}
|
||||
<body>
|
||||
{{> modals}}
|
||||
|
||||
<div id="dialog" title="Confirm Logout">
|
||||
<p>Are you sure you want to log out?</p>
|
||||
</div>
|
||||
{{> joinAudioDialog}}
|
||||
<div id="notification">
|
||||
<div id="browser-icon-container"></div>
|
||||
<p id="notification-text"></p>
|
||||
</div>
|
||||
|
||||
<div id="main" class="mainContainer row-fluid">
|
||||
{{#if isDisconnected}}
|
||||
{{>status}}
|
||||
{{else}}
|
||||
<div class="fixed">{{> header}}</div>
|
||||
{{> whiteboard id="whiteboard" title=getWhiteboardTitle name="whiteboard"}}
|
||||
{{> chatbar id="chat" title="Chat" name="chatbar"}}
|
||||
{{> usersList id="users" name="usersList"}}
|
||||
<audio id="remote-media" autoplay="autoplay"></audio>
|
||||
{{/if}}
|
||||
<div id='shield'></div>
|
||||
</div>
|
||||
{{#if isPortraitMobile}}
|
||||
{{> slidingMenu}}
|
||||
<div id="container">
|
||||
{{#if isDisconnected}}
|
||||
{{>status}}
|
||||
{{else}}
|
||||
{{> usersList id="users" name="usersList"}}
|
||||
<div id="main">
|
||||
{{> header}}
|
||||
<div id="panels">
|
||||
{{> whiteboard id="whiteboard" name="whiteboard"}}
|
||||
{{> chatbar id="chat" title="Chat" name="chatbar"}}
|
||||
</div>
|
||||
{{> modals}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</body>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template name="modals">
|
||||
{{> settingsModal}}
|
||||
|
||||
<div id="dialog" title="Confirm Logout">
|
||||
<p>Are you sure you want to log out?</p>
|
||||
</div>
|
||||
<div id="notification">
|
||||
<div id="browser-icon-container"></div>
|
||||
<p id="notification-text"></p>
|
||||
</div>
|
||||
<audio id="remote-media" autoplay="autoplay"></audio>
|
||||
<div id='shield'></div>
|
||||
</template>
|
||||
|
||||
<template name="recordingStatus">
|
||||
<!-- Recording status of the meeting -->
|
||||
{{#with getCurrentMeeting}}
|
||||
{{#if intendedForRecording}}
|
||||
{{#if currentlyBeingRecorded}}
|
||||
<button class="recordingStatus recordingStatusTrue" rel="tooltip" data-placement="bottom" title="This Meeting is Being Recorded"><span class="glyphicon glyphicon-record"></span> Recording</button>
|
||||
{{else}}
|
||||
<button class="recordingStatus recordingStatusFalse" rel="tooltip" data-placement="bottom" title="This Meeting is Not Currently Being Recorded"><span class="glyphicon glyphicon-record"></span></button>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/with}}
|
||||
</template>
|
||||
|
||||
<template name='slidingMenu'>
|
||||
<div class="sliding-menu" id="sliding-menu">
|
||||
<div class="slideSection">
|
||||
{{#if getInSession "display_usersList"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive usersListIcon slideButton" i_class="glyphicon glyphicon-user" rel="tooltip" data_placement="right" title="Hide List of Users"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="usersListIcon slideButton" i_class="glyphicon glyphicon-user" rel="tooltip" data_placement="right" title="Show List of Users"}}
|
||||
{{/if}}
|
||||
|
||||
{{#if getInSession "display_whiteboard"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive whiteboardIcon slideButton" i_class="ion-easel" rel="tooltip" data_placement="right" title="Hide Whiteboard"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="whiteboardIcon slideButton" i_class="ion-easel" rel="tooltip" data_placement="right" title="Show Whiteboard"}}
|
||||
{{/if}}
|
||||
|
||||
{{#if getInSession "display_chatbar"}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive chatBarIcon slideButton" i_class="glyphicon glyphicon-comment" rel="tooltip" data_placement="right" title="Hide Message Pane"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="chatBarIcon slideButton" i_class="glyphicon glyphicon-comment" rel="tooltip" data_placement="right" title="Show Message Pane"}}
|
||||
{{/if}}
|
||||
|
||||
{{#if amIInAudio}}
|
||||
{{> makeButton btn_class="navbarIconToggleActive audioFeedIcon slideButton audioButton leaveAudioButton" i_class="ion-volume-mute" sharingAudio=true rel="tooltip" data_placement="bottom" title="Leave Audio Call"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="audioFeedIcon slideButton audioButton joinAudioButton" i_class="glyphicon glyphicon-headphones" sharingAudio=false rel="tooltip" data_placement="bottom" title="Join Audio Call"}}
|
||||
{{/if}}
|
||||
|
||||
{{#if isCurrentUserRaisingHand}}
|
||||
{{> makeButton btn_class="lowerHand navbarIconToggleActive slideButton" i_class="ion-android-hand" rel="tooltip" data_placement="right" title="Lower your hand"}}
|
||||
{{else}}
|
||||
{{> makeButton btn_class="raiseHand slideButton" i_class="ion-android-hand" rel="tooltip" data_placement="right" title="Raise your hand"}}
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -8,27 +8,16 @@
|
||||
}
|
||||
|
||||
#chat {
|
||||
background-color: extract(@white, 2);
|
||||
border: 1px solid extract(@lightGrey, 3);
|
||||
float: left;
|
||||
background: extract(@white, 1);
|
||||
margin-left: 0.25%;
|
||||
margin-right: 0.25%;
|
||||
overflow: hidden;
|
||||
-webkit-flex: 1 1 25%;
|
||||
flex: 1 1 25%;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
width: 100%;
|
||||
@media @landscape {
|
||||
height: calc(~'100% - 15px');
|
||||
-webkit-order: 3;
|
||||
order: 3;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
-webkit-order: 2;
|
||||
order: 2;
|
||||
-webkit-flex: 3 3 30%;
|
||||
-moz-flex: 3 3 30%;
|
||||
-ms-flex: 3 3 30%;
|
||||
flex: 3 3 30%;
|
||||
height: 100%;
|
||||
}
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.chat {
|
||||
@ -49,7 +38,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#chatbody {
|
||||
@ -112,7 +100,9 @@
|
||||
}
|
||||
|
||||
.chat-input-wrapper {
|
||||
padding:10px;
|
||||
padding-top:10px;
|
||||
padding-left:10px;
|
||||
padding-right:10px;
|
||||
}
|
||||
|
||||
#chat-user-list {
|
||||
|
@ -15,7 +15,7 @@ body {
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
position: relative;
|
||||
top: 15px;
|
||||
top: 0;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
overflow-x: hidden;
|
||||
@ -31,8 +31,6 @@ body {
|
||||
background: extract(@white, 1);
|
||||
border: 1px solid extract(@lightGrey, 3);
|
||||
float: left;
|
||||
height: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.extraConversationScrollableMenu {
|
||||
@ -45,41 +43,6 @@ body {
|
||||
margin-left:5px
|
||||
}
|
||||
|
||||
.mainContainer {
|
||||
height: 95%;
|
||||
}
|
||||
|
||||
.myFooter {
|
||||
min-height: 40px !important;
|
||||
color: black;
|
||||
padding-top: 13px;
|
||||
text-align: center;
|
||||
background-color: #EEEEEE;
|
||||
@media @landscape {
|
||||
position:fixed;
|
||||
bottom:0;
|
||||
margin-bottom: 0;
|
||||
border-width: 1px 0 0;
|
||||
width: 100%;
|
||||
}
|
||||
@media @landscape, @desktop-portrait {
|
||||
font-size: 10px;
|
||||
max-height: 20px;
|
||||
}
|
||||
@media @mobile-portrait {
|
||||
font-size: 2vw;
|
||||
}
|
||||
|
||||
/*the footer should be visible only at the very bottom of a portrait page*/
|
||||
@media @desktop-portrait, @mobile-portrait {
|
||||
order: 4;
|
||||
-webkit-order: 4;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard {
|
||||
display: none; /*hide when typing*/
|
||||
}
|
||||
}
|
||||
|
||||
.myNavbar {
|
||||
border-bottom: 0px;
|
||||
&.gradientBar {
|
||||
@ -181,8 +144,6 @@ body {
|
||||
|
||||
.navbarTitle {
|
||||
color: extract(@white, 1);
|
||||
display: block;
|
||||
float: left;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
@ -272,51 +233,26 @@ body {
|
||||
padding-left: 10px;
|
||||
padding-top: 5px;
|
||||
@media @desktop-portrait, @landscape {
|
||||
font-size: 14px;
|
||||
font-size: 18px;
|
||||
height: 50px;
|
||||
}
|
||||
@media @mobile-portrait, @mobile-portrait-with-keyboard {
|
||||
font-size: 4vw;
|
||||
}
|
||||
}
|
||||
|
||||
#main {
|
||||
padding-top: 50px;
|
||||
padding-left: 0.25%;
|
||||
padding-right: 0.25%;
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
@media @desktop-portrait {
|
||||
padding-top: 0;
|
||||
}
|
||||
#container {
|
||||
@media @landscape {
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-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;
|
||||
flex-flow: column;
|
||||
flex-direction: column;
|
||||
min-height: 125%;
|
||||
max-height: 125%;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @mobile-portrait {
|
||||
transition: left 0.1s;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.ui-widget-overlay {
|
||||
@ -654,3 +590,35 @@ body {
|
||||
.ui-dialog-titlebar {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#main {
|
||||
@media @landscape {
|
||||
-webkit-flex: 4 4 80%;
|
||||
-moz-flex: 4 4 80%;
|
||||
-ms-flex: 4 4 80%;
|
||||
flex: 4 4 80%;
|
||||
height: 99%;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#panels {
|
||||
display: -moz-flex;
|
||||
display: -ms-flexbox;
|
||||
display: -ms-flex;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
@media @landscape {
|
||||
-webkit-flex-flow: row;
|
||||
flex-flow: row;
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
-webkit-flex-flow: column;
|
||||
flex-flow: column;
|
||||
}
|
||||
width: 100%;
|
||||
height: calc(~'100% - 55px');
|
||||
margin-bottom: 1%;
|
||||
}
|
||||
|
@ -54,30 +54,20 @@
|
||||
}
|
||||
|
||||
#users {
|
||||
margin-left: 0.25%;
|
||||
margin-right: 0.25%;
|
||||
padding-bottom: 10px; /*min-width:230px;*/
|
||||
-webkit-flex: 1 1 25%;
|
||||
flex: 1 1 25%;
|
||||
@media @landscape {
|
||||
height: calc(~'100% - 15px');
|
||||
-webkit-order: 1;
|
||||
order: 1;
|
||||
min-width: 0;
|
||||
-webkit-flex: 1 1 20%;
|
||||
-moz-flex: 1 1 20%;
|
||||
-ms-flex: 1 1 20%;
|
||||
flex: 1 1 20%;
|
||||
height: 99%;
|
||||
}
|
||||
@media @desktop-portrait, @mobile-portrait {
|
||||
-webkit-order: 3;
|
||||
order: 3;
|
||||
margin-bottom: 0px;
|
||||
padding-bottom: 10x; /*so that the footer does not overlap */
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard {
|
||||
display: none; //hide when typing
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
#user-contents {
|
||||
height: 100%; /* for the inside scrolling list to utilize as much room as possible, this surrounding window must also take up as much room as possible */
|
||||
height: 83vh; /* for the inside scrolling list to utilize as much room as possible, this surrounding window must also take up as much room as possible */
|
||||
|
||||
.userlist {
|
||||
height: calc(~'100% - 29px'); /* height of user contents - user list */
|
||||
@ -111,3 +101,8 @@
|
||||
width:70%;
|
||||
}
|
||||
}
|
||||
|
||||
.closeUserlistIcon {
|
||||
float: right;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
@ -1,68 +1,17 @@
|
||||
@import "variables";
|
||||
|
||||
#whiteboard {
|
||||
padding: 0 !important;
|
||||
margin-left: 0.25%;
|
||||
margin-right: 0.25%;
|
||||
-webkit-flex: 2 2 50%;
|
||||
-moz-flex: 2 2 50%;
|
||||
-ms-flex: 2 2 50%;
|
||||
flex: 2 2 50%;
|
||||
min-width: 0;
|
||||
@media @landscape {
|
||||
height: calc(~'100% - 15px');
|
||||
-webkit-order: 2;
|
||||
order: 2;
|
||||
min-width: 50%;
|
||||
min-height: calc(~'100% - 65px');
|
||||
}
|
||||
@media @mobile-portrait-with-keyboard, @desktop-portrait, @mobile-portrait {
|
||||
-webkit-order: 1;
|
||||
order: 1;
|
||||
min-width: 99%; /* 100% - (2 #whileboard margins 0.25% each + 2 #main paddings 0.25% each) */
|
||||
}
|
||||
&:-webkit-full-screen {
|
||||
width: 100%;
|
||||
-webkit-flex: 7 7 70%;
|
||||
-moz-flex: 7 7 70%;
|
||||
-ms-flex: 7 7 70%;
|
||||
flex: 7 7 70%;
|
||||
height: 100%;
|
||||
margin-top: 0px;
|
||||
#whiteboard-navbar {
|
||||
display: none;
|
||||
}
|
||||
#whiteboard-container {
|
||||
height: 100%;
|
||||
}
|
||||
#whiteboard-paper {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&:-moz-full-screen {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin-top: 0px;
|
||||
#whiteboard-navbar {
|
||||
display: none;
|
||||
}
|
||||
#whiteboard-container {
|
||||
height: 100%;
|
||||
}
|
||||
#whiteboard-paper {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&:fullscreen {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin-top: 0px;
|
||||
#whiteboard-navbar {
|
||||
display: none;
|
||||
}
|
||||
#whiteboard-container {
|
||||
height: 100%;
|
||||
}
|
||||
#whiteboard-paper {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
margin-left: 4px;
|
||||
margin-right: 2px;
|
||||
margin-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#whiteboard-paper {
|
||||
@ -95,7 +44,7 @@
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-align-items: center;
|
||||
height: calc(~'100% - 39px');
|
||||
height: calc(~'99% - 39px');
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,10 +1,9 @@
|
||||
<template name="chatbar">
|
||||
<div id="{{id}}" {{visibility name}} class="component">
|
||||
<h3 class="title gradientBar">
|
||||
<span class="glyphicon glyphicon-comment heading"></span>
|
||||
{{> extraConversations}}
|
||||
<span class="ion-ios-chatbubble"></span>
|
||||
{{> extraConversations}}
|
||||
</h3>
|
||||
{{>tabButtons}} <!-- Display public/options tabs, and private chat tabs -->
|
||||
{{#if getInSession "display_chatPane"}}
|
||||
<div id="chatbody">
|
||||
<ul class="chat" {{messageFontSize}}>
|
||||
|
@ -4,3 +4,7 @@ Template.usersList.helpers
|
||||
if numberUsers > 8
|
||||
return "Users: #{numberUsers}"
|
||||
# do not display the label if there are just a few users
|
||||
|
||||
Template.usersList.events
|
||||
"click .closeUserlistIcon": (event, template) ->
|
||||
toggleUsersList()
|
@ -1,15 +1,17 @@
|
||||
<template name="usersList">
|
||||
<div id="{{id}}" {{visibility name}} class="component">
|
||||
<h3 class="title gradientBar"><span class="glyphicon glyphicon-user heading"></span> {{getInfoNumberOfUsers}} </h3>
|
||||
|
||||
<div id="user-contents">
|
||||
<div class="userlist ScrollableWindowY">
|
||||
{{#each getUsersInMeeting}}
|
||||
<div id="content">
|
||||
{{>userItem}}
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="{{id}}" {{visibility name}} class="component">
|
||||
<h3 class="title">
|
||||
{{getMeetingName}}
|
||||
<span class="closeUserlistIcon"><i class="ion-close-circled"></i></span>
|
||||
</h3>
|
||||
<div id="user-contents">
|
||||
<div class="userlist ScrollableWindowY">
|
||||
{{#each getUsersInMeeting}}
|
||||
<div id="content">
|
||||
{{>userItem}}
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -1,18 +1,14 @@
|
||||
<template name="whiteboard">
|
||||
<div id="{{id}}" {{visibility name}} class="component gradientBar">
|
||||
<h3 id="whiteboard-navbar" class="title">
|
||||
{{#if isMobileChromeOrFirefox}}
|
||||
{{> makeButton btn_class="fullscreenWhiteboardButton" i_class="glyphicon glyphicon-fullscreen"}}
|
||||
{{/if}}
|
||||
<span class="ion-easel heading"></span>
|
||||
{{title}}
|
||||
</h3>
|
||||
{{#each getCurrentSlide}}
|
||||
{{> slide}}
|
||||
{{/each}}
|
||||
<div id="whiteboard-container">
|
||||
<div id="whiteboard-paper">
|
||||
</div>
|
||||
</div>
|
||||
<div id="{{id}}" {{visibility name}} class="component gradientBar">
|
||||
<h3 id="whiteboard-navbar" class="title">
|
||||
<span class="ion-easel heading"></span>
|
||||
</h3>
|
||||
{{#each getCurrentSlide}}
|
||||
{{> slide}}
|
||||
{{/each}}
|
||||
<div id="whiteboard-container">
|
||||
<div id="whiteboard-paper">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
Loading…
Reference in New Issue
Block a user