Add video,js, Genesis 3:6

This commit is contained in:
Omar Roth 2018-01-16 13:58:08 -06:00
parent 9f63fcaa1e
commit 9e4d0bd3a5
5 changed files with 27177 additions and 49 deletions

View file

@ -9,6 +9,11 @@
<link rel="stylesheet" href="/css/grids-responsive-min.css">
<link rel="stylesheet" href="/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/custom.css">
<link rel="stylesheet" href="/css/video-js.css">
<script src="/js/video.js"></script>
<script src="/js/videojs.hotkeys.min.js"></script>
<title><%= yield_content "header" %>Invidious</title>
</head>

View file

@ -2,22 +2,7 @@
<%= video.info["title"] + " - " %>
<% end %>
<script>
function setRate(rate) {
var video = document.getElementById("player")
video.playbackRate = rate;
};
function toggle() {
var video = document.getElementById("player")
if (video.paused == true) {
video.play();
} else {
video.pause();
};
};
</script>
<video id="player" onclick="toggle()" onplay="setRate(<%= speed %>)" style="width: 100%" poster="<%= player_response["videoDetails"]["thumbnail"]["thumbnails"][-1]["url"] %>" controls>
<video id="player" class="video-js" data-setup="{}" style="width:100%" controls>
<% if listen == "true" %>
<% adaptive_fmts.each do |fmt| %>
<% url = fmt["url"] %>
@ -31,41 +16,61 @@ function toggle() {
<source src="<%= fmt["url"] %>" type="<%= fmt["type"].split(";")[0] %>">
<% end %>
<% end %>
</video>
</video>
<h1>
<%= video.info["title"] %>
<% if listen == "true" %>
<script>
var options = {
poster: "<%= player_response["videoDetails"]["thumbnail"]["thumbnails"][-1]["url"] %>",
aspectRatio: "16:9",
preload: "auto",
playbackRates: [0.5, 1, 1.5, 2]
};
var player = videojs('player', options, function() {
this.hotkeys({
volumeStep: 0.1,
seekStep: 5,
enableModifiersForNumbers: false
});
});
</script>
<h1>
<%= video.info["title"] %>
<% if listen == "true" %>
<a class="link" href="/watch?<%= env.params.query %>">
<i class="fa fa-video-camera" aria-hidden="true"></i>
</a>
<% else %>
<i class="fa fa-video-camera" aria-hidden="true"></i>
</a>
<% else %>
<a class="link" href="/watch?<%= env.params.query %>&listen=true">
<i class="fa fa-volume-up" aria-hidden="true"></i>
</a>
<% end %>
</h1>
<i class="fa fa-volume-up" aria-hidden="true"></i>
</a>
<% end %>
</h1>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5">
<p><i class="fa fa-eye" aria-hidden="true"></i> <%= views %></p>
<p><i class="fa fa-thumbs-up" aria-hidden="true"></i> <%= likes %></p>
<p><i class="fa fa-thumbs-down" aria-hidden="true"></i> <%= dislikes %></p>
<p id="Wilson">Wilson Score : <%= ci_lower_bound(likes, likes + dislikes).round(4) %></p>
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div>
<div class="pure-u-1 pure-u-md-3-5">
<p><a class="link" href="https://youtube.com/channel/<%= video.info["ucid"] %>"><%= video.info["author"] %></a></p>
<p id="Description"><%= description %></p>
</div>
<div class="pure-u-1 pure-u-md-1-5">
<% rvs.each do |rv| %>
<% if rv.has_key?("id") %>
<p><a class="link" href="/watch?v=<%= rv["id"] %>"><%= rv["title"] %></a></p>
<% end %>
<% end %>
</div>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5">
<p><i class="fa fa-eye" aria-hidden="true"></i> <%= views %></p>
<p><i class="fa fa-thumbs-up" aria-hidden="true"></i> <%= likes %></p>
<p><i class="fa fa-thumbs-down" aria-hidden="true"></i> <%= dislikes %></p>
<p id="Wilson">Wilson Score : <%= ci_lower_bound(likes, likes + dislikes).round(4) %></p>
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div>
<div class="pure-u-1 pure-u-md-3-5">
<p>
<a class="link" href="https://youtube.com/channel/<%= video.info["ucid"] %>">
<h3><%= video.info["author"] %></h3>
</a>
</p>
<%= description %>
</div>
<div class="pure-u-1 pure-u-md-1-5">
<% rvs.each do |rv| %>
<% if rv.has_key?("id") %>
<p><a class="link" href="/watch?v=<%= rv["id"] %>"><%= rv["title"] %></a></p>
<% end %>
<% end %>
</div>
</div>