invidious/src/views/watch.ecr

134 lines
4.2 KiB
Text
Raw Normal View History

2018-01-07 17:40:03 +00:00
<% content_for "header" do %>
2018-03-07 22:48:26 +00:00
<meta name="thumbnail" content="<%= thumbnail %>">
2018-02-07 00:52:01 +00:00
<link rel="stylesheet" href="http://vjs.zencdn.net/6.6.3/video-js.css">
<script src="http://vjs.zencdn.net/6.6.3/video.js"></script>
<script src="//cdn.sc.gl/videojs-hotkeys/latest/videojs.hotkeys.min.js"></script>
2018-01-28 02:10:08 +00:00
<title><%= video.title %> - Invidious</title>
2018-01-07 17:40:03 +00:00
<% end %>
2018-01-15 03:16:09 +00:00
2018-02-11 23:01:32 +00:00
<% if listen %>
<%= render "src/views/player/audio.ecr" %>
2018-01-16 20:02:35 +00:00
<% else %>
<%= render "src/views/player/video.ecr" %>
2018-01-16 20:02:35 +00:00
<% end %>
2018-01-16 19:58:08 +00:00
<script>
var options = {
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,
2018-02-06 00:36:16 +00:00
enableModifiersForNumbers: false,
enableVolumeScroll: false,
customKeys: {
play: {
key: function(e) {
// Toggle play with K Key
return (e.which === 75);
},
handler: function(player, options, e) {
if (player.paused()) {
player.play();
} else {
player.pause();
}
}
},
backward: {
key: function(e) {
// Go backward 5 seconds
return (e.which === 74);
},
handler: function(player, options, e) {
player.currentTime(player.currentTime() - 5);
}
},
forward: {
key: function(e) {
// Go forward 5 seconds
return (e.which === 76);
},
handler: function(player, options, e) {
player.currentTime(player.currentTime() + 5);
}
}
}
2018-01-16 19:58:08 +00:00
});
});
2018-03-03 21:06:14 +00:00
function toggle(target) {
body = target.parentNode.parentNode.children[1];
if (body.style.display === null || body.style.display === '') {
target.innerHTML = '[ + ]';
body.style.display = 'none';
} else {
target.innerHTML = '[ - ]';
body.style.display = '';
}
2018-03-03 21:06:14 +00:00
}
2018-01-16 19:58:08 +00:00
</script>
2018-01-16 02:30:57 +00:00
2018-01-16 19:58:08 +00:00
<h1>
<%= video.info["title"] %>
2018-02-11 23:01:32 +00:00
<% if listen %>
<a href="/watch?<%= env.params.query %>">
2018-02-11 23:01:32 +00:00
<i class="fa fa-video" aria-hidden="true"></i>
2018-01-16 19:58:08 +00:00
</a>
<% else %>
<a href="/watch?<%= env.params.query %>&listen=true">
2018-01-16 19:58:08 +00:00
<i class="fa fa-volume-up" aria-hidden="true"></i>
</a>
<% end %>
</h1>
2018-01-16 02:30:57 +00:00
2018-01-16 19:58:08 +00:00
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5">
<p><i class="fa fa-eye" aria-hidden="true"></i> <%= number_with_separator(video.views) %></p>
<p><i class="fa fa-thumbs-up" aria-hidden="true"></i> <%= number_with_separator(video.likes) %></p>
<p><i class="fa fa-thumbs-down" aria-hidden="true"></i> <%= number_with_separator(video.dislikes) %></p>
2018-01-28 02:10:08 +00:00
<p id="Wilson">Wilson Score : <%= video.wilson_score.round(4) %></p>
2018-01-16 19:58:08 +00:00
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div>
2018-01-16 02:30:57 +00:00
2018-01-16 19:58:08 +00:00
<div class="pure-u-1 pure-u-md-3-5">
<p>
<a href="https://youtube.com/channel/<%= video.info["ucid"] %>">
2018-01-16 19:58:08 +00:00
<h3><%= video.info["author"] %></h3>
</a>
</p>
2018-03-09 17:12:28 +00:00
<p>
<b>Shared <%= video.published.to_s("%B %-d, %Y") %></b>
</p>
2018-03-06 22:59:08 +00:00
<div style="margin-right:1em; overflow-wrap:break-word; word-wrap:break-word;">
2018-02-27 00:58:45 +00:00
<%= video.description %>
2018-02-06 01:08:20 +00:00
</div>
2018-03-03 21:06:14 +00:00
<hr style="margin-right:1em;">
2018-03-07 04:00:35 +00:00
<% if reddit_thread && !reddit_html.empty? %>
2018-03-06 22:59:08 +00:00
<div style="margin-right:1em; overflow-wrap:break-word; word-wrap:break-word;">
2018-03-03 21:06:14 +00:00
<h3><%= reddit_thread.data.title %></h3>
<b>
2018-03-09 16:47:50 +00:00
<a target="_blank" href="https://reddit.com<%= reddit_thread.data.permalink %>">View more comments on Reddit</a>
2018-03-03 21:06:14 +00:00
</b>
2018-03-07 04:00:35 +00:00
<%= reddit_html %>
2018-03-03 21:06:14 +00:00
</div>
<% end %>
2018-01-16 19:58:08 +00:00
</div>
2018-01-16 02:30:57 +00:00
2018-01-16 19:58:08 +00:00
<div class="pure-u-1 pure-u-md-1-5">
<% rvs.each do |rv| %>
2018-01-15 03:16:09 +00:00
<% if rv.has_key?("id") %>
<a href="/watch?v=<%= rv["id"] %>">
2018-02-06 00:44:42 +00:00
<img style="width:100%;" alt="thumbnail" src="<%= rv["iurlmq"] %>">
2018-02-27 02:59:18 +00:00
<p style="width:100%"><%= rv["title"] %></p>
<p><b style="width: 100%"><%= rv["author"] %></b></p>
2018-01-16 20:25:59 +00:00
</a>
2018-01-15 03:16:09 +00:00
<% end %>
2018-01-16 19:58:08 +00:00
<% end %>
2018-01-07 17:50:04 +00:00
</div>
2018-01-16 19:58:08 +00:00
</div>