Add ability to mark videos as watched in subscription feed

This commit is contained in:
Omar Roth 2018-11-19 22:06:59 -06:00
parent c7e8d623c0
commit 6b12f11e10
8 changed files with 206 additions and 25 deletions

View File

@ -55,6 +55,19 @@ img.thumbnail {
bottom: -0.5em;
}
.watched {
z-index: 100;
position: absolute;
background-color: rgba(35, 35, 35, 0.75);
color: #fff;
border-radius: 2px;
padding: 4px 8px 4px 8px;
font-size: 25px;
font-family: sans-serif;
left: 0.25em;
top: -0.75em;
}
/*
* Navbar
*/

View File

@ -246,12 +246,10 @@ get "/watch" do |env|
user = env.get? "user"
if user
user = user.as(User)
if !user.watched.includes? id
PG_DB.exec("UPDATE users SET watched = watched || $1 WHERE id = $2", [id], user.id)
end
preferences = user.preferences
subscriptions = user.subscriptions
watched = user.watched
end
subscriptions ||= [] of String
@ -268,6 +266,10 @@ get "/watch" do |env|
next templated "error"
end
if watched && !watched.includes? id
PG_DB.exec("UPDATE users SET watched = watched || $1 WHERE $2 = id", [id], user.as(User).id)
end
if nojs
if preferences
source = preferences.comments[0]
@ -963,7 +965,6 @@ end
get "/preferences" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -976,7 +977,6 @@ end
post "/preferences" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1079,7 +1079,6 @@ end
get "/toggle_theme" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1098,13 +1097,66 @@ get "/toggle_theme" do |env|
env.redirect referer
end
get "/mark_watched" do |env|
user = env.get? "user"
referer = get_referer(env, "/feed/subscriptions")
id = env.params.query["id"]?
if !id
halt env, status_code: 400
end
redirect = env.params.query["redirect"]?
redirect ||= "false"
redirect = redirect == "true"
if user
user = user.as(User)
if !user.watched.includes? id
PG_DB.exec("UPDATE users SET watched = watched || $1 WHERE $2 = id", [id], user.id)
end
end
if redirect
env.redirect referer
else
env.response.content_type = "application/json"
"{}"
end
end
get "/mark_unwatched" do |env|
user = env.get? "user"
referer = get_referer(env, "/feed/history")
id = env.params.query["id"]?
if !id
halt env, status_code: 400
end
redirect = env.params.query["redirect"]?
redirect ||= "false"
redirect = redirect == "true"
if user
user = user.as(User)
PG_DB.exec("UPDATE users SET watched = array_remove(watched, $1) WHERE id = $2", id, user.id)
end
if redirect
env.redirect referer
else
env.response.content_type = "application/json"
"{}"
end
end
# /modify_notifications
# will "ding" all subscriptions.
# /modify_notifications?receive_all_updates=false&receive_no_updates=false
# will "unding" all subscriptions.
get "/modify_notifications" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1150,7 +1202,6 @@ end
get "/subscription_manager" do |env|
user = env.get? "user"
referer = get_referer(env, "/")
if !user
@ -1235,7 +1286,6 @@ end
get "/data_control" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1249,7 +1299,6 @@ end
post "/data_control" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1385,7 +1434,6 @@ end
get "/subscription_ajax" do |env|
user = env.get? "user"
referer = get_referer(env)
if user
@ -1547,6 +1595,7 @@ get "/feed/subscriptions" do |env|
if user
user = user.as(User)
preferences = user.preferences
env.set "show_watched", true
# Refresh account
headers = HTTP::Headers.new
@ -1670,19 +1719,28 @@ get "/feed/subscriptions" do |env|
end
end
# get "/feed/history" do |env|
# user = env.get? "user"
# referer = get_referer(env)
get "/feed/history" do |env|
user = env.get? "user"
referer = get_referer(env)
# if user
# user = user.as(User)
# watched = user.watched.reverse
page = env.params.query["page"]?.try &.to_i?
page ||= 1
# templated "history"
# else
# env.redirect referer
# end
# end
if user
user = user.as(User)
limit = user.preferences.max_results
if user.watched[(page - 1)*limit]?
watched = user.watched.reverse[(page - 1)*limit, limit]
else
watched = [] of String
end
templated "history"
else
env.redirect referer
end
end
get "/feed/channel/:ucid" do |env|
env.response.content_type = "text/xml"

View File

