mirror of
https://github.com/ENSL/ensl.org.git
synced 2024-12-26 20:41:01 +00:00
Added styling to movie pages
This commit is contained in:
Luke Barratt
parent
cf8f4e89af
commit
c471ccff22
8 changed files with 242 additions and 209 deletions
|
|
@ -44,3 +44,47 @@
|
||||||
margin-top: em(20);
|
margin-top: em(20);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
Movies List
|
||||||
|
*/
|
||||||
|
|
||||||
|
#movies {
|
||||||
|
|
||||||
|
.filters {
|
||||||
|
@include span-columns(12);
|
||||||
|
margin-bottom: em(20);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
table.movie {
|
||||||
|
|
||||||
|
.controls {
|
||||||
|
@include span-columns(12);
|
||||||
|
margin: em(20) 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.movie-full {
|
||||||
|
|
||||||
|
.title {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#player {
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 0px;
|
||||||
|
padding-bottom: 56%;
|
||||||
|
padding-top: 50px;
|
||||||
|
margin-bottom: em(20);
|
||||||
|
|
||||||
|
object {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,49 +1,50 @@
|
||||||
<div class="wide box">
|
<%= form_for @movie, html: { multipart: true, class: 'square' } do |f| %>
|
||||||
<%= form_for @movie, :html => { :multipart => true } do |f| %>
|
<%= render 'shared/errors', messages: @movie.errors.full_messages %>
|
||||||
<%= f.error_messages %>
|
|
||||||
|
|
||||||
<% if @movie.file %>
|
<% if @movie.file %>
|
||||||
<%= link_to "Go to file", edit_data_file_path(@movie.file) %>
|
<%= link_to "View File", edit_data_file_path(@movie.file), class: 'button tiny' %>
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<%= f.label :name %><br />
|
|
||||||
<%= f.text_field :name, {:value => @movie.file.to_s} %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :category_id %><br />
|
|
||||||
<%= f.select :category_id, Category.ordered.collect{|c| ["#{c.domains[c.domain]} - #{c}", c.id]} %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :content %><br />
|
|
||||||
<%= f.text_field :content %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :format %><br />
|
|
||||||
<%= f.text_field :format %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :length, "Length in seconds" %><br />
|
|
||||||
<%= f.text_field :length %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= link_to_function 'Author', "findUser('movie[user_name]')" %><br />
|
|
||||||
<%= f.text_field :user_name, {:value => @movie.get_user} %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :file %><br />
|
|
||||||
<%= f.select :file_id, DataFile.movies.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :preview_id %><br />
|
|
||||||
<%= f.select :preview_id, @movie.all_files.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.label :picture %><br />
|
|
||||||
<%= f.file_field :picture %>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<%= f.submit 'Save' %>
|
|
||||||
</p>
|
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :name %>
|
||||||
|
<%= f.text_field :name, { value: @movie.file.to_s } %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :category_id %>
|
||||||
|
<%= f.select :category_id, Category.ordered.collect { |c| ["#{c.domains[c.domain]} - #{c}", c.id] } %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :content %>
|
||||||
|
<%= f.text_field :content %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :format %>
|
||||||
|
<%= f.text_field :format %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :length, "Length in seconds" %>
|
||||||
|
<%= f.text_field :length %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :user_name, "Author" %>
|
||||||
|
<%= f.text_field :user_name, { value: @movie.get_user } %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :file %>
|
||||||
|
<div class="inputs">
|
||||||
|
<%= f.select :file_id, DataFile.movies.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :preview_id %>
|
||||||
|
<%= f.select :preview_id, @movie.all_files.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %>
|
||||||
|
</div>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= f.label :picture %>
|
||||||
|
<%= f.file_field :picture %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="controls">
|
||||||
|
<%= f.submit 'Save' %>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
|
|
||||||
|
|
@ -1,44 +1,34 @@
|
||||||
<div class="wide box sub">
|
<table class="movie">
|
||||||
<table id="movie">
|
<tr>
|
||||||
<tr>
|
<td>
|
||||||
<td>
|
<% if movie.picture %>
|
||||||
<br /> <br />
|
<%= image_tag movie.picture.url, :class => "centered" %>
|
||||||
<% if movie.picture %>
|
<% end %>
|
||||||
<%= image_tag movie.picture.url, :class => "centered" %>
|
</td>
|
||||||
<% end %>
|
|
||||||
</td>
|
|
||||||
|
|
||||||
<td>
|
<td>
|
||||||
<h3 class="center">
|
<h3 class="title"><%= namelink movie %></h3>
|
||||||
<%= namelink movie %>
|
<%= cascade movie, ["content", "format", ["Author", :user], "length_s", ["Views", "view_count"], ["Date", "file.created_at"]] %>
|
||||||
</h3>
|
|
||||||
|
|
||||||
<%= cascade movie, ["content", "format", ["Author", :user], "length_s", ["Views", "view_count"], ["Date", "file.created_at"]] %>
|
<% (params[:action] == "show" ? movie.all_files : [movie.file]).each do |file| %>
|
||||||
|
<b>File: </b> <%= link_to File.basename(file.name.to_s), file.url %>
|
||||||
<% (params[:action] == "show" ? movie.all_files : [movie.file]).each do |file| %>
|
|
||||||
<p>
|
|
||||||
<b>File: </b> <%= link_to File.basename(file.name.to_s), file.url %>
|
|
||||||
</p>
|
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
<b>MD5:</b> <%= file.md5_s %>
|
<strong>MD5:</strong> <%= file.md5_s %>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<b>Size:</b> <%= file.size_s %> MB
|
<strong>Size:</strong> <%= file.size_s %> MB
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
<% if cuser and movie.can_update? cuser %>
|
<% if cuser and movie.can_update? cuser %>
|
||||||
<p>
|
<div class="controls">
|
||||||
<%= link_to 'Edit', edit_movie_path(movie) %> |
|
<%= link_to 'Edit', edit_movie_path(movie), class: 'button tiny' %>
|
||||||
<%= link_to 'Make a Preview', :action => "preview", :id => movie %> |
|
<%= link_to 'Make a Preview', { action: "preview", id: movie }, class: 'button tiny' %>
|
||||||
<%= link_to 'Destroy', movie, :confirm => 'Are you sure?', :method => :delete %>
|
<%= link_to 'Destroy', movie, confirm: 'Are you sure?', method: :delete, class: 'button tiny' %>
|
||||||
</p>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<div class="clear">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
|
||||||
|
|
@ -1,60 +1,65 @@
|
||||||
<h1>Editing movie</h1>
|
<h1>Editing Movie</h1>
|
||||||
|
|
||||||
<%= render :partial => "form" %>
|
<%= render partial: 'form' %>
|
||||||
|
|
||||||
<div class="wide box">
|
<div class="preview">
|
||||||
<h3>
|
<h3>Make a Preview</h3>
|
||||||
Make a preview
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
This will produce a MP4-version preview of the file. It will take usually 3-4 times the movie length.
|
This will produce a MP4-version preview of the file. It will take usually 3-4 times the movie length.
|
||||||
The program will run in the background and the preview file will automatically added to the movie.
|
The program will run in the background and the preview file will automatically added to the movie.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<%= form_tag :action => "preview", :id => @movie.id do %>
|
<%= form_tag({ action: "preview", id: @movie.id }, { class: 'square' }) do %>
|
||||||
<p>
|
<div class="fields horizontal">
|
||||||
Resolution: <%= text_field_tag "x", "800", :size => 2 %> x <%= text_field_tag "y", "600", :size => 2 %>
|
<%= label_tag "Resolution" %>
|
||||||
</p>
|
<div class="inputs">
|
||||||
|
<%= text_field_tag "x", "800", size: 2 %> x <%= text_field_tag "y", "600", size: 2 %>
|
||||||
<p>
|
</div>
|
||||||
<%= submit_tag "Make a preview" %>
|
|
||||||
</p>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<br />
|
|
||||||
|
|
||||||
<h3>
|
|
||||||
Take a snapshot
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<%= form_tag :action => "snapshot", :id => @movie.id do %>
|
|
||||||
<p>
|
|
||||||
Secs: <%= text_field_tag "secs" %>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<%= submit_tag "Take snapshot" %>
|
|
||||||
</p>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<h3>
|
|
||||||
Download (stream)
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<%= form_tag :action => "download", :id => @movie.id do %>
|
|
||||||
<p>
|
|
||||||
This will start downloading the video from an IP and Port.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
IP: <%= text_field_tag "ip", "", :size => 12 %> : <%= text_field_tag "port", "", :size => 3 %>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<%= submit_tag "Download" %>
|
|
||||||
</p>
|
|
||||||
<% end %>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<%= link_to 'Show', @movie %> |
|
<div class="controls">
|
||||||
<%= link_to 'Back', movies_path %>
|
<%= submit_tag "Make a Preview" %>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="snapshot">
|
||||||
|
<h3>Take a Snapshot</h3>
|
||||||
|
|
||||||
|
<%= form_tag({ action: "snapshot", id: @movie.id }, { class: 'square' }) do %>
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= label_tag "Seconds" %>
|
||||||
|
<%= text_field_tag "secs" %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="controls">
|
||||||
|
<%= submit_tag "Take Snapshot" %>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="stream">
|
||||||
|
<h3>Download (Stream)</h3>
|
||||||
|
|
||||||
|
<%= form_tag({ action: "download", id: @movie.id }, { class: 'square' }) do %>
|
||||||
|
<p>This will start downloading the video from an IP and Port.</p>
|
||||||
|
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= label_tag "IP" %>
|
||||||
|
<%= text_field_tag "ip", "", size: 12 %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="fields horizontal">
|
||||||
|
<%= label_tag "Port" %>
|
||||||
|
<%= text_field_tag "port", "", size: 3 %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="controls">
|
||||||
|
<%= submit_tag "Download" %>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -1,48 +1,51 @@
|
||||||
<h1>
|
<div id="movies">
|
||||||
ENSL Movie Archive
|
<h1 class="title">Movie Archive</h1>
|
||||||
</h1>
|
<p>We recommend <%= link_to "VLC Player", "http://www.videolan.org/vlc/" %> for movie playback.</p>
|
||||||
|
|
||||||
<p>
|
<div class="filters">
|
||||||
We recommend <%= link_to "VLC Player", "http://www.videolan.org/vlc/" %> for movie playback.
|
<%= form_tag movies_url, method: "get" do %>
|
||||||
</p>
|
<div class="fields">
|
||||||
|
<%= select_tag :filter, options_for_select({"5 stars" => 5, "4 stars" => 4, "3 stars" => 3, "2 stars" => 2, "1 stars" => 1}) %>
|
||||||
|
</div>
|
||||||
|
|
||||||
<%= form_tag movies_url(), :method => "get" do %>
|
<div class="fields">
|
||||||
Limit to:
|
<%= select_tag :order, options_for_select({"Ratings" => :ratings, "Date" => :date, "Author" => :author}) %>
|
||||||
<%= select_tag :filter, options_for_select({"5 stars" => 5, "4 stars" => 4, "3 stars" => 3, "2 stars" => 2, "1 stars" => 1}) %>
|
</div>
|
||||||
Order by:
|
|
||||||
<%= select_tag :order, options_for_select({"Ratings" => :ratings, "Date" => :date, "Author" => :author}) %>
|
|
||||||
<%= submit_tag "Filter" %>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<br />
|
<div class="controls">
|
||||||
|
<%= submit_tag "Filter" %>
|
||||||
<div id="movieTabs">
|
|
||||||
<ul id="movieTabs-nav" class="tabs">
|
|
||||||
<% Category.domain(Category::DOMAIN_MOVIES).ordered.each do |cat| %>
|
|
||||||
<li>
|
|
||||||
<a href="#<%= cat.id %>"><%= cat %></a>
|
|
||||||
</li>
|
|
||||||
<% end %>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="box wide tabs">
|
|
||||||
<% Category.domain(Category::DOMAIN_MOVIES).each do |cat| %>
|
|
||||||
<div class="tab" id="<%= cat.id %>">
|
|
||||||
<div id="movieList">
|
|
||||||
<% @movies.each do |m| %>
|
|
||||||
<% next if m.category != cat %>
|
|
||||||
<%= render :partial => "movie", :object => m %>
|
|
||||||
<% end %>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="movie" class="tabbed">
|
||||||
|
<ul id="movie-nav" class="tabs">
|
||||||
|
<% Category.domain(Category::DOMAIN_MOVIES).ordered.each do |cat| %>
|
||||||
|
<li>
|
||||||
|
<a href="#<%= cat.id %>"><%= cat %></a>
|
||||||
|
</li>
|
||||||
|
<% end %>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="tabbed-contents">
|
||||||
|
<% Category.domain(Category::DOMAIN_MOVIES).each do |cat| %>
|
||||||
|
<div class="tab" id="<%= cat.id %>">
|
||||||
|
<% @movies.each do |m| %>
|
||||||
|
<% next if m.category != cat %>
|
||||||
|
<%= render partial: "movie", object: m %>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
new Yetii({
|
||||||
|
id: 'movie'
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<% if cuser and DataFile.new(directory_id: Directory::MOVIES).can_create? cuser %>
|
||||||
|
<%= link_to "New Movie", { controller: "data_files", action: "new", id: Directory::MOVIES }, { class: 'button' } %>
|
||||||
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
var tabber1 = new Yetii({id: 'movieTabs'});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<% if cuser and DataFile.new(:directory_id => Directory::MOVIES).can_create? cuser %>
|
|
||||||
<%= link_to "New Movie", :controller => "data_files", :action => "new", :id => Directory::MOVIES %>
|
|
||||||
<% end %>
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,3 @@
|
||||||
<h1>New movie</h1>
|
<h1>New Movie</h1>
|
||||||
|
|
||||||
<%= render :partial => "form" %>
|
<%= render partial: 'form' %>
|
||||||
|
|
||||||
<%= link_to 'Back', movies_path %>
|
|
||||||
|
|
|
||||||
|
|
@ -1,32 +1,26 @@
|
||||||
<div class="box">
|
<div class="movie-full">
|
||||||
<h2>
|
<h1 class="fancy">
|
||||||
<%= namelink @movie %>
|
<span><%= namelink @movie %></span>
|
||||||
</h2>
|
</h1>
|
||||||
<%= render :partial => "movie", :object => @movie %>
|
|
||||||
|
<%= render partial: "movie", object: @movie %>
|
||||||
|
|
||||||
<% if @movie.preview %>
|
<% if @movie.preview %>
|
||||||
<div class="nbox wide center">
|
<div class="player">
|
||||||
<%= javascript_include_tag 'flowplayer' %>
|
<%= javascript_include_tag 'flowplayer' %>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
flowplayer("player", "/flash/flowplayer-3.1.3.swf",
|
flowplayer("player", "/flash/flowplayer-3.1.3.swf", {
|
||||||
{
|
clip: {
|
||||||
clip:
|
autoPlay: false,
|
||||||
{
|
autoBuffering: false
|
||||||
autoPlay: false,
|
}
|
||||||
autoBuffering: false
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<a
|
|
||||||
href="<%= @movie.preview.url %>"
|
|
||||||
style="display:block;width:520px;height:330px"
|
|
||||||
id="player" class="centered">
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<p>
|
<a id="player" href="<%= @movie.preview.url %>"></a>
|
||||||
This is a low quality version. Please download better version from above. <br />
|
|
||||||
We recommend <%= link_to "VLC Player", "http://www.videolan.org/vlc/" %> for movie playback.
|
<p>This is a low quality version. Please download better version from above.</p>
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,5 @@
|
||||||
<h2>
|
<h2>Movies</h2>
|
||||||
Movies
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<div class="userData">
|
<div class="userData">
|
||||||
<%= render :partial => "movies/movie_user", :collection => @user.movies %>
|
<%= render partial: "movies/movie_user", collection: @user.movies %>
|
||||||
</div>
|
</div>
|
||||||
Loading…
Reference in a new issue