diff --git a/assets/js/watch.js b/assets/js/watch.js
index 46910620..d447f441 100644
--- a/assets/js/watch.js
+++ b/assets/js/watch.js
@@ -16,7 +16,8 @@ function toggle_parent(target) {
}
}
-function toggle_comments(target) {
+function toggle_comments(event) {
+ var target = event.target;
body = target.parentNode.parentNode.parentNode.children[1];
if (body.style.display === null || body.style.display === '') {
target.innerHTML = '[ + ]';
@@ -27,28 +28,44 @@ function toggle_comments(target) {
}
}
-function swap_comments(source) {
- if (source == 'youtube') {
+function swap_comments(event) {
+ var source = event.target.getAttribute('data-comments');
+
+ if (source === 'youtube') {
get_youtube_comments();
- } else if (source == 'reddit') {
+ } else if (source === 'reddit') {
get_reddit_comments();
}
}
-function show_youtube_replies(target, inner_text, sub_text) {
- body = target.parentNode.parentNode.children[1];
- body.style.display = '';
+function hide_youtube_replies(event) {
+ var target = event.target;
- target.innerHTML = inner_text;
- target.setAttribute('onclick', "hide_youtube_replies(this, \'" + inner_text + "\', \'" + sub_text + "\')");
-}
+ sub_text = target.getAttribute('data-inner-text');
+ inner_text = target.getAttribute('data-sub-text');
-function hide_youtube_replies(target, inner_text, sub_text) {
body = target.parentNode.parentNode.children[1];
body.style.display = 'none';
target.innerHTML = sub_text;
- target.setAttribute('onclick', "show_youtube_replies(this, \'" + inner_text + "\', \'" + sub_text + "\')");
+ target.onclick = show_youtube_replies;
+ target.setAttribute('data-inner-text', inner_text);
+ target.setAttribute('data-sub-text', sub_text);
+}
+
+function show_youtube_replies(event) {
+ var target = event.target;
+
+ sub_text = target.getAttribute('data-inner-text');
+ inner_text = target.getAttribute('data-sub-text');
+
+ body = target.parentNode.parentNode.children[1];
+ body.style.display = '';
+
+ target.innerHTML = sub_text;
+ target.onclick = hide_youtube_replies;
+ target.setAttribute('data-inner-text', inner_text);
+ target.setAttribute('data-sub-text', sub_text);
}
var continue_button = document.getElementById('continue');
@@ -186,12 +203,12 @@ function get_reddit_comments(timeouts = 0) {
comments.innerHTML = ' \
\
\
- [ - ] \
+ [ - ] \
{title} \
\
\
\
- \
+ \
{youtubeCommentsText} \
\
\
@@ -208,6 +225,9 @@ function get_reddit_comments(timeouts = 0) {
permalink: xhr.response.permalink,
contentHtml: xhr.response.contentHtml
});
+
+ comments.children[0].children[0].children[0].onclick = toggle_comments;
+ comments.children[0].children[1].children[0].onclick = swap_comments;
} else {
if (video_data.preferences.comments[1] === 'youtube') {
get_youtube_comments(timeouts + 1);
@@ -254,11 +274,11 @@ function get_youtube_comments(timeouts = 0) {
comments.innerHTML = ' \
\
\
- [ - ] \
+ [ - ] \
{commentsText} \
\
\
- \
+ \
{redditComments} \
\
\
@@ -271,6 +291,9 @@ function get_youtube_comments(timeouts = 0) {
{ commentCount: number_with_separator(xhr.response.commentCount) }
)
});
+
+ comments.children[0].children[0].children[0].onclick = toggle_comments;
+ comments.children[0].children[1].children[0].onclick = swap_comments;
} else {
comments.innerHTML = '';
}
@@ -319,15 +342,23 @@ function get_youtube_replies(target, load_more) {
body.removeChild(body.lastElementChild);
body.innerHTML += xhr.response.contentHtml;
} else {
- body.innerHTML = ' \
-
{hideRepliesText} \
-
\
-
{contentHtml}
'.supplant({
- hideRepliesText: video_data.hide_replies_text,
- showRepliesText: video_data.show_replies_text,
- contentHtml: xhr.response.contentHtml
- });
+ body.removeChild(body.lastElementChild);
+
+ var p = document.createElement('p');
+ var a = document.createElement('a');
+ p.appendChild(a);
+
+ a.href = 'javascript:void(0)';
+ a.onclick = hide_youtube_replies;
+ a.setAttribute('data-sub-text', video_data.hide_replies_text);
+ a.setAttribute('data-inner-text', video_data.show_replies_text);
+ a.innerText = video_data.hide_replies_text;
+
+ var div = document.createElement('div');
+ div.innerHTML = xhr.response.contentHtml;
+
+ body.appendChild(p);
+ body.appendChild(div);
}
} else {
body.innerHTML = fallback;
diff --git a/assets/js/watched_widget.js b/assets/js/watched_widget.js
new file mode 100644
index 00000000..304a7688
--- /dev/null
+++ b/assets/js/watched_widget.js
@@ -0,0 +1,46 @@
+function mark_watched(target) {
+ var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
+ tile.style.display = 'none';
+
+ var url = '/watch_ajax?action_mark_watched=1&redirect=false' +
+ '&id=' + target.getAttribute('data-id');
+ var xhr = new XMLHttpRequest();
+ xhr.responseType = 'json';
+ xhr.timeout = 20000;
+ xhr.open('POST', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.send('csrf_token=' + watched_data.csrf_token);
+
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState == 4) {
+ if (xhr.status != 200) {
+ tile.style.display = '';
+ }
+ }
+ }
+}
+
+function mark_unwatched(target) {
+ var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
+ tile.style.display = "none";
+ var count = document.getElementById('count')
+ count.innerText = count.innerText - 1;
+
+ var url = '/watch_ajax?action_mark_unwatched=1&redirect=false' +
+ '&id=' + target.getAttribute('data-id');
+ var xhr = new XMLHttpRequest();
+ xhr.responseType = 'json';
+ xhr.timeout = 20000;
+ xhr.open('POST', url, true);
+ xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+ xhr.send('csrf_token=' + watched_data.csrf_token);
+
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState == 4) {
+ if (xhr.status != 200) {
+ count.innerText = count.innerText - 1 + 2;
+ tile.style.display = '';
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/invidious/views/components/item.ecr b/src/invidious/views/components/item.ecr
index 4a20de51..5ec406cb 100644
--- a/src/invidious/views/components/item.ecr
+++ b/src/invidious/views/components/item.ecr
@@ -93,7 +93,7 @@
+
+
+
<% watched.each_slice(4) do |slice| %>
<% slice.each do |item| %>
@@ -27,10 +34,10 @@
<% if !env.get("preferences").as(Preferences).thin_mode %>
-
-
-
<% if page >= 2 %>
diff --git a/src/invidious/views/subscriptions.ecr b/src/invidious/views/subscriptions.ecr
index 806e6124..f4725169 100644
--- a/src/invidious/views/subscriptions.ecr
+++ b/src/invidious/views/subscriptions.ecr
@@ -45,6 +45,13 @@
+
+
+
<% videos.each_slice(4) do |slice| %>
<% slice.each do |item| %>
@@ -53,30 +60,6 @@
<% end %>
-
-
<% if page >= 2 %>
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index d0dba85e..466c71f4 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -207,7 +207,7 @@ var video_data = {