Support adding video to playlist from watch page

2 files changed, 27 insertions, 0 deletions

diff --git a/assets/js/handlers.js b/assets/js/handlers.js
index 7ecb5a02..b3da8d9b 100644
--- a/assets/js/handlers.js
+++ b/assets/js/handlers.js
@@ -55,6 +55,9 @@
     n2a(document.querySelectorAll('[data-onclick="mark_unwatched"]')).forEach(function (e) {
         e.onclick = function () { mark_unwatched(e); };
     });
+    n2a(document.querySelectorAll('[data-onclick="add_playlist_video"]')).forEach(function (e) {
+        e.onclick = function () { add_playlist_video(e); };
+    });
     n2a(document.querySelectorAll('[data-onclick="add_playlist_item"]')).forEach(function (e) {
         e.onclick = function () { add_playlist_item(e); };
     });
diff --git a/assets/js/playlist_widget.js b/assets/js/playlist_widget.js
index a29d7ef0..0ec27859 100644
--- a/assets/js/playlist_widget.js
+++ b/assets/js/playlist_widget.js
@@ -1,5 +1,29 @@
 var playlist_data = JSON.parse(document.getElementById('playlist_data').innerHTML);
 
+function add_playlist_video(target) {
+    var select = target.parentNode.children[0].children[1];
+    var option = select.children[select.selectedIndex];
+
+    var url = '/playlist_ajax?action_add_video=1&redirect=false' +
+        '&video_id=' + target.getAttribute('data-id') +
+        '&playlist_id=' + option.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) {
+                option.innerText = '✓' + option.innerText;
+            }
+        }
+    }
+
+    xhr.send('csrf_token=' + playlist_data.csrf_token);
+}
+
 function add_playlist_item(target) {
     var tile = target.parentNode.parentNode.parentNode.parentNode.parentNode;
     tile.style.display = 'none';