Initial commit
This commit is contained in:
153
app/views/broadcasts/show.html.erb
Normal file
153
app/views/broadcasts/show.html.erb
Normal file
@@ -0,0 +1,153 @@
|
||||
<%= content_for :meta do %>
|
||||
<% if @project %>
|
||||
<meta name="project-id" content="<%= @project.id %>">
|
||||
<% end %>
|
||||
<% if @broadcast %>
|
||||
<meta name="broadcast-token" content="<%= @broadcast.token %>">
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% content_for :header do %>
|
||||
<header class="container-fluid py-3 border-bottom sticky-top bg-light">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col-4 text-center">
|
||||
<%= product_wordmark(:direct_me, class: 'navbar-brand') %>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<% end %>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-8 col-md-12 mb-3">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-header">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<h1 class="h3 m-0"><%= @broadcast.name %></h1>
|
||||
<div class="dropdown">
|
||||
<a class="btn btn-light border dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
Switch View
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
|
||||
<h5 class="dropdown-header">Live Streams</h5>
|
||||
<span class="dropdown-item active"><%= fa_icon("check", text: @broadcast.name.titleize) %></span>
|
||||
<% @multi_view_broadcasts.each do |broadcast| %>
|
||||
<% if broadcast.id != @broadcast.id %>
|
||||
<%= link_to broadcast.name.titleize, broadcast.url, class: class_string("dropdown-item", "active" => @broadcast.id == broadcast.id) %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<h5 class="dropdown-header">Previous Sessions</h5>
|
||||
<div id="broadcast_recordings_nav">
|
||||
<% if @recordings.any? %>
|
||||
<%= render partial: "broadcasts/broadcast_recording_nav", collection: @recordings, as: :broadcast_recording %>
|
||||
<% else %>
|
||||
<p class="dropdown-item text-muted">Recordings will appear here</p>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="embed-responsive embed-responsive-16by9">
|
||||
<%= render partial: 'broadcasts/video', locals: { broadcast: @broadcast } %>
|
||||
<% if @broadcast.streamer_recording? && @broadcast.active? %>
|
||||
<%= javascript_tag nonce: true do %>
|
||||
new Clappr.Player({
|
||||
parentId: '#broadcast_video',
|
||||
source: "<%= @broadcast.stream_playback_url %>",
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
mute: true,
|
||||
autoPlay: true,
|
||||
hlsMinimumDvrSize: 1
|
||||
});
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-12 mb-3">
|
||||
<div class="card shadow-sm mb-3">
|
||||
<div class="card-header">
|
||||
<ul class="nav nav-tabs card-header-tabs">
|
||||
<li class="nav-item">
|
||||
<a class="<%= class_string("nav-link", "active" => !params[:active_tab].present?) %>" href="#home" data-toggle="tab">Home</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="<%= class_string("nav-link", "active" => params[:active_tab] == "files") %>" href="#files" data-toggle="tab">Files</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="<%= class_string("nav-link", "active" => params[:active_tab] == "recordings") %>" href="#recordings" data-toggle="tab">Previous Sessions</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-body p-3">
|
||||
<div class="tab-content">
|
||||
<div class="<%= class_string("tab-pane fade show", "active" => !params[:active_tab].present?) %>" id="home">
|
||||
<div id="broadcast_updates">
|
||||
<%= render partial: 'broadcasts/broadcast_status', locals: { broadcast: @broadcast } %>
|
||||
</div>
|
||||
<% unless controller.class.module_parent.to_s == "Public" %>
|
||||
<hr>
|
||||
<div class="form-group">
|
||||
<label for="broadcast_share_url">To share the stream, copy the URL below. Anyone with the link can view the stream.</label>
|
||||
<div class="input-group">
|
||||
<% if @multi_view_broadcasts.present? %>
|
||||
<% tokens = @multi_view_broadcasts.map(&:token) %>
|
||||
<input type="text" class="form-control" value="<%= broadcast_url(@broadcast.token, multi_view_tokens: tokens) %>" readonly>
|
||||
<div class="input-group-append">
|
||||
<button type="button" id="broadcast_share_url" class="btn btn-success" data-behavior="clipboard" href="<%= broadcast_url(@broadcast.token, multi_view_tokens: tokens) %>">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
Copy URL
|
||||
</button>
|
||||
</div>
|
||||
<% else %>
|
||||
<input type="text" class="form-control" value="<%= broadcast_url(@broadcast.token) %>" readonly>
|
||||
<div class="input-group-append">
|
||||
<button type="button" id="broadcast_share_url" class="btn btn-success" data-behavior="clipboard" href="<%= broadcast_url(@broadcast.token) %>">
|
||||
<i class="fa fa-clipboard"></i>
|
||||
Copy URL
|
||||
</button>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<% end %>
|
||||
<p class="card-text">If you want to join the ZOOM meeting dedicated to this broadcast, follow the link below.</p>
|
||||
<%= link_to 'Video Conference', @conference_url, class: 'btn btn-primary btn-block', target: '_blank' %>
|
||||
</div>
|
||||
<div class="<%= class_string("tab-pane fade show", "active" => params[:active_tab] == 'files') %>" id="files">
|
||||
<div class="text-center pb-2" id="broadcast_file_form">
|
||||
<% if controller.class.module_parent.to_s == "Public" %>
|
||||
<%= render partial: "public/broadcasts/file_form", locals: { model: [@broadcast], token: @broadcast.token } %>
|
||||
<% else %>
|
||||
<%= render partial: "broadcasts/file_form", locals: { model: [@project, @broadcast] } %>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="overflow-auto mh-30">
|
||||
<ul class="list-unstyled d-flex flex-column align-items-center text-center" id="broadcast_file_list">
|
||||
<% if @files.present? %>
|
||||
<%= render partial: "broadcasts/file", collection: @files %>
|
||||
<% else %>
|
||||
<li class="my-3">
|
||||
Files will appear here.
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
<div class="d-flex mt-2 justify-content-center" id="broadcast_files_pagination">
|
||||
<%= will_paginate(@files, params: { active_tab: 'files' }) if @files.present? %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="<%= class_string("tab-pane fade show", "active" => params[:active_tab] == 'recordings') %>" id="recordings">
|
||||
<div id="broadcast_recordings">
|
||||
<%= render partial: 'broadcasts/broadcast_recordings', locals: { recordings: @recordings, broadcast: @broadcast } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
Reference in New Issue
Block a user