dani/vroom
1
0
Fork 0
mirror of https://github.com/dani/vroom.git synced 2024-07-02 12:13:12 +02:00
Code Issues Projects Releases Wiki Activity
06f7ec3e1e
vroom/templates/default/join.html.ep
Daniel Berteaud 06f7ec3e1e Measure latency between peers and add feedback 
Previews will be grey when latency is unknown (not measured yet), green when it's good (60ms or less), blue when medium (between 60 and 120), orange when it's becoming high (between 120 and 250) and red when latency is too high to have a good call (250ms or more)
To reduce confusion, slected preview will now have a reduced opacity instead of the red border
Fix #66
2014-06-10 23:02:10 +02:00

805 lines
37 KiB
Plaintext
Raw Blame History

% title sprintf l('ROOM_s'), $room;
%= include 'header'
<div class="container-fluid">
<nav id="toolbar" class="navbar navbar-default" role="toolbar">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#roomToolBar">
<span class="sr-only"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<input id="roomName" name="roomName" type="hidden" value="<%= $room %>"/>
<div id="roomToolBar" class="collapse navbar-collapse">
<div class="navbar-form navbar-left input-group">
<div class="input-group">
<input type="text" id="displayName" class="form-control help" placeholder="<%=l 'YOUR_NAME' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'NAME_SENT_TO_OTHERS' %>"/>
<span class="input-group-btn">
<button id="changeColorButton" class="btn btn-default help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CHANGE_COLOR' %>">
<span class="glyphicon glyphicon-tag">
</span>
</button>
</span>
</div>
</div>
<div class="btn-group navbar-form navbar-left">
<button id="chatDropdown" class="btn btn-default collapsed help" data-toggle="collapse" data-target="#chatMenu" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CLICK_TO_CHAT' %>">
<span class="glyphicon glyphicon-comment">
</span>
<span class="badge" id="unreadMsg">
0
</span>
</button>
</div>
<div class="btn-group navbar-form navbar-left" data-toggle="buttons">
<label class="btn btn-default help" id="muteMicLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'MUTE_MIC' %>">
<input type="checkbox" id="muteMicButton">
<span class="glyphicon glyphicon-volume-off">
</span>
</label>
<label class="btn btn-default help" id="suspendCamLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SUSPEND_CAM' %>">
<input type="checkbox" id="suspendCamButton">
<span class="glyphicon glyphicon-eye-close">
</span>
</label>
<label class="btn btn-default help aloneEl" id="pauseMohLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PAUSE_MOH' %>">
<input type="checkbox" id="pauseMohButton">
<span class="glyphicon glyphicon-music">
</span>
</label>
<label class="btn btn-default help" id="shareScreenLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SHARE_YOUR_SCREEN' %>">
<input type="checkbox" id="shareScreenButton">
<span class="glyphicon glyphicon-expand">
</span>
</label>
</div>
<div class="btn-group navbar-form navbar-left">
<div class="btn-group dropdown ownerEl">
<button class="btn btn-default dropdown-toggle help" type="button" id="inviteMenuButton" data-toggle="dropdown" data-toggle="tooltip" data-placement="bottom" title="<%=l 'INVITE_PEOPLE' %>">
<span class="glyphicon glyphicon-user"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="inviteMenuButton" id="inviteMenu">
<li>
<center>
<p><%=l 'TO_INVITE_SHARE_THIS_URL' %></p>
<% my $url = $self->url_for('/')->to_abs;
$url .= ($url =~ m/\/$/) ? '':'/';
%>
<h4><a href="javascript:void(0)" onclick="inviteUrlPopup();"><%= $url . $room %></a></h4>
</center>
</li>
<li class="divider"></li>
<li>
<form class="navbar-form" id="inviteEmail" action="" method="post">
<center>
<p><%=l 'YOU_CAN_INVITE_BY_MAIL' %></p>
</center>
<div class="input-group">
<input type="email" id="recipient" class="form-control help" placeholder="<%=l 'EMAIL_PLACEHOLDER' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SEND_INVITE' %>"/>
<span class="input-group-btn">
<button id="inviteEmailButton" type="submit" class="btn btn-default help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SEND_INVITE' %>">
<span class="glyphicon glyphicon-send">
</span>
</button>
</span>
</div>
<div class="input-group">
<textarea id="message" name="message" class="form-control help" placeholder="<%=l 'MESSAGE' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SEND_CUSTOM_MESSAGE' %>"></textarea>
<span class="input-group-addon">
<span class="glyphicon glyphicon-envelope">
</span>
</span>
</div>
</form>
</li>
</ul>
</div>
<div class="btn-group dropdown ownerEl threePeersEl">
<button class="btn btn-default dropdown-toggle help" type="button" id="groupActionsButton" data-toggle="dropdown" data-toggle="tooltip" data-placement="bottom" title="<%=l 'GROUP_ACTIONS' %>">
<span class="glyphicon glyphicon-flag"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="groupActionsButton" id="confMenu">
<li>
<center>
<div class="navbar-form">
<div class="btn-group" data-toggle="buttons">
<button type="button" class="btn btn-default help" id="muteEveryoneButton" data-toggle="tooltip" data-placement="bottom" title="<%=l 'MUTE_EVERYONE' %>">
<span class="glyphicon glyphicon-volume-off">
</span>
</button>
<button type="button" class="btn btn-default help" id="unmuteEveryoneButton" data-toggle="tooltip" data-placement="bottom" title="<%=l 'UNMUTE_EVERYONE' %>">
<span class="glyphicon glyphicon-volume-up">
</span>
</buton>
<button type="button" class="btn btn-default help" id="suspendEveryoneButton" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SUSPEND_EVERYONE' %>">
<span class="glyphicon glyphicon-eye-close">
</span>
</button>
<button type="button" class="btn btn-default help" id="resumeEveryoneButton" data-toggle="tooltip" data-placement="bottom" title="<%=l 'RESUME_EVERYONE' %>">
<span class="glyphicon glyphicon-eye-open">
</span>
</button>
</div>
</div>
</center>
</li>
</ul>
</div>
<div class="btn-group dropdown ownerEl">
<button class="btn btn-default dropdown-toggle help" type="button" id="confMenuButton" data-toggle="dropdown" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CONFIGURE' %>">
<span class="glyphicon glyphicon-wrench"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="confMenuButton" id="confMenu">
<li>
<center>
<div class="navbar-form">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-default help" id="lockLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PREVENT_TO_JOIN' %>">
<input type="checkbox" id="lockButton">
<span class="glyphicon glyphicon-ban-circle">
</span>
</label>
<label class="btn btn-default help" id="joinPassLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PASSWORD_PROTECT' %>">
<input type="checkbox" id="joinPassButton">
<span class="glyphicon glyphicon-lock">
</span>
</label>
<label class="btn btn-default help" id="persistentLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'MAKE_THIS_ROOM_PERSISTENT' %>">
<input type="checkbox" id="persistentButton">
<span class="glyphicon glyphicon-pushpin">
</span>
</label>
<label class="btn btn-default help" id="askForNameLabel" data-toggle="tooltip" data-placement="bottom" title="<%=l 'FORCE_DISPLAY_NAME' %>">
<input type="checkbox" id="askForNameButton">
<span class="glyphicon glyphicon-leaf">
</span>
</label>
</div>
</div>
</center>
</li>
<li class="divider">
</li>
<li>
<center>
<p><%=l 'NOTIFICATION_ON_JOIN' %></p>
</center>
<ul class="list-inline" id="emailNotificationList">
</ul>
<form class="navbar-form" id="newEmailNotificationForm">
<div class="input-group">
<input type="email" id="newEmailNotification" class="form-control help" placeholder="<%=l 'EMAIL_PLACEHOLDER' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'ADD_NOTIFICATION' %>"/>
<span class="input-group-btn">
<button id="newEmailNotificationButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'ADD_THIS_ADDRESS' %>">
<span class="glyphicon glyphicon-ok">
</span>
</button>
</span>
</div>
</form>
</li>
</ul>
</div>
</div>
<div class="btn-group navbar-form navbar-left">
<button class="btn btn-default dropdown-toggle help unauthEl" type="button" id="authMenuButton" data-toggle="dropdown" data-toggle="tooltip" data-placement="bottom" title="<%=l 'AUTHENTICATE' %>">
<span class="glyphicon glyphicon-log-in"></span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="authMenuButton" id="authMenu">
<li>
<form class="navbar-form" id="authForm">
<center>
<p><%=l 'AUTH_TO_MANAGE_THE_ROOM' %></p>
</center>
<div class="input-group">
<input type="password" id="authPass" class="form-control help" placeholder="<%=l 'PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'AUTHENTICATE' %>"/>
<span class="input-group-btn">
<button id="authPassButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'AUTHENTICATE' %>">
<span class="glyphicon glyphicon-ok">
</span>
</button>
</span>
</div>
</form>
</li>
</ul>
</div>
<div class="navbar-form navbar-right" data-toggle="buttons" >
<div class="btn-group">
<button id="helpButton" class="btn btn-default help" data-toggle="modal" data-target="#helpModal" rel="tooltip" data-placement="bottom" title="<%=l 'HELP' %>">
<span class="glyphicon glyphicon-question-sign">
</span>
</button>
<div id="timeCounter" class="btn btn-default disabled"></div>
<button class="btn btn-default help" id="logoutButton" data-toggle="tooltip" data-placement="bottom" title="<%=l 'LOGOUT' %>">
<span class="glyphicon glyphicon-log-out">
</span>
</button>
</div>
</div>
</div>
</nav>
<div class="modal fade" role="dialog" id="helpModal" aria-labelledby="helpModal" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title"><%=l 'HELP' %></h4>
</div>
<div class="modal-body">
<div class="list-group">
<div class="list-group-item row">
<div class="col-md-3">
<center>
<input type="text" class="form-control" placeholder="<%=l 'YOUR_NAME' %>">
</center>
</div>
<div class="col-md-9">
<%=l 'HELP_SET_DISPLAY_NAME' %>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-tag"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_CHANGE_COLOR_BUTTON' %>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-comment"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_CHAT_BUTTON' %>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-volume-off"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_MUTE_BUTTON' %>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-eye-close"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_SUSPEND_CAM_BUTTON' %>
</div>
</div>
<div class="list-group-item row aloneEl">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-music"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_MOH_BUTTON' %>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-expand"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_SHARE_SCREEN_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-1">
<center>
<a data-toggle="collapse" href="#helpInviteMenuCollapse" class="btn btn-default">
<span class="glyphicon glyphicon-user"></span>
<span class="caret"></span>
</a>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_INVITE_MENU' %>
</div>
</div>
<div id="helpInviteMenuCollapse" class="collapse">
<div class="list-group-item row ownerEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-send"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_EMAIL_INVITE_BUTTON' %>
</div>
</div>
</div>
<div class="list-group-item row ownerEl threePeersEl">
<div class="col-md-1">
<center>
<a data-toggle="collapse" href="#helpGroupActionsMenuCollapse" class="btn btn-default">
<span class="glyphicon glyphicon-flag"></span>
<span class="caret"></span>
</a>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_GROUP_ACTIONS' %>
</div>
</div>
<div id="helpGroupActionsMenuCollapse" class="collapse">
<div class="list-group-item row ownerEl threePeersEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-volume-off"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_MUTE_EVERYONE_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl threePeersEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-volume-up"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_UNMUTE_EVERYONE_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl threePeersEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-eye-close"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_SUSPEND_EVERYONE_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl threePeersEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-eye-open"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_RESUME_EVERYONE_BUTTON' %>
</div>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-1">
<center>
<a data-toggle="collapse" href="#helpConfMenuCollapse" class="btn btn-default">
<span class="glyphicon glyphicon-wrench"></span>
<span class="caret"></span>
</a>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_CONF_MENU' %>
</div>
</div>
<div id="helpConfMenuCollapse" class="collapse">
<div class="list-group-item row ownerEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-ban-circle"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_LOCK_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-lock"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_PASSWORD_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-pushpin"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_PERSISTENT_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-1 col-md-offset-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-leaf"></span>
</div>
</center>
</div>
<div class="col-md-10">
<%=l 'HELP_ASK_FOR_NAME_BUTTON' %>
</div>
</div>
</div>
<div class="list-group-item row">
<div class="col-md-1">
<center>
<div class="btn btn-default">
<span class="glyphicon glyphicon-log-out"></span>
</div>
</center>
</div>
<div class="col-md-11">
<%=l 'HELP_LOGOUT_BUTTON' %>
</div>
</div>
<div class="list-group-item row ownerEl">
<div class="col-md-3">
<center>
<div class="btn-group">
<div class="btn btn-sm btn-default">
<span class="glyphicon glyphicon-volume-off"></span>
</div>
<div class="btn btn-sm btn-default">
<span class="glyphicon glyphicon-eye-close"></span>
</div>
<div class="btn btn-sm btn-default">
<span class="glyphicon glyphicon-certificate"></span>
</div>
<div class="btn btn-sm btn-default">
<span class="glyphicon glyphicon-remove-circle"></span>
</div>
</center>
</div>
<div class="col-md-9">
<%=l 'HELP_PEER_ACTIONS_BUTTONS' %>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="setDisplayName" aria-labelledby="setDisplayName" aria-hidden="true" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="setDisplayNameTitle"><%=l 'DISPLAY_NAME_REQUIRED' %></h4>
</div>
<div class="modal-body">
<form role="form" class="well" id="displayNamePreForm">
<label for="displayNamePre"><%=l 'SET_A_DISPLAY_NAME' %></label>
<div class="input-group">
<input type="text" class="form-control" id="displayNamePre" name="displayNamePre" placeholder="<%=l 'YOUR_NAME' %>">
<span class="input-group-btn">
<button type="submit" id="displayNamePreButton" class="btn btn-default disabled">
<span class="glyphicon glyphicon-log-in"></span>
</button>
</span>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="chromeExtMessage" aria-labelledby="chromeExtMessage" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="chromeExtMessageTitle"><%=l 'EXTENSION_REQUIRED' %></h4>
</div>
<div clas="modal-body">
<p>
<%=l 'VROOM_CHROME_EXTENSION' %>
</p>
<p>
<a class="btn btn-default btn-lg" href="https://chrome.google.com/webstore/detail/<%= $config->{chromeExtensionId} %>" target="_blank">
<span class="glyphicon glyphicon-download-alt">
</span>
</a>
</p>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="noWebrtcSupport" aria-labelledby="noWebrtcSupport" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="noWebrtcSupportTitle"><%=l 'BROWSER_NOT_SUPPORTED' %></h4>
</div>
<div class="modal-body">
<p><%=l 'NO_WEBRTC_SUPPORT' %></p>
<% if ($ua !~ m/iphone|ipad|ipod/i){ %>
<p><%=l 'DOWNLOAD_ONE_OF_THESE_BROWSERS' %></p>
<div class="row">
<%
my $ffurl = "http://www.mozilla.org/firefox/";
my $churl = "http://www.google.com/chrome/";
my $opurl = "http://www.opera.com";
if ($ua =~ m/android/i){
$ffurl = "https://play.google.com/store/apps/details?id=org.mozilla.firefox";
$churl = "https://play.google.com/store/apps/details?id=com.android.chrome";
$opurl = "https://play.google.com/store/apps/details?id=com.opera.browser";
}
%>
<div class="col-xs-4">
<a href="<%= $ffurl %>" target="_blank">
<center>
<img class="img-responsive" src="<%= $self->get_url('/') %>img/firefox.png" alt="Mozilla Firefox"/>
</center>
</a>
</div>
<div class="col-xs-4">
<a href="<%= $churl %>" target="_blank">
<center>
<img class="img-responsive" src="<%= $self->get_url('/') %>img/chrome.png" alt="Google Chrome"/>
</center>
</a>
</div>
<div class="col-xs-4">
<a href="<%= $opurl %>" target="_blank">
<center>
<img class="img-responsive" src="<%= $self->get_url('/') %>img/opera.png" alt="Opera"/>
</center>
</a>
</div>
</div>
<% } %>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="noWebcam" aria-labelledby="noWebcam" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="noWebcamTitle"><%=l 'NO_WEBCAM' %></h4>
</div>
<div class="modal-body">
<p><%=l 'CANT_ACCESS_WEBCAM' %></p>
<center>
<img src="<%= $self->get_url('/') %>img/webcam.png" alt="Webcam"/>
<br>
<p>
<%=l 'CLICK_IF_NO_WEBCAM' %>
</p>
<p>
<a class="btn btn-default btn-lg" href="<%= $self->get_url('/') . $room %>?video=false">
<span class="glyphicon glyphicon-headphones">
</span>
</a>
</p>
</center>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="persistentModal" aria-labelledby="persistentModal" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="persistentTitle"><%=l 'MAKE_THIS_ROOM_PERSISTENT' %></h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form" id="persistentForm">
<p>
<%=l 'SET_OWNER_PASS_PERSISTENT' %>
<ul>
<li><%= sprintf($self->l('A_STANDARD_ROOM_EXPIRES_AFTER_d'), int($config->{inactivityTimeout}/3600)) %></li>
<li>
<%=l 'A_PERSISTENT_ROOM' %>
<% if ($config->{persistentInactivityTimeout} > 0){ %>
<%= sprintf($self->l('EXPIRE_AFTER_d'), int($config->{persistentInactivityTimeout}/(3600*24))) %>
<% } else{ %>
<%=l 'WILL NEVER_EXPIRE' %>
<% } %>
</li>
</ul>
</p>
<div class="form-group">
<label for="ownerPass" class="col-sm-4 control-label">
<%=l 'PASSWORD' %>
</label>
<div class="col-sm-8">
<input type="password" id="ownerPass" class="form-control help" placeholder="<%=l 'PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PASSWORD' %>"/>
</div>
</div>
<div class="form-group">
<label for="ownerPassConfirm" class="col-sm-4 control-label">
<%=l 'CONFIRM_PASSWORD' %>
</label>
<div class="col-sm-8">
<input type="password" id="ownerPassConfirm" class="form-control help" placeholder="<%=l 'CONFIRM_PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CONFIRM_PASSWORD' %>"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-4 col-sm-8">
<button id="setOwnerPassButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SUBMIT' %>"><%=l 'SUBMIT' %></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" role="dialog" id="joinPassModal" aria-labelledby="joinPassModal" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="joinPassTitle"><%=l 'PASSWORD_PROTECT' %></h4>
</div>
<div class="modal-body">
<form class="form-horizontal" role="form" id="joinPassForm">
<p>
<%=l 'PROTECT_ROOM_WITH_PASSWORD' %>
</p>
<div class="form-group">
<label for="joinPass" class="col-sm-4 control-label">
<%=l 'PASSWORD' %>
</label>
<div class="col-sm-8">
<input type="password" id="joinPass" class="form-control help" placeholder="<%=l 'PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'PASSWORD' %>"/>
</div>
</div>
<div class="form-group">
<label for="joinPassConfirm" class="col-sm-4 control-label">
<%=l 'CONFIRM_PASSWORD' %>
</label>
<div class="col-sm-8">
<input type="password" id="joinPassConfirm" class="form-control help" placeholder="<%=l 'CONFIRM_PASSWORD' %>" data-toggle="tooltip" data-placement="bottom" title="<%=l 'CONFIRM_PASSWORD' %>"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-4 col-sm-8">
<button id="setJoinPassButton" type="submit" class="btn btn-default help disabled" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SUBMIT' %>"><%=l 'SUBMIT' %></button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="frame">
<div id="chatMenu" class="nav-collapse collapse">
<div id="chatHistory" class="form-control">
</div>
<form role="form" id="chatForm">
<div class="input-group">
<textarea class="form-control" id="chatBox" form_id="chatForm" placeholder="<%=l 'SET_YOUR_NAME_TO_CHAT' %>" rows=1 disabled></textarea>
<span class="input-group-btn">
<button type="submit" id="sendChat" class="btn btn-default help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SEND_MESSAGE' %>">
<span class="glyphicon glyphicon-share-alt">
</span>
</button>
<button type="button" id="saveChat" class="btn btn-default help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'SAVE_HISTORY' %>">
<span class="glyphicon glyphicon-floppy-save">
</span>
</button>
</span>
</div>
</form>
</div>
<audio id="mohPlayer" src="<%= $self->get_url('/') %>snd/moh/<%= $moh %>" loop></audio>
<div id="view" class="view row-fluid">
<div id="webRTCVideo" class="col-xs-12 col-sm-4">
<div class="col-xs-6 col-sm-12 col-lg-6 previewContainer" id="videoLocalContainer">
<video id="webRTCVideoLocal" class="webRTCVideo latencyUnknown" muted oncontextmenu="return false;">
</video>
<div id="localVolume" class="volumeBar">
</div>
<div id="name_local" class="displayName">
</div>
</div>
</div>
<div id="mainView" class="col-sm-8 hidden-xs">
<div id="mainVideo">
</div>
<div id="aloneMsg" class="aloneEl">
<center>
<h2>
<%=l 'ALONE_IN_ROOM' %>
</h2>
</center>
</div>
</div>
</div>
</div>
%= include 'js_common'
%= include 'js_room'
<script>
var roomName = '<%= $room %>';
$( document ).ready(function() {
setTimeout(function(){
<% if ($video eq 'false'){ %>
videoConstraints = false;
<% } else{ %>
videoConstraints = {
mandatory: {
maxFrameRate: 15,
}
};
<% } %>
webrtc = new SimpleWebRTC({
url: "<%= $config->{signalingServer} %>",
peerConnectionConfig: {
iceServers: [
{"url":"stun:<%= $config->{stunServer} %>"},
<%== ($config->{turnServer} && $config->{turnServer} ne '') ? "{\"url\":\"turn:$config->{turnServer}\", \"username\":\"$room\", \"credential\":\"$turnPassword\"}":'' %>
]
},
localVideoEl: 'webRTCVideoLocal',
autoRequestMedia: true,
enableDataChannels: true,
debug: false,
detectSpeakingEvents: true,
adjustPeerVolume: false,
autoAdjustMic: false,
harkOptions: {
interval: 300,
threshold: -20
},
media: {
video: videoConstraints,
audio: true
}
});
initVroom(roomName);
}, 300);
});
</script>
</div>
%= include 'footer'
Reference in New Issue View Git Blame Copy Permalink