signup and room waiting

This commit is contained in:
Josh
2018-06-07 15:52:42 -04:00
parent 56489ee6cd
commit 657feb777f
18 changed files with 191 additions and 143 deletions

View File

@ -1,36 +1,14 @@
<div class="room-section pb-9">
<div class="container">
<div class="row pt-9">
<div class="col-lg-12 col-sm-12">
<h4 class="text-left">You have been invited to join</h4>
<h1 class="display-3 text-left mb-3 font-weight-400"><%= @room.name %></h1>
<hr class="mt-2 float-left" style="width: 20%;">
</div>
<%= render 'shared/room_event' do %>
<%= form_for room_path, method: :post do |f| %>
<div class="input-group" style="height: 60px;">
<% if current_user %>
<%= f.submit "Join", class: "btn btn-primary px-7 main-large join-button"%>
<% else %>
<%= f.text_field :join_name, class: "form-control main-large", placeholder: "Enter your name!" %>
<span class="input-group-append">
<%= f.submit "Join", class: "btn btn-primary px-7 main-large" %>
</span>
<% end %>
</div>
<div class="row">
<div class="col-lg-6 col-md-8 col-sm-12 form-inline mb-5 align-top">
<% if @room.owner.image.nil? %>
<span class="avatar"><%= @room.owner.name.first %></span>
<% else %>
<span class="avatar" style="background-image: url(<%= @room.owner.image %>)"></span>
<% end %>
<h5 class="font-weight-normal ml-4 mt-3"><%= @room.owner.name %> (Owner)</h5>
</div>
<div class="col-lg-6 col-md-4 col-sm-12">
<%= form_for room_path, method: :post do |f| %>
<div class="input-group" style="height: 60px;">
<% if current_user %>
<%= f.submit "Join", class: "btn btn-primary px-7 main-large btn-block"%>
<% else %>
<%= f.text_field :join_name, class: "form-control main-large", placeholder: "Enter your name!" %>
<span class="input-group-append">
<%= f.submit "Join", class: "btn btn-primary px-7 main-large" %>
</span>
<% end %>
</div>
<% end %>
</div>
</div>
</div>
</div>
<% end %>
<% end %>

View File

@ -1,7 +1,45 @@
<p>Waiting for meeting to start...</p>
<p>You will be redirected when the meeing starts...</p>
<%= render 'shared/room_event' do %>
<div class="row">
<div class="col-9">
<h3>Oops! The meeting hasn't started yet.</h3>
<h4 class="text-muted">You will automatically join when the meeting starts.</h4>
</div>
<div class="col-3">
<div class="loader align-bottom mt-3"></div>
</div>
</div>
<% end %>
<% unless current_user %>
<p>Input a name for when the meeting starts.</p>
<%= text_field(:unauthenticated_join_name, nil) %>
<% end %>
<script>
$(document).on("turbolinks:load", function(){
App.waiting = App.cable.subscriptions.create({
channel: "WaitingChannel",
uid: $(".room-section").attr("room")
}, {
received: function(data){
if(data.action = "started"){ request_to_join_meeting(); }
}
});
});
var join_attempts = 0;
var request_to_join_meeting = function(){
$.ajax({
url: window.location.pathname,
type: 'POST',
data: {
join_name: $(".room-section").attr("join-name")
},
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
},
error: function(){
// The meeting is still booting (going slowly), retry shortly.
if(join_attempts < 4){ setTimeout(request_to_join_meeting, 5000); }
join_attempts++;
}
});
}
</script>