[WIP] Add playlists

assets/css/darktheme.css

@@ -21,10 +21,9 @@ body {
   color: #f0f0f0;
 }
 
-.pure-form > fieldset > input,
-.pure-control-group > input,
-.pure-form > fieldset > select,
-.pure-control-group > select {
+input,
+select,
+textarea {
   color: rgba(35, 35, 35, 1);
 }
 

assets/js/embed.js

@@ -12,7 +12,8 @@ function get_playlist(plid, retries) {
             '&format=html&hl=' + video_data.preferences.locale;
     } else {
         var plid_url = '/api/v1/playlists/' + plid +
-            '?continuation=' + video_data.id +
+            '?index=' + video_data.index +
+            '&continuation' + video_data.id +
             '&format=html&hl=' + video_data.preferences.locale;
     }
 
@@ -45,6 +46,9 @@ function get_playlist(plid, retries) {
                         }
 
                         url.searchParams.set('list', plid);
+                        if (!plid.startsWith('RD')) {
+                            url.searchParams.set('index', xhr.response.index);
+                        }
                         location.assign(url.pathname + url.search);
                     });
                 }

assets/js/playlist_widget.js

@@ -0,0 +1,47 @@
+function add_playlist_item(target) {
+    var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
+    tile.style.display = 'none';
+
+    var url = '/playlist_ajax?action_add_video=1&redirect=false' +
+        '&video_id=' + target.getAttribute('data-id') +
+        '&playlist_id=' + target.getAttribute('data-plid');
+    var xhr = new XMLHttpRequest();
+    xhr.responseType = 'json';
+    xhr.timeout = 10000;
+    xhr.open('POST', url, true);
+    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+
+    xhr.onreadystatechange = function () {
+        if (xhr.readyState == 4) {
+            if (xhr.status != 200) {
+                tile.style.display = '';
+            }
+        }
+    }
+
+    xhr.send('csrf_token=' + playlist_data.csrf_token);
+}
+
+function remove_playlist_item(target) {
+    var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
+    tile.style.display = 'none';
+
+    var url = '/playlist_ajax?action_remove_video=1&redirect=false' +
+        '&set_video_id=' + target.getAttribute('data-index') +
+        '&playlist_id=' + target.getAttribute('data-plid');
+    var xhr = new XMLHttpRequest();
+    xhr.responseType = 'json';
+    xhr.timeout = 10000;
+    xhr.open('POST', url, true);
+    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+
+    xhr.onreadystatechange = function () {
+        if (xhr.readyState == 4) {
+            if (xhr.status != 200) {
+                tile.style.display = '';
+            }
+        }
+    }
+
+    xhr.send('csrf_token=' + playlist_data.csrf_token);
+}

assets/js/watch.js

@@ -133,7 +133,8 @@ function get_playlist(plid, retries) {
             '&format=html&hl=' + video_data.preferences.locale;
     } else {
         var plid_url = '/api/v1/playlists/' + plid +
-            '?continuation=' + video_data.id +
+            '?index=' + video_data.index +
+            '&continuation=' + video_data.id +
             '&format=html&hl=' + video_data.preferences.locale;
     }
 
@@ -168,6 +169,9 @@ function get_playlist(plid, retries) {
                         }
 
                         url.searchParams.set('list', plid);
+                        if (!plid.startsWith('RD')) {
+                            url.searchParams.set('index', xhr.response.index);
+                        }
                         location.assign(url.pathname + url.search);
                     });
                 }

config/sql/playlist_videos.sql

@@ -0,0 +1,19 @@
+-- Table: public.playlist_videos
+
+-- DROP TABLE public.playlist_videos;
+
+CREATE TABLE playlist_videos
+(
+    title text,
+    id text,
+    author text,
+    ucid text,
+    length_seconds integer,
+    published timestamptz,
+    plid text references playlists(id),
+    index int8,
+    live_now boolean,
+    PRIMARY KEY (index,plid)
+);
+
+GRANT ALL ON TABLE public.playlist_videos TO kemal;

config/sql/playlists.sql

@@ -0,0 +1,18 @@
+-- Table: public.playlists
+
+-- DROP TABLE public.playlists;
+
+CREATE TABLE public.playlists
+(
+    title text,
+    id text primary key,
+    author text,
+    description text,
+    video_count integer,
+    created timestamptz,
+    updated timestamptz,
+    privacy privacy,
+    index int8[]
+);
+
+GRANT ALL ON public.playlists TO kemal;

config/sql/privacy.sql

@@ -0,0 +1,10 @@
+-- Type: public.privacy
+
+-- DROP TYPE public.privacy;
+
+CREATE TYPE public.privacy AS ENUM
+(
+    'Public',
+    'Unlisted',
+    'Private'
+);

locales/ar.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "مشاهدة معلومات حول تراخيص الجافاسكريبت.",
     "View privacy policy.": "عرض سياسة الخصوصية.",
     "Trending": "الشائع",
+    "Public": "",
     "Unlisted": "غير مصنف",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "مشاهدة الفيديو على اليوتيوب",
     "Hide annotations": "إخفاء الملاحظات فى الفيديو",
     "Show annotations": "عرض الملاحظات فى الفيديو",
@@ -322,4 +332,4 @@
     "Playlists": "قوائم التشغيل",
     "Community": "المجتمع",
     "Current version: ": "الإصدار الحالي: "
-}
+}

locales/de.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "Javascript Lizenzinformationen anzeigen.",
     "View privacy policy.": "Datenschutzerklärung einsehen.",
     "Trending": "Trending",
+    "Public": "",
     "Unlisted": "Nicht aufgeführt",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "Video auf YouTube ansehen",
     "Hide annotations": "Anmerkungen ausblenden",
     "Show annotations": "Anmerkungen anzeigen",