@ -507,7 +507,7 @@ def content_to_comment_html(content)
length_seconds = watch_endpoint["startTimeSeconds"].as_i
video_id = watch_endpoint["videoId"].as_s
text = %(<a href="javascript:void();" onclick="player.currentTime(#{length_seconds})">#{text}</a>)
text = %(<a href="javascript:void(0)" onclick="player.currentTime(#{length_seconds})">#{text}</a>)
elsif url = run["navigationEndpoint"]["commandMetadata"]?.try &.["webCommandMetadata"]["url"].as_s
text = %(<a href="#{url}">#{text}</a>)
end

View File

@ -90,7 +90,7 @@
</div>
<script>
document.getElementById("subscribe")["href"] = "javascript:void(0);"
document.getElementById("subscribe")["href"] = "javascript:void(0)"
function subscribe() {
var url = "/subscription_ajax?action_create_subscription_to_channel=1&c=<%= ucid %>&referer=<%= env.get("current_page") %>";

View File

@ -74,6 +74,21 @@
<% else %>
<div class="thumbnail">
<img class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg"/>
<% if env.get? "show_watched" %>
<p class="watched">
<a onclick="mark_watched(this)"
data-id="<%= item.id %>"
onmouseenter='this["href"]="javascript:void(0)"'
href="/mark_watched?id=<%= item.id %>"'
>
<i onmouseenter='this.setAttribute("class", "icon ion-ios-eye-off")'
onmouseleave='this.setAttribute("class", "icon ion-ios-eye")'
class="icon ion-ios-eye"
>
</i>
</a>
</p>
<% end %>
<p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
</div>
<% end %>

View File

@ -0,0 +1,73 @@
<% content_for "header" do %>
<title>History - Invidious</title>
<% end %>
<div class="pure-g">
<% watched.each_slice(4) do |slice| %>
<% slice.each do |item| %>
<div class="pure-u-1 pure-u-md-1-4">
<div class="h-box">
<a style="width:100%;" href="/watch?v=<%= item %>">
<% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %>
<% else %>
<div class="thumbnail">
<img class="thumbnail" src="/vi/<%= item %>/mqdefault.jpg"/>
<p class="watched">
<a onclick="mark_unwatched(this)"
data-id="<%= item %>"
onmouseenter='this["href"]="javascript:void(0)"'
href="/mark_unwatched?id=<%= item %>"'
>
<i onmouseenter='this.setAttribute("class", "icon ion-ios-eye")'
onmouseleave='this.setAttribute("class", "icon ion-ios-eye-off")'
class="icon ion-ios-eye-off"
>
</i>
</a>
</p>
</div>
<p></p>
<% end %>
</a>
</div>
</div>
<% end %>
<% end %>
</div>
<script>
function mark_unwatched(target) {
var tile = target.parentNode.parentNode.parentNode.parentNode;
tile.style.display = "none";
var url = "/mark_unwatched?redirect=false&id=" + target.getAttribute("data-id");
var xhr = new XMLHttpRequest();
xhr.responseType = "json";
xhr.timeout = 20000;
xhr.open("GET", url, true);
xhr.setRequestHeader("Redirect", "false");
xhr.send();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status != 200) {
tile.style.display = "";
}
}
}
}
</script>
<div class="pure-g h-box">
<div class="pure-u-1 pure-u-md-1-5">
<% if page >= 2 %>
<a href="/feed/history?page=<%= page - 1 %>">Previous page</a>
<% end %>
</div>
<div class="pure-u-1 pure-u-md-3-5"></div>
<div style="text-align:right;" class="pure-u-1 pure-u-md-1-5">
<% if watched.size >= limit %>
<a href="/feed/history?page=<%= page + 1 %>">Next page</a>
<% end %>
</div>
</div>

View File

@ -43,6 +43,28 @@
<% end %>
</div>
<script>
function mark_watched(target) {
var tile = target.parentNode.parentNode.parentNode.parentNode;
tile.style.display = "none";
var url = "/mark_watched?redirect=false&id=" + target.getAttribute("data-id");
var xhr = new XMLHttpRequest();
xhr.responseType = "json";
xhr.timeout = 20000;
xhr.open("GET", url, true);
xhr.send();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status != 200) {
tile.style.display = "";
}
}
}
}
</script>
<div class="pure-g">
<div class="pure-u-1 pure-u-md-1-5">
<% if page >= 2 %>

View File

@ -225,7 +225,7 @@ function number_with_separator(val) {
subscribe_button = document.getElementById("subscribe");
if (subscribe_button.getAttribute('onclick')) {
subscribe_button["href"] = "javascript:void(0);";
subscribe_button["href"] = "javascript:void(0)";
}
function subscribe() {