Add speed control

This commit is contained in:
Omar Roth 2018-01-15 20:30:57 -06:00
parent 38cff5a752
commit b21365248d
2 changed files with 25 additions and 11 deletions

View File

@ -124,6 +124,9 @@ end
get "/watch" do |env| get "/watch" do |env|
id = env.params.query["v"] id = env.params.query["v"]
listen = env.params.query["listen"]? || "false" listen = env.params.query["listen"]? || "false"
speed = env.params.query["speed"]? && env.params.query["speed"].to_f? ? env.params.query["speed"].to_f : 1
env.params.query.delete_all("listen")
begin begin
video = get_video(id) video = get_video(id)
@ -172,7 +175,6 @@ end
get "/search" do |env| get "/search" do |env|
query = env.params.query["q"] query = env.params.query["q"]
page = env.params.query["page"]? && env.params.query["page"].to_i? ? env.params.query["page"].to_i : 1 page = env.params.query["page"]? && env.params.query["page"].to_i? ? env.params.query["page"].to_i : 1
speed = env.params.query["speed"]? && env.params.query["speed"].to_i? ? env.params.query["speed"].to_i : 1
client = get_client client = get_client

View File

@ -2,7 +2,22 @@
<%= video.info["title"] + " - " %> <%= video.info["title"] + " - " %>
<% end %> <% end %>
<video style="width: 100%" poster="<%= player_response["videoDetails"]["thumbnail"]["thumbnails"][-1]["url"] %>" controls> <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>
<% if listen == "true" %> <% if listen == "true" %>
<% adaptive_fmts.each do |fmt| %> <% adaptive_fmts.each do |fmt| %>
<% url = fmt["url"] %> <% url = fmt["url"] %>
@ -17,18 +32,20 @@
<% end %> <% end %>
<% end %> <% end %>
</video> </video>
<h1> <h1>
<%= video.info["title"] %> <%= video.info["title"] %>
<% if listen == "true" %> <% if listen == "true" %>
<a class="link" href="/watch?v=<%= id %>"> <a class="link" href="/watch?<%= env.params.query %>">
<i class="fa fa-video-camera" aria-hidden="true"></i> <i class="fa fa-video-camera" aria-hidden="true"></i>
</a> </a>
<% else %> <% else %>
<a class="link" href="/watch?v=<%= id %>&listen=true"> <a class="link" href="/watch?<%= env.params.query %>&listen=true">
<i class="fa fa-volume-up" aria-hidden="true"></i> <i class="fa fa-volume-up" aria-hidden="true"></i>
</a> </a>
<% end %> <% end %>
</h1> </h1>
<div class="pure-g"> <div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5"> <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-eye" aria-hidden="true"></i> <%= views %></p>
@ -38,16 +55,12 @@
<p id="Rating">Rating : <%= rating.round(4) %> / 5</p> <p id="Rating">Rating : <%= rating.round(4) %> / 5</p>
<p id="Engagement">Engagement : <%= engagement.round(2) %>%</p> <p id="Engagement">Engagement : <%= engagement.round(2) %>%</p>
</div> </div>
<div class="pure-u-1 pure-u-md-3-5"> <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><a class="link" href="https://youtube.com/channel/<%= video.info["ucid"] %>"><%= video.info["author"] %></a></p>
<p id="Description"><%= description %></p> <p id="Description"><%= description %></p>
<% rvs.each do |rv| %>
<% rv.each do |value| %>
<p style="word-break: break-all"><%= value[0] %> => <%= value[1] %></p>
<% end %>
<br>
<% end %>
</div> </div>
<div class="pure-u-1 pure-u-md-1-5"> <div class="pure-u-1 pure-u-md-1-5">
<% rvs.each do |rv| %> <% rvs.each do |rv| %>
<% if rv.has_key?("id") %> <% if rv.has_key?("id") %>
@ -56,4 +69,3 @@
<% end %> <% end %>
</div> </div>
</div> </div>
</div>