@@ -322,4 +332,4 @@
     "Playlists": "Wiedergabelisten",
     "Community": "Gemeinschaft",
     "Current version: ": "Aktuelle Version: "
-}
+}

locales/el.json

@@ -141,7 +141,17 @@
     "View JavaScript license information.": "Προβολή πληροφοριών άδειας JavaScript.",
     "View privacy policy.": "Προβολή πολιτικής απορρήτου.",
     "Trending": "Τάσεις",
+    "Public": "",
     "Unlisted": "Κρυφό",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "Προβολή στο YouTube",
     "Hide annotations": "Απόκρυψη σημειώσεων",
     "Show annotations": "Προβολή σημειώσεων",

locales/en-US.json

@@ -7,6 +7,10 @@
         "([^0-9]|^)1([^,0-9]|$)": "`x` video",
         "": "`x` videos"
     },
+    "`x` playlists": {
+        "(\\D|^)1(\\D|$)": "`x` playlist",
+        "": "`x` playlists"
+    },
     "LIVE": "LIVE",
     "Shared `x` ago": "Shared `x` ago",
     "Unsubscribe": "Unsubscribe",
@@ -74,11 +78,11 @@
     "Show related videos: ": "Show related videos: ",
     "Show annotations by default: ": "Show annotations by default: ",
     "Visual preferences": "Visual preferences",
-    "Player style: ": "",
+    "Player style: ": "Player style: ",
     "Dark mode: ": "Dark mode: ",
-    "Theme: ": "",
-    "dark": "",
-    "light": "",
+    "Theme: ": "Theme: ",
+    "dark": "dark",
+    "light": "light",
     "Thin mode: ": "Thin mode: ",
     "Subscription preferences": "Subscription preferences",
     "Show annotations by default for subscribed channels: ": "Show annotations by default for subscribed channels? ",
@@ -141,7 +145,17 @@
     "View JavaScript license information.": "View JavaScript license information.",
     "View privacy policy.": "View privacy policy.",
     "Trending": "Trending",
+    "Public": "Public",
     "Unlisted": "Unlisted",
+    "Private": "Private",
+    "View all playlists": "View all playlists",
+    "Updated `x` ago": "Updated `x` ago",
+    "Delete playlist `x`?": "Delete playlist `x`?",
+    "Delete playlist": "Delete playlist",
+    "Create playlist": "Create playlist",
+    "Title": "Title",
+    "Playlist privacy": "Playlist privacy",
+    "Editing playlist `x`": "Editing playlist `x`",
     "Watch on YouTube": "Watch on YouTube",
     "Hide annotations": "Hide annotations",
     "Show annotations": "Show annotations",
@@ -162,7 +176,10 @@
     "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.": "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.",
     "View YouTube comments": "View YouTube comments",
     "View more comments on Reddit": "View more comments on Reddit",
-    "View `x` comments": "View `x` comments",
+    "View `x` comments": {
+        "(\\D|^)1(\\D|$)": "View `x` comment",
+        "": "View `x` comments"
+    },
     "View Reddit comments": "View Reddit comments",
     "Hide replies": "Hide replies",
     "Show replies": "Show replies",
@@ -359,7 +376,7 @@
     "%A %B %-d, %Y": "%A %B %-d, %Y",
     "(edited)": "(edited)",
     "YouTube comment permalink": "YouTube comment permalink",
-    "permalink": "",
+    "permalink": "permalink",
     "`x` marked it with a ❤": "`x` marked it with a ❤",
     "Audio mode": "Audio mode",
     "Video mode": "Video mode",

locales/eo.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "Vidi Ĝavoskriptan licencan informon.",
     "View privacy policy.": "Vidi regularon pri privateco.",
     "Trending": "Tendencoj",
+    "Public": "",
     "Unlisted": "Ne listigita",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "Vidi videon en Youtube",
     "Hide annotations": "Kaŝi prinotojn",
     "Show annotations": "Montri prinotojn",
@@ -322,4 +332,4 @@
     "Playlists": "Ludlistoj",
     "Community": "Komunumo",
     "Current version: ": "Nuna versio: "
-}
+}

locales/es.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "Ver información de licencia de JavaScript.",
     "View privacy policy.": "Ver la política de privacidad.",
     "Trending": "Tendencias",
+    "Public": "",
     "Unlisted": "No listado",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "Ver el vídeo en Youtube",
     "Hide annotations": "Ocultar anotaciones",
     "Show annotations": "Mostrar anotaciones",
@@ -322,4 +332,4 @@
     "Playlists": "Listas de reproducción",
     "Community": "",
     "Current version: ": "Versión actual: "
-}
+}

locales/eu.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "",
     "View privacy policy.": "",
     "Trending": "",
+    "Public": "",
     "Unlisted": "",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "",
     "Hide annotations": "",
     "Show annotations": "",

locales/fr.json

@@ -126,7 +126,17 @@
     "View JavaScript license information.": "Informations des licences JavaScript.",
     "View privacy policy.": "Politique de confidentialité.",
     "Trending": "Tendances",
+    "Public": "",
     "Unlisted": "Non répertoriée",
+    "Private": "",
+    "View all playlists": "",
+    "Updated `x` ago": "",
+    "Delete playlist `x`?": "",
+    "Delete playlist": "",
+    "Create playlist": "",
+    "Title": "",
+    "Playlist privacy": "",
+    "Editing playlist `x`": "",
     "Watch on YouTube": "Voir la vidéo sur Youtube",
     "Hide annotations": "Masquer les annotations",
     "Show annotations": "Afficher les annotations",
@@ -322,4 +332,4 @@
     "Playlists": "Liste de lecture",
     "Community": "Communauté",
     "Current version: ": "Version actuelle : "
-}
+}