From 564bca966fafaec4cd6040aeaf9a8153b3f20327 Mon Sep 17 00:00:00 2001 From: Samuel Casellas Date: Mon, 6 Jan 2025 07:32:40 -0500 Subject: [PATCH 1/5] some reformatting --- assets/js/_helpers.js | 19 +++++++++---------- assets/js/comments.js | 12 +++++------- 2 files changed, 14 insertions(+), 17 deletions(-) diff --git a/assets/js/_helpers.js b/assets/js/_helpers.js index 8e18169e1..d4952d0ff 100644 --- a/assets/js/_helpers.js +++ b/assets/js/_helpers.js @@ -153,8 +153,8 @@ window.helpers = window.helpers || { return; } - if (!options.entity_name) options.entity_name = 'unknown'; - if (!options.retry_timeout) options.retry_timeout = 1000; + options.entity_name = options.entity_name || 'unknown'; + options.retry_timeout = options.retry_timeout || 1000; const retries_total = options.retries; let currentTry = 1; @@ -197,7 +197,7 @@ window.helpers = window.helpers || { storage: (function () { // access to localStorage throws exception in Tor Browser, so try is needed let localStorageIsUsable = false; - try{localStorageIsUsable = !!localStorage.setItem;}catch(e){} + try { localStorageIsUsable = !!localStorage.setItem; } catch {} if (localStorageIsUsable) { return { @@ -206,7 +206,7 @@ window.helpers = window.helpers || { if (!storageItem) return; try { return JSON.parse(decodeURIComponent(storageItem)); - } catch(e) { + } catch { // Erase non parsable value helpers.storage.remove(key); } @@ -224,14 +224,13 @@ window.helpers = window.helpers || { return { get: function (key) { const cookiePrefix = key + '='; - function findCallback(cookie) {return cookie.startsWith(cookiePrefix);} - const matchedCookie = document.cookie.split('; ').find(findCallback); + const matchedCookie = document.cookie.split('; ').find(cookie => cookie.startsWith(cookiePrefix)); if (matchedCookie) { const cookieBody = matchedCookie.replace(cookiePrefix, ''); - if (cookieBody.length === 0) return; + if (!cookieBody.length) return; try { return JSON.parse(decodeURIComponent(cookieBody)); - } catch(e) { + } catch { // Erase non parsable value helpers.storage.remove(key); } @@ -240,9 +239,9 @@ window.helpers = window.helpers || { set: function (key, value) { const cookie_data = encodeURIComponent(JSON.stringify(value)); - // Set expiration in 2 year + // Set expiration for 2 years out const date = new Date(); - date.setFullYear(date.getFullYear()+2); + date.setFullYear(date.getFullYear() + 2); document.cookie = key + '=' + cookie_data + '; expires=' + date.toGMTString(); }, diff --git a/assets/js/comments.js b/assets/js/comments.js index 35ffa96e5..6c0f7c1d8 100644 --- a/assets/js/comments.js +++ b/assets/js/comments.js @@ -58,7 +58,7 @@ function get_youtube_comments() { var fallback = comments.innerHTML; comments.innerHTML = spinnerHTML; - var baseUrl = video_data.base_url || '/api/v1/comments/'+ video_data.id + var baseUrl = video_data.base_url || '/api/v1/comments/' + video_data.id var url = baseUrl + '?format=html' + '&hl=' + video_data.preferences.locale + @@ -68,10 +68,6 @@ function get_youtube_comments() { url += '&ucid=' + video_data.ucid } - var onNon200 = function (xhr) { comments.innerHTML = fallback; }; - if (video_data.params.comments[1] === 'youtube') - onNon200 = function (xhr) {}; - helpers.xhr('GET', url, {retries: 5, entity_name: 'comments'}, { on200: function (response) { var commentInnerHtml = ' \ @@ -109,7 +105,9 @@ function get_youtube_comments() { comments.children[0].children[1].children[0].onclick = swap_comments; } }, - onNon200: onNon200, // declared above + onNon200: video_data.params.comments[1] === 'youtube' + ? function (xhr) {} + : function (xhr) { comments.innerHTML = fallback; }, onError: function (xhr) { comments.innerHTML = spinnerHTML; }, @@ -125,7 +123,7 @@ function get_youtube_replies(target, load_more, load_replies) { var body = target.parentNode.parentNode; var fallback = body.innerHTML; body.innerHTML = spinnerHTML; - var baseUrl = video_data.base_url || '/api/v1/comments/'+ video_data.id + var baseUrl = video_data.base_url || '/api/v1/comments/' + video_data.id var url = baseUrl + '?format=html' + '&hl=' + video_data.preferences.locale + From e64442a37338cc1a820abc7429d124772ae285a0 Mon Sep 17 00:00:00 2001 From: Samuel Casellas Date: Wed, 8 Jan 2025 22:26:41 -0500 Subject: [PATCH 2/5] edit per suggestion --- assets/js/_helpers.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/_helpers.js b/assets/js/_helpers.js index d4952d0ff..3ce1746d2 100644 --- a/assets/js/_helpers.js +++ b/assets/js/_helpers.js @@ -227,7 +227,7 @@ window.helpers = window.helpers || { const matchedCookie = document.cookie.split('; ').find(cookie => cookie.startsWith(cookiePrefix)); if (matchedCookie) { const cookieBody = matchedCookie.replace(cookiePrefix, ''); - if (!cookieBody.length) return; + if (cookieBody.length === 0) return; try { return JSON.parse(decodeURIComponent(cookieBody)); } catch { From 5451391502016654aa19bb3c2892e07298fe4f8f Mon Sep 17 00:00:00 2001 From: Samuel Casellas Date: Fri, 10 Jan 2025 12:47:00 -0500 Subject: [PATCH 3/5] Incorporate unused "unable to load comments" message --- assets/js/comments.js | 4 ++-- assets/js/community.js | 2 +- assets/js/watch.js | 8 +++----- locales/en-US.json | 2 +- src/invidious/views/post.ecr | 3 +++ src/invidious/views/watch.ecr | 3 +++ 6 files changed, 13 insertions(+), 9 deletions(-) diff --git a/assets/js/comments.js b/assets/js/comments.js index 6c0f7c1d8..f948a3f82 100644 --- a/assets/js/comments.js +++ b/assets/js/comments.js @@ -106,8 +106,8 @@ function get_youtube_comments() { } }, onNon200: video_data.params.comments[1] === 'youtube' - ? function (xhr) {} - : function (xhr) { comments.innerHTML = fallback; }, + ? function (xhr) {} + : function (xhr) { comments.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]) }, onError: function (xhr) { comments.innerHTML = spinnerHTML; }, diff --git a/assets/js/community.js b/assets/js/community.js index 32fe4ebc3..9b29bbf2c 100644 --- a/assets/js/community.js +++ b/assets/js/community.js @@ -72,7 +72,7 @@ function get_youtube_replies(target, load_more) { } }, onNon200: function (xhr) { - body.innerHTML = fallback; + body.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]); }, onTimeout: function (xhr) { console.warn('Pulling comments failed'); diff --git a/assets/js/watch.js b/assets/js/watch.js index 26ad138f5..736cecb30 100644 --- a/assets/js/watch.js +++ b/assets/js/watch.js @@ -117,10 +117,6 @@ function get_reddit_comments() { '?source=reddit&format=html' + '&hl=' + video_data.preferences.locale; - var onNon200 = function (xhr) { comments.innerHTML = fallback; }; - if (video_data.params.comments[1] === 'youtube') - onNon200 = function (xhr) {}; - helpers.xhr('GET', url, {retries: 5, entity_name: ''}, { on200: function (response) { comments.innerHTML = ' \ @@ -152,7 +148,9 @@ function get_reddit_comments() { comments.children[0].children[0].children[0].onclick = toggle_comments; comments.children[0].children[1].children[0].onclick = swap_comments; }, - onNon200: onNon200, // declared above + onNon200: video_data.params.comments[1] === 'youtube' + ? function (xhr) {} + : function (xhr) { comments.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]); } }); } diff --git a/locales/en-US.json b/locales/en-US.json index c23f6bc33..b624ce864 100644 --- a/locales/en-US.json +++ b/locales/en-US.json @@ -234,7 +234,7 @@ "Deleted or invalid channel": "Deleted or invalid channel", "This channel does not exist.": "This channel does not exist.", "Could not get channel info.": "Could not get channel info.", - "Could not fetch comments": "Could not fetch comments", + "Could not fetch comments": "Could not fetch comments (they may be turned off)", "comments_view_x_replies": "View {{count}} reply", "comments_view_x_replies_plural": "View {{count}} replies", "`x` ago": "`x` ago", diff --git a/src/invidious/views/post.ecr b/src/invidious/views/post.ecr index fb03a44c9..f357999da 100644 --- a/src/invidious/views/post.ecr +++ b/src/invidious/views/post.ecr @@ -21,6 +21,9 @@ <%= translate(locale, "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.") %> +

+ <%= translate(locale, "Could not fetch comments") %> +

<% end %> diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr index 45c58a162..308d00212 100644 --- a/src/invidious/views/watch.ecr +++ b/src/invidious/views/watch.ecr @@ -297,6 +297,9 @@ we're going to need to do it here in order to allow for translations. <%= translate(locale, "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.") %> +

+ <%= translate(locale, "Could not fetch comments") %> +

<% end %> From 88e80d50ad54082c1b4cb3d3f4e9fc54b4cc02f3 Mon Sep 17 00:00:00 2001 From: Samuel Casellas Date: Sat, 11 Jan 2025 13:16:26 -0500 Subject: [PATCH 4/5] Revert "Incorporate unused "unable to load comments" message": Split these changes to another PR This reverts commit 5451391502016654aa19bb3c2892e07298fe4f8f. --- assets/js/comments.js | 4 ++-- assets/js/community.js | 2 +- assets/js/watch.js | 8 +++++--- locales/en-US.json | 2 +- src/invidious/views/post.ecr | 3 --- src/invidious/views/watch.ecr | 3 --- 6 files changed, 9 insertions(+), 13 deletions(-) diff --git a/assets/js/comments.js b/assets/js/comments.js index f948a3f82..6c0f7c1d8 100644 --- a/assets/js/comments.js +++ b/assets/js/comments.js @@ -106,8 +106,8 @@ function get_youtube_comments() { } }, onNon200: video_data.params.comments[1] === 'youtube' - ? function (xhr) {} - : function (xhr) { comments.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]) }, + ? function (xhr) {} + : function (xhr) { comments.innerHTML = fallback; }, onError: function (xhr) { comments.innerHTML = spinnerHTML; }, diff --git a/assets/js/community.js b/assets/js/community.js index 9b29bbf2c..32fe4ebc3 100644 --- a/assets/js/community.js +++ b/assets/js/community.js @@ -72,7 +72,7 @@ function get_youtube_replies(target, load_more) { } }, onNon200: function (xhr) { - body.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]); + body.innerHTML = fallback; }, onTimeout: function (xhr) { console.warn('Pulling comments failed'); diff --git a/assets/js/watch.js b/assets/js/watch.js index 736cecb30..26ad138f5 100644 --- a/assets/js/watch.js +++ b/assets/js/watch.js @@ -117,6 +117,10 @@ function get_reddit_comments() { '?source=reddit&format=html' + '&hl=' + video_data.preferences.locale; + var onNon200 = function (xhr) { comments.innerHTML = fallback; }; + if (video_data.params.comments[1] === 'youtube') + onNon200 = function (xhr) {}; + helpers.xhr('GET', url, {retries: 5, entity_name: ''}, { on200: function (response) { comments.innerHTML = ' \ @@ -148,9 +152,7 @@ function get_reddit_comments() { comments.children[0].children[0].children[0].onclick = toggle_comments; comments.children[0].children[1].children[0].onclick = swap_comments; }, - onNon200: video_data.params.comments[1] === 'youtube' - ? function (xhr) {} - : function (xhr) { comments.innerHTML = (xhr.response.error === 'Comments not found.' ? fallback.split('')[1] : fallback.split('

')[0]); } + onNon200: onNon200, // declared above }); } diff --git a/locales/en-US.json b/locales/en-US.json index b624ce864..c23f6bc33 100644 --- a/locales/en-US.json +++ b/locales/en-US.json @@ -234,7 +234,7 @@ "Deleted or invalid channel": "Deleted or invalid channel", "This channel does not exist.": "This channel does not exist.", "Could not get channel info.": "Could not get channel info.", - "Could not fetch comments": "Could not fetch comments (they may be turned off)", + "Could not fetch comments": "Could not fetch comments", "comments_view_x_replies": "View {{count}} reply", "comments_view_x_replies_plural": "View {{count}} replies", "`x` ago": "`x` ago", diff --git a/src/invidious/views/post.ecr b/src/invidious/views/post.ecr index f357999da..fb03a44c9 100644 --- a/src/invidious/views/post.ecr +++ b/src/invidious/views/post.ecr @@ -21,9 +21,6 @@ <%= translate(locale, "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.") %> -

- <%= translate(locale, "Could not fetch comments") %> -

<% end %> diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr index 308d00212..45c58a162 100644 --- a/src/invidious/views/watch.ecr +++ b/src/invidious/views/watch.ecr @@ -297,9 +297,6 @@ we're going to need to do it here in order to allow for translations. <%= translate(locale, "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.") %> -

- <%= translate(locale, "Could not fetch comments") %> -

<% end %> From c365cd274e348904e170969b7227ab1894f0fc36 Mon Sep 17 00:00:00 2001 From: Samuel Casellas Date: Sat, 11 Jan 2025 14:11:47 -0500 Subject: [PATCH 5/5] more refactoring --- assets/js/comments.js | 25 +++++++------------ assets/js/community.js | 25 +++++++------------ assets/js/embed.js | 28 ++++++++++------------ assets/js/watch.js | 54 ++++++++++++++++-------------------------- 4 files changed, 49 insertions(+), 83 deletions(-) diff --git a/assets/js/comments.js b/assets/js/comments.js index 6c0f7c1d8..dda83c0bf 100644 --- a/assets/js/comments.js +++ b/assets/js/comments.js @@ -22,34 +22,25 @@ function toggle_comments(event) { } } -function hide_youtube_replies(event) { - var target = event.target; - +function toggle_youtube_replies(target, next_click_action) { var sub_text = target.getAttribute('data-inner-text'); var inner_text = target.getAttribute('data-sub-text'); var body = target.parentNode.parentNode.children[1]; - body.style.display = 'none'; + body.style.display = next_click_action === show_youtube_replies ? 'none' : ''; target.textContent = sub_text; - target.onclick = show_youtube_replies; + target.onclick = next_click_action; target.setAttribute('data-inner-text', inner_text); target.setAttribute('data-sub-text', sub_text); } -function show_youtube_replies(event) { - var target = event.target; - - var sub_text = target.getAttribute('data-inner-text'); - var inner_text = target.getAttribute('data-sub-text'); - - var body = target.parentNode.parentNode.children[1]; - body.style.display = ''; +function hide_youtube_replies(event) { + toggle_youtube_replies(event.target, show_youtube_replies); +} - target.textContent = sub_text; - target.onclick = hide_youtube_replies; - target.setAttribute('data-inner-text', inner_text); - target.setAttribute('data-sub-text', sub_text); +function show_youtube_replies(event) { + toggle_youtube_replies(event.target, hide_youtube_replies); } function get_youtube_comments() { diff --git a/assets/js/community.js b/assets/js/community.js index 32fe4ebc3..2e2b70015 100644 --- a/assets/js/community.js +++ b/assets/js/community.js @@ -1,34 +1,25 @@ 'use strict'; var community_data = JSON.parse(document.getElementById('community_data').textContent); -function hide_youtube_replies(event) { - var target = event.target; - +function toggle_youtube_replies(target, next_click_action) { var sub_text = target.getAttribute('data-inner-text'); var inner_text = target.getAttribute('data-sub-text'); var body = target.parentNode.parentNode.children[1]; - body.style.display = 'none'; + body.style.display = next_click_action === show_youtube_replies ? 'none' : ''; target.innerHTML = sub_text; - target.onclick = show_youtube_replies; + target.onclick = next_click_action; target.setAttribute('data-inner-text', inner_text); target.setAttribute('data-sub-text', sub_text); } -function show_youtube_replies(event) { - var target = event.target; - - var sub_text = target.getAttribute('data-inner-text'); - var inner_text = target.getAttribute('data-sub-text'); - - var body = target.parentNode.parentNode.children[1]; - body.style.display = ''; +function hide_youtube_replies(event) { + toggle_youtube_replies(event.target, show_youtube_replies); +} - target.innerHTML = sub_text; - target.onclick = hide_youtube_replies; - target.setAttribute('data-inner-text', inner_text); - target.setAttribute('data-sub-text', sub_text); +function show_youtube_replies(event) { + toggle_youtube_replies(event.target, hide_youtube_replies); } function get_youtube_replies(target, load_more) { diff --git a/assets/js/embed.js b/assets/js/embed.js index b11b5e5a6..7eb6b6437 100644 --- a/assets/js/embed.js +++ b/assets/js/embed.js @@ -1,6 +1,16 @@ 'use strict'; var video_data = JSON.parse(document.getElementById('video_data').textContent); +function set_search_params() { + if (video_data.params.autoplay || video_data.params.continue_autoplay) + url.searchParams.set('autoplay', '1'); + + ['listen', 'speed', 'local'].forEach(p => { + if (video_data.params[p] !== video_data.preferences[p]) + url.searchParams.set(p, video_data.params[p]); + }); +} + function get_playlist(plid) { var plid_url; if (plid.startsWith('RD')) { @@ -25,14 +35,7 @@ function get_playlist(plid) { url.searchParams.set('list', plid); if (!plid.startsWith('RD')) url.searchParams.set('index', response.index); - if (video_data.params.autoplay || video_data.params.continue_autoplay) - url.searchParams.set('autoplay', '1'); - if (video_data.params.listen !== video_data.preferences.listen) - url.searchParams.set('listen', video_data.params.listen); - if (video_data.params.speed !== video_data.preferences.speed) - url.searchParams.set('speed', video_data.params.speed); - if (video_data.params.local !== video_data.preferences.local) - url.searchParams.set('local', video_data.params.local); + set_search_params(); location.assign(url.pathname + url.search); }); @@ -47,14 +50,7 @@ addEventListener('load', function (e) { player.on('ended', function () { var url = new URL('https://example.com/embed/' + video_data.video_series.shift()); - if (video_data.params.autoplay || video_data.params.continue_autoplay) - url.searchParams.set('autoplay', '1'); - if (video_data.params.listen !== video_data.preferences.listen) - url.searchParams.set('listen', video_data.params.listen); - if (video_data.params.speed !== video_data.preferences.speed) - url.searchParams.set('speed', video_data.params.speed); - if (video_data.params.local !== video_data.preferences.local) - url.searchParams.set('local', video_data.params.local); + set_search_params(); if (video_data.video_series.length !== 0) url.searchParams.set('playlist', video_data.video_series.join(',')); diff --git a/assets/js/watch.js b/assets/js/watch.js index 26ad138f5..cd60e5522 100644 --- a/assets/js/watch.js +++ b/assets/js/watch.js @@ -26,17 +26,20 @@ if (continue_button) { continue_button.onclick = continue_autoplay; } +function set_search_params() { + if (video_data.params.autoplay || video_data.params.continue_autoplay) + url.searchParams.set('autoplay', '1'); + + ['listen', 'speed', 'local'].forEach(p => { + if (video_data.params[p] !== video_data.preferences[p]) + url.searchParams.set(p, video_data.params[p]); + }); +} + function next_video() { var url = new URL('https://example.com/watch?v=' + video_data.next_video); - if (video_data.params.autoplay || video_data.params.continue_autoplay) - url.searchParams.set('autoplay', '1'); - if (video_data.params.listen !== video_data.preferences.listen) - url.searchParams.set('listen', video_data.params.listen); - if (video_data.params.speed !== video_data.preferences.speed) - url.searchParams.set('speed', video_data.params.speed); - if (video_data.params.local !== video_data.preferences.local) - url.searchParams.set('local', video_data.params.local); + set_search_params(); url.searchParams.set('continue', '1'); location.assign(url.pathname + url.search); @@ -82,14 +85,7 @@ function get_playlist(plid) { url.searchParams.set('list', plid); if (!plid.startsWith('RD')) url.searchParams.set('index', response.index); - if (video_data.params.autoplay || video_data.params.continue_autoplay) - url.searchParams.set('autoplay', '1'); - if (video_data.params.listen !== video_data.preferences.listen) - url.searchParams.set('listen', video_data.params.listen); - if (video_data.params.speed !== video_data.preferences.speed) - url.searchParams.set('speed', video_data.params.speed); - if (video_data.params.local !== video_data.preferences.local) - url.searchParams.set('local', video_data.params.local); + set_search_params(); location.assign(url.pathname + url.search); }); @@ -117,10 +113,6 @@ function get_reddit_comments() { '?source=reddit&format=html' + '&hl=' + video_data.preferences.locale; - var onNon200 = function (xhr) { comments.innerHTML = fallback; }; - if (video_data.params.comments[1] === 'youtube') - onNon200 = function (xhr) {}; - helpers.xhr('GET', url, {retries: 5, entity_name: ''}, { on200: function (response) { comments.innerHTML = ' \ @@ -152,7 +144,9 @@ function get_reddit_comments() { comments.children[0].children[0].children[0].onclick = toggle_comments; comments.children[0].children[1].children[0].onclick = swap_comments; }, - onNon200: onNon200, // declared above + onNon200: video_data.params.comments[1] === 'youtube' + ? function (xhr) {} + : function (xhr) { comments.innerHTML = fallback; } }); } @@ -160,14 +154,7 @@ if (video_data.play_next) { player.on('ended', function () { var url = new URL('https://example.com/watch?v=' + video_data.next_video); - if (video_data.params.autoplay || video_data.params.continue_autoplay) - url.searchParams.set('autoplay', '1'); - if (video_data.params.listen !== video_data.preferences.listen) - url.searchParams.set('listen', video_data.params.listen); - if (video_data.params.speed !== video_data.preferences.speed) - url.searchParams.set('speed', video_data.params.speed); - if (video_data.params.local !== video_data.preferences.local) - url.searchParams.set('local', video_data.params.local); + set_search_params(); url.searchParams.set('continue', '1'); location.assign(url.pathname + url.search); @@ -178,13 +165,14 @@ addEventListener('load', function (e) { if (video_data.plid) get_playlist(video_data.plid); - if (video_data.params.comments[0] === 'youtube') { + const c = video_data.params.comments; + if (c[0] === 'youtube') { get_youtube_comments(); - } else if (video_data.params.comments[0] === 'reddit') { + } else if (c[0] === 'reddit') { get_reddit_comments(); - } else if (video_data.params.comments[1] === 'youtube') { + } else if (c[1] === 'youtube') { get_youtube_comments(); - } else if (video_data.params.comments[1] === 'reddit') { + } else if (c[1] === 'reddit') { get_reddit_comments(); } else { var comments = document.getElementById('comments');