summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--Makefile1
-rw-r--r--assets/css/default.css242
-rw-r--r--config/config.example.yml8
-rw-r--r--docker-compose.yml1
-rw-r--r--locales/af.json16
-rw-r--r--locales/ar.json6
-rw-r--r--locales/ca.json3
-rw-r--r--locales/de.json3
-rw-r--r--locales/en-US.json8
-rw-r--r--locales/fr.json6
-rw-r--r--locales/ja.json2
-rw-r--r--locales/nb-NO.json14
-rw-r--r--locales/pt.json3
-rw-r--r--locales/ru.json50
-rw-r--r--locales/sl.json3
-rw-r--r--locales/vi.json79
-rw-r--r--src/invidious.cr9
-rw-r--r--src/invidious/channels/playlists.cr18
-rw-r--r--src/invidious/config.cr14
-rw-r--r--src/invidious/frontend/channel_page.cr2
-rw-r--r--src/invidious/frontend/pagination.cr97
-rw-r--r--src/invidious/helpers/i18n.cr9
-rw-r--r--src/invidious/http_server/utils.cr20
-rw-r--r--src/invidious/routes/api/v1/channels.cr62
-rw-r--r--src/invidious/routes/channels.cr44
-rw-r--r--src/invidious/routes/feeds.cr8
-rw-r--r--src/invidious/routes/playlists.cr45
-rw-r--r--src/invidious/routes/search.cr26
-rw-r--r--src/invidious/routing.cr5
-rw-r--r--src/invidious/views/add_playlist_items.ecr30
-rw-r--r--src/invidious/views/channel.ecr27
-rw-r--r--src/invidious/views/components/channel_info.ecr27
-rw-r--r--src/invidious/views/components/item.ecr235
-rw-r--r--src/invidious/views/components/items_paginated.ecr11
-rw-r--r--src/invidious/views/components/subscribe_widget.ecr6
-rw-r--r--src/invidious/views/components/video-context-buttons.ecr4
-rw-r--r--src/invidious/views/edit_playlist.ecr89
-rw-r--r--src/invidious/views/feeds/history.ecr52
-rw-r--r--src/invidious/views/feeds/subscriptions.ecr25
-rw-r--r--src/invidious/views/hashtag.ecr35
-rw-r--r--src/invidious/views/playlist.ecr97
-rw-r--r--src/invidious/views/search.ecr37
-rw-r--r--src/invidious/views/template.ecr8
-rw-r--r--src/invidious/views/watch.ecr62
-rw-r--r--src/invidious/yt_backend/extractors.cr5
45 files changed, 969 insertions, 585 deletions
diff --git a/Makefile b/Makefile
index 929b11e1..d4657792 100644
--- a/Makefile
+++ b/Makefile
@@ -86,6 +86,7 @@ clean:
distclean: clean
rm -rf libs
+ rm -rf ~/.cache/{crystal,shards}
# -----------------------
diff --git a/assets/css/default.css b/assets/css/default.css
index 431a0427..c31b24e5 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -1,3 +1,7 @@
+/*
+ * Common attributes
+ */
+
html,
body {
font-family: BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, Oxygen,
@@ -11,6 +15,16 @@ body {
min-height: 100vh;
}
+.h-box {
+ padding-left: 1em;
+ padding-right: 1em;
+}
+
+.v-box {
+ padding-top: 1em;
+ padding-bottom: 1em;
+}
+
.deleted {
background-color: rgb(255, 0, 0, 0.5);
}
@@ -20,6 +34,34 @@ body {
margin-bottom: 20px;
}
+.title {
+ margin: 0.5em 0 1em 0;
+}
+
+/* A flex container */
+.flexible {
+ display: flex;
+ align-items: center;
+}
+
+.flex-left {
+ display: flex;
+ flex: 1 1 auto;
+ flex-flow: row wrap;
+ justify-content: flex-start;
+}
+.flex-right {
+ display: flex;
+ flex: 2 0 auto;
+ flex-flow: row nowrap;
+ justify-content: flex-end;
+}
+
+
+/*
+ * Channel page
+ */
+
.channel-profile > * {
font-size: 1.17em;
font-weight: bold;
@@ -90,16 +132,6 @@ body a.channel-owner {
}
}
-.h-box {
- padding-left: 1em;
- padding-right: 1em;
-}
-
-.v-box {
- padding-top: 1em;
- padding-bottom: 1em;
-}
-
div {
overflow-wrap: break-word;
word-wrap: break-word;
@@ -115,6 +147,11 @@ div {
padding-right: 10px;
}
+
+/*
+ * Buttons
+ */
+
body a.pure-button {
color: rgba(0,0,0,.8);
}
@@ -127,30 +164,48 @@ body a.pure-button-primary,
color: rgba(35, 35, 35, 1);
}
-button.pure-button-primary:hover,
-body a.pure-button-primary:hover,
-button.pure-button-primary:focus,
-body a.pure-button-primary:focus {
- background-color: rgba(0, 182, 240, 1);
- color: #fff;
+.pure-button-primary,
+.pure-button-secondary {
+ border: 1px solid #a0a0a0;
+ border-radius: 3px;
+ margin: 0 .4em;
+}
+
+.pure-button-secondary.low-profile {
+ padding: 5px 10px;
+ margin: 0;
}
+/* Has to be combined with flex-left/right */
+.button-container {
+ flex-flow: wrap;
+ gap: 0.5em 0.75em;
+}
+
+
+/*
+ * Video thumbnails
+ */
+
div.thumbnail {
- padding: 28.125%;
position: relative;
+ width: 100%;
box-sizing: border-box;
}
img.thumbnail {
- position: absolute;
+ display: block; /* See: https://stackoverflow.com/a/11635197 */
width: 100%;
- height: 100%;
- left: 0;
- top: 0;
object-fit: cover;
}
+.thumbnail-placeholder {
+ min-height: 50px;
+ border: 2px dotted;
+}
+
div.watched-overlay {
+ z-index: 50;
position: absolute;
top: 0;
left: 0;
@@ -168,30 +223,31 @@ div.watched-indicator {
background-color: red;
}
-.length {
+div.thumbnail > .top-left-overlay,
+div.thumbnail > .bottom-right-overlay {
z-index: 100;
position: absolute;
- background-color: rgba(35, 35, 35, 0.75);
- color: #fff;
- border-radius: 2px;
- padding: 2px;
+ padding: 0;
+ margin: 0;
font-size: 16px;
- right: 0.25em;
- bottom: -0.75em;
}
-.watched {
- z-index: 100;
- position: absolute;
- background-color: rgba(35, 35, 35, 0.75);
+.top-left-overlay { top: 0.6em; left: 0.6em; }
+.bottom-right-overlay { bottom: 0.6em; right: 0.6em; }
+
+.length {
+ padding: 1px;
+ margin: -2px 0;
color: #fff;
- border-radius: 2px;
- padding: 4px 8px 4px 8px;
- font-size: 16px;
- left: 0.2em;
- top: -0.7em;
+ border-radius: 3px;
}
+.length, .top-left-overlay button {
+ color: #eee;
+ background-color: rgba(35, 35, 35, 0.85) !important;
+}
+
+
/*
* Navbar
*/
@@ -267,6 +323,11 @@ input[type="search"]::-webkit-search-cancel-button {
margin-right: 1em;
}
+
+/*
+ * Responsive rules
+ */
+
@media only screen and (max-aspect-ratio: 16/9) {
.player-dimensions.vjs-fluid {
padding-top: 46.86% !important;
@@ -285,20 +346,28 @@ input[type="search"]::-webkit-search-cancel-button {
.navbar > div {
display: flex;
justify-content: center;
- }
-
- .navbar > div:not(:last-child) {
- margin-bottom: 1em;
+ margin-bottom: 25px;
}
.navbar > .searchbar > form {
- width: 60%;
+ width: 75%;
}
h1 {
font-size: 1.25em;
margin: 0.42em 0;
}
+
+ /* Space out the subscribe & RSS buttons and align them to the left */
+ .title.flexible { display: block; }
+ .title.flexible > .flex-right { margin: 0.75em 0; justify-content: flex-start; }
+
+ /* Space out buttons to make them easier to tap */
+ .user-field { font-size: 125%; }
+ .user-field > :not(:last-child) { margin-right: 1.75em; }
+
+ .icon-buttons { font-size: 125%; }
+ .icon-buttons > :not(:last-child) { margin-right: 0.75em; }
}
@media screen and (max-width: 320px) {
@@ -315,10 +384,6 @@ input[type="search"]::-webkit-search-cancel-button {
.video-card-row { margin: 15px 0; }
-.flexible { display: flex; }
-.flex-left { flex: 1 1 100%; flex-wrap: wrap; }
-.flex-right { flex: 1 0 auto; flex-wrap: nowrap; }
-
p.channel-name { margin: 0; }
p.video-data { margin: 0; font-weight: bold; font-size: 80%; }
@@ -347,6 +412,22 @@ p.video-data { margin: 0; font-weight: bold; font-size: 80%; }
border: none;
}
+
+/*
+ * Page navigation
+ */
+
+.page-nav-container { margin: 15px 0 30px 0; }
+
+.page-prev-container { text-align: start; }
+.page-next-container { text-align: end; }
+
+.page-prev-container,
+.page-next-container {
+ display: inline-block;
+}
+
+
/*
* Footer
*/
@@ -389,6 +470,7 @@ span > select {
word-wrap: normal;
}
+
/*
* Light theme
*/
@@ -401,9 +483,18 @@ span > select {
color: #075A9E !important;
}
-.light-theme a.pure-button-primary:hover,
-.light-theme a.pure-button-primary:focus {
+.light-theme .pure-button-primary:hover,
+.light-theme .pure-button-primary:focus,
+.light-theme .pure-button-secondary:hover,
+.light-theme .pure-button-secondary:focus {
color: #fff !important;
+ border-color: rgba(0, 182, 240, 0.75) !important;
+ background-color: rgba(0, 182, 240, 0.75) !important;
+}
+
+.light-theme .pure-button-secondary:not(.low-profile) {
+ color: #335d7a;
+ background-color: #fff2;
}
.light-theme a {
@@ -431,9 +522,18 @@ span > select {
color: #075A9E !important;
}
- .no-theme a.pure-button-primary:hover,
- .no-theme a.pure-button-primary:focus {
+ .no-theme .pure-button-primary:hover,
+ .no-theme .pure-button-primary:focus,
+ .no-theme .pure-button-secondary:hover,
+ .no-theme .pure-button-secondary:focus {
color: #fff !important;
+ border-color: rgba(0, 182, 240, 0.75) !important;
+ background-color: rgba(0, 182, 240, 0.75) !important;
+ }
+
+ .no-theme .pure-button-secondary:not(.low-profile) {
+ color: #335d7a;
+ background-color: #fff2;
}
.no-theme a {
@@ -453,6 +553,7 @@ span > select {
}
}
+
/*
* Dark theme
*/
@@ -465,6 +566,20 @@ span > select {
color: rgb(0, 182, 240);
}
+.dark-theme .pure-button-primary:hover,
+.dark-theme .pure-button-primary:focus,
+.dark-theme .pure-button-secondary:hover,
+.dark-theme .pure-button-secondary:focus {
+ color: #fff !important;
+ border-color: rgb(0, 182, 240) !important;
+ background-color: rgba(0, 182, 240, 1) !important;
+}
+
+.dark-theme .pure-button-secondary {
+ background-color: #0002;
+ color: #ddd;
+}
+
.dark-theme a {
color: #a0a0a0;
text-decoration: none;
@@ -505,6 +620,20 @@ body.dark-theme {
color: rgb(0, 182, 240);
}
+ .no-theme .pure-button-primary:hover,
+ .no-theme .pure-button-primary:focus,
+ .no-theme .pure-button-secondary:hover,
+ .no-theme .pure-button-secondary:focus {
+ color: #fff !important;
+ border-color: rgb(0, 182, 240) !important;
+ background-color: rgba(0, 182, 240, 1) !important;
+ }
+
+ .no-theme .pure-button-secondary {
+ background-color: #0002;
+ color: #ddd;
+ }
+
.no-theme a {
color: #a0a0a0;
text-decoration: none;
@@ -539,6 +668,12 @@ body.dark-theme {
}
}
+
+/*
+ * Miscellanous
+ */
+
+
/*With commit d9528f5 all contents of the page is now within a flexbox. However,
the hr element is rendered improperly within one.
See https://stackoverflow.com/a/34372979 for more info */
@@ -576,12 +711,7 @@ label[for="music-desc-expansion"]:hover {
}
/* Bidi (bidirectional text) support */
-h1,
-h2,
-h3,
-h4,
-h5,
-p,
+h1, h2, h3, h4, h5, p,
#descriptionWrapper,
#description-box,
#music-description-box {
diff --git a/config/config.example.yml b/config/config.example.yml
index c591eb6a..34070fe5 100644
--- a/config/config.example.yml
+++ b/config/config.example.yml
@@ -455,13 +455,17 @@ jobs:
#use_pubsub_feeds: false
##
-## HMAC signing key used for CSRF tokens and pubsub
+## HMAC signing key used for CSRF tokens, cookies and pubsub
## subscriptions verification.
##
+## Note: This parameter is mandatory and should be a random string.
+## Such random string can be generated on linux with the following
+## command: `pwgen 20 1`
+##
## Accepted values: a string
## Default: <none>
##
-#hmac_key:
+hmac_key: "CHANGE_ME!!"
##
## List of video IDs where the "download" widget must be
diff --git a/docker-compose.yml b/docker-compose.yml
index eb83b020..6a854475 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -30,6 +30,7 @@ services:
# domain:
# https_only: false
# statistics_enabled: false
+ hmac_key: "CHANGE_ME!!"
healthcheck:
test: wget -nv --tries=1 --spider http://127.0.0.1:3000/api/v1/comments/jNQXAC9IVRw || exit 1
interval: 30s
diff --git a/locales/af.json b/locales/af.json
index 0967ef42..35f40a13 100644
--- a/locales/af.json
+++ b/locales/af.json
@@ -1 +1,15 @@
-{}
+{
+ "generic_views_count": "{{count}} kyk",
+ "generic_views_count_plural": "{{count}} kyke",
+ "generic_videos_count": "{{count}} video",
+ "generic_videos_count_plural": "{{count}} videos",
+ "generic_playlists_count": "{{count}} snitlys",
+ "generic_playlists_count_plural": "{{count}} snitlyste",
+ "generic_subscriptions_count": "{{count}} intekening",
+ "generic_subscriptions_count_plural": "{{count}} intekeninge",
+ "LIVE": "LEWENDIG",
+ "generic_subscribers_count": "{{count}} intekenaar",
+ "generic_subscribers_count_plural": "{{count}} intekenare",
+ "Shared `x` ago": "`x` gelede gedeel",
+ "New passwords must match": "Nuwe wagwoord moet ooreenstem"
+}
diff --git a/locales/ar.json b/locales/ar.json
index 2e275e77..c137d1a3 100644
--- a/locales/ar.json
+++ b/locales/ar.json
@@ -48,8 +48,8 @@
"preferences_category_player": "إعدادات المُشغِّل",
"preferences_video_loop_label": "كرر المقطع المرئيّ دائما: ",
"preferences_autoplay_label": "تشغيل تلقائي: ",
- "preferences_continue_label": "شغل المقطع التالي تلقائيًا: ",
- "preferences_continue_autoplay_label": "شغل المقطع التالي تلقائيًا: ",
+ "preferences_continue_label": "تشغيل المقطع التالي تلقائيًا: ",
+ "preferences_continue_autoplay_label": "شغل المقطع التالي تلقائيًا: . ",
"preferences_listen_label": "تشغيل النسخة السمعية تلقائيًا: ",
"preferences_local_label": "بروكسي المقاطع المرئيّة؟ ",
"preferences_speed_label": "السرعة الافتراضية: ",
@@ -155,7 +155,7 @@
"View more comments on Reddit": "عرض المزيد من التعليقات على\\من موقع ريديت",
"View `x` comments": {
"([^.,0-9]|^)1([^.,0-9]|$)": "عرض `x` تعليقات",
- "": "عرض `x` تعليقات"
+ "": "عرض `x` تعليقات."
},
"View Reddit comments": "عرض تعليقات ريديت",
"Hide replies": "إخفاء الردود",
diff --git a/locales/ca.json b/locales/ca.json
index 6a320b02..4392c2a9 100644
--- a/locales/ca.json
+++ b/locales/ca.json
@@ -475,5 +475,6 @@
"Engagement: ": "Atracció: ",
"Redirect homepage to feed: ": "Redirigeix la pàgina d'inici al feed: ",
"Standard YouTube license": "Llicència estàndard de YouTube",
- "Download is disabled": "Les baixades s'han inhabilitat"
+ "Download is disabled": "Les baixades s'han inhabilitat",
+ "Import YouTube playlist (.csv)": "Importar llista de reproducció de YouTube (.csv)"
}
diff --git a/locales/de.json b/locales/de.json
index 5703a0d7..66f2ae6f 100644
--- a/locales/de.json
+++ b/locales/de.json
@@ -475,5 +475,6 @@
"Channel Sponsor": "Kanalsponsor",
"Standard YouTube license": "Standard YouTube-Lizenz",
"Song: ": "Musik: ",
- "Download is disabled": "Herunterladen ist deaktiviert"
+ "Download is disabled": "Herunterladen ist deaktiviert",
+ "Import YouTube playlist (.csv)": "YouTube Playlist Importieren (.csv)"
}
diff --git a/locales/en-US.json b/locales/en-US.json
index e13ba968..74f43d90 100644
--- a/locales/en-US.json
+++ b/locales/en-US.json
@@ -9,6 +9,11 @@
"generic_subscribers_count_plural": "{{count}} subscribers",
"generic_subscriptions_count": "{{count}} subscription",
"generic_subscriptions_count_plural": "{{count}} subscriptions",
+ "generic_button_delete": "Delete",
+ "generic_button_edit": "Edit",
+ "generic_button_save": "Save",
+ "generic_button_cancel": "Cancel",
+ "generic_button_rss": "RSS",
"LIVE": "LIVE",
"Shared `x` ago": "Shared `x` ago",
"Unsubscribe": "Unsubscribe",
@@ -170,6 +175,7 @@
"Title": "Title",
"Playlist privacy": "Playlist privacy",
"Editing playlist `x`": "Editing playlist `x`",
+ "playlist_button_add_items": "Add videos",
"Show more": "Show more",
"Show less": "Show less",
"Watch on YouTube": "Watch on YouTube",
@@ -474,6 +480,8 @@
"channel_tab_videos_label": "Videos",
"channel_tab_shorts_label": "Shorts",
"channel_tab_streams_label": "Livestreams",
+ "channel_tab_podcasts_label": "Podcasts",
+ "channel_tab_releases_label": "Releases",
"channel_tab_playlists_label": "Playlists",
"channel_tab_community_label": "Community",
"channel_tab_channels_label": "Channels"
diff --git a/locales/fr.json b/locales/fr.json
index d2607a49..2eb4dd2b 100644
--- a/locales/fr.json
+++ b/locales/fr.json
@@ -9,6 +9,11 @@
"generic_subscribers_count_plural": "{{count}} abonnés",
"generic_subscriptions_count": "{{count}} abonnement",
"generic_subscriptions_count_plural": "{{count}} abonnements",
+ "generic_button_delete": "Supprimer",
+ "generic_button_edit": "Editer",
+ "generic_button_save": "Enregistrer",
+ "generic_button_cancel": "Annuler",
+ "generic_button_rss": "RSS",
"LIVE": "EN DIRECT",
"Shared `x` ago": "Ajoutée il y a `x`",
"Unsubscribe": "Se désabonner",
@@ -149,6 +154,7 @@
"Title": "Titre",
"Playlist privacy": "Paramètres de confidentialité de la liste de lecture",
"Editing playlist `x`": "Modifier la liste de lecture `x`",
+ "playlist_button_add_items": "Ajouter des vidéos",
"Show more": "Afficher plus",
"Show less": "Afficher moins",
"Watch on YouTube": "Voir la vidéo sur Youtube",
diff --git a/locales/ja.json b/locales/ja.json
index 80e28460..8adcbf6a 100644
--- a/locales/ja.json
+++ b/locales/ja.json
@@ -53,7 +53,7 @@
"preferences_category_player": "プレイヤーの設定",
"preferences_video_loop_label": "常にループ: ",
"preferences_autoplay_label": "自動再生: ",
- "preferences_continue_label": "次の動画を再生をオン: ",
+ "preferences_continue_label": "次の動画を自動再生: ",
"preferences_continue_autoplay_label": "次の動画を自動再生: ",
"preferences_listen_label": "音声モードを使用: ",
"preferences_local_label": "動画視聴にプロキシを経由: ",
diff --git a/locales/nb-NO.json b/locales/nb-NO.json
index 05cc7328..1e0e9e77 100644
--- a/locales/nb-NO.json
+++ b/locales/nb-NO.json
@@ -464,5 +464,17 @@
"search_filters_apply_button": "Bruk valgte filtre",
"search_filters_date_option_none": "Siden begynnelsen",
"search_filters_features_option_vr180": "VR180",
- "error_video_not_in_playlist": "Forespurt video finnes ikke i denne spillelisten. <a href=\"`x`\">Trykk her for spillelistens hjemmeside.</a>"
+ "error_video_not_in_playlist": "Forespurt video finnes ikke i denne spillelisten. <a href=\"`x`\">Trykk her for spillelistens hjemmeside.</a>",
+ "Standard YouTube license": "Standard YouTube-lisens",
+ "Song: ": "Sang: ",
+ "channel_tab_streams_label": "Direktesendinger",
+ "channel_tab_shorts_label": "Kortvideoer",
+ "channel_tab_playlists_label": "Spillelister",
+ "Music in this video": "Musikk i denne videoen",
+ "channel_tab_channels_label": "Kanaler",
+ "Artist: ": "Artist: ",
+ "Album: ": "Album: ",
+ "Download is disabled": "Nedlasting er avskrudd",
+ "Channel Sponsor": "Kanalsponsor",
+ "Import YouTube playlist (.csv)": "Importer YouTube-spilleliste (.csv)"
}
diff --git a/locales/pt.json b/locales/pt.json
index c817460a..dfa411c3 100644
--- a/locales/pt.json
+++ b/locales/pt.json
@@ -475,5 +475,6 @@
"Song: ": "Canção: ",
"Channel Sponsor": "Patrocinador do canal",
"Standard YouTube license": "Licença padrão do YouTube",
- "Download is disabled": "A descarga está desativada"
+ "Download is disabled": "A descarga está desativada",
+ "Import YouTube playlist (.csv)": "Importar lista de reprodução do YouTube (.csv)"
}
diff --git a/locales/ru.json b/locales/ru.json
index 7f79a90c..a93207ad 100644
--- a/locales/ru.json
+++ b/locales/ru.json
@@ -4,7 +4,7 @@
"Unsubscribe": "Отписаться",
"Subscribe": "Подписаться",
"View channel on YouTube": "Смотреть канал на YouTube",
- "View playlist on YouTube": "Просмотреть подборку на ютубе",
+ "View playlist on YouTube": "Посмотреть плейлист на YouTube",
"newest": "сначала новые",
"oldest": "сначала старые",
"popular": "популярные",
@@ -126,14 +126,14 @@
"Public": "Публичный",
"Unlisted": "Нет в списке",
"Private": "Приватный",
- "View all playlists": "Просмотреть все подборки",
+ "View all playlists": "Посмотреть все плейлисты",
"Updated `x` ago": "Обновлено `x` назад",
- "Delete playlist `x`?": "Удалить подборку `x`?",
- "Delete playlist": "Удалить подборку",
- "Create playlist": "Создать подборку",
+ "Delete playlist `x`?": "Удалить плейлист `x`?",
+ "Delete playlist": "Удалить плейлист",
+ "Create playlist": "Создать плейлист",
"Title": "Заголовок",
- "Playlist privacy": "Видимость подборки",
- "Editing playlist `x`": "Изменение подборки `x`",
+ "Playlist privacy": "Видимость плейлиста",
+ "Editing playlist `x`": "Редактирование плейлиста `x`",
"Show more": "Развернуть",
"Show less": "Свернуть",
"Watch on YouTube": "Смотреть на YouTube",
@@ -179,9 +179,9 @@
"`x` ago": "`x` назад",
"Load more": "Загрузить ещё",
"Could not create mix.": "Не удалось создать микс.",
- "Empty playlist": "Подборка пуста",
- "Not a playlist.": "Это не подборка.",
- "Playlist does not exist.": "Подборка не существует.",
+ "Empty playlist": "Плейлист пуст",
+ "Not a playlist.": "Это не плейлист.",
+ "Playlist does not exist.": "Плейлист не существует.",
"Could not pull trending pages.": "Не удаётся загрузить страницы «в тренде».",
"Hidden field \"challenge\" is a required field": "Необходимо заполнить скрытое поле «challenge»",
"Hidden field \"token\" is a required field": "Необходимо заполнить скрытое поле «токен»",
@@ -302,7 +302,7 @@
"About": "О сайте",
"Rating: ": "Рейтинг: ",
"preferences_locale_label": "Язык: ",
- "View as playlist": "Смотреть как подборку",
+ "View as playlist": "Смотреть как плейлист",
"Default": "По умолчанию",
"Music": "Музыка",
"Gaming": "Игры",
@@ -318,16 +318,16 @@
"Audio mode": "Аудио режим",
"Video mode": "Видео режим",
"channel_tab_videos_label": "Видео",
- "Playlists": "Подборки",
+ "Playlists": "Плейлисты",
"channel_tab_community_label": "Сообщество",
- "search_filters_sort_option_relevance": "по актуальности",
- "search_filters_sort_option_rating": "по рейтингу",
- "search_filters_sort_option_date": "по дате загрузки",
- "search_filters_sort_option_views": "по просмотрам",
+ "search_filters_sort_option_relevance": "актуальности",
+ "search_filters_sort_option_rating": "рейтингу",
+ "search_filters_sort_option_date": "дате загрузки",
+ "search_filters_sort_option_views": "просмотрам",
"search_filters_type_label": "Тип",
"search_filters_duration_label": "Длительность",
"search_filters_features_label": "Дополнительно",
- "search_filters_sort_label": "Сортировать",
+ "search_filters_sort_label": "Сортировать по",
"search_filters_date_option_hour": "Последний час",
"search_filters_date_option_today": "Сегодня",
"search_filters_date_option_week": "Эта неделя",
@@ -335,7 +335,7 @@
"search_filters_date_option_year": "Этот год",
"search_filters_type_option_video": "Видео",
"search_filters_type_option_channel": "Канал",
- "search_filters_type_option_playlist": "Подборка",
+ "search_filters_type_option_playlist": "Плейлист",
"search_filters_type_option_movie": "Фильм",
"search_filters_type_option_show": "Сериал",
"search_filters_features_option_hd": "HD",
@@ -377,7 +377,7 @@
"videoinfo_youTube_embed_link": "Версия для встраивания",
"videoinfo_invidious_embed_link": "Ссылка для встраивания",
"download_subtitles": "Субтитры - `x` (.vtt)",
- "user_created_playlists": "`x` созданных подборок",
+ "user_created_playlists": "`x` созданных плейлистов",
"crash_page_you_found_a_bug": "Похоже, вы нашли ошибку в Invidious!",
"crash_page_before_reporting": "Прежде чем сообщать об ошибке, убедитесь, что вы:",
"crash_page_refresh": "пробовали <a href=\"`x`\"> перезагрузить страницу</a>",
@@ -385,9 +385,9 @@
"generic_videos_count_0": "{{count}} видео",
"generic_videos_count_1": "{{count}} видео",
"generic_videos_count_2": "{{count}} видео",
- "generic_playlists_count_0": "{{count}} подборка",
- "generic_playlists_count_1": "{{count}} подборки",
- "generic_playlists_count_2": "{{count}} подборок",
+ "generic_playlists_count_0": "{{count}} плейлист",
+ "generic_playlists_count_1": "{{count}} плейлиста",
+ "generic_playlists_count_2": "{{count}} плейлистов",
"tokens_count_0": "{{count}} токен",
"tokens_count_1": "{{count}} токена",
"tokens_count_2": "{{count}} токенов",
@@ -446,7 +446,7 @@
"footer_source_code": "Исходный код",
"footer_original_source_code": "Оригинальный исходный код",
"footer_modfied_source_code": "Изменённый исходный код",
- "user_saved_playlists": "`x` сохранённых подборок",
+ "user_saved_playlists": "`x` сохранённых плейлистов",
"crash_page_search_issue": "поискали <a href=\"`x`\">похожую проблему на GitHub</a>",
"comments_points_count_0": "{{count}} плюс",
"comments_points_count_1": "{{count}} плюса",
@@ -480,8 +480,8 @@
"search_filters_duration_option_medium": "Средние (4 - 20 минут)",
"search_filters_apply_button": "Применить фильтры",
"Popular enabled: ": "Популярное включено: ",
- "error_video_not_in_playlist": "Запрошенного видео нет в этой подборке. <a href=\"`x`\">Нажмите тут, чтобы вернуться к странице подборки.</a>",
- "channel_tab_playlists_label": "Подборки",
+ "error_video_not_in_playlist": "Запрошенного видео нет в этом плейлисте. <a href=\"`x`\">Нажмите тут, чтобы вернуться к странице плейлиста.</a>",
+ "channel_tab_playlists_label": "Плейлисты",
"channel_tab_channels_label": "Каналы",
"channel_tab_streams_label": "Стримы",
"channel_tab_shorts_label": "Shorts",
diff --git a/locales/sl.json b/locales/sl.json
index 592ba78f..45f63c6b 100644
--- a/locales/sl.json
+++ b/locales/sl.json
@@ -507,5 +507,6 @@
"Song: ": "Pesem: ",
"Standard YouTube license": "Standardna licenca YouTube",
"Channel Sponsor": "Sponzor kanala",
- "Download is disabled": "Prenos je onemogočen"
+ "Download is disabled": "Prenos je onemogočen",
+ "Import YouTube playlist (.csv)": "Uvoz seznama predvajanja YouTube (.csv)"
}
diff --git a/locales/vi.json b/locales/vi.json
index 42076745..d79c684c 100644
--- a/locales/vi.json
+++ b/locales/vi.json
@@ -1,10 +1,10 @@
{
"generic_videos_count_0": "{{count}} video",
- "generic_subscribers_count_0": "{{count}} subscribers",
+ "generic_subscribers_count_0": "{{count}} người theo dõi",
"LIVE": "TRỰC TIẾP",
"Shared `x` ago": "Đã chia sẻ` x` trước",
- "Unsubscribe": "Hủy đăng ký",
- "Subscribe": "Đăng ký",
+ "Unsubscribe": "Hủy theo dõi",
+ "Subscribe": "Theo dõi",
"View channel on YouTube": "Xem kênh trên YouTube",
"View playlist on YouTube": "Xem danh sách phát trên YouTube",
"newest": "mới nhất",
@@ -22,15 +22,15 @@
"No": "Không",
"Import and Export Data": "Nhập và xuất dữ liệu",
"Import": "Nhập",
- "Import Invidious data": "Nhập dữ liệu sống động",
- "Import YouTube subscriptions": "Nhập đăng ký YouTube",
+ "Import Invidious data": "Nhập dữ liệu Invidious JSON",
+ "Import YouTube subscriptions": "Nhập dữ liệu thuê bao YouTube/OPML",
"Import FreeTube subscriptions (.db)": "Nhập đăng ký FreeTube (.db)",
"Import NewPipe subscriptions (.json)": "Nhập đăng ký NewPipe (.json)",
"Import NewPipe data (.zip)": "Nhập dữ liệu NewPipe (.zip)",
"Export": "Xuất",
"Export subscriptions as OPML": "Xuất đăng ký dưới dạng OPML",
"Export subscriptions as OPML (for NewPipe & FreeTube)": "Xuất đăng ký dưới dạng OPML (cho NewPipe & FreeTube)",
- "Export data as JSON": "Xuất dữ liệu dưới dạng JSON",
+ "Export data as JSON": "Xuất dữ liệu Invidious dưới dạng JSON",
"Delete account?": "Xóa tài khoản?",
"History": "Lịch sử",
"An alternative front-end to YouTube": "Giao diện người dùng thay thế cho YouTube",
@@ -47,34 +47,34 @@
"Register": "Đăng ký",
"E-mail": "E-mail",
"Preferences": "Sở thích",
- "preferences_category_player": "Tùy chọn người chơi",
+ "preferences_category_player": "Tùy chọn trình phát video",
"preferences_video_loop_label": "Luôn lặp lại: ",
"preferences_autoplay_label": "Tự chạy: ",
- "preferences_continue_label": "Phát tiếp theo theo mặc định: ",
+ "preferences_continue_label": "Phát kế tiếp theo mặc định: ",
"preferences_continue_autoplay_label": "Tự động phát video tiếp theo: ",
"preferences_listen_label": "Nghe theo mặc định: ",
"preferences_local_label": "Video proxy: ",
"preferences_speed_label": "Tốc độ mặc định: ",
"preferences_quality_label": "Chất lượng video ưa thích: ",
- "preferences_volume_label": "Khối lượng trình phát: ",
+ "preferences_volume_label": "Âm lượng trình phát video: ",
"preferences_comments_label": "Nhận xét mặc định: ",
"youtube": "YouTube",
- "reddit": "reddit",
+ "reddit": "Reddit",
"preferences_captions_label": "Phụ đề mặc định: ",
"Fallback captions: ": "Phụ đề dự phòng: ",
"preferences_related_videos_label": "Hiển thị các video có liên quan: ",
"preferences_annotations_label": "Hiển thị chú thích theo mặc định: ",
"preferences_extend_desc_label": "Tự động mở rộng mô tả video: ",
- "preferences_vr_mode_label": "Video 360 độ tương tác: ",
+ "preferences_vr_mode_label": "Video 360 độ tương tác (yêu cầu WebGL): ",
"preferences_category_visual": "Tùy chọn hình ảnh",
- "preferences_player_style_label": "Phong cách người chơi: ",
+ "preferences_player_style_label": "Phong cách trình phát: ",
"Dark mode: ": "Chế độ tối: ",
"preferences_dark_mode_label": "Chủ đề: ",
"dark": "tối",
"light": "ánh sáng",
"preferences_thin_mode_label": "Chế độ mỏng: ",
"preferences_category_misc": "Tùy chọn khác",
- "preferences_automatic_instance_redirect_label": "Chuyển hướng phiên bản tự động (dự phòng thành redirect.invidious.io): ",
+ "preferences_automatic_instance_redirect_label": "Tự động chuyển hướng phiên bản (dự phòng về redirect.invidious.io): ",
"preferences_category_subscription": "Tùy chọn đăng ký",
"preferences_annotations_subscribed_label": "Hiển thị chú thích theo mặc định cho các kênh đã đăng ký: ",
"Redirect homepage to feed: ": "Chuyển hướng trang chủ đến nguồn cấp dữ liệu: ",
@@ -114,14 +114,14 @@
"Subscription manager": "Người quản lý đăng ký",
"Token manager": "Trình quản lý mã thông báo",
"Token": "Mã thông báo",
- "search": "Tìm kiếm",
+ "search": "tìm kiếm",
"Log out": "Đăng xuất",
"Source available here.": "Nguồn có sẵn ở đây.",
"View JavaScript license information.": "Xem thông tin giấy phép JavaScript.",
"View privacy policy.": "Xem chính sách bảo mật.",
"Trending": "Xu hướng",
"Public": "Công cộng",
- "Unlisted": "Riêng tư",
+ "Unlisted": "Không hiển thị",
"Private": "Riêng tư",
"View all playlists": "Xem tất cả danh sách phát",
"Updated `x` ago": "Đã cập nhật` x` trước",
@@ -337,6 +337,51 @@
"generic_playlists_count": "{{count}} danh sách phát",
"generic_views_count": "{{count}} lượt xem",
"View `x` comments": {
- "": "Xem `x` bình luận"
- }
+ "": "Xem `x` bình luận",
+ "([^.,0-9]|^)1([^.,0-9]|$)": "Hiển thị `x`bình luận"
+ },
+ "Song: ": "Ca khúc: ",
+ "Premieres in `x`": "Trình chiếu lần đầu vào `x`",
+ "preferences_quality_dash_option_worst": "Thấp nhất",
+ "preferences_watch_history_label": "Bật lịch sử video đã xem ",
+ "preferences_quality_option_hd720": "HD720",
+ "unsubscribe": "hủy đăng kí",
+ "revoke": "gỡ bỏ",
+ "preferences_quality_dash_label": "Chất lượng video DASH ưa thích ",
+ "preferences_quality_dash_option_auto": "Tự động",
+ "Subscriptions": "Thuê bao",
+ "View YouTube comments": "Hiển thị bình luận trên YouTube",
+ "View more comments on Reddit": "Hiển thị thêm bình luận từ Reddit",
+ "Music in this video": "Nhạc trong video này",
+ "Artist: ": "Nghệ sĩ: ",
+ "Premieres `x`": "Phát lần đầu `x`",
+ "preferences_region_label": "Nội dung theo quốc gia ",
+ "search_message_change_filters_or_query": "Thử mở rộng nội dung tìm kiếm hoặc thay đổi bộ lọc.",
+ "preferences_quality_option_small": "Nhỏ",
+ "preferences_quality_dash_option_144p": "144p",
+ "invidious": "Invidious",
+ "preferences_quality_dash_option_240p": "240p",
+ "Import/export": "Xuất/nhập dữ liệu",
+ "preferences_quality_dash_option_4320p": "4320p",
+ "preferences_quality_option_dash": "DASH (tự tối ưu chất lượng)",
+ "generic_subscriptions_count_0": "{{count}} thuê bao",
+ "preferences_quality_dash_option_1440p": "1440p",
+ "preferences_quality_dash_option_480p": "480p",
+ "preferences_quality_dash_option_2160p": "2160p",
+ "search_message_no_results": "Tìm kiếm không có kết quả.",
+ "preferences_quality_dash_option_1080p": "1080p",
+ "preferences_quality_dash_option_720p": "720p",
+ "preferences_quality_option_medium": "Trung bình",
+ "Load more": "Hiển thị thêm",
+ "comments_points_count_0": "{{count}} điểm",
+ "Import YouTube playlist (.csv)": "Nhập danh sách phát YouTube (.csv)",
+ "preferences_quality_dash_option_best": "Tốt nhất",
+ "preferences_quality_dash_option_360p": "360p",
+ "subscriptions_unseen_notifs_count_0": "{{count}} thông báo chưa đọc",
+ "Released under the AGPLv3 on Github.": "Phát hành dưới giấy phép AGPLv3 trên GitHub.",
+ "search_message_use_another_instance": " Bạn cũng có thể tìm kiếm <a href=\"`x`\"> ở một phiên bản khác</a>.",
+ "Standard YouTube license": "Giấy phép YouTube thông thường",
+ "Album: ": "Album: ",
+ "preferences_save_player_pos_label": "Lưu vị trí xem cuối cùng ",
+ "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.": "Xin chào! Có vẻ như bạn đã tắt JavaScript. Bấm vào đây để xem bình luận, lưu ý rằng thời gian tải có thể lâu hơn."
}
diff --git a/src/invidious.cr b/src/invidious.cr
index 636e28a6..84e1895d 100644
--- a/src/invidious.cr
+++ b/src/invidious.cr
@@ -57,9 +57,8 @@ end
# Simple alias to make code easier to read
alias IV = Invidious
-CONFIG = Config.load
-HMAC_KEY_CONFIGURED = CONFIG.hmac_key != nil
-HMAC_KEY = CONFIG.hmac_key || Random::Secure.hex(32)
+CONFIG = Config.load
+HMAC_KEY = CONFIG.hmac_key
PG_DB = DB.open CONFIG.database_url
ARCHIVE_URL = URI.parse("https://archive.org")
@@ -230,10 +229,6 @@ Kemal.config.host_binding = Kemal.config.host_binding != "0.0.0.0" ? Kemal.confi
Kemal.config.port = Kemal.config.port != 3000 ? Kemal.config.port : CONFIG.port
Kemal.config.app_name = "Invidious"
-if !HMAC_KEY_CONFIGURED
- LOGGER.warn("Please configure hmac_key by July 1st, see more here: https://github.com/iv-org/invidious/issues/3854")
-end
-
# Use in kemal's production mode.
# Users can also set the KEMAL_ENV environmental variable for this to be set automatically.
{% if flag?(:release) || flag?(:production) %}
diff --git a/src/invidious/channels/playlists.cr b/src/invidious/channels/playlists.cr
index 8dc824b2..91029fe3 100644
--- a/src/invidious/channels/playlists.cr
+++ b/src/invidious/channels/playlists.cr
@@ -26,3 +26,21 @@ def fetch_channel_playlists(ucid, author, continuation, sort_by)
return extract_items(initial_data, author, ucid)
end
+
+def fetch_channel_podcasts(ucid, author, continuation)
+ if continuation
+ initial_data = YoutubeAPI.browse(continuation)
+ else
+ initial_data = YoutubeAPI.browse(ucid, params: "Eghwb2RjYXN0c_IGBQoDugEA")
+ end
+ return extract_items(initial_data, author, ucid)
+end
+
+def fetch_channel_releases(ucid, author, continuation)
+ if continuation
+ initial_data = YoutubeAPI.browse(continuation)
+ else
+ initial_data = YoutubeAPI.browse(ucid, params: "EghyZWxlYXNlc_IGBQoDsgEA")
+ end
+ return extract_items(initial_data, author, ucid)
+end
diff --git a/src/invidious/config.cr b/src/invidious/config.cr
index 9fc58409..e5f1e822 100644
--- a/src/invidious/config.cr
+++ b/src/invidious/config.cr
@@ -85,7 +85,7 @@ class Config
# Used to tell Invidious it is behind a proxy, so links to resources should be https://
property https_only : Bool?
# HMAC signing key for CSRF tokens and verifying pubsub subscriptions
- property hmac_key : String?
+ property hmac_key : String = ""
# Domain to be used for links to resources on the site where an absolute URL is required
property domain : String?
# Subscribe to channels using PubSubHubbub (requires domain, hmac_key)
@@ -204,6 +204,16 @@ class Config
end
{% end %}
+ # HMAC_key is mandatory
+ # See: https://github.com/iv-org/invidious/issues/3854
+ if config.hmac_key.empty?
+ puts "Config: 'hmac_key' is required/can't be empty"
+ exit(1)
+ elsif config.hmac_key == "CHANGE_ME!!"
+ puts "Config: The value of 'hmac_key' needs to be changed!!"
+ exit(1)
+ end
+
# Build database_url from db.* if it's not set directly
if config.database_url.to_s.empty?
if db = config.db
@@ -216,7 +226,7 @@ class Config
path: db.dbname,
)
else
- puts "Config : Either database_url or db.* is required"
+ puts "Config: Either database_url or db.* is required"
exit(1)
end
end
diff --git a/src/invidious/frontend/channel_page.cr b/src/invidious/frontend/channel_page.cr
index 53745dd5..fe7d6d6e 100644
--- a/src/invidious/frontend/channel_page.cr
+++ b/src/invidious/frontend/channel_page.cr
@@ -5,6 +5,8 @@ module Invidious::Frontend::ChannelPage
Videos
Shorts
Streams
+ Podcasts
+ Releases
Playlists
Community
Channels
diff --git a/src/invidious/frontend/pagination.cr b/src/invidious/frontend/pagination.cr
new file mode 100644
index 00000000..3f931f4e
--- /dev/null
+++ b/src/invidious/frontend/pagination.cr
@@ -0,0 +1,97 @@
+require "uri"
+
+module Invidious::Frontend::Pagination
+ extend self
+
+ private def previous_page(str : String::Builder, locale : String?, url : String)
+ # Link
+ str << %(<a href=") << url << %(" class="pure-button pure-button-secondary">)
+
+ if locale_is_rtl?(locale)
+ # Inverted arrow ("previous" points to the right)
+ str << translate(locale, "Previous page")
+ str << "&nbsp;&nbsp;"
+ str << %(<i class="icon ion-ios-arrow-forward"></i>)
+ else
+ # Regular arrow ("previous" points to the left)
+ str << %(<i class="icon ion-ios-arrow-back"></i>)
+ str << "&nbsp;&nbsp;"
+ str << translate(locale, "Previous page")
+ end
+
+ str << "</a>"
+ end
+
+ private def next_page(str : String::Builder, locale : String?, url : String)
+ # Link
+ str << %(<a href=") << url << %(" class="pure-button pure-button-secondary">)
+
+ if locale_is_rtl?(locale)
+ # Inverted arrow ("next" points to the left)
+ str << %(<i class="icon ion-ios-arrow-back"></i>)
+ str << "&nbsp;&nbsp;"
+ str << translate(locale, "Next page")
+ else
+ # Regular arrow ("next" points to the right)
+ str << translate(locale, "Next page")
+ str << "&nbsp;&nbsp;"
+ str << %(<i class="icon ion-ios-arrow-forward"></i>)
+ end
+
+ str << "</a>"
+ end
+
+ def nav_numeric(locale : String?, *, base_url : String | URI, current_page : Int, show_next : Bool = true)
+ return String.build do |str|
+ str << %(<div class="h-box">\n)
+ str << %(<div class="page-nav-container flexible">\n)
+
+ str << %(<div class="page-prev-container flex-left">)
+
+ if current_page > 1
+ params_prev = URI::Params{"page" => (current_page - 1).to_s}
+ url_prev = HttpServer::Utils.add_params_to_url(base_url, params_prev)
+
+ self.previous_page(str, locale, url_prev.to_s)
+ end
+
+ str << %(</div>\n)
+ str << %(<div class="page-next-container flex-right">)
+
+ if show_next
+ params_next = URI::Params{"page" => (current_page + 1).to_s}
+ url_next = HttpServer::Utils.add_params_to_url(base_url, params_next)
+
+ self.next_page(str, locale, url_next.to_s)
+ end
+
+ str << %(</div>\n)
+
+ str << %(</div>\n)
+ str << %(</div>\n\n)
+ end
+ end
+
+ def nav_ctoken(locale : String?, *, base_url : String | URI, ctoken : String?)
+ return String.build do |str|
+ str << %(<div class="h-box">\n)
+ str << %(<div class="page-nav-container flexible">\n)
+
+ str << %(<div class="page-prev-container flex-left"></div>\n)
+
+ str << %(<div class="page-next-container flex-right">)
+
+ if !ctoken.nil?
+ params_next = URI::Params{"continuation" => ctoken}
+ url_next = HttpServer::Utils.add_params_to_url(base_url, params_next)
+
+ self.next_page(str, locale, url_next.to_s)
+ end
+
+ str << %(</div>\n)
+
+ str << %(</div>\n)
+ str << %(</div>\n\n)
+ end
+ end
+end
diff --git a/src/invidious/helpers/i18n.cr b/src/invidious/helpers/i18n.cr
index a9ed1f64..76e477a4 100644
--- a/src/invidious/helpers/i18n.cr
+++ b/src/invidious/helpers/i18n.cr
@@ -165,3 +165,12 @@ def translate_bool(locale : String?, translation : Bool)
return translate(locale, "No")
end
end
+
+def locale_is_rtl?(locale : String?)
+ # Fallback to en-US
+ return false if locale.nil?
+
+ # Arabic, Persian, Hebrew
+ # See https://en.wikipedia.org/wiki/Right-to-left_script#List_of_RTL_scripts
+ return {"ar", "fa", "he"}.includes? locale
+end
diff --git a/src/invidious/http_server/utils.cr b/src/invidious/http_server/utils.cr
index e3f1fa0f..222dfc4a 100644
--- a/src/invidious/http_server/utils.cr
+++ b/src/invidious/http_server/utils.cr
@@ -1,3 +1,5 @@
+require "uri"
+
module Invidious::HttpServer
module Utils
extend self
@@ -16,5 +18,23 @@ module Invidious::HttpServer
return "#{url.request_target}?#{params}"
end
end
+
+ def add_params_to_url(url : String | URI, params : URI::Params) : URI
+ url = URI.parse(url) if url.is_a?(String)
+
+ url_query = url.query || ""
+
+ # Append the parameters
+ url.query = String.build do |str|
+ if !url_query.empty?
+ str << url_query
+ str << '&'
+ end
+
+ str << params
+ end
+
+ return url
+ end
end
end
diff --git a/src/invidious/routes/api/v1/channels.cr b/src/invidious/routes/api/v1/channels.cr
index bcb4db2c..adf05d30 100644
--- a/src/invidious/routes/api/v1/channels.cr
+++ b/src/invidious/routes/api/v1/channels.cr
@@ -245,7 +245,7 @@ module Invidious::Routes::API::V1::Channels
channel = nil # Make the compiler happy
get_channel()
- items, continuation = fetch_channel_playlists(channel.ucid, channel.author, continuation, sort_by)
+ items, next_continuation = fetch_channel_playlists(channel.ucid, channel.author, continuation, sort_by)
JSON.build do |json|
json.object do
@@ -257,7 +257,65 @@ module Invidious::Routes::API::V1::Channels
end
end
- json.field "continuation", continuation
+ json.field "continuation", next_continuation if next_continuation
+ end
+ end
+ end
+
+ def self.podcasts(env)
+ locale = env.get("preferences").as(Preferences).locale
+
+ env.response.content_type = "application/json"
+
+ ucid = env.params.url["ucid"]
+ continuation = env.params.query["continuation"]?
+
+ # Use the macro defined above
+ channel = nil # Make the compiler happy
+ get_channel()
+
+ items, next_continuation = fetch_channel_podcasts(channel.ucid, channel.author, continuation)
+
+ JSON.build do |json|
+ json.object do
+ json.field "playlists" do
+ json.array do
+ items.each do |item|
+ item.to_json(locale, json) if item.is_a?(SearchPlaylist)
+ end
+ end
+ end
+
+ json.field "continuation", next_continuation if next_continuation
+ end
+ end
+ end
+
+ def self.releases(env)
+ locale = env.get("preferences").as(Preferences).locale
+
+ env.response.content_type = "application/json"
+
+ ucid = env.params.url["ucid"]
+ continuation = env.params.query["continuation"]?
+
+ # Use the macro defined above
+ channel = nil # Make the compiler happy
+ get_channel()
+
+ items, next_continuation = fetch_channel_releases(channel.ucid, channel.author, continuation)
+
+ JSON.build do |json|
+ json.object do
+ json.field "playlists" do
+ json.array do
+ items.each do |item|
+ item.to_json(locale, json) if item.is_a?(SearchPlaylist)
+ end
+ end
+ end
+
+ json.field "continuation", next_continuation if next_continuation
end
end
end
diff --git a/src/invidious/routes/channels.cr b/src/invidious/routes/channels.cr
index 16621994..9892ae2a 100644
--- a/src/invidious/routes/channels.cr
+++ b/src/invidious/routes/channels.cr
@@ -27,7 +27,7 @@ module Invidious::Routes::Channels
item.author
end
end
- items = items.select(SearchPlaylist).map(&.as(SearchPlaylist))
+ items = items.select(SearchPlaylist)
items.each(&.author = "")
else
sort_options = {"newest", "oldest", "popular"}
@@ -105,13 +105,53 @@ module Invidious::Routes::Channels
channel.ucid, channel.author, continuation, (sort_by || "last")
)
- items = items.select(SearchPlaylist).map(&.as(SearchPlaylist))
+ items = items.select(SearchPlaylist)
items.each(&.author = "")
selected_tab = Frontend::ChannelPage::TabsAvailable::Playlists
templated "channel"
end
+ def self.podcasts(env)
+ data = self.fetch_basic_information(env)
+ return data if !data.is_a?(Tuple)
+
+ locale, user, subscriptions, continuation, ucid, channel = data
+
+ sort_by = ""
+ sort_options = [] of String
+
+ items, next_continuation = fetch_channel_podcasts(
+ channel.ucid, channel.author, continuation
+ )
+
+ items = items.select(SearchPlaylist)
+ items.each(&.author = "")
+
+ selected_tab = Frontend::ChannelPage::TabsAvailable::Podcasts
+ templated "channel"
+ end
+
+ def self.releases(env)
+ data = self.fetch_basic_information(env)
+ return data if !data.is_a?(Tuple)
+
+ locale, user, subscriptions, continuation, ucid, channel = data
+
+ sort_by = ""
+ sort_options = [] of String
+
+ items, next_continuation = fetch_channel_releases(
+ channel.ucid, channel.author, continuation
+ )
+
+ items = items.select(SearchPlaylist)
+ items.each(&.author = "")
+
+ selected_tab = Frontend::ChannelPage::TabsAvailable::Releases
+ templated "channel"
+ end
+
def self.community(env)
data = self.fetch_basic_information(env)
if !data.is_a?(Tuple)
diff --git a/src/invidious/routes/feeds.cr b/src/invidious/routes/feeds.cr
index 60f8db05..40bca008 100644
--- a/src/invidious/routes/feeds.cr
+++ b/src/invidious/routes/feeds.cr
@@ -102,6 +102,10 @@ module Invidious::Routes::Feeds
end
env.set "user", user
+ # Used for pagination links
+ base_url = "/feed/subscriptions"
+ base_url += "?max_results=#{max_results}" if env.params.query.has_key?("max_results")
+
templated "feeds/subscriptions"
end
@@ -129,6 +133,10 @@ module Invidious::Routes::Feeds
end
watched ||= [] of String
+ # Used for pagination links
+ base_url = "/feed/history"
+ base_url += "?max_results=#{max_results}" if env.params.query.has_key?("max_results")
+
templated "feeds/history"
end
diff --git a/src/invidious/routes/playlists.cr b/src/invidious/routes/playlists.cr
index 1dd3f32e..9c6843e9 100644
--- a/src/invidious/routes/playlists.cr
+++ b/src/invidious/routes/playlists.cr
@@ -163,13 +163,20 @@ module Invidious::Routes::Playlists
end
begin
- videos = get_playlist_videos(playlist, offset: (page - 1) * 100)
+ items = get_playlist_videos(playlist, offset: (page - 1) * 100)
rescue ex
- videos = [] of PlaylistVideo
+ items = [] of PlaylistVideo
end
csrf_token = generate_response(sid, {":edit_playlist"}, HMAC_KEY)
+ # Pagination
+ page_nav_html = Frontend::Pagination.nav_numeric(locale,
+ base_url: "/playlist?list=#{playlist.id}",
+ current_page: page,
+ show_next: (items.size == 100)
+ )
+
templated "edit_playlist"
end
@@ -247,11 +254,19 @@ module Invidious::Routes::Playlists
begin
query = Invidious::Search::Query.new(env.params.query, :playlist, region)
- videos = query.process.select(SearchVideo).map(&.as(SearchVideo))
+ items = query.process.select(SearchVideo).map(&.as(SearchVideo))
rescue ex
- videos = [] of SearchVideo
+ items = [] of SearchVideo
end
+ # Pagination
+ query_encoded = URI.encode_www_form(query.try &.text || "", space_to_plus: true)
+ page_nav_html = Frontend::Pagination.nav_numeric(locale,
+ base_url: "/add_playlist_items?list=#{playlist.id}&q=#{query_encoded}",
+ current_page: page,
+ show_next: (items.size >= 20)
+ )
+
env.set "add_playlist_items", plid
templated "add_playlist_items"
end
@@ -406,8 +421,13 @@ module Invidious::Routes::Playlists
return error_template(500, ex)
end
- page_count = (playlist.video_count / 200).to_i
- page_count += 1 if (playlist.video_count % 200) > 0
+ if playlist.is_a? InvidiousPlaylist
+ page_count = (playlist.video_count / 100).to_i
+ page_count += 1 if (playlist.video_count % 100) > 0
+ else
+ page_count = (playlist.video_count / 200).to_i
+ page_count += 1 if (playlist.video_count % 200) > 0
+ end
if page > page_count
return env.redirect "/playlist?list=#{plid}&page=#{page_count}"
@@ -418,7 +438,11 @@ module Invidious::Routes::Playlists
end
begin
- videos = get_playlist_videos(playlist, offset: (page - 1) * 200)
+ if playlist.is_a? InvidiousPlaylist
+ items = get_playlist_videos(playlist, offset: (page - 1) * 100)
+ else
+ items = get_playlist_videos(playlist, offset: (page - 1) * 200)
+ end
rescue ex
return error_template(500, "Error encountered while retrieving playlist videos.<br>#{ex.message}")
end
@@ -427,6 +451,13 @@ module Invidious::Routes::Playlists
env.set "remove_playlist_items", plid
end
+ # Pagination
+ page_nav_html = Frontend::Pagination.nav_numeric(locale,
+ base_url: "/playlist?list=#{playlist.id}",
+ current_page: page,
+ show_next: (page_count != 1 && page < page_count)
+ )
+
templated "playlist"
end
diff --git a/src/invidious/routes/search.cr b/src/invidious/routes/search.cr
index 6c3088de..5be33533 100644
--- a/src/invidious/routes/search.cr
+++ b/src/invidious/routes/search.cr
@@ -52,24 +52,28 @@ module Invidious::Routes::Search
user = env.get? "user"
begin
- videos = query.process
+ items = query.process
rescue ex : ChannelSearchException
return error_template(404, "Unable to find channel with id of '#{HTML.escape(ex.channel)}'. Are you sure that's an actual channel id? It should look like 'UC4QobU6STFB0P71PMvOGN5A'.")
rescue ex
return error_template(500, ex)
end
- params = query.to_http_params
- url_prev_page = "/search?#{params}&page=#{query.page - 1}"
- url_next_page = "/search?#{params}&page=#{query.page + 1}"
-
redirect_url = Invidious::Frontend::Misc.redirect_url(env)
+ # Pagination
+ page_nav_html = Frontend::Pagination.nav_numeric(locale,
+ base_url: "/search?#{query.to_http_params}",
+ current_page: query.page,
+ show_next: (items.size >= 20)
+ )
+
if query.type == Invidious::Search::Query::Type::Channel
env.set "search", "channel:#{query.channel} #{query.text}"
else
env.set "search", query.text
end
+
templated "search"
end
end
@@ -91,16 +95,18 @@ module Invidious::Routes::Search
end
begin
- videos = Invidious::Hashtag.fetch(hashtag, page)
+ items = Invidious::Hashtag.fetch(hashtag, page)
rescue ex
return error_template(500, ex)
end
- params = env.params.query.empty? ? "" : "&#{env.params.query}"
-
+ # Pagination
hashtag_encoded = URI.encode_www_form(hashtag, space_to_plus: false)
- url_prev_page = "/hashtag/#{hashtag_encoded}?page=#{page - 1}#{params}"
- url_next_page = "/hashtag/#{hashtag_encoded}?page=#{page + 1}#{params}"
+ page_nav_html = Frontend::Pagination.nav_numeric(locale,
+ base_url: "/hashtag/#{hashtag_encoded}",
+ current_page: page,
+ show_next: (items.size >= 60)
+ )
templated "hashtag"
end
diff --git a/src/invidious/routing.cr b/src/invidious/routing.cr
index daaf4d88..9c43171c 100644
--- a/src/invidious/routing.cr
+++ b/src/invidious/routing.cr
@@ -118,6 +118,8 @@ module Invidious::Routing
get "/channel/:ucid/videos", Routes::Channels, :videos
get "/channel/:ucid/shorts", Routes::Channels, :shorts
get "/channel/:ucid/streams", Routes::Channels, :streams
+ get "/channel/:ucid/podcasts", Routes::Channels, :podcasts
+ get "/channel/:ucid/releases", Routes::Channels, :releases
get "/channel/:ucid/playlists", Routes::Channels, :playlists
get "/channel/:ucid/community", Routes::Channels, :community
get "/channel/:ucid/channels", Routes::Channels, :channels
@@ -228,6 +230,9 @@ module Invidious::Routing
get "/api/v1/channels/:ucid", {{namespace}}::Channels, :home
get "/api/v1/channels/:ucid/shorts", {{namespace}}::Channels, :shorts
get "/api/v1/channels/:ucid/streams", {{namespace}}::Channels, :streams
+ get "/api/v1/channels/:ucid/podcasts", {{namespace}}::Channels, :podcasts
+ get "/api/v1/channels/:ucid/releases", {{namespace}}::Channels, :releases
+
get "/api/v1/channels/:ucid/channels", {{namespace}}::Channels, :channels
{% for route in {"videos", "latest", "playlists", "community", "search"} %}
diff --git a/src/invidious/views/add_playlist_items.ecr b/src/invidious/views/add_playlist_items.ecr
index bcba74cf..6aea82ae 100644
--- a/src/invidious/views/add_playlist_items.ecr
+++ b/src/invidious/views/add_playlist_items.ecr
@@ -31,33 +31,5 @@
</script>
<script src="/js/playlist_widget.js?v=<%= ASSET_COMMIT %>"></script>
-<div class="pure-g">
- <% videos.each_slice(4) do |slice| %>
- <% slice.each do |item| %>
- <%= rendered "components/item" %>
- <% end %>
- <% end %>
-</div>
-<script src="/js/watched_indicator.js"></script>
-
-<% if query %>
- <%- query_encoded = URI.encode_www_form(query.text, space_to_plus: true) -%>
- <div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <% if query.page > 1 %>
- <a href="/add_playlist_items?list=<%= plid %>&q=<%= query_encoded %>&page=<%= page - 1 %>">
- <%= translate(locale, "Previous page") %>
- </a>
- <% end %>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if videos.size >= 20 %>
- <a href="/add_playlist_items?list=<%= plid %>&q=<%= query_encoded %>&page=<%= page + 1 %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
- </div>
-<% end %>
+<%= rendered "components/items_paginated" %>
diff --git a/src/invidious/views/channel.ecr b/src/invidious/views/channel.ecr
index 6e62a471..09df106d 100644
--- a/src/invidious/views/channel.ecr
+++ b/src/invidious/views/channel.ecr
@@ -9,13 +9,20 @@
when .streams? then "/channel/#{ucid}/streams"
when .playlists? then "/channel/#{ucid}/playlists"
when .channels? then "/channel/#{ucid}/channels"
+ when .podcasts? then "/channel/#{ucid}/podcasts"
+ when .releases? then "/channel/#{ucid}/releases"
else
"/channel/#{ucid}"
end
youtube_url = "https://www.youtube.com#{relative_url}"
redirect_url = Invidious::Frontend::Misc.redirect_url(env)
--%>
+
+ page_nav_html = IV::Frontend::Pagination.nav_ctoken(locale,
+ base_url: relative_url,
+ ctoken: next_continuation
+ )
+%>
<% content_for "header" do %>
<%- if selected_tab.videos? -%>
@@ -43,21 +50,5 @@
<hr>
</div>
-<div class="pure-g">
-<% items.each do |item| %>
- <%= rendered "components/item" %>
-<% end %>
-</div>
-<script src="/js/watched_indicator.js"></script>
-
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-md-4-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if next_continuation %>
- <a href="<%= relative_url %>?continuation=<%= next_continuation %><% if sort_options.any? sort_by %>&sort_by=<%= sort_by %><% end %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
-</div>
+<%= rendered "components/items_paginated" %>
diff --git a/src/invidious/views/components/channel_info.ecr b/src/invidious/views/components/channel_info.ecr
index 59888760..f4164f31 100644
--- a/src/invidious/views/components/channel_info.ecr
+++ b/src/invidious/views/components/channel_info.ecr
@@ -8,29 +8,30 @@
</div>
<% end %>
-<div class="pure-g h-box">
- <div class="pure-u-2-3">
+<div class="pure-g h-box flexible title">
+ <div class="pure-u-1-2 flex-left flexible">
<div class="channel-profile">
<img src="/ggpht<%= channel_profile_pic %>" alt="" />
<span><%= author %></span><% if !channel.verified.nil? && channel.verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %>
</div>
</div>
- <div class="pure-u-1-3">
- <h3 style="text-align:right">
- <a href="/feed/channel/<%= ucid %>"><i class="icon ion-logo-rss"></i></a>
- </h3>
- </div>
-</div>
-<div class="h-box">
- <div id="descriptionWrapper">
- <p><span style="white-space:pre-wrap"><%= channel.description_html %></span></p>
+ <div class="pure-u-1-2 flex-right flexible button-container">
+ <div class="pure-u">
+ <% sub_count_text = number_to_short_text(channel.sub_count) %>
+ <%= rendered "components/subscribe_widget" %>
+ </div>
+
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary" dir="auto" href="/feed/channel/<%= ucid %>">
+ <i class="icon ion-logo-rss"></i>&nbsp;<%= translate(locale, "generic_button_rss") %>
+ </a>
+ </div>
</div>
</div>
<div class="h-box">
- <% sub_count_text = number_to_short_text(channel.sub_count) %>
- <%= rendered "components/subscribe_widget" %>
+ <div id="descriptionWrapper"><p><span style="white-space:pre-wrap"><%= channel.description_html %></span></p></div>
</div>
<div class="pure-g h-box">
diff --git a/src/invidious/views/components/item.ecr b/src/invidious/views/components/item.ecr
index 7cfd38db..7ffd2d93 100644
--- a/src/invidious/views/components/item.ecr
+++ b/src/invidious/views/components/item.ecr
@@ -1,157 +1,146 @@
-<% item_watched = !item.is_a?(SearchChannel | SearchPlaylist | InvidiousPlaylist | Category) && env.get?("user").try &.as(User).watched.index(item.id) != nil %>
+<%-
+ thin_mode = env.get("preferences").as(Preferences).thin_mode
+ item_watched = !item.is_a?(SearchChannel | SearchPlaylist | InvidiousPlaylist | Category) && env.get?("user").try &.as(User).watched.index(item.id) != nil
+ author_verified = item.responds_to?(:author_verified) && item.author_verified
+-%>
<div class="pure-u-1 pure-u-md-1-4">
<div class="h-box">
<% case item when %>
<% when SearchChannel %>
- <a href="/channel/<%= item.ucid %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
+ <% if !thin_mode %>
+ <a tabindex="-1" href="/channel/<%= item.ucid %>">
<center>
- <img loading="lazy" tabindex="-1" style="width:56.25%" src="/ggpht<%= URI.parse(item.author_thumbnail).request_target.gsub(/=s\d+/, "=s176") %>" alt="" />
+ <img loading="lazy" style="width:56.25%" src="/ggpht<%= URI.parse(item.author_thumbnail).request_target.gsub(/=s\d+/, "=s176") %>" alt="" />
</center>
- <% end %>
- <p dir="auto"><%= HTML.escape(item.author) %><% if !item.author_verified.nil? && item.author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %></p>
- </a>
+ </a>
+ <%- else -%>
+ <div class="thumbnail-placeholder" style="width:56.25%"></div>
+ <% end %>
+
+ <div class="video-card-row flexible">
+ <div class="flex-left"><a href="/channel/<%= item.ucid %>">
+ <p class="channel-name" dir="auto"><%= HTML.escape(item.author) %>
+ <%- if author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end -%>
+ </p>
+ </a></div>
+ </div>
+
<p><%= translate_count(locale, "generic_subscribers_count", item.subscriber_count, NumberFormatting::Separator) %></p>
<% if !item.auto_generated %><p><%= translate_count(locale, "generic_videos_count", item.video_count, NumberFormatting::Separator) %></p><% end %>
<h5><%= item.description_html %></h5>
<% when SearchPlaylist, InvidiousPlaylist %>
- <% if item.id.starts_with? "RD" %>
- <% url = "/mix?list=#{item.id}&continuation=#{URI.parse(item.thumbnail || "/vi/-----------").request_target.split("/")[2]}" %>
- <% else %>
- <% url = "/playlist?list=#{item.id}" %>
- <% end %>
-
- <a style="width:100%" href="<%= url %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
- <img loading="lazy" tabindex="-1" class="thumbnail" src="<%= URI.parse(item.thumbnail || "/").request_target %>" alt="" />
- <p class="length"><%= translate_count(locale, "generic_videos_count", item.video_count, NumberFormatting::Separator) %></p>
- </div>
- <% end %>
- <p dir="auto"><%= HTML.escape(item.title) %></p>
- </a>
- <a href="/channel/<%= item.ucid %>">
- <p dir="auto"><b><%= HTML.escape(item.author) %><% if !item.is_a?(InvidiousPlaylist) && !item.author_verified.nil? && item.author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %></b></p>
- </a>
- <% when MixVideo %>
- <a href="/watch?v=<%= item.id %>&list=<%= item.rdid %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
- <img loading="lazy" tabindex="-1" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
- <% if item.length_seconds != 0 %>
- <p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
- <% end %>
+ <%-
+ if item.id.starts_with? "RD"
+ link_url = "/mix?list=#{item.id}&continuation=#{URI.parse(item.thumbnail || "/vi/-----------").request_target.split("/")[2]}"
+ else
+ link_url = "/playlist?list=#{item.id}"
+ end
+ -%>
- <% if item_watched %>
- <div class="watched-overlay"></div>
- <div class="watched-indicator" data-length="<%= item.length_seconds %>" data-id="<%= item.id %>"></div>
- <% end %>
- </div>
- <% end %>
- <p dir="auto"><%= HTML.escape(item.title) %></p>
- </a>
- <a href="/channel/<%= item.ucid %>">
- <p dir="auto"><b><%= HTML.escape(item.author) %></b></p>
- </a>
- <% when PlaylistVideo %>
- <a style="width:100%" href="/watch?v=<%= item.id %>&list=<%= item.plid %>&index=<%= item.index %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
- <img loading="lazy" tabindex="-1" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
-
- <% if plid_form = env.get?("remove_playlist_items") %>
- <form data-onsubmit="return_false" action="/playlist_ajax?action_remove_video=1&set_video_id=<%= item.index %>&playlist_id=<%= plid_form %>&referer=<%= env.get("current_page") %>" method="post">
- <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
- <p class="watched">
- <button type="submit" style="all:unset" data-onclick="remove_playlist_item" data-index="<%= item.index %>" data-plid="<%= plid_form %>"><i class="icon ion-md-trash"></i></button>
- </p>
- </form>
- <% end %>
+ <div class="thumbnail">
+ <%- if !thin_mode %>
+ <a tabindex="-1" href="<%= link_url %>">
+ <img loading="lazy" class="thumbnail" src="<%= URI.parse(item.thumbnail || "/").request_target %>" alt="" />
+ </a>
+ <%- else -%>
+ <div class="thumbnail-placeholder"></div>
+ <%- end -%>
- <% if item.responds_to?(:live_now) && item.live_now %>
- <p class="length"><i class="icon ion-ios-play-circle"></i> <%= translate(locale, "LIVE") %></p>
- <% elsif item.length_seconds != 0 %>
- <p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
- <% end %>
+ <div class="bottom-right-overlay">
+ <p class="length"><%= translate_count(locale, "generic_videos_count", item.video_count, NumberFormatting::Separator) %></p>
+ </div>
+ </div>
- <% if item_watched %>
- <div class="watched-overlay"></div>
- <div class="watched-indicator" data-length="<%= item.length_seconds %>" data-id="<%= item.id %>"></div>
- <% end %>
- </div>
- <% end %>
- <p dir="auto"><%= HTML.escape(item.title) %></p>
- </a>
+ <div class="video-card-row">
+ <a href="<%= link_url %>"><p dir="auto"><%= HTML.escape(item.title) %></p></a>
+ </div>
<div class="video-card-row flexible">
<div class="flex-left"><a href="/channel/<%= item.ucid %>">
- <p class="channel-name" dir="auto"><%= HTML.escape(item.author) %></p>
+ <p class="channel-name" dir="auto"><%= HTML.escape(item.author) %>
+ <%- if author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end -%>
+ </p>
</a></div>
- <% endpoint_params = "?v=#{item.id}&list=#{item.plid}" %>
- <%= rendered "components/video-context-buttons" %>
- </div>
-
- <div class="video-card-row flexible">
- <div class="flex-left">
- <% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp.try &.> Time.utc %>
- <p dir="auto"><%= translate(locale, "Premieres in `x`", recode_date((item.premiere_timestamp.as(Time) - Time.utc).ago, locale)) %></p>
- <% elsif Time.utc - item.published > 1.minute %>
- <p dir="auto"><%= translate(locale, "Shared `x` ago", recode_date(item.published, locale)) %></p>
- <% end %>
- </div>
-
- <% if item.responds_to?(:views) && item.views %>
- <div class="flex-right">
- <p dir="auto"><%= translate_count(locale, "generic_views_count", item.views || 0, NumberFormatting::Short) %></p>
- </div>
- <% end %>
</div>
<% when Category %>
<% else %>
- <a style="width:100%" href="/watch?v=<%= item.id %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
- <img loading="lazy" tabindex="-1" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
- <% if env.get? "show_watched" %>
- <form data-onsubmit="return_false" action="/watch_ajax?action_mark_watched=1&id=<%= item.id %>&referer=<%= env.get("current_page") %>" method="post">
- <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
- <p class="watched">
- <button type="submit" style="all:unset" data-onclick="mark_watched" data-id="<%= item.id %>">
- <i data-mouse="switch_classes" data-switch-classes="ion-ios-eye-off,ion-ios-eye" class="icon ion-ios-eye"></i>
- </button>
- </p>
- </form>
- <% elsif plid_form = env.get? "add_playlist_items" %>
- <form data-onsubmit="return_false" action="/playlist_ajax?action_add_video=1&video_id=<%= item.id %>&playlist_id=<%= plid_form %>&referer=<%= env.get("current_page") %>" method="post">
- <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
- <p class="watched">
- <button type="submit" style="all:unset" data-onclick="add_playlist_item" data-id="<%= item.id %>" data-plid="<%= plid_form %>"><i class="icon ion-md-add"></i></button>
- </p>
- </form>
- <% end %>
+ <%-
+ # `endpoint_params` is used for the "video-context-buttons" component
+ if item.is_a?(PlaylistVideo)
+ link_url = "/watch?v=#{item.id}&list=#{item.plid}&index=#{item.index}"
+ endpoint_params = "?v=#{item.id}&list=#{item.plid}"
+ elsif item.is_a?(MixVideo)
+ link_url = "/watch?v=#{item.id}&list=#{item.rdid}"
+ endpoint_params = "?v=#{item.id}&list=#{item.rdid}"
+ else
+ link_url = "/watch?v=#{item.id}"
+ endpoint_params = "?v=#{item.id}"
+ end
+ -%>
- <% if item.responds_to?(:live_now) && item.live_now %>
- <p class="length" dir="auto"><i class="icon ion-ios-play-circle"></i> <%= translate(locale, "LIVE") %></p>
- <% elsif item.length_seconds != 0 %>
- <p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
- <% end %>
+ <div class="thumbnail">
+ <%- if !thin_mode -%>
+ <a tabindex="-1" href="<%= link_url %>">
+ <img loading="lazy" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
<% if item_watched %>
<div class="watched-overlay"></div>
<div class="watched-indicator" data-length="<%= item.length_seconds %>" data-id="<%= item.id %>"></div>
<% end %>
- </div>
- <% end %>
- <p dir="auto"><%= HTML.escape(item.title) %></p>
- </a>
+ </a>
+ <%- else -%>
+ <div class="thumbnail-placeholder"></div>
+ <%- end -%>
+
+ <div class="top-left-overlay">
+ <%- if env.get? "show_watched" -%>
+ <form data-onsubmit="return_false" action="/watch_ajax?action_mark_watched=1&id=<%= item.id %>&referer=<%= env.get("current_page") %>" method="post">
+ <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
+ <button type="submit" class="pure-button pure-button-secondary low-profile"
+ data-onclick="mark_watched" data-id="<%= item.id %>">
+ <i data-mouse="switch_classes" data-switch-classes="ion-ios-eye-off,ion-ios-eye" class="icon ion-ios-eye"></i>
+ </button>
+ </form>
+ <%- end -%>
+
+ <%- if plid_form = env.get?("add_playlist_items") -%>
+ <%- form_parameters = "action_add_video=1&video_id=#{item.id}&playlist_id=#{plid_form}&referer=#{env.get("current_page")}" -%>
+ <form data-onsubmit="return_false" action="/playlist_ajax?<%= form_parameters %>" method="post">
+ <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
+ <button type="submit" class="pure-button pure-button-secondary low-profile"
+ data-onclick="add_playlist_item" data-id="<%= item.id %>" data-plid="<%= plid_form %>"><i class="icon ion-md-add"></i></button>
+ </form>
+ <%- elsif item.is_a?(PlaylistVideo) && (plid_form = env.get?("remove_playlist_items")) -%>
+ <%- form_parameters = "action_remove_video=1&set_video_id=#{item.index}&playlist_id=#{plid_form}&referer=#{env.get("current_page")}" -%>
+ <form data-onsubmit="return_false" action="/playlist_ajax?<%= form_parameters %>" method="post">
+ <input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
+ <button type="submit" class="pure-button pure-button-secondary low-profile"
+ data-onclick="remove_playlist_item" data-index="<%= item.index %>" data-plid="<%= plid_form %>"><i class="icon ion-md-trash"></i></button>
+ </form>
+ <%- end -%>
+ </div>
+
+ <div class="bottom-right-overlay">
+ <%- if item.responds_to?(:live_now) && item.live_now -%>
+ <p class="length" dir="auto"><i class="icon ion-ios-play-circle"></i>&nbsp;<%= translate(locale, "LIVE") %></p>
+ <%- elsif item.length_seconds != 0 -%>
+ <p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
+ <%- end -%>
+ </div>
+ </div>
+
+ <div class="video-card-row">
+ <a href="<%= link_url %>"><p dir="auto"><%= HTML.escape(item.title) %></p></a>
+ </div>
<div class="video-card-row flexible">
<div class="flex-left"><a href="/channel/<%= item.ucid %>">
- <p class="channel-name" dir="auto"><%= HTML.escape(item.author) %><% if !item.is_a?(ChannelVideo) && !item.author_verified.nil? && item.author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %></p>
+ <p class="channel-name" dir="auto"><%= HTML.escape(item.author) %>
+ <%- if author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end -%>
+ </p>
</a></div>
- <% endpoint_params = "?v=#{item.id}" %>
<%= rendered "components/video-context-buttons" %>
</div>
@@ -159,7 +148,7 @@
<div class="flex-left">
<% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp.try &.> Time.utc %>
<p class="video-data" dir="auto"><%= translate(locale, "Premieres in `x`", recode_date((item.premiere_timestamp.as(Time) - Time.utc).ago, locale)) %></p>
- <% elsif Time.utc - item.published > 1.minute %>
+ <% elsif item.responds_to?(:published) && (Time.utc - item.published) > 1.minute %>
<p class="video-data" dir="auto"><%= translate(locale, "Shared `x` ago", recode_date(item.published, locale)) %></p>
<% end %>
</div>
diff --git a/src/invidious/views/components/items_paginated.ecr b/src/invidious/views/components/items_paginated.ecr
new file mode 100644
index 00000000..4534a0a3
--- /dev/null
+++ b/src/invidious/views/components/items_paginated.ecr
@@ -0,0 +1,11 @@
+<%= page_nav_html %>
+
+<div class="pure-g">
+ <%- items.each do |item| -%>
+ <%= rendered "components/item" %>
+ <%- end -%>
+</div>
+
+<%= page_nav_html %>
+
+<script src="/js/watched_indicator.js"></script>
diff --git a/src/invidious/views/components/subscribe_widget.ecr b/src/invidious/views/components/subscribe_widget.ecr
index b9d5f783..05e4e253 100644
--- a/src/invidious/views/components/subscribe_widget.ecr
+++ b/src/invidious/views/components/subscribe_widget.ecr
@@ -1,22 +1,18 @@
<% if user %>
<% if subscriptions.includes? ucid %>
- <p>
<form action="/subscription_ajax?action_remove_subscriptions=1&c=<%= ucid %>&referer=<%= env.get("current_page") %>" method="post">
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
<button data-type="unsubscribe" id="subscribe" class="pure-button pure-button-primary">
<b><input style="all:unset" type="submit" value="<%= translate(locale, "Unsubscribe") %> | <%= sub_count_text %>"></b>
</button>
</form>
- </p>
<% else %>
- <p>
<form action="/subscription_ajax?action_create_subscription_to_channel=1&c=<%= ucid %>&referer=<%= env.get("current_page") %>" method="post">
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
<button data-type="subscribe" id="subscribe" class="pure-button pure-button-primary">
<b><input style="all:unset" type="submit" value="<%= translate(locale, "Subscribe") %> | <%= sub_count_text %>"></b>
</button>
</form>
- </p>
<% end %>
<script id="subscribe_data" type="application/json">
@@ -33,10 +29,8 @@
</script>
<script src="/js/subscribe_widget.js?v=<%= ASSET_COMMIT %>"></script>
<% else %>
- <p>
<a id="subscribe" class="pure-button pure-button-primary"
href="/login?referer=<%= env.get("current_page") %>">
<b><%= translate(locale, "Subscribe") %> | <%= sub_count_text %></b>
</a>
- </p>
<% end %>
diff --git a/src/invidious/views/components/video-context-buttons.ecr b/src/invidious/views/components/video-context-buttons.ecr
index ddb6c983..385ed6b3 100644
--- a/src/invidious/views/components/video-context-buttons.ecr
+++ b/src/invidious/views/components/video-context-buttons.ecr
@@ -1,4 +1,4 @@
-<div class="flex-right">
+<div class="flex-right flexible">
<div class="icon-buttons">
<a title="<%=translate(locale, "videoinfo_watch_on_youTube")%>" href="https://www.youtube.com/watch<%=endpoint_params%>">
<i class="icon ion-logo-youtube"></i>
@@ -6,7 +6,7 @@
<a title="<%=translate(locale, "Audio mode")%>" href="/watch<%=endpoint_params%>&listen=1">
<i class="icon ion-md-headset"></i>
</a>
-
+
<% if env.get("preferences").as(Preferences).automatic_instance_redirect%>
<a title="<%=translate(locale, "Switch Invidious Instance")%>" href="/redirect?referer=%2Fwatch<%=URI.encode_www_form(endpoint_params)%>">
<i class="icon ion-md-jet"></i>
diff --git a/src/invidious/views/edit_playlist.ecr b/src/invidious/views/edit_playlist.ecr
index 548104c8..34157c67 100644
--- a/src/invidious/views/edit_playlist.ecr
+++ b/src/invidious/views/edit_playlist.ecr
@@ -6,35 +6,43 @@
<% end %>
<form class="pure-form" action="/edit_playlist?list=<%= plid %>" method="post">
- <div class="pure-g h-box">
- <div class="pure-u-2-3">
+ <div class="h-box flexible">
+ <div class="flex-right button-container">
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/playlist?list=<%= plid %>">
+ <i class="icon ion-md-close"></i>&nbsp;<%= translate(locale, "generic_button_cancel") %>
+ </a>
+ </div>
+ <div class="pure-u">
+ <button class="pure-button pure-button-secondary low-profile" dir="auto" type="submit">
+ <i class="icon ion-md-save"></i>&nbsp;<%= translate(locale, "generic_button_save") %>
+ </button>
+ </div>
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/delete_playlist?list=<%= plid %>">
+ <i class="icon ion-md-trash"></i>&nbsp;<%= translate(locale, "generic_button_delete") %>
+ </a>
+ </div>
+ </div>
+ </div>
+
+ <div class="h-box flexible title">
+ <div>
<h3><input class="pure-input-1" maxlength="150" name="title" type="text" value="<%= title %>"></h3>
+ </div>
+ </div>
+
+ <div class="h-box">
+ <div class="pure-u-1-1">
<b>
<%= HTML.escape(playlist.author) %> |
<%= translate_count(locale, "generic_videos_count", playlist.video_count) %> |
- <%= translate(locale, "Updated `x` ago", recode_date(playlist.updated, locale)) %> |
- <i class="icon <%= {"ion-md-globe", "ion-ios-unlock", "ion-ios-lock"}[playlist.privacy.value] %>"></i>
- <select name="privacy">
- <% {"Public", "Unlisted", "Private"}.each do |option| %>
- <option value="<%= option %>" <% if option == playlist.privacy.to_s %>selected<% end %>><%= translate(locale, option) %></option>
- <% end %>
- </select>
</b>
- </div>
- <div class="pure-u-1-3" style="text-align:right">
- <h3>
- <div class="pure-g user-field">
- <div class="pure-u-1-3">
- <a href="javascript:void(0)">
- <button type="submit" style="all:unset">
- <i class="icon ion-md-save"></i>
- </button>
- </a>
- </div>
- <div class="pure-u-1-3"><a href="/delete_playlist?list=<%= plid %>"><i class="icon ion-md-trash"></i></a></div>
- <div class="pure-u-1-3"><a href="/feed/playlist/<%= plid %>"><i class="icon ion-logo-rss"></i></a></div>
- </div>
- </h3>
+ <select name="privacy">
+ <%- {"Public", "Unlisted", "Private"}.each do |option| -%>
+ <option value="<%= option %>" <% if option == playlist.privacy.to_s %>selected<% end %>><%= translate(locale, option) %></option>
+ <%- end -%>
+ </select>
</div>
</div>
@@ -44,40 +52,9 @@
<input type="hidden" name="csrf_token" value="<%= HTML.escape(csrf_token) %>">
</form>
-<% if playlist.is_a?(InvidiousPlaylist) && playlist.author == user.try &.email %>
-<div class="h-box" style="text-align:right">
- <h3>
- <a href="/add_playlist_items?list=<%= plid %>"><i class="icon ion-md-add"></i></a>
- </h3>
-</div>
-<% end %>
-
<div class="h-box">
<hr>
</div>
-<div class="pure-g">
-<% videos.each do |item| %>
- <%= rendered "components/item" %>
-<% end %>
-</div>
-
-<script src="/js/watched_indicator.js"></script>
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <% if page > 1 %>
- <a href="/playlist?list=<%= playlist.id %>&page=<%= page - 1 %>">
- <%= translate(locale, "Previous page") %>
- </a>
- <% end %>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if videos.size == 100 %>
- <a href="/playlist?list=<%= playlist.id %>&page=<%= page + 1 %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
-</div>
+<%= rendered "components/items_paginated" %>
diff --git a/src/invidious/views/feeds/history.ecr b/src/invidious/views/feeds/history.ecr
index 2234b297..bda4e1f3 100644
--- a/src/invidious/views/feeds/history.ecr
+++ b/src/invidious/views/feeds/history.ecr
@@ -31,39 +31,29 @@
<% watched.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("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
- <img class="thumbnail" src="/vi/<%= item %>/mqdefault.jpg" alt="" />
- <form data-onsubmit="return_false" action="/watch_ajax?action_mark_unwatched=1&id=<%= item %>&referer=<%= env.get("current_page") %>" method="post">
- <input type="hidden" name="csrf_token" value="<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>">
- <p class="watched">
- <button type="submit" style="all:unset" data-onclick="mark_unwatched" data-id="<%= item %>"><i class="icon ion-md-trash"></i></button>
- </p>
- </form>
- </div>
- <p></p>
- <% end %>
- </a>
+ <div class="thumbnail">
+ <a style="width:100%" href="/watch?v=<%= item %>">
+ <img class="thumbnail" src="/vi/<%= item %>/mqdefault.jpg" alt="" />
+ </a>
+
+ <div class="top-left-overlay"><div class="watched">
+ <form data-onsubmit="return_false" action="/watch_ajax?action_mark_unwatched=1&id=<%= item %>&referer=<%= env.get("current_page") %>" method="post">
+ <input type="hidden" name="csrf_token" value="<%= URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "") %>">
+ <button type="submit" class="pure-button pure-button-secondary low-profile"
+ data-onclick="mark_unwatched" data-id="<%= item %>"><i class="icon ion-md-trash"></i></button>
+ </form>
+ </div></div>
+ </div>
+ <p></p>
</div>
</div>
<% end %>
</div>
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <% if page > 1 %>
- <a href="/feed/history?page=<%= page - 1 %><% if env.params.query["max_results"]? %>&max_results=<%= max_results %><% end %>">
- <%= translate(locale, "Previous page") %>
- </a>
- <% end %>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if watched.size >= max_results %>
- <a href="/feed/history?page=<%= page + 1 %><% if env.params.query["max_results"]? %>&max_results=<%= max_results %><% end %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
-</div>
+<%=
+ IV::Frontend::Pagination.nav_numeric(locale,
+ base_url: base_url,
+ current_page: page,
+ show_next: (watched.size >= max_results)
+ )
+%>
diff --git a/src/invidious/views/feeds/subscriptions.ecr b/src/invidious/views/feeds/subscriptions.ecr
index 9c69c5b0..c36bd00f 100644
--- a/src/invidious/views/feeds/subscriptions.ecr
+++ b/src/invidious/views/feeds/subscriptions.ecr
@@ -56,6 +56,7 @@
</script>
<script src="/js/watched_widget.js"></script>
+
<div class="pure-g">
<% videos.each do |item| %>
<%= rendered "components/item" %>
@@ -64,20 +65,10 @@
<script src="/js/watched_indicator.js"></script>
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <% if page > 1 %>
- <a href="/feed/subscriptions?page=<%= page - 1 %><% if env.params.query["max_results"]? %>&max_results=<%= max_results %><% end %>">
- <%= translate(locale, "Previous page") %>
- </a>
- <% end %>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if (videos.size + notifications.size) == max_results %>
- <a href="/feed/subscriptions?page=<%= page + 1 %><% if env.params.query["max_results"]? %>&max_results=<%= max_results %><% end %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
-</div>
+<%=
+ IV::Frontend::Pagination.nav_numeric(locale,
+ base_url: base_url,
+ current_page: page,
+ show_next: ((videos.size + notifications.size) == max_results)
+ )
+%>
diff --git a/src/invidious/views/hashtag.ecr b/src/invidious/views/hashtag.ecr
index 3351c21c..2000337e 100644
--- a/src/invidious/views/hashtag.ecr
+++ b/src/invidious/views/hashtag.ecr
@@ -4,38 +4,5 @@
<hr/>
-<div class="pure-g h-box v-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <%- if page > 1 -%>
- <a href="<%= url_prev_page %>"><%= translate(locale, "Previous page") %></a>
- <%- end -%>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <%- if videos.size >= 60 -%>
- <a href="<%= url_next_page %>"><%= translate(locale, "Next page") %></a>
- <%- end -%>
- </div>
-</div>
-<div class="pure-g">
- <%- videos.each do |item| -%>
- <%= rendered "components/item" %>
- <%- end -%>
-</div>
-
-<script src="/js/watched_indicator.js"></script>
-
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <%- if page > 1 -%>
- <a href="<%= url_prev_page %>"><%= translate(locale, "Previous page") %></a>
- <%- end -%>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <%- if videos.size >= 60 -%>
- <a href="<%= url_next_page %>"><%= translate(locale, "Next page") %></a>
- <%- end -%>
- </div>
-</div>
+<%= rendered "components/items_paginated" %>
diff --git a/src/invidious/views/playlist.ecr b/src/invidious/views/playlist.ecr
index a04acf4c..ee9ba87b 100644
--- a/src/invidious/views/playlist.ecr
+++ b/src/invidious/views/playlist.ecr
@@ -6,9 +6,50 @@
<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/playlist/<%= plid %>" />
<% end %>
-<div class="pure-g h-box">
- <div class="pure-u-2-3">
- <h3><%= title %></h3>
+<div class="h-box flexible title">
+ <div class="flex-left"><h3><%= title %></h3></div>
+
+ <div class="flex-right button-container">
+ <%- if playlist.is_a?(InvidiousPlaylist) && playlist.author == user.try &.email -%>
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/add_playlist_items?list=<%= plid %>">
+ <i class="icon ion-md-add"></i>&nbsp;<%= translate(locale, "playlist_button_add_items") %>
+ </a>
+ </div>
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/edit_playlist?list=<%= plid %>">
+ <i class="icon ion-md-create"></i>&nbsp;<%= translate(locale, "generic_button_edit") %>
+ </a>
+ </div>
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/delete_playlist?list=<%= plid %>">
+ <i class="icon ion-md-trash"></i>&nbsp;<%= translate(locale, "generic_button_delete") %>
+ </a>
+ </div>
+ <%- else -%>
+ <div class="pure-u">
+ <%- if IV::Database::Playlists.exists?(playlist.id) -%>
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/subscribe_playlist?list=<%= plid %>">
+ <i class="icon ion-md-add"></i>&nbsp;<%= translate(locale, "Subscribe") %>
+ </a>
+ <%- else -%>
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/delete_playlist?list=<%= plid %>">
+ <i class="icon ion-md-trash"></i>&nbsp;<%= translate(locale, "Unsubscribe") %>
+ </a>
+ <%- end -%>
+ </div>
+ <%- end -%>
+
+ <div class="pure-u">
+ <a class="pure-button pure-button-secondary low-profile" dir="auto" href="/feed/playlist/<%= plid %>">
+ <i class="icon ion-logo-rss"></i>&nbsp;<%= translate(locale, "generic_button_rss") %>
+ </a>
+ </div>
+ </div>
+</div>
+
+<div class="h-box">
+ <div class="pure-u-1-1">
<% if playlist.is_a? InvidiousPlaylist %>
<b>
<% if playlist.author == user.try &.email %>
@@ -54,37 +95,12 @@
</div>
<% end %>
</div>
- <div class="pure-u-1-3" style="text-align:right">
- <h3>
- <div class="pure-g user-field">
- <% if playlist.is_a?(InvidiousPlaylist) && playlist.author == user.try &.email %>
- <div class="pure-u-1-3"><a href="/edit_playlist?list=<%= plid %>"><i class="icon ion-md-create"></i></a></div>
- <div class="pure-u-1-3"><a href="/delete_playlist?list=<%= plid %>"><i class="icon ion-md-trash"></i></a></div>
- <% else %>
- <% if Invidious::Database::Playlists.exists?(playlist.id) %>
- <div class="pure-u-1-3"><a href="/subscribe_playlist?list=<%= plid %>"><i class="icon ion-md-add"></i></a></div>
- <% else %>
- <div class="pure-u-1-3"><a href="/delete_playlist?list=<%= plid %>"><i class="icon ion-md-trash"></i></a></div>
- <% end %>
- <% end %>
- <div class="pure-u-1-3"><a href="/feed/playlist/<%= plid %>"><i class="icon ion-logo-rss"></i></a></div>
- </div>
- </h3>
- </div>
</div>
<div class="h-box">
<div id="descriptionWrapper"><%= playlist.description_html %></div>
</div>
-<% if playlist.is_a?(InvidiousPlaylist) && playlist.author == user.try &.email %>
-<div class="h-box" style="text-align:right">
- <h3>
- <a href="/add_playlist_items?list=<%= plid %>"><i class="icon ion-md-add"></i></a>
- </h3>
-</div>
-<% end %>
-
<div class="h-box">
<hr>
</div>
@@ -100,28 +116,5 @@
<script src="/js/playlist_widget.js?v=<%= ASSET_COMMIT %>"></script>
<% end %>
-<div class="pure-g">
-<% videos.each do |item| %>
- <%= rendered "components/item" %>
-<% end %>
-</div>
-
-<script src="/js/watched_indicator.js"></script>
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <% if page > 1 %>
- <a href="/playlist?list=<%= playlist.id %>&page=<%= page - 1 %>">
- <%= translate(locale, "Previous page") %>
- </a>
- <% end %>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <% if page_count != 1 && page < page_count %>
- <a href="/playlist?list=<%= playlist.id %>&page=<%= page + 1 %>">
- <%= translate(locale, "Next page") %>
- </a>
- <% end %>
- </div>
-</div>
+<%= rendered "components/items_paginated" %>
diff --git a/src/invidious/views/search.ecr b/src/invidious/views/search.ecr
index a7469e36..b1300214 100644
--- a/src/invidious/views/search.ecr
+++ b/src/invidious/views/search.ecr
@@ -7,21 +7,8 @@
<%= Invidious::Frontend::SearchFilters.generate(query.filters, query.text, query.page, locale) %>
<hr/>
-<div class="pure-g h-box v-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <%- if query.page > 1 -%>
- <a href="<%= url_prev_page %>"><%= translate(locale, "Previous page") %></a>
- <%- end -%>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <%- if videos.size >= 20 -%>
- <a href="<%= url_next_page %>"><%= translate(locale, "Next page") %></a>
- <%- end -%>
- </div>
-</div>
-<%- if videos.empty? -%>
+<%- if items.empty? -%>
<div class="h-box no-results-error">
<div>
<%= translate(locale, "search_message_no_results") %><br/><br/>
@@ -30,25 +17,5 @@
</div>
</div>
<%- else -%>
-<div class="pure-g">
- <%- videos.each do |item| -%>
- <%= rendered "components/item" %>
- <%- end -%>
-</div>
+ <%= rendered "components/items_paginated" %>
<%- end -%>
-
-<script src="/js/watched_indicator.js"></script>
-
-<div class="pure-g h-box">
- <div class="pure-u-1 pure-u-lg-1-5">
- <%- if query.page > 1 -%>
- <a href="<%= url_prev_page %>"><%= translate(locale, "Previous page") %></a>
- <%- end -%>
- </div>
- <div class="pure-u-1 pure-u-lg-3-5"></div>
- <div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
- <%- if videos.size >= 20 -%>
- <a href="<%= url_next_page %>"><%= translate(locale, "Next page") %></a>
- <%- end -%>
- </div>
-</div>
diff --git a/src/invidious/views/template.ecr b/src/invidious/views/template.ecr
index aa0fc15f..77265679 100644
--- a/src/invidious/views/template.ecr
+++ b/src/invidious/views/template.ecr
@@ -111,14 +111,6 @@
</div>
<% end %>
- <% if env.get? "user" %>
- <% if !HMAC_KEY_CONFIGURED && CONFIG.admins.includes? env.get("user").as(Invidious::User).email %>
- <div class="h-box">
- <h3><p>Message for admin: please configure hmac_key, <a href="https://github.com/iv-org/invidious/issues/3854">see more here</a>.</p></h3>
- </div>
- <% end %>
- <% end %>
-
<%= content %>
<footer>
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index 5b3190f3..498d57a1 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -204,19 +204,28 @@ we're going to need to do it here in order to allow for translations.
</div>
<div class="pure-u-1 <% if params.related_videos || plid %>pure-u-lg-3-5<% else %>pure-u-md-4-5<% end %>">
- <div class="h-box">
- <a href="/channel/<%= video.ucid %>" style="display:block;width:fit-content;width:-moz-fit-content">
- <div class="channel-profile">
- <% if !video.author_thumbnail.empty? %>
- <img src="/ggpht<%= URI.parse(video.author_thumbnail).request_target %>" alt="" />
- <% end %>
- <span id="channel-name"><%= author %><% if !video.author_verified.nil? && video.author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %></span>
- </div>
- </a>
- <% sub_count_text = video.sub_count_text %>
- <%= rendered "components/subscribe_widget" %>
+ <div class="pure-g h-box flexible title">
+ <div class="pure-u-1-2 flex-left flexible">
+ <a href="/channel/<%= video.ucid %>">
+ <div class="channel-profile">
+ <% if !video.author_thumbnail.empty? %>
+ <img src="/ggpht<%= URI.parse(video.author_thumbnail).request_target %>" alt="" />
+ <% end %>
+ <span id="channel-name"><%= author %><% if !video.author_verified.nil? && video.author_verified %>&nbsp;<i class="icon ion ion-md-checkmark-circle"></i><% end %></span>
+ </div>
+ </a>
+ </div>
+ <div class="pure-u-1-2 flex-right flexible button-container">
+ <div class="pure-u">
+ <% sub_count_text = video.sub_count_text %>
+ <%= rendered "components/subscribe_widget" %>
+ </div>
+ </div>
+ </div>
+
+ <div class="h-box">
<p id="published-date">
<% if video.premiere_timestamp.try &.> Time.utc %>
<b><%= video.premiere_timestamp.try { |t| translate(locale, "Premieres `x`", t.to_s("%B %-d, %R UTC")) } %></b>
@@ -295,15 +304,28 @@ we're going to need to do it here in order to allow for translations.
<% video.related_videos.each do |rv| %>
<% if rv["id"]? %>
- <a href="/watch?v=<%= rv["id"] %>&listen=<%= params.listen %>">
- <% if !env.get("preferences").as(Preferences).thin_mode %>
- <div class="thumbnail">
+ <div class="pure-u-1">
+
+ <div class="thumbnail">
+ <%- if !env.get("preferences").as(Preferences).thin_mode -%>
+ <a tabindex="-1" href="/watch?v=<%= rv["id"] %>&listen=<%= params.listen %>">
<img loading="lazy" class="thumbnail" src="/vi/<%= rv["id"] %>/mqdefault.jpg" alt="" />
- <p class="length"><%= recode_length_seconds(rv["length_seconds"]?.try &.to_i? || 0) %></p>
- </div>
- <% end %>
- <p style="width:100%"><%= rv["title"] %></p>
- </a>
+ </a>
+ <%- else -%>
+ <div class="thumbnail-placeholder"></div>
+ <%- end -%>
+
+ <div class="bottom-right-overlay">
+ <%- if (length_seconds = rv["length_seconds"]?.try &.to_i?) && length_seconds != 0 -%>
+ <p class="length"><%= recode_length_seconds(length_seconds) %></p>
+ <%- end -%>
+ </div>
+ </div>
+
+ <div class="video-card-row">
+ <a href="/watch?v=<%= rv["id"] %>&listen=<%= params.listen %>"><p dir="auto"><%= HTML.escape(rv["title"]) %></p></a>
+ </div>
+
<h5 class="pure-g">
<div class="pure-u-14-24">
<% if rv["ucid"]? %>
@@ -321,6 +343,8 @@ we're going to need to do it here in order to allow for translations.
%></b>
</div>
</h5>
+
+ </div>
<% end %>
<% end %>
</div>
diff --git a/src/invidious/yt_backend/extractors.cr b/src/invidious/yt_backend/extractors.cr
index 6686e6e7..e5029dc5 100644
--- a/src/invidious/yt_backend/extractors.cr
+++ b/src/invidious/yt_backend/extractors.cr
@@ -408,8 +408,8 @@ private module Parsers
# Returns nil when the given object isn't a RichItemRenderer
#
# A richItemRenderer seems to be a simple wrapper for a videoRenderer, used
- # by the result page for hashtags. It is located inside a continuationItems
- # container.
+ # by the result page for hashtags and for the podcast tab on channels.
+ # It is located inside a continuationItems container for hashtags.
#
module RichItemRendererParser
def self.process(item : JSON::Any, author_fallback : AuthorFallback)
@@ -421,6 +421,7 @@ private module Parsers
private def self.parse(item_contents, author_fallback)
child = VideoRendererParser.process(item_contents, author_fallback)
child ||= ReelItemRendererParser.process(item_contents, author_fallback)
+ child ||= PlaylistRendererParser.process(item_contents, author_fallback)
return child
end