Video conf based on SimpleWebRTC https://vroom.fws.fr/documentation
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

184 lines
7.4 KiB

% title $self->l('WELCOME');
%= include 'header'
%= include 'public_toolbar'
<div class="container-fluid">
%= include 'noscript'
<div class="well publicForm">
<h1>
<center>
<%=l 'CREATE_ROOM' %>
</center>
</h1>
<form id="createRoom" class="form-horizontal" action="<%= $self->get_url('/create') %>" method="post">
<fieldset>
<div class="input-group input-group-lg">
<span class="input-group-addon hidden-xs">
<strong class="text-muted">
<%
my $url = $self->url_for('/')->to_abs;
$url =~ s/^https?:\/\///;
$url .= ($url =~ m/\/$/)? '':'/';
%>
<%= $url %>
</strong>
</span>
<div class="control-group">
<input id="roomName" name="roomName" type="text" placeholder="<%=l 'ROOM_NAME' %>" class="form-control input-lg help" data-toggle="tooltip" data-placement="bottom" title="<%=l 'RANDOM_IF_EMPTY' %>" autofocus>
</div>
<span class="input-group-btn">
<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-log-in"></span></button>
</span>
</div>
</fieldset>
</form>
</div>
<div class="modal fade" role="dialog" id="conflictModal" aria-labelledby="conflictModal" aria-hidden="true">
<div class="modal-dialog">
<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 'THIS_ROOM_ALREADY_EXISTS' %></h4>
</div>
<div class="modal-body">
<div class="panel" id="confirmJoinForm">
<label><%=l 'CONFIRM_OR_CHOOSE_ANOTHER_NAME' %></label>
<div class="btn-group btn-group-justified">
<div class="btn-group">
<button class="btn btn-primary" id="confirmJoinButton"><%=l 'JOIN_THIS_ROOM' %></button>
</div>
<div class="btn-group">
<button class="btn btn-default" id="chooseAnotherNameButton"><%=l 'CHOOSE_ANOTHER_NAME' %></button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<br/><br/>
<div class="row">
<div id="carouselIndexContainer" class="col-md-8 col-md-offset-2 col-xl-6 col-xl-offset-3 thumbnail">
<div id="carouselIndex" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators carouselIndexIndicator">
<li data-target="#carouselIndex" data-slide-to="0" class="active"></li>
<li data-target="#carouselIndex" data-slide-to="1"></li>
<li data-target="#carouselIndex" data-slide-to="2"></li>
<li data-target="#carouselIndex" data-slide-to="3"></li>
<li data-target="#carouselIndex" data-slide-to="4"></li>
<li data-target="#carouselIndex" data-slide-to="5"></li>
<li data-target="#carouselIndex" data-slide-to="6"></li>
<% if ($etherpad eq 'true'){ %>
<li data-target="#carouselIndex" data-slide-to="7"></li>
<% } %>
</ol>
<div id="carouselIndexContent" class="carousel-inner">
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/lock.png" alt="<%=l 'SECURE' %>">
<p>
<%=l 'P2P_COMMUNICATION' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'SECURE' %>
</h2>
</div>
</div>
<div class="item active carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/universal.png" alt="<%=l 'WORKS_EVERYWHERE' %>">
<p>
<%=l 'MODERN_BROWSERS' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'WORKS_EVERYWHERE' %>
</h2>
</div>
</div>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/share.png" alt="<%=l 'MULTI_USER' %>">
<p>
<%=l 'THE_LIMIT_IS_YOUR_PIPE' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'MULTI_USER' %>
</h2>
</div>
</div>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/signin.png" alt="<%=l 'NO_SIGNIN' %>">
<p>
<%=l 'YOU_DONT_HAVE_TO_REGISTER' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'NO_SIGNIN' %>
</h2>
</div>
</div>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/clock.png" alt="<%=l 'QUICK' %>">
<p>
<%=l 'STOP_WASTING_TIME' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'QUICK' %>
</h2>
</div>
</div>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/screen.png" alt="<%=l 'SCREEN_SHARING' %>">
<p>
<%=l 'SHARE_DESKTOP_OR_WINDOW' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'SCREEN_SHARING' %>
</h2>
</div>
</div>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/chat.png" alt="<%=l 'TEXT_CHAT' %>">
<p>
<%=l 'SECURED_TEXT_CHAT' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'TEXT_CHAT' %>
</h2>
</div>
</div>
<% if ($etherpad eq 'true') { %>
<div class="item carouselIndexItem col-xs-10 col-xs-offset-1">
<img class="img-responsive carouselLogo" src="<%= $self->get_url('/') %>img/note.png" alt="<%=l 'COLLABORATIVE_NOTETAKING' %>">
<p>
<%=l 'TAKE_NOTE_IN_REALTIME' %>
</p>
<div class="carousel-caption hidden-xs carouselIndexCaption">
<h2>
<%=l 'COLLABORATIVE_NOTETAKING' %>
</h2>
</div>
</div>
<% } %>
</div>
<a class="left carousel-control" href="#carouselIndex" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carouselIndex" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>
</div>
%= include 'js_common'
<script>
$(document).ready(function() {
initIndex();
});
</script>
%= include 'footer